wave-roll
Version:
JavaScript Library for Comparative MIDI Piano-Roll Visualization
128 lines • 3.47 kB
TypeScript
/**
* PianoRollManager - Manages piano roll visualization independently from playback
*
* Handles all visual aspects of the piano roll including:
* - Note rendering with colors
* - Overlap detection
* - Zoom and pan controls
* - Visual state management
*/
import { ControlChangeEvent, NoteData } from "@/lib/midi/types";
/**
* Configuration for piano roll visualization
*/
export interface PianoRollConfig {
width: number;
height: number;
backgroundColor: number;
playheadColor: number;
showPianoKeys: boolean;
noteRange: {
min: number;
max: number;
};
minorTimeStep: number;
/** Whether to show waveform band at the bottom (default: true) */
showWaveformBand?: boolean;
/** Preferred renderer type for PixiJS (default: auto-select) */
rendererPreference?: 'webgl' | 'webgpu';
}
/**
* Note with color information
*/
export interface ColoredNote {
note: NoteData;
color: number;
fileId: string;
isMuted: boolean;
}
/**
* Piano roll instance interface
*/
export interface PianoRollInstance {
setNotes(notes: NoteData[]): void;
setControlChanges?(controlChanges: ControlChangeEvent[]): void;
setTime(time: number): void;
zoomX?(scale: number): void;
getState?(): {
zoomX: number;
};
onTimeChange?(callback: (time: number) => void): void;
setMinorTimeStep?(step: number): void;
destroy?(): void;
}
/**
* Default piano roll configuration
*/
export declare const DEFAULT_PIANO_ROLL_CONFIG: PianoRollConfig;
/**
* PianoRollManager - Manages visual aspects of piano roll
*/
export declare class PianoRollManager {
private pianoRollInstance;
private pianoRollContainer;
private currentNoteColors;
private config;
private enableOverlapDetection;
private overlapColor;
constructor(config?: Partial<PianoRollConfig>, options?: {
enableOverlapDetection?: boolean;
overlapColor?: number;
});
/**
* Initialize piano roll with container
*/
initialize(container: HTMLElement, notes?: NoteData[]): Promise<void>;
/**
* Update visualization with colored notes
*/
updateVisualization(coloredNotes: ColoredNote[]): Promise<void>;
/**
* Process notes with color handling and overlap detection
*/
private processNotesWithColors;
/**
* Set playhead time position
*/
setTime(time: number): void;
/**
* Set zoom level
*/
setZoom(scale: number): void;
/**
* Get current zoom level
*/
getZoom(): number;
/**
* Update piano roll configuration
*/
updateConfig(config: Partial<PianoRollConfig>): void;
/**
* Get piano roll instance for direct access
*/
getPianoRollInstance(): PianoRollInstance | null;
/**
* Get piano roll container element
*/
getContainer(): HTMLElement | null;
/**
* Check if piano roll is initialized
*/
isInitialized(): boolean;
/**
* Recreate piano roll with new configuration
*/
recreate(notes?: NoteData[]): Promise<void>;
/**
* Destroy piano roll and cleanup
*/
destroy(): void;
}
/**
* Factory function to create PianoRollManager
*/
export declare function createPianoRollManager(config?: Partial<PianoRollConfig>, options?: {
enableOverlapDetection?: boolean;
overlapColor?: number;
}): PianoRollManager;
//# sourceMappingURL=piano-roll-manager.d.ts.map