# Timeline Editor

Interactive web-based editor for `timeline.seq` files with Sequence V2 format support.

## Quick Start

```bash
cd tools/timeline_editor
python3 -m http.server 8080
# Open http://localhost:8080
```

Or with auto-load: `index.html?seq=../../workspaces/main/timeline.seq&wav=audio.wav`

## Features

**Editing:**
- Drag/drop sequences and effects, resize with handles
- Add/delete sequences and effects
- Edit NODE declarations (typed buffers: u8x4_norm, f32x4, f16x8, depth24, compute_f32)
- Edit effect routing: inputs/outputs with buffer chain visualization
- Properties panel with validation for undeclared nodes
- Collapsible sequences (double-click), re-order by time

**Timeline:**
- Beat-based timing with BPM slider (60-200)
- Quantize grid (Off, 1/32-1 beat), snap-to-grid with hotkeys 0-6
- Zoom 10%-200% (Ctrl/Cmd + wheel)
- CPU load visualization (effect density)
- Show beats/seconds toggle

**Audio:**
- WAV playback with waveform visualization
- Seek by clicking waveform or double-clicking timeline
- Auto-expand/collapse sequences during playback
- Dual playback indicators (timeline + waveform)

**Shortcuts:**
- **Spacebar**: Play/pause
- **0-6**: Quantize (0=Off, 1=1beat, etc.)
- **Ctrl/Cmd + Wheel**: Zoom

## File Format (V2)

⚠️ **Complete spec:** `doc/SEQUENCE.md`

```
# BPM 120
SEQUENCE <start_time> <priority> ["name"]
  NODE <name> <type>                  # Optional: u8x4_norm|f32x4|f16x8|depth24|compute_f32
  EFFECT <+|=|-> <Class> <in...> -> <out...> <start> <end> [params]
```

**Reserved nodes:** `source` (input), `sink` (output)
**Priority:** `+` increment, `=` same, `-` decrement
**Time:** Beats by default, `4b` explicit beats, `2.0s` seconds

**Example:**
```
SEQUENCE 0.0 0 "Scene"
  NODE temp1 u8x4_norm
  NODE depth depth24
  EFFECT + Hybrid3D source depth -> temp1 0.0 4.0
  EFFECT + Blur temp1 -> sink 0.0 4.0
```

**Auto-inferred nodes** (no NODE declarations needed):
```
SEQUENCE 0.0 0
  EFFECT + Blur source -> temp1 0.0 4.0    # temp1 auto-inferred
  EFFECT + Flash temp1 -> sink 0.0 4.0
```

## Architecture

- `index.html` - Main editor (1200+ lines)
- `timeline-format.js` - V2 parser/serializer/validator
- `timeline-viewport.js` - Zoom/scroll control
- `timeline-playback.js` - Audio playback

Pure ES6 modules, no dependencies, requires HTTP server (not file://).