57 lines
3.2 KiB
Markdown
57 lines
3.2 KiB
Markdown
|
# v0.1.3 Polish/Tweaks Implementation Summary
|
||
|
|
|
||
|
|
**Date:** 2026-09-22 16:55 ET
|
||
|
|
**Version:** 0.1.2 → 0.1.3
|
||
|
|
|
||
|
|
## Task Description
|
||
|
|
|
||
|
|
Implemented three UI polish features for v0.1.3 of the GUI Video Clipper (Tauri + Svelte 5):
|
||
|
|
|
||
|
|
1. **Adjustable clip list layout** — clip list can appear below the timeline (default) or as a left sidebar next to the video preview, with a toolbar toggle button and persisted preference
|
||
|
|
2. **Timeline timestamp magnification** — increased base font from 10px to 12px, with a mouse-proximity magnification effect using cosine interpolation (~18px peak, 80px radius)
|
||
|
|
3. **Timeline right-click context menu** — custom context menu replacing the default web menu, with Mark In/Out, Go to Clip Start/End, and Delete Clip actions
|
||
|
|
|
||
|
|
## Changes Made
|
||
|
|
|
||
|
|
### Commits (oldest → newest)
|
||
|
|
- `0b8bec2` — chore: bump version to 0.1.3
|
||
|
|
- `b371ec6` — feat: adjustable clip list layout (bottom/left sidebar)
|
||
|
|
- `923c7b0` — fix: clip list width edge cases (falsy check, narrow-window clamp)
|
||
|
|
- `27c199e` — feat: larger timeline timestamps with mouse-proximity magnification
|
||
|
|
- `8c27177` — feat: timeline right-click context menu with mark/seek/delete actions
|
||
|
|
- `279e27a` — docs: user edits to v0.1.3 spec (version bump section)
|
||
|
|
|
||
|
|
### Files Modified
|
||
|
|
- `VERSION` — new file, version 0.1.3
|
||
|
|
- `package.json` — version bump
|
||
|
|
- `package-lock.json` — lockfile sync
|
||
|
|
- `src-tauri/tauri.conf.json` — version bump
|
||
|
|
- `src-tauri/Cargo.toml` — version bump
|
||
|
|
- `src-tauri/Cargo.lock` — lockfile sync
|
||
|
|
- `src/lib/stores/preferences.svelte.ts` — added `clipListPosition` and `clipListWidth` preferences
|
||
|
|
- `src/App.svelte` — dual layout modes (bottom/left), toggle button, sidebar resize
|
||
|
|
- `src/lib/components/ClipList.svelte` — added `position` prop for sidebar styling
|
||
|
|
- `src/lib/timeline/renderer.ts` — larger base font, magnification math in `drawTimeTicks()`
|
||
|
|
- `src/lib/components/Timeline.svelte` — mouseX tracking, context menu wiring
|
||
|
|
- `src/lib/components/TimelineContextMenu.svelte` — new context menu component
|
||
|
|
|
||
|
|
### Design & Plan Docs
|
||
|
|
- `docs/superpowers/specs/2026-09-22-v013-polish-tweaks.md` — design spec
|
||
|
|
- `docs/superpowers/plans/2026-09-22-v013-polish-tweaks.md` — implementation plan
|
||
|
|
|
||
|
|
## Process
|
||
|
|
|
||
|
|
Used subagent-driven development: 5 tasks dispatched as subagents with task reviews between each. Two reviewer findings on Task 2 (falsy width check, narrow-window clamp) were fixed before proceeding.
|
||
|
|
|
||
|
|
## Lessons Learned
|
||
|
|
|
||
|
|
- The layout restructure required careful conditional rendering in App.svelte — the `{#if}/{:else}` approach creates two separate DOM trees. This means TransportControls gets remounted on layout toggle, which should be smoke-tested.
|
||
|
|
- Context menu `$effect` for viewport clamping can flash position (0,0) for one frame before adjustment — initializing adjusted positions from the raw x/y props would eliminate this.
|
||
|
|
- The bump-version.sh script doesn't sync package-lock.json — needed manual `npm install --package-lock-only`.
|
||
|
|
|
||
|
|
## Follow-Up Items
|
||
|
|
|
||
|
|
- [ ] Manual smoke test with `npm run tauri dev` — layout toggle, sidebar resize, timestamp magnification feel, context menu flow
|
||
|
|
- [ ] Consider fixing first-frame context menu position flash
|
||
|
|
- [ ] Consider adding `onresize` clamp for sidebar width when window shrinks below saved width
|