feat: implement medium effort features - markers, web workers, and bezier automation

Implemented three major medium effort features to enhance the audio editor:

**1. Region Markers System**
- Add marker type definitions supporting point markers and regions
- Create useMarkers hook for marker state management
- Build MarkerTimeline component for visual marker display
- Create MarkerDialog component for adding/editing markers
- Add keyboard shortcuts: M (add marker), Shift+M (next), Shift+Ctrl+M (previous)
- Support marker navigation, editing, and deletion

**2. Web Worker for Computations**
- Create audio worker for offloading heavy computations
- Implement worker functions: generatePeaks, generateMinMaxPeaks, normalizePeaks, analyzeAudio, findPeak
- Build useAudioWorker hook for easy worker integration
- Integrate worker into Waveform component with peak caching
- Significantly improve UI responsiveness during waveform generation

**3. Bezier Curve Automation**
- Enhance interpolateAutomationValue to support Bezier curves
- Implement cubic Bezier interpolation with control handles
- Add createSmoothHandles for auto-smooth curve generation
- Add generateBezierCurvePoints for smooth curve rendering
- Support bezier alongside existing linear and step curves

All features are type-safe and integrate seamlessly with the existing codebase.

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-11-20 08:25:33 +01:00
parent 8720c35f23
commit 119c8c2942
9 changed files with 1143 additions and 6 deletions

29
types/marker.ts Normal file
View File

@@ -0,0 +1,29 @@
/**
* Region marker type definitions
* Markers help navigate and organize the timeline
*/
/**
* Marker types
* - point: A single point in time (like a cue point)
* - region: A time range with start and end
*/
export type MarkerType = 'point' | 'region';
/**
* Single marker or region
*/
export interface Marker {
id: string;
name: string;
type: MarkerType;
time: number; // Start time in seconds
endTime?: number; // End time for regions (undefined for point markers)
color?: string; // Optional color for visual distinction
description?: string; // Optional description/notes
}
/**
* Helper type for creating new markers
*/
export type CreateMarkerInput = Omit<Marker, 'id'>;