Custom video player with hls.js for instant HLS playback with MP4
fallback. Full keyboard-driven controls matching NLE conventions:
Space/K play/pause, J/L skip 5s, arrow/comma/period frame step,
[/] speed, F fullscreen, M mute. Timecode display in HH:MM:SS:FF.
Components:
- video-player.tsx: Core player with HLS/MP4 source loading
- video-controls.tsx: Play, seek, speed, volume, fullscreen, loop
- video-timeline.tsx: Scrub bar with hover time preview + marker slots
- video-frame-display.tsx: Timecode display (HH:MM:SS:FF)
- video-upload-zone.tsx: Drag-drop upload with progress bar (XHR)
- use-video-player.ts: Player state hook with keyboard shortcuts
Review page integration:
- Auto-detects video vs image attachments per revision
- Image/Video toggle when both exist on same revision
- Upload panel extended with video + reference video zones
- VideoPlayer renders in place of ImageViewer when in video mode
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
4d78655ce2