Leak_Technologies/VideoTools
Leak_Technologies/VideoTools
2
1
Fork 1
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity
998b76cefd
VideoTools/docs/ICONS_NEEDED.md
Stu Leak 5e2171a95e Fix video loading and improve player UI 
Major fixes:
- Fix drag-and-drop video loading bug (s.source was never set)
- Call switchToVideo() instead of showPlayerView() to properly initialize player state
- Show initial preview frame/thumbnail when video loads
- Improve ffprobe error messages (capture stderr for better diagnostics)

UI improvements:
- Move playlist from left to right side
- Add playlist toggle button (☰) with visibility control
- Load and display preview frame immediately when video loads
- Improve control layout with volume container
- Auto-hide playlist when only one video loaded

Documentation:
- Add FEATURE_ROADMAP.md tracking 30 planned features
- Add ICONS_NEEDED.md listing 53 required SVG icons
- Update .gitignore to exclude binaries

References: DEV_SPEC_FRAME_ACCURATE_PLAYBACK.md

Co-Authored-By: Claude <noreply@anthropic.com>
2025-12-05 10:01:59 -05:00

3.6 KiB
Raw Blame History

VT_Player Icon Specifications

All icons should be SVG format, ideally 24x24px base size for UI consistency.

Playback Controls (Priority 1)

  • play.svg - Play button (triangle pointing right)
  • pause.svg - Pause button (two vertical bars)
  • stop.svg - Stop button (square)
  • previous.svg - Previous track (skip backward)
  • next.svg - Next track (skip forward)
  • rewind.svg - Rewind/seek backward
  • fast-forward.svg - Fast forward/seek forward

Frame Navigation (Priority 1 - Frame-Accurate Playback)

  • frame-previous.svg - Previous frame (|◄ single step back)
  • frame-next.svg - Next frame (►| single step forward)
  • keyframe-previous.svg - Previous keyframe (||◄◄ double chevron back)
  • keyframe-next.svg - Next keyframe (►►|| double chevron forward)

Volume Controls (Priority 1)

  • volume-high.svg - Speaker with waves (70-100% volume)
  • volume-medium.svg - Speaker with fewer waves (30-69% volume)
  • volume-low.svg - Speaker with minimal waves (1-29% volume)
  • volume-muted.svg - Speaker with X (0% volume/muted)

Playlist Management (Priority 1)

  • playlist.svg - Hamburger menu / list icon (☰)
  • playlist-add.svg - Plus icon or list with +
  • playlist-remove.svg - Minus icon or list with -
  • playlist-clear.svg - List with X or trash can

Cut/Edit Tools (Priority 1 - LosslessCut features)

  • marker-in.svg - In-point marker ([ or scissors open left)
  • marker-out.svg - Out-point marker (] or scissors open right)
  • cut.svg - Cut/scissors icon
  • export.svg - Export/download arrow pointing down into tray
  • clear-markers.svg - Clear/X icon for removing markers

File Operations (Priority 2)

  • open-file.svg - Folder with document or open folder
  • open-folder.svg - Folder icon
  • save.svg - Floppy disk icon
  • screenshot.svg - Camera or rectangle with corners

View/Display (Priority 2)

  • fullscreen.svg - Arrows pointing to corners (expand)
  • fullscreen-exit.svg - Arrows pointing inward (contract)
  • aspect-ratio.svg - Rectangle with resize handles
  • subtitles.svg - Speech bubble or "CC" text
  • chapters.svg - Book chapters icon or list with dots

Settings/Options (Priority 2)

  • settings.svg - Gear/cog icon
  • audio-track.svg - Waveform or music note
  • video-track.svg - Film strip or play button in rectangle
  • speed.svg - Speedometer or "1x" with arrows
  • loop.svg - Circular arrows (loop/repeat)
  • shuffle.svg - Crossed arrows (shuffle/random)

Navigation/UI (Priority 3)

  • back.svg - Left arrow (go back)
  • forward.svg - Right arrow (go forward)
  • up.svg - Up arrow
  • down.svg - Down arrow
  • close.svg - X icon
  • minimize.svg - Horizontal line
  • maximize.svg - Square/window icon

Status Indicators (Priority 3)

  • info.svg - Information "i" in circle
  • warning.svg - Triangle with exclamation mark
  • error.svg - Circle with X or exclamation
  • success.svg - Checkmark in circle
  • loading.svg - Circular spinner or hourglass

Application Icon

  • VT_Icon.svg - Main application icon (already exists?)

Total Count

Priority 1: 25 icons (core playback + frame-accurate features) Priority 2: 14 icons (extended features) Priority 3: 14 icons (UI/polish) Total: 53 icons

Design Guidelines

  1. Use simple, recognizable shapes
  2. Maintain consistent stroke width (2px recommended)
  3. Use single color (white/light gray) for dark theme
  4. Ensure icons are recognizable at 16x16px minimum
  5. Export as optimized SVG (remove unnecessary metadata)
  6. Use standard icon conventions where possible

Icon Storage

Location: /assets/icons/ Naming: Use lowercase with hyphens (e.g., frame-next.svg)