player visualizer example

Author: chrisweb

build/@types/web-audio-api-player/library/audio.d.ts

@@ -1,7 +1,52 @@
+/// <reference types="webaudioapi" />
+export interface IWaveTable {
+}
+export interface IAudioContext {
+    destination: AudioDestinationNode;
+    sampleRate: number;
+    currentTime: number;
+    listener: AudioListener;
+    activeSourceCount: number;
+    state: string;
+    createBuffer(numberOfChannels: number, length: number, sampleRate: number): AudioBuffer;
+    createBuffer(buffer: ArrayBuffer, mixToMono: boolean): AudioBuffer;
+    decodeAudioData(audioData: ArrayBuffer, decodeSuccessCallback?: Function, decodeErrorCallback?: Function): void;
+    createBufferSource(): AudioBufferSourceNode;
+    createMediaElementSource(mediaElement: HTMLMediaElement): MediaElementAudioSourceNode;
+    createMediaStreamSource(mediaStreamMediaStream: MediaStream): MediaStreamAudioSourceNode;
+    createMediaStreamDestination(): MediaStreamAudioDestinationNode;
+    createScriptProcessor(bufferSize: number, numberOfInputChannels?: number, numberOfOutputChannels?: number): ScriptProcessorNode;
+    createAnalyser(): AnalyserNode;
+    createGain(): GainNode;
+    createDelay(maxDelayTime?: number): DelayNode;
+    createBiquadFilter(): BiquadFilterNode;
+    createWaveShaper(): WaveShaperNode;
+    createPanner(): PannerNode;
+    createConvolver(): ConvolverNode;
+    createChannelSplitter(numberOfOutputs?: number): ChannelSplitterNode;
+    createChannelMerger(numberOfInputs?: number): ChannelMergerNode;
+    createDynamicsCompressor(): DynamicsCompressorNode;
+    createOscillator(): OscillatorNode;
+    createWaveTable(real: Float32Array, imag: Float32Array): IWaveTable;
+    onstatechange(): void;
+    close(): Promise<void>;
+    suspend(): Promise<void>;
+    resume(): Promise<void>;
+}
 export interface IAudioGraph {
     gainNode: GainNode;
     pannerNode?: PannerNode;
     stereoPannerNode?: StereoPannerNode;
+    delayNode?: DelayNode;
+    scriptProcessorNode?: ScriptProcessorNode;
+    analyserNode?: AnalyserNode;
+    biquadFilterNode?: BiquadFilterNode;
+    channelMergeNode?: ChannelMergerNode;
+    channelSplitterNode?: ChannelSplitterNode;
+    convolverNode?: ConvolverNode;
+    dynamicCompressorNode?: DynamicsCompressorNode;
+    oscillatorNode?: OscillatorNode;
+    waveShaperNode?: WaveShaperNode;
 }
 export interface IAudioGraphOptions {
     volume: number;
@@ -11,20 +56,23 @@ export interface ISourceNodeOptions {
     onEnded: Function;
 }
 export declare class PlayerAudio {
-    protected _context: AudioContext;
+    protected _audioContext: IAudioContext | null;
     protected _contextState: string;
     protected _audioGraph: IAudioGraph | null;
-    constructor();
+    constructor(customAudioContext?: IAudioContext, customAudioGraph?: IAudioGraph);
     decodeAudio(arrayBuffer: ArrayBuffer): Promise<AudioBuffer>;
-    protected _getAudioContext(): Promise<{}>;
+    protected _createAudioContext(): IAudioContext;
+    protected _bindContextStateListener(audioContext: IAudioContext): void;
+    getAudioContext(): Promise<{}>;
+    setAudioContext(audioContext: IAudioContext): void;
     protected _destroyAudioContext(): void;
     protected _unfreezeAudioContext(): Promise<void>;
     protected _freezeAudioContext(): Promise<void>;
-    protected _createAudioGraph(): void;
     setAudioGraph(audioGraph: IAudioGraph): void;
     getAudioGraph(): IAudioGraph;
     createSourceNode(sourceNodeOptions: ISourceNodeOptions): Promise<AudioBufferSourceNode>;
-    connectSourceNodeToGraph(sourceNode: AudioBufferSourceNode): void;
+    connectSourceNodeToGraphNodes(sourceNode: AudioBufferSourceNode): void;
+    protected _createAudioGraph(): void;
     protected _destroyAudioGraph(): void;
     destroySourceNode(sourceNode: AudioBufferSourceNode): AudioBufferSourceNode;
     changeGainValue(volume: number): void;

build/@types/web-audio-api-player/library/core.d.ts

@@ -1,12 +1,14 @@
 import { ISound, ISoundAttributes, ISoundSource } from './sound';
-import { PlayerAudio } from './audio';
+import { PlayerAudio, IAudioGraph, IAudioContext } from './audio';
 import { PlayerError } from './error';
 export interface ICoreOptions {
     volume?: number;
     loopQueue?: boolean;
     soundsBaseUrl?: string;
     playingProgressIntervalTime?: number;
     playNextOnEnded?: boolean;
+    audioGraph?: IAudioGraph;
+    audioContext?: IAudioContext;
 }
 export declare class PlayerCore {
     protected _isWebAudioApiSupported: boolean;
@@ -19,6 +21,8 @@ export declare class PlayerCore {
     protected _playingTimeoutID: number | null;
     protected _playNextOnEnded: boolean;
     protected _loopQueue: boolean;
+    protected _customAudioGraph: IAudioGraph | null;
+    protected _customAudioContext: IAudioContext | null;
     readonly WHERE_IN_QUEUE_AT_END: string;
     readonly WHERE_IN_QUEUE_AT_START: string;
     readonly WHERE_IN_QUEUE_AFTER_CURRENT: string;
@@ -62,4 +66,8 @@ export declare class PlayerCore {
     first(): void;
     last(): void;
     protected _playingProgress(sound: ISound): void;
+    setAudioGraph(customAudioGraph: IAudioGraph): void;
+    getAudioGraph(): IAudioGraph;
+    setAudioContext(customAudioContext: IAudioContext): void;
+    getAudioContext(): Promise<IAudioContext>;
 }

build/library/audio.js

@@ -0,0 +1,17 @@
+# editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 4
+end_of_line = lf
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.{md,json}]
+charset = utf-8
+indent_style = space
+indent_size = 2
+trim_trailing_whitespace = false
+insert_final_newline = false

build/library/core.js

@@ -0,0 +1,59 @@
+###############################################################################
+# Set default behavior to automatically normalize line endings.
+###############################################################################
+* text=auto
+
+###############################################################################
+# enfore LF for all JS and TS files
+###############################################################################
+*.js eol=lf
+*.ts eol=lf
+
+###############################################################################
+# Set the merge driver for project and solution files
+#
+# Merging from the command prompt will add diff markers to the files if there
+# are conflicts (Merging from VS is not affected by the settings below, in VS
+# the diff markers are never inserted). Diff markers may cause the following 
+# file extensions to fail to load in VS. An alternative would be to treat
+# these files as binary and thus will always conflict and require user
+# intervention with every merge.
+###############################################################################
+*.sln       merge=binary
+*.csproj    merge=binary
+*.vbproj    merge=binary
+*.vcxproj   merge=binary
+*.vcproj    merge=binary
+*.dbproj    merge=binary
+*.fsproj    merge=binary
+*.lsproj    merge=binary
+*.wixproj   merge=binary
+*.modelproj merge=binary
+*.sqlproj   merge=binary
+*.wwaproj   merge=binary
+
+###############################################################################
+# behavior for image files
+#
+# image files are treated as binary by default.
+###############################################################################
+*.jpg   binary
+*.png   binary
+*.gif   binary
+
+###############################################################################
+# diff behavior for common document formats
+# 
+# Convert binary document formats to text before diffing them. This feature
+# is only available from the command line.
+###############################################################################
+*.doc   diff=astextplain
+*.DOC   diff=astextplain
+*.docx  diff=astextplain
+*.DOCX  diff=astextplain
+*.dot   diff=astextplain
+*.DOT   diff=astextplain
+*.pdf   diff=astextplain
+*.PDF   diff=astextplain
+*.rtf   diff=astextplain
+*.RTF   diff=astextplain

examples/visualizer-player/.editorconfig

@@ -0,0 +1,31 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules
+jspm_packages
+
+# Optional npm cache directory
+.npm
+
+# Optional REPL history
+.node_repl_history
+
+# visual studio
+.vs
+*.njsproj
+*.sln
+obj
+
+# build
+build

examples/visualizer-player/.gitattributes

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2014 chris weber
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

examples/visualizer-player/.gitignore

@@ -0,0 +1,28 @@
+# web audio API player - visualizer player example
+
+## build
+
+run gulp build in the root of this repository, to build the player itself  
+
+```
+cd /web-audio-api-player
+gulp build
+```
+
+now build the example itself  
+
+```
+cd /web-audio-api-player/examples/visualizer-player
+gulp build
+```
+
+## run
+
+launch the server  
+
+```
+node build/server
+```
+
+## TODOs
+