Awesome

web-audio-graph

web audiograph builder

Usage

var AudioGraph = require('web-audio-graph')
var graph = new AudioGraph()

var source = graph.addSource('oscillator')
var filter = source.addNode('filter')
var gain = filter.addNode('gain')

source.play()

API

var graph = AudioGraph([context])

This module expose the main AudioGraph class, use it to create a new instance of an audio graph. There's no need for the new keyword. The only argument to pass is optional, use it if you want to give the graph object a known AudioContext, if you omit this parameter a new AudioContext will be created. An AudioGraph has two main properties:

• context: Reference to the AudioContext object for this graph.
• sources: A Set object that store each SourceWrapper fro this graph.

var source = graph.addSource(type, value)

Creates a new source node of the type specified, where type is a string of buffer, constant, oscillator, mediaElement and mediaStream. For some of those types, you need to pass a value to create the source.

• buffer: Creates a AudioBufferSourceNode, this type of source need an AudioBuffer as value. A common pattern for this source is to load through ajax (fetch) a file.

fetch('music.mp3')
.then(response => response.arrayBuffer())
.then(buffer => {
  graph.context.decodeAudioData(buffer, audioBuffer => {
    var source = graph.addSource('buffer', audioBuffer)
    // ...
  })
})

• constant: Creates a ConstantSourceNode, value param is not used.
• oscillator: Creates a OscillatorNode, value param is not used.
• mediaElement: Creates a MediaElementAudioSourceNode from an existing <audio> element. For this source, you need to pass the audio element as the value.
• mediaStream: Creates a MediaStreamAudioSourceNode. Use this if you want to get user input from getUserMedia as the source.

if (navigator.mediaDevices) {
  navigator.mediaDevices.getUserMedia ({audio: true, video: true})
  .then(function (stream) {
    var source = graph.addSource('mediaStream', stream)
    // ...
  })
}

If given params are correct, a source node instance is returned. Source nodes have the following properties.

• context: Reference to the AudioContext object for this source (always the same as the grpah from which this source was created).
• outputs: A Set object that store each output node for this source.
• type: The type passed to the constructor.
• isPlaying: A boolean set to true if the source is playing and false otherwise.

graph.play()

Start playing all the sources for this graph.

graph.stop()

Stop all the sources for this graph.

graph.pause()

Pause all the sources for this graph.

var newNode = node.addNode(type)

Add a node of the given type. This method can be called for a normal node or a source node (source node inherits from normal nodes). You can't add source nodes with this method, because source node has no inputs (they are the input), and source node can only be added to the graph itself. The availaible types are analyser (to add AnalyserNode), filter (to add BiquadFilterNode), channelMerger (to add ChannelMergerNode), channelSplitter (to add ChannelSplitterNode), convolver (to add ConvolverNode), delay (to add DelayNode), compressor (to add DynamicsCompressorNode), gain (to add GainNode), iirfilter (to add IIRFilterNode), panner (to add PannerNode), stereoPanner (to add StereoPannerNode) and waveShaper (to add WaveShaperNode).

var newWorletNode = node.addWorkletNode(script, processor)

Add a AudioWorkletNode. Similar to the normal addNode method, but returns a Promise that resolves to the newly added AudioWorkletNode. You need to pass the processor script file name as the first argument and the processor name as the second argument.

node.addWorkletNode('gain-processor.js', 'gain-processor')
  .then(gainWorklet => {
    gainWorklet.connectToDestination()
    // or keep adding (worklet)nodes
    source.play()
  })

node.connectToDestination()

Connect a node to the context.destination fo the graph.

node.update(config)

Update properties of the node. The properties of the config object depend on the type of node. Currently supported properties are:

• For analyser nodes: fftSize, minDecibels, maxDecibels and smoothingTimeConstant.
• For filter nodes: frequency, detune, Q, gain and type.
• For convolver nodes: buffer and normalize.
• For delay nodes: delayTime.
• For compressor nodes: threshold, knee, ratio, reduction, attack and release.
• For gain nodes: gain.
• For panner nodes: coneInnerAngle, coneOuterAngle, coneOuterGain, distanceModel, maxDistance, orientationX, orientationY, orientationZ, panningModel, positionX, positionY, positionZ, refDistance,and rolloffFactor.
• For stereoPanner nodes: pan.
• For waveShaper nodes: curve and oversample.

Each of these properties are set directly to their respectives nodes, so check those for further documentation.

source.play([time])

Play the source at the given time. If time is not set, it defaults to 0.

source.stop()

Stop the source.

source.pause()

Stop the source and save the currentTime so the next time you call play it will pass the time when you last paused.

source.update()

Update properties of the source. The properties of the config object depend on the type of source. Currently supported properties are:

• For buffer nodes: buffer, loop, detune and playbackRate.
• For constant nodes: offset.
• For oscillator nodes: type, detune and frequency.

Each of these properties are set directly to their respectives sources, so check those for further documentation.

License

MIT