From 8cd444af4f3094257bea3626da809400a5e01f7a Mon Sep 17 00:00:00 2001 From: skal Date: Thu, 5 Feb 2026 22:58:33 +0100 Subject: docs(timeline-editor): Document WAV source and music.track visualization task Updated documentation: README.md: - Added waveform visualization to implemented features list - Added section on loading audio waveform with usage instructions - Documented wav_dump_backend integration: ./demo64k --dump_wav output.wav - Added snap-to-beat and resize handles to feature list - Updated Future Enhancements with music.track visualization ROADMAP.md: - Added Phase 2.5: Music.track Visualization & Overlay - Detailed implementation plan for tracker score overlay - Visual design specifications (colored bars, sample markers) - Use case: Align visual sequences with tracker events - Effort: 12-15 hours, Priority: MEDIUM The timeline editor now has clear guidance on: 1. How to generate WAV files from demo64k for visual reference 2. Future feature: Display tracker patterns/samples for alignment --- tools/timeline_editor/ROADMAP.md | 46 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 46 insertions(+) (limited to 'tools/timeline_editor/ROADMAP.md') diff --git a/tools/timeline_editor/ROADMAP.md b/tools/timeline_editor/ROADMAP.md index 4a9d171..4bfc35c 100644 --- a/tools/timeline_editor/ROADMAP.md +++ b/tools/timeline_editor/ROADMAP.md @@ -421,6 +421,52 @@ function detectOverlaps() { --- +### 2.5 Music.track Visualization & Overlay +**Goal:** Display tracker patterns and samples alongside timeline for precise alignment. + +**Features:** +- Load `music.track` file (parse tracker score format) +- Render tracker patterns as horizontal bars above/below sequences +- Display sample triggers (kick, snare, bass notes) as vertical markers +- Color-code different sample types (drums, bass, melody) +- Show pattern names and beat divisions +- Toggle visibility (checkbox: "Show Tracker Score") +- Sync horizontal scale with timeline (pixels per second) +- Help users align visual sequences with audio events + +**Implementation Details:** +```javascript +// Parse music.track file format (similar to demo.seq parser) +function parseTrackerScore(content) { + // Extract patterns, events, sample triggers + // Return structured data: { patterns: [...], events: [...] } +} + +// Render tracker overlay on canvas or DOM elements +function renderTrackerOverlay() { + // Draw pattern bars + // Draw sample trigger markers (vertical lines) + // Label with sample names (KICK_1, BASS_E2, etc.) +} +``` + +**Visual Design:** +- Tracker patterns: Semi-transparent colored bars (green/yellow/purple) +- Sample triggers: Thin vertical lines with labels +- Pattern names: Small text above bars +- Positioned above waveform, below time markers + +**Use Case:** +- Load `music.track` to see exactly where drums/bass/melody trigger +- Align visual effect sequences with musical events +- Verify timing matches tracker score before testing in demo + +**Effort:** 12-15 hours +**Priority:** MEDIUM +**Dependencies:** Requires `music.track` file format specification + +--- + ## Phase 3: Advanced Features (Low Priority) ### 3.1 Timeline Playback Indicator -- cgit v1.2.3