Implements visual timeline with smooth interaction and keyframe visualization:
Timeline Widget Features:
- Custom Fyne widget in internal/ui/timeline.go
- Visual keyframe markers (yellow 1px vertical lines)
- Current position scrubber (white 2px line with circle handle)
- Progress fill showing played portion (gray)
- Mouse click/drag for smooth seeking
- In/out point marker support (for future cut functionality)
Rendering Performance:
- Cached rendering objects to minimize redraws
- Only scrubber position updates on playback
- Full redraw only on resize or keyframe data change
- Optimized for 1000+ keyframes without lag
UI Integration:
- Timeline replaces slider when keyframing mode is enabled
- Automatically loads keyframe timestamps from Index
- Integrates with existing updateProgress callback
- Maintains current time/total time labels
Technical Implementation:
- TimelineWidget extends widget.BaseWidget
- Custom renderer implements fyne.WidgetRenderer
- SetOnChange() for seek callback
- SetPosition() for playback updates
- SetKeyframes() for keyframe marker display
- Desktop mouse events for hover and drag
Visual Design:
- Dark gray background (#282828)
- Lighter gray progress fill (#3C3C3C)
- Yellow keyframe markers (#FFDC00 with transparency)
- White scrubber with circular handle
- Blue in-point marker for cuts
- Red out-point marker for cuts
References: DEV_SPEC lines 192-241
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
