Files
audio-ui/types/automation.ts

106 lines
3.0 KiB
TypeScript
Raw Normal View History

feat: Ableton Live-style effects and complete automation system Enhanced visual design: - Improved device rack container with darker background and inner shadow - Device cards now have rounded corners, shadows, and colored indicators - Better visual separation between enabled/disabled effects - Active devices highlighted with accent border Complete automation infrastructure (Phase 9): - Created comprehensive type system for automation lanes and points - Implemented AutomationPoint component with drag-and-drop editing - Implemented AutomationHeader with mode controls (Read/Write/Touch/Latch) - Implemented AutomationLane with canvas-based curve rendering - Integrated automation lanes into Track component below effects - Created automation playback engine with real-time interpolation - Added automation data persistence to localStorage Automation features: - Add/remove automation points by clicking/double-clicking - Drag points to change time and value - Multiple automation modes (Read, Write, Touch, Latch) - Linear and step curve types (bezier planned) - Adjustable lane height (60-180px) - Show/hide automation per lane - Real-time value display at playhead - Color-coded lanes by parameter type - Keyboard delete support (Delete/Backspace) Track type updates: - Added automation field to Track interface - Updated track creation to initialize empty automation - Updated localStorage save/load to include automation data Files created: - components/automation/AutomationPoint.tsx - components/automation/AutomationHeader.tsx - components/automation/AutomationLane.tsx - lib/audio/automation/utils.ts (helper functions) - lib/audio/automation/playback.ts (playback engine) - types/automation.ts (complete type system) Files modified: - components/effects/EffectDevice.tsx (Ableton-style visual improvements) - components/tracks/Track.tsx (automation lanes integration) - types/track.ts (automation field added) - lib/audio/track-utils.ts (automation initialization) - lib/hooks/useMultiTrack.ts (automation persistence) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-18 16:30:01 +01:00
/**
* Automation system type definitions
* Based on Ableton Live's automation model
*/
/**
* Automation curve types
* - linear: Straight line between points
* - bezier: Curved line with control handles
* - step: Horizontal lines with vertical transitions (for discrete values)
*/
export type AutomationCurveType = 'linear' | 'bezier' | 'step';
/**
* Automation recording/playback modes
* - read: Only playback automation
* - write: Record automation (replaces existing)
* - touch: Record while touching control, then return to read mode
* - latch: Record from first touch until stop, then return to read mode
*/
export type AutomationMode = 'read' | 'write' | 'touch' | 'latch';
/**
* Single automation breakpoint
*/
export interface AutomationPoint {
id: string;
time: number; // Position in seconds from track start
value: number; // Parameter value (normalized 0-1)
curve: AutomationCurveType;
// Bezier control handles (only used when curve is 'bezier')
handleIn?: { x: number; y: number }; // Relative to point position
handleOut?: { x: number; y: number }; // Relative to point position
}
/**
* Parameter identifier for automation
* Examples:
* - 'volume' - Track volume
* - 'pan' - Track pan
* - 'mute' - Track mute (step curve)
* - 'effect.compressor-1.threshold' - Effect parameter
* - 'effect.delay-2.time' - Effect parameter
*/
export type AutomationParameterId = string;
/**
* Single automation lane for a specific parameter
*/
export interface AutomationLane {
id: string;
trackId: string;
parameterId: AutomationParameterId;
parameterName: string; // Display name (e.g., "Volume", "Compressor Threshold")
visible: boolean; // Show/hide lane
height: number; // Lane height in pixels (user-adjustable, 60-120px)
points: AutomationPoint[];
mode: AutomationMode;
color?: string; // Optional color override (defaults to parameter type color)
// Value range for display (actual values are normalized 0-1)
valueRange: {
min: number; // Display minimum (e.g., 0 for volume)
max: number; // Display maximum (e.g., 1 for volume)
unit?: string; // Display unit (e.g., 'dB', '%', 'ms', 'Hz')
formatter?: (value: number) => string; // Custom value formatter
};
}
/**
* All automation lanes for a single track
*/
export interface TrackAutomation {
trackId: string;
lanes: AutomationLane[];
showAutomation: boolean; // Master show/hide toggle for all lanes
}
/**
* Complete automation data for entire project
*/
export interface ProjectAutomation {
tracks: Record<string, TrackAutomation>;
}
/**
* Automation parameter value at a specific time
* Used for real-time playback
*/
export interface AutomationValue {
parameterId: AutomationParameterId;
value: number;
time: number;
}
/**
* Helper type for creating new automation points
*/
export type CreateAutomationPointInput = Omit<AutomationPoint, 'id'>;
/**
* Helper type for creating new automation lanes
*/
export type CreateAutomationLaneInput = Omit<AutomationLane, 'id' | 'points'> & {
points?: AutomationPoint[];
};