demo.git/tools/editor/index.html, branch mainVide-coded 64k demo systemhttps://git.taar-o.com/demo.git/atom?h=main2026-02-06T21:53:29Zfeat(spectral_editor): Add cursor-centered zoom and pan with mouse wheel2026-02-06T21:53:29Zskalpascal.massimino@gmail.com2026-02-06T21:53:29Zurn:sha1:0c98c830b382d66c420524ff395e12164a566dd8
Implemented zoom and pan system for the spectral editor:
Core Features:
- Viewport offset system (viewportOffsetX, viewportOffsetY) for panning
- Three wheel interaction modes:
* Ctrl/Cmd + wheel: Cursor-centered zoom (both axes)
* Shift + wheel: Horizontal pan
* Normal wheel: Vertical pan
- Zoom range: 0.5-20.0x horizontal, 0.1-5.0x vertical
- Zoom factor: 0.9/1.1 per wheel notch (10% change)
Technical Implementation:
- Calculate data position under cursor before zoom
- Apply zoom to pixelsPerFrame and pixelsPerBin
- Adjust viewport offsets to keep cursor position stable
- Clamp offsets to valid ranges (0 to max content size)
- Updated all coordinate conversion functions (screenToSpectrogram, spectrogramToScreen)
- Updated playhead rendering with visibility check
- Reset viewport offsets on file load
Algorithm (cursor-centered zoom):
1. Calculate frame and frequency under cursor: pos = (screen + offset) / scale
2. Apply zoom: scale *= zoomFactor
3. Adjust offset: offset = pos * scale - screen
4. Clamp offset to [0, maxOffset]
This matches the zoom behavior of the timeline editor, adapted for 2D spectrogram display.
handoff(Claude): Spectral editor zoom implementation complete
Chore: Remove trailing whitespaces across the codebase2026-01-30T23:57:49Zskalpascal.massimino@gmail.com2026-01-30T23:57:47Zurn:sha1:2520ae66ce2da210eaeaeba44c467c97e0c3fdd0fix the spec editor a bit2026-01-28T20:34:59Zskalpascal.massimino@gmail.com2026-01-28T20:34:59Zurn:sha1:d82db7e301ff778b3c71a409263d696d9f561b74feat(editor): Add audio playback and redo functionality2026-01-28T11:04:44Zskalpascal.massimino@gmail.com2026-01-28T11:04:44Zurn:sha1:a570e4d571ccdd205f140ed294aa182c13d7bc2a
Enhances the spectrogram editor with audio playback capabilities and a redo button.
- : Added 'Listen Original' and 'Listen Generated' buttons, and a 'Redo' button.
- : Added styling for the new buttons.
- : Implemented JavaScript IDCT, Hanning window, and for audio synthesis.
- Connected playback buttons to audio functionality.
- Fully implemented logic.
feat(editor): Implement drawing tools and advanced undo/redo2026-01-28T11:00:50Zskalpascal.massimino@gmail.com2026-01-28T11:00:50Zurn:sha1:5951650903b228bb01171f8d47965e22a949a518
This commit significantly enhances the web spectrogram editor by implementing core drawing tools (line, ellipse, noise) and a robust undo/redo system.
- and : Added redo button and styling.
- : Implemented canvas event handling, dynamic shape previews, and the logic for lines and noise rectangles.
- : Now reconstructs the spectrogram from a clean base, allowing proper undo/redo.
- : Uses an improved color gradient for better visualization.
- : Stores original spectrogram data for persistent state management.
docs: Finalize project state synchronization2026-01-28T10:49:52Zskalpascal.massimino@gmail.com2026-01-28T10:49:52Zurn:sha1:9b003f762f7fea313ecb3b2b17ef9446881d7a8c
Updates all relevant Markdown files to reflect the completed asset system and build pipeline.
- Updates PROJECT_CONTEXT.md with latest architectural decisions.
- Updates GEMINI.md with the full list of relevant files.
- Adds initial scaffolding for the web editor.
- Cleans up any lingering issues with asset generation paths.
feat(editor): Scaffold web spectrogram editor2026-01-28T10:45:09Zskalpascal.massimino@gmail.com2026-01-28T10:45:09Zurn:sha1:371017a31bedaed179d339b9fe371529f22d9ec4
Initial setup for the spectrogram editor tool.
- Created tools/editor/index.html, script.js, and style.css.
- Added basic structure for WAV loading, visualization, and tool controls.