[Feature] Video Player & Preview - In-App Video Playback and Scene Preview #69
Description
Summary
Build a fully-featured in-app video player for previewing generated scenes and the full assembled project. Immediate visual feedback is critical for an AI video editor — users must be able to quickly evaluate generation results and compare attempts without leaving the app.
Requirements
- Full video player with play/pause, seek, volume, fullscreen
- Scene-level preview: play individual scene video
- Full project preview: play all scenes concatenated in sequence
- Timeline scrubber showing scene boundaries
- Frame-by-frame navigation (← → arrow keys)
- Playback speed control (0.25x, 0.5x, 1x, 1.5x, 2x)
- Loop mode per scene or full project
- A/B comparison: compare two generation attempts side by side
- Split-screen: generated video vs reference images
- First/last frame overlay: show expected first/last frame as overlay
- Zoom and pan in player
- Screenshot/snapshot from any timestamp
- Overlay display of scene metadata (model, params, duration)
- Video quality indicator (resolution, FPS, codec, file size)
- Buffering and loading states
- Keyboard shortcuts for player control
Acceptance Criteria
- Video player plays, pauses, seeks, and controls volume
- Full project preview plays all scenes in sequence seamlessly
- A/B comparison mode displays two videos side-by-side
- Frame-by-frame navigation works with arrow keys
- Screenshot captures current frame and saves to asset library
Related
Part of the ai-video-editor Flutter application. Used throughout the editor in conjunction with #62 (Scene Management) and #69 (Iterative Workflow).