feat: add advanced audio effects and improve UI

Phase 6.5 Advanced Effects:
- Add Pitch Shifter with semitones and cents adjustment
- Add Time Stretch with pitch preservation using overlap-add
- Add Distortion with soft/hard/tube types and tone control
- Add Bitcrusher with bit depth and sample rate reduction
- Add AdvancedParameterDialog with real-time waveform visualization
- Add 4 professional presets per effect type

Improvements:
- Fix undefined parameter errors by adding nullish coalescing operators
- Add global custom scrollbar styling with color-mix transparency
- Add custom-scrollbar utility class for side panel
- Improve theme-aware scrollbar appearance in light/dark modes
- Fix parameter initialization when switching effect types

Integration:
- All advanced effects support undo/redo via EffectCommand
- Effects accessible via command palette and side panel
- Selection-based processing support
- Toast notifications for all effects

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-11-17 20:03:40 +01:00
parent f414573655
commit ee48f9475f
26 changed files with 6027 additions and 273 deletions

149
PLAN.md
View File

@@ -2,7 +2,7 @@
## Progress Overview
**Current Status**: Phase 5 Complete ✓
**Current Status**: Phase 6.5 Complete ✓ (Basic Effects + Filters + Dynamics + Time-Based + Advanced Effects)
### Completed Phases
-**Phase 1**: Project Setup & Core Infrastructure (95% complete)
@@ -10,37 +10,72 @@
-**Phase 3**: Waveform Visualization (95% complete)
-**Phase 4**: Selection & Editing (70% complete - core editing features done)
-**Phase 5**: Undo/Redo System (100% complete)
-**UI Redesign**: Professional Audacity-style layout (100% complete)
### Working Features
**Core Features:**
- ✅ Audio file upload with drag-and-drop
- ✅ Waveform visualization with real-time progress
- ✅ Playback controls (play, pause, stop, seek)
- ✅ Volume control with mute
- ✅ Timeline scrubbing
- ✅ Drag-to-scrub audio
- ✅ Timeline scrubbing (click-to-play, drag-to-scrub)
- ✅ Horizontal zoom (1x-20x)
- ✅ Vertical amplitude zoom
- ✅ Scroll through zoomed waveform
- ✅ Grid lines every second
- ✅ Viewport culling for performance
-**Region selection with Shift+drag** (NEW!)
-**Visual selection feedback** (NEW!)
-**Cut/Copy/Paste operations** (NEW!)
-**Delete and Trim operations** (NEW!)
-**Keyboard shortcuts (Ctrl+A/X/C/V, Delete, Escape)** (NEW!)
-**Clipboard management** (NEW!)
-**Undo/Redo system with command pattern** (NEW!)
-**History tracking (50 operations)** (NEW!)
-**Undo/Redo keyboard shortcuts (Ctrl+Z, Ctrl+Y)** (NEW!)
-**History controls UI with visual feedback** (NEW!)
- ✅ Dark/light theme support
- ✅ Toast notifications
- ✅ File metadata display
**Editing Features:**
- ✅ Region selection with Shift+drag
- ✅ Visual selection feedback
- ✅ Cut/Copy/Paste operations
- ✅ Delete and Trim operations
- ✅ Keyboard shortcuts (Ctrl+A/X/C/V, Delete, Escape)
- ✅ Clipboard management
- ✅ Undo/Redo system with command pattern
- ✅ History tracking (50 operations)
- ✅ Undo/Redo keyboard shortcuts (Ctrl+Z, Ctrl+Y)
**Audio Effects:**
- ✅ Normalize (peak amplitude)
- ✅ Fade In (linear/exponential/logarithmic curves)
- ✅ Fade Out (linear/exponential/logarithmic curves)
- ✅ Reverse audio
- ✅ Low-Pass Filter (removes high frequencies)
- ✅ High-Pass Filter (removes low frequencies)
- ✅ Band-Pass Filter (isolates frequency range)
- ✅ Compressor (with visual transfer curve and presets)
- ✅ Limiter (brick-wall limiting with makeup gain)
- ✅ Gate/Expander (noise reduction and dynamics expansion)
- ✅ Delay/Echo (time, feedback, mix with visual pattern)
- ✅ Reverb (Schroeder algorithm with room size and damping)
- ✅ Chorus (LFO modulation with depth, rate controls)
- ✅ Flanger (short modulated delay with feedback)
- ✅ Phaser (allpass filters with LFO modulation)
- ✅ Pitch Shifter (semitones and cents adjustment)
- ✅ Time Stretch (change duration with/without pitch preservation)
- ✅ Distortion (soft/hard/tube overdrive with tone control)
- ✅ Bitcrusher (bit depth and sample rate reduction)
- ✅ All effects support undo/redo
- ✅ Effects accessible via command palette and side panel
- ✅ Parameterized effects with real-time visual feedback
**Professional UI:**
- ✅ Command Palette (Ctrl+K) with searchable actions
- ✅ Compact header (Logo + Command Palette + Theme Toggle)
- ✅ Collapsible side panel with tabs (File, History, Info)
- ✅ Full-screen waveform canvas layout
- ✅ Integrated playback controls at bottom
- ✅ Keyboard-driven workflow
### Next Steps
- Audio effects (Phase 6)
- Multi-track editing (Phase 7)
- Recording functionality (Phase 8)
- **Phase 6**: Audio effects (Section 6.1 ✓ + Section 6.2 filters ✓ + Section 6.3 dynamics ✓ + Section 6.4 time-based ✓ + Section 6.5 advanced ✓)
- **Phase 7**: Multi-track editing
- **Phase 8**: Recording functionality
---
@@ -411,41 +446,61 @@ audio-ui/
### Phase 6: Audio Effects
#### 6.1 Basic Effects
- [ ] Gain/Volume adjustment
- [ ] Pan (stereo positioning)
- [ ] Fade In/Fade Out (linear/exponential/logarithmic)
- [ ] Normalize (peak/RMS)
- [ ] Reverse
- [ ] Silence generator
#### 6.1 Basic Effects (✅ Complete)
- [x] Gain/Volume adjustment
- [ ] Pan (stereo positioning) - FUTURE
- [x] Fade In/Fade Out (linear/exponential/logarithmic)
- [x] Normalize (peak/RMS)
- [x] Reverse
- [ ] Silence generator - FUTURE
- [x] EffectCommand for undo/redo integration
- [x] Effects added to command palette
- [x] Toast notifications for effects
#### 6.2 Filters & EQ
- [ ] Parametric EQ (3-band, 10-band, 31-band)
- [ ] Low-pass filter
- [ ] High-pass filter
- [ ] Band-pass filter
- [ ] Notch filter
- [ ] Shelf filters (low/high)
- [ ] Visual EQ curve editor
#### 6.2 Filters & EQ (Partially Complete)
- [ ] Parametric EQ (3-band, 10-band, 31-band) - FUTURE
- [x] Low-pass filter (1000Hz cutoff, configurable)
- [x] High-pass filter (100Hz cutoff, configurable)
- [x] Band-pass filter (1000Hz center, configurable)
- [x] Notch filter (implemented in filters.ts)
- [x] Shelf filters (low/high) (implemented in filters.ts)
- [x] Peaking EQ filter (implemented in filters.ts)
- [ ] Visual EQ curve editor - FUTURE
- [x] Filters integrated with undo/redo system
- [x] Filters added to command palette
#### 6.3 Dynamics Processing
- [ ] Compressor (threshold, ratio, attack, release, knee)
- [ ] Limiter
- [ ] Gate/Expander
- [ ] Visual gain reduction meter
#### 6.3 Dynamics Processing (✅ Complete)
- [x] Compressor (threshold, ratio, attack, release, knee, makeup gain)
- [x] Limiter (threshold, attack, release, makeup gain)
- [x] Gate/Expander (threshold, ratio, attack, release, knee)
- [x] Visual transfer curve showing input/output relationship
- [x] Professional presets for each effect type
- [x] Real-time parameter visualization
- [x] EffectCommand integration for undo/redo
- [x] Effects added to command palette and side panel
- [x] Selection-based processing support
- [ ] Visual gain reduction meter (realtime metering - FUTURE)
#### 6.4 Time-Based Effects
- [ ] Delay/Echo (time, feedback, mix)
- [ ] Reverb (Convolution Reverb with IR files)
- [ ] Chorus (depth, rate, delay)
- [ ] Flanger
- [ ] Phaser
#### 6.4 Time-Based Effects
- [x] Delay/Echo (time, feedback, mix)
- [x] Reverb (Schroeder algorithmic reverb with room size and damping)
- [x] Chorus (depth, rate, delay with LFO modulation)
- [x] Flanger (short modulated delay with feedback)
- [x] Phaser (cascaded allpass filters with LFO)
- [x] TimeBasedParameterDialog component with visual feedback
- [x] Integration with command palette and side panel
- [x] 4 presets per effect type
- [x] Undo/redo support for all time-based effects
#### 6.5 Advanced Effects
- [ ] Pitch shifter (semitones, cents)
- [ ] Time stretcher (without pitch change)
- [ ] Distortion/Overdrive
- [ ] Bitcrusher (bit depth, sample rate reduction)
#### 6.5 Advanced Effects
- [x] Pitch shifter (semitones, cents with linear interpolation)
- [x] Time stretcher (with and without pitch preservation using overlap-add)
- [x] Distortion/Overdrive (soft/hard/tube types with tone and output control)
- [x] Bitcrusher (bit depth and sample rate reduction)
- [x] AdvancedParameterDialog component with visual waveform feedback
- [x] Integration with command palette and side panel
- [x] 4 presets per effect type
- [x] Undo/redo support for all advanced effects
#### 6.6 Effect Management
- [ ] Effect rack/chain