UNPKG

waveform-renderer

Version:

High-performance audio waveform visualization library for the web. Create customizable, interactive waveform renderers with TypeScript support and zero dependencies.

163 lines 4.95 kB
//#region src/types/types.d.ts type RenderMode = "bottom" | "center" | "top"; interface ProgressLineOptions { color?: string; heightPercent?: number; position?: RenderMode; style?: "dashed" | "dotted" | "solid"; width?: number; } interface WaveformOptions { amplitude?: number; backgroundColor?: string; barWidth?: number; borderColor?: string; borderRadius?: number; borderWidth?: number; color?: string; debug?: boolean; gap?: number; minPixelRatio?: number; position?: RenderMode; progress?: number; progressLine?: null | ProgressLineOptions; smoothing?: boolean; } interface WaveformEvents { destroy: void; error: Error; progressChange: number; ready: void; renderComplete: void; renderStart: void; resize: { height: number; width: number; }; seek: number; } interface CachedBarData { x: number; y: number; width: number; height: number; peakValue: number; } interface RenderCache { canvasWidth: number; canvasHeight: number; totalBars: number; step: number; singleUnitWidth: number; bars: CachedBarData[]; staticWaveformPath?: Path2D; lastOptionsHash: string; lastPeaksHash: string; } interface DirtyFlags { peaks: boolean; options: boolean; size: boolean; progress: boolean; } interface DebugInfo { performance: { lastRenderTime: number; averageRenderTime: number; totalRenders: number; fps: number; cacheBuilds: number; lastCacheBuildTime: number; }; state: { canvasSize: { width: number; height: number; }; peaksCount: number; barsRendered: number; cacheValid: boolean; dirtyFlags: DirtyFlags; }; events: { totalSeeks: number; totalResizes: number; totalErrors: number; }; } interface CustomRenderer { render(ctx: CanvasRenderingContext2D, cache: RenderCache, options: Required<WaveformOptions>, staticPath?: Path2D): boolean; } interface RenderHook { beforeRender?: (ctx: CanvasRenderingContext2D, cache: RenderCache, options: Required<WaveformOptions>) => void; afterBackground?: (ctx: CanvasRenderingContext2D, cache: RenderCache, options: Required<WaveformOptions>) => void; afterProgress?: (ctx: CanvasRenderingContext2D, cache: RenderCache, options: Required<WaveformOptions>, progress: number) => void; afterComplete?: (ctx: CanvasRenderingContext2D, cache: RenderCache, options: Required<WaveformOptions>) => void; } //#endregion //#region src/events/EventEmitter.d.ts declare class EventEmitter<Events extends Record<string, any>> { private events; off<E extends keyof Events>(event: E, callback: (args: Events[E]) => void): void; on<E extends keyof Events>(event: E, callback: (args: Events[E]) => void): void; once<E extends keyof Events>(event: E, callback: (args: Events[E]) => void): void; removeAllListeners<E extends keyof Events>(event?: E): void; protected emit<E extends keyof Events>(event: E, args: Events[E]): void; protected hasListeners<E extends keyof Events>(event: E): boolean; } //#endregion //#region src/renderer.d.ts declare class WaveformRenderer extends EventEmitter<WaveformEvents> { private readonly canvas; private readonly ctx; private readonly devicePixelRatio; private readonly cacheManager; private readonly debugSystem; private readonly eventHandler; private readonly renderingEngine; private isDestroyed; private options; private peaks; private dirtyFlags; private frameRequest?; private lastRenderTime; private readonly minRenderInterval; constructor(canvas: HTMLCanvasElement, peaks: number[], options?: Partial<WaveformOptions>); destroy(): void; setOptions(options: Partial<WaveformOptions>): void; setPeaks(peaks: number[]): void; setProgress(progress: number): void; setProgressLineOptions(options: null | Partial<ProgressLineOptions>): void; setDebug(enabled: boolean): void; getDebugInfo(): DebugInfo; resetDebugCounters(): void; setCustomRenderer(renderer?: CustomRenderer): void; setRenderHooks(hooks: RenderHook): void; clearRenderHooks(): void; private validateInputs; private getCanvasContext; private mergeOptions; private updateDirtyFlags; private setupCanvas; private setupContext; private scheduleRender; private cancelPendingRender; private render; private handleSeek; private handleResize; private handleError; } //#endregion //#region src/utils/peaks.d.ts /** * Calculates peaks from an AudioBuffer */ declare function getPeaksFromAudioBuffer(audioBuffer: AudioBuffer, numberOfPeaks: number): number[]; /** * Normalizes an array of peak values to a range of -1 to 1 */ //#endregion //#region src/constants/default.d.ts declare const DEFAULT_OPTIONS: Required<WaveformOptions>; //#endregion export { CachedBarData, CustomRenderer, DEFAULT_OPTIONS, DebugInfo, ProgressLineOptions, RenderCache, RenderHook, RenderMode, WaveformEvents, WaveformOptions, WaveformRenderer, getPeaksFromAudioBuffer };