wavesurfer.js: Initial definitions

types/wavesurfer.js/index.d.ts

@@ -0,0 +1,172 @@
+// Type definitions for wavesurfer.js 2.0
+// Project: https://github.com/katspaugh/wavesurfer.js
+// Definitions by: Yusuke Higuchi <https://github.com/higuri>
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+// TypeScript Version: 2.2
+
+export as namespace WaveSurfer;
+
+export = WaveSurfer;
+
+declare class Observer {
+    constructor();
+    fireEvent(eventName: string, ...args: any[]): void;
+    on(eventName: string, callback: (...args: any[]) => void): WaveSurfer.ListenerDescriptor;
+    once(eventName: string, callback: (...args: any[]) => void): WaveSurfer.ListenerDescriptor;
+    un(eventName: string, callback: (...args: any[]) => void): void;
+    unAll(): void;
+}
+
+declare class WaveSurfer extends Observer {
+    constructor(params: WaveSurfer.WaveSurferParams);
+    static util: WaveSurfer.WaveSurferUtil;
+    static create(params: WaveSurfer.WaveSurferParams): WaveSurfer;
+    // [x: string]: any
+    //   pluginName -> WaveSurferPlugin
+    //   propertyNameAddedByPlugin -> any
+    [x: string]: any;
+    util: WaveSurfer.WaveSurferUtil;
+    destroy(): void;
+    empty(): void;
+    getCurrentTime(): number;
+    getDuration(): number;
+    getPlaybackRate(): number;
+    getVolume(): number;
+    getMute(): boolean;
+    getFilters(): AudioNode[];
+    getWaveColor(): string;
+    exportPCM(length: number, accuracy: number, noWindow?: boolean, start?: number): string;
+    exportImage(format: string, quality: number): string;
+    init(): void;
+    isPlaying(): boolean;
+    isReady(): boolean;
+    load(url: string | HTMLMediaElement, peaks?: ReadonlyArray<number> | ReadonlyArray<ReadonlyArray<number>>, preload?: string, duration?: number): void;
+    loadBlob(url: Blob | File): void;
+    pause(): Promise<void> | undefined;
+    play(start?: number, end?: number): Promise<void> | undefined;
+    playPause(): Promise<void> | undefined;
+    seekAndCenter(progress: number): void;
+    seekTo(progress: number): void;
+    setHeight(height: number): void;
+    setPlaybackRate(rate: number): void;
+    setVolume(newVolume: number): void;
+    setMute(mute: boolean): void;
+    setWaveColor(color: string): void;
+    setSinkId(deviceId: string): void;
+    skip(offset: number): void;
+    skipBackward(seconds?: number): void;
+    skipForward(seconds?: number): void;
+    stop(): void;
+    toggleInteraction(): void;
+    toggleMute(): void;
+    toggleScroll(): void;
+    zoom(pxPerSec?: number): void;
+}
+
+declare namespace WaveSurfer {
+    class WaveRenderer extends Observer {
+        constructor(container: HTMLElement, params: WaveSurferParams);
+        height: number;
+        width: number;
+        wrapper: HTMLElement;
+        clearWave(): void;
+        createWrapper(): void;
+        destroy(): void;
+        drawBars(peaks: ReadonlyArray<number> | ReadonlyArray<ReadonlyArray<number>>, channelIndex: number, start: number, end: number): void;
+        drawPeaks(peaks: ReadonlyArray<number> | ReadonlyArray<ReadonlyArray<number>>, length: number, start: number, end: number): void;
+        drawWave(peaks: ReadonlyArray<number> | ReadonlyArray<ReadonlyArray<number>>, channelIndex: number, start: number, end: number): void;
+        getScrollX(): number;
+        getWidth(): number;
+        handleEvent(e: Event, noPrevent: boolean): number;
+        progress(progress: number): void;
+        recenter(percent: number): void;
+        recenterOnPosition(position: number, immediate: boolean): void;
+        resetScroll(): void;
+        setHeight(height: number): boolean;
+        setWidth(width: number): boolean;
+        style(el: HTMLElement, styles: { [x: string]: string }): HTMLElement;
+        updateProgress(position: number): void;
+        updateSize(): void;
+    }
+
+    class WaveSurferPlugin {
+        constructor(ws: WaveSurfer, params: object);
+        static create(params: object): PluginDefinition;
+        init(): void;
+        destroy(): void;
+    }
+
+    interface WaveSurferUtil {
+        ajax(options: { xhr?: XHROptions }): Observer;
+        extend(dest: object, ...sources: object[]): object;
+        frame(fn: (...args: any[]) => void): (...args: any[]) => number;
+        getId(): string;
+        max(values: ReadonlyArray<number>): number;
+        min(values: ReadonlyArray<number>): number;
+        Observer: Observer;
+        preventClick(): void;
+        requestAnimationFrame(): (fn: (t: number) => void) => number;
+        style(el: HTMLElement, styles: { [x: string]: string }): HTMLElement;
+    }
+
+    interface WaveSurferParams {
+        audioContext?: AudioContext;
+        audioRate?: number;
+        audioScriptProcessor?: ScriptProcessorNode;
+        autoCenter?: boolean;
+        backend?: string;
+        barHeight?: number;
+        barGap?: number;
+        closeAudioContext?: boolean;
+        container: string | HTMLElement;
+        cursorColor?: string;
+        cursorWidth?: number;
+        fillParent?: boolean;
+        forceDecode?: boolean;
+        height?: number;
+        hideScrollbar?: boolean;
+        interact?: boolean;
+        loopSelection?: boolean;
+        maxCanvasWidth?: number;
+        mediaControls?: boolean;
+        mediaType?: string;
+        minPxPerSec?: number;
+        normalize?: boolean;
+        partialRender?: boolean;
+        pixelRatio?: number;
+        plugins?: PluginDefinition[];
+        progressColor?: string;
+        removeMediaElementOnDestroy?: boolean;
+        renderer?: { new(container: HTMLElement, params: WaveSurferParams): WaveRenderer };
+        responsive?: boolean | number;
+        scrollParent?: boolean;
+        skipLength?: number;
+        splitChannels?: boolean;
+        waveColor?: string;
+        xhr?: XHROptions;
+    }
+
+    interface PluginDefinition {
+        name: string;
+        staticProps?: object;
+        deferInit?: boolean;
+        params: object;
+        instance: { new(ws: WaveSurfer, params: object): WaveSurferPlugin };
+    }
+
+    interface ListenerDescriptor {
+        name: string;
+        callback(...args: any[]): void;
+        un(): void;
+    }
+
+    interface XHROptions {
+        requestHeaders?: XHRRequestHeader[];
+        withCredentials?: boolean;
+    }
+
+    interface XHRRequestHeader {
+        key: string;
+        value: string;
+    }
+}

types/wavesurfer.js/tsconfig.json

@@ -0,0 +1,24 @@
+{
+    "compilerOptions": {
+        "module": "commonjs",
+        "lib": [
+            "es6",
+            "dom"
+        ],
+        "noImplicitAny": true,
+        "noImplicitThis": true,
+        "strictNullChecks": true,
+        "strictFunctionTypes": true,
+        "baseUrl": "../",
+        "typeRoots": [
+            "../"
+        ],
+        "types": [],
+        "noEmit": true,
+        "forceConsistentCasingInFileNames": true
+    },
+    "files": [
+        "index.d.ts",
+        "wavesurfer.js-tests.ts"
+    ]
+}

types/wavesurfer.js/tslint.json

@@ -0,0 +1 @@
+{ "extends": "dtslint/dt.json" }

types/wavesurfer.js/wavesurfer.js-tests.ts

@@ -0,0 +1,54 @@
+/// <reference types="node" />
+import * as fs from "fs";
+import * as WaveSurfer from "wavesurfer.js";
+
+// https://www.npmjs.com/package/wavesurfer.js#api-in-examples
+// - create an instance
+const wavesurfer = WaveSurfer.create({
+    container: "#waveform",
+    waveColor: "violet",
+    progressColor: "purple"
+});
+// -- subscribe to some events
+wavesurfer.on("ready", () => {
+    wavesurfer.play();
+});
+// -- load an audio file
+wavesurfer.load("audio/sample.wav");
+
+// - create an instance with "new"
+const wsNewed = new WaveSurfer({
+    container: "#waveform",
+    xhr: {
+        withCredentials: true
+    }
+});
+wsNewed.init();
+// - clear the waveform
+wsNewed.empty();
+
+// - create an instance with plugins
+class SamplePlugin {
+    constructor(ws: WaveSurfer, params: object) { }
+    static create(params: object): WaveSurfer.PluginDefinition {
+        return {
+            name: "samplePlugin",
+            instance: SamplePlugin,
+            params
+        };
+    }
+    init(): void { }
+    destroy(): void { }
+    foo(): void { console.log('foo'); }
+}
+const wsWithPlugins = WaveSurfer.create({
+    container: "#waveform",
+    waveColor: "violet",
+    plugins: [
+        SamplePlugin.create({
+            container: "#waveform"
+        })
+    ]
+});
+// - call plugin's method
+wsWithPlugins.samplePlugin.foo();