FastView is a browser-based player for synchronized multi-camera review. Load up to 9 video files side-by-side, keep them in sync with per-panel time offsets, and inspect frames with a magnifying-glass tool.
npm install
npm run dev # opens at http://localhost:5173
npm run build # production build → dist/- Starts with one panel; add more via the File menu (max 9)
- Remove any panel with the ✕ button in its header (min 1)
- Drag panels by their handle to reorder the grid
- Click the panel name to rename it; loading a file sets the name automatically from the filename
- Grid layout adjusts automatically: 1–3 → 1 row, 4 → 2×2, 5–9 → 3 columns
- Click the empty panel area or drag & drop a video file onto it
- Double-click a loaded panel to replace its file
- New files loaded mid-playback automatically seek to the correct offset-adjusted position and join playback immediately
Every panel is synced to the primary video. The primary's playhead is the clock — all other panels follow it with a configurable time offset.
- Offset (in each panel's settings): positive = that video plays ahead; negative = behind
- Sync is checked every animation frame during playback; panels more than 250 ms off are corrected
- A hard exact-seek is forced on play, pause, skip, seek, and whenever the primary or audio source changes
Open the ⚙ settings on any panel to control:
| Setting | Description |
|---|---|
| Primary | Sets this panel as the sync master (clock source) |
| Audio | Routes audio output to this panel |
| Offset (s) | Time offset in seconds relative to the primary |
Offsets are automatically re-rooted when the primary changes so relative timing is preserved.
| Control | Action |
|---|---|
| Seekbar | Scrub all videos simultaneously |
| −30s / −10s / −5s | Jump back |
| ▶ / ⏸ | Play / pause all |
| +5s / +10s / +30s | Jump forward |
| Go to… | Type a timestamp (m:ss, h:mm:ss, or plain seconds) and press Enter |
Click Zoom in the transport bar to activate the magnifying-glass tool. While active, hovering any panel shows a circular magnified lens following the cursor.
- Level slider: zoom factor (1.5× – 8×)
- Radius slider: lens size (30 – 200 px)
The lens samples the video's full native resolution (4K if available), not the scaled-down display.
- File → Export layout saves panel names and offsets to a JSON file
- File → Import layout restores a saved layout (video files must be re-loaded manually)
- Requires a Chromium-based browser (Chrome, Edge, Brave) or Firefox for best results
- Video files are opened as local
blob:URLs — nothing is uploaded - Hardware-accelerated video decode is used when available; the magnifier reads the full decoded frame via
drawImage
- Vue 3 — Composition API,
<script setup>SFCs - Vite 8 — dev server and bundler
- SCSS — design tokens, mixins, global primitives
MIT