Skip to content

Implement multi-track timeline visualization for different event types#458

Open
Copilot wants to merge 5 commits intomainfrom
copilot/track-system-implementation
Open

Implement multi-track timeline visualization for different event types#458
Copilot wants to merge 5 commits intomainfrom
copilot/track-system-implementation

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Mar 31, 2026

The timeline visualization hardcoded trackCount = 1, rendering all event types on a single horizontal lane. This replaces it with dynamic track allocation so each TimelineEventType (series, movie, exploration, etc.) gets its own lane.

Types (src/modules/types.ts)

  • Added TrackConfig interface (type, label, index)
  • Added track-change event to TimelineEvents map

Track system (src/modules/timeline-viz.ts)

  • buildTracks() derives tracks from unique event types in filtered data — empty tracks are never rendered
  • getEventTrackY() computes vertical position: trackIndex * (trackHeight + trackSpacing) + trackHeight / 2
  • Updated all SVG marker/label/indicator cy/y attrs and canvas rendering to use track-aware coordinates
  • renderTrackLanes() draws alternating background rects per track
  • Track labels rendered on Y-axis via renderAxes()
  • Emits track-change when track configuration changes
// Before
const trackCount = 1 // TODO: Multiple tracks for different event types
yScale.domain([0, trackCount])

// After
const newTracks = buildTracks(filteredEvents) // one track per unique event type
tracks = newTracks
yScale.domain([0, Math.max(1, tracks.length)])

Tests (test/timeline-viz.test.ts)

  • 5 new tests covering track-change emission, data updates, multi/single-type rendering, and empty events

Copilot AI and others added 4 commits March 31, 2026 18:29
…ti-track timeline

Add TrackConfig interface defining single track lane configuration
(type, label, index) for the multi-track timeline visualization.

Add 'track-change' event to TimelineEvents interface, fired when
track configuration changes (event types added/removed).

Co-authored-by: marcusrbrown <831617+marcusrbrown@users.noreply.github.com>
…t types

Replace hardcoded single track (trackCount = 1) with dynamic track allocation
based on unique event types in the filtered data. Each TimelineEventType gets
its own horizontal lane with:

- Dynamic track allocation from visible event types (empty tracks not rendered)
- Track-based Y coordinate positioning for SVG markers, labels, and canvas
- Alternating track lane backgrounds for visual separation
- Track labels on the Y-axis showing event type names
- track-change event emission when track configuration changes
- TrackConfig type and track-change event in types.ts

Agent-Logs-Url: https://github.com/marcusrbrown/vbs/sessions/7d3c59fb-7f3f-46c2-bf63-b3ea6f1c0614

Co-authored-by: marcusrbrown <831617+marcusrbrown@users.noreply.github.com>
…ove track comparison

Agent-Logs-Url: https://github.com/marcusrbrown/vbs/sessions/7d3c59fb-7f3f-46c2-bf63-b3ea6f1c0614

Co-authored-by: marcusrbrown <831617+marcusrbrown@users.noreply.github.com>
Copilot AI changed the title [WIP] Implement multi-track timeline visualization for different event types Implement multi-track timeline visualization for different event types Mar 31, 2026
Copilot AI requested a review from marcusrbrown March 31, 2026 18:43
@marcusrbrown marcusrbrown marked this pull request as ready for review April 1, 2026 00:50
@marcusrbrown marcusrbrown requested a review from fro-bot April 1, 2026 00:52
@fro-bot fro-bot mentioned this pull request Apr 1, 2026
22 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Implementation] Multi-track timeline visualization for different event types

3 participants