Confirm
656
edits
Changes
no edit summary
<pre>
</pre>
src="song.ogg"
controls="true"
style="width: 512px;">
</audio>
var audio = document.getElementById('audio-element');
audio.addEventListener('MozAudioAvailable', audioAvailable, false);
audio.addEventListener('loadedmetadata', loadedMetadata, false);
// FFT from dsp.js, see below
<pre>
<audio id="a1"
src="song.ogg" onloadedmetadata="loadedMetadata();"
controls>
</audio>
writeAudio(frameBuffer);
}
a1.addEventListener('MozAudioAvailable', audioAvailable, false);a1.addEventListener('loadedmetadata', audioAvailableloadedMetadata, false);
function writeAudio(audio) {
===== nsIDOMHTMLMediaElement additions =====
Audio metadata is made available via three new attributes on the HTMLMediaElement. By default these attributes throw if accessed before the '''LoadedMetadataloadedmetadata''' event occurs. Users who need this info before the audio starts playing should not use '''autoplay''', since the audio might start before a loadmetadata handler has run.
The three new attributes are defined as follows:
# '''rate''' - the audio's sample rate (e.g., 44100 samples per second)
The choices made for '''channel''' and '''rate''' are significant, because they determine the amount of data you must pass to '''mozWriteAudio()'''. That is, you must pass either an array with 0 elements--similar to flushing the audio stream--or enough data for each channel specified in '''mozSetup()'''.
The '''mozSetup()''' method, if called more than once, will recreate a new audio stream (destroying an existing one if present) with each call. Thus it is safe to call this more than once, but unnecessary.
* We have started work on a JavaScript library to make building audio web apps easier. Details are [[Audio Data API JS Library|here]].
* [http://github.com/bfirsh/dynamicaudio.js dynamicaudio.js] - An interface for writing audio with a Flash fall back for older browsers. ''NOTE:'' not necessarily up-to-date with this version of the API.
=== Working Audio Data Demos ===
** API Example: [http://code.bocoup.com/audio-data-api/examples/ambient-extraction-mixer/ Ambient Extraction Mixer]
** API Example: [http://code.bocoup.com/audio-data-api/examples/worker-thread-audio-processing/ Worker Thread Audio Processing]
* Writing Audio from JavaScript, Digital Signal Processing
** JavaScript Text to Speech engine http://scotland.proximity.on.ca/dxr/tmp/audio/tts/index.html
** Csound shaker instrument ported to JavaScript via Processing.js http://scotland.proximity.on.ca/dxr/tmp/audio/shaker/instruments/shaker.htm
* Beat Detection (also showing use of WebGL for 3D visualizations)
** http://cubicvr.org/CubicVR.js/bd3/BeatDetektor3HD.html (video [http://www.youtube.com/watch?v=OxoFcyKYwr0&fmt=22 here])
** http://cubicvr.org/CubicVR.js/bd3/BeatDetektor4HD.html (video [http://www.youtube.com/watch?v=dym4DqpJuDk&fmt=22 here])
=== Demos Needing to be Updated to New API ===
** http://weare.buildingsky.net/processing/dsp.js/examples/fft.html
** JavaScript Audio Sampler http://weare.buildingsky.net/processing/dsp.js/examples/sampler.html
** Experimental JavaScript port Pure Data http://mccormick.cx/dev/webpd/ with demo http://mccormick.cx/dev/webpd/demos/processingjs-basic-example-with-audio/index.html
** Delay effect http://code.almeros.com/code-examples/delay-firefox-audio-api/ (video of older version [http://vimeo.com/11780707 here])
** Reverb effect http://code.almeros.com/code-examples/reverb-firefox-audio-api/ (video [http://vimeo.com/13386796 here])
** http://weare.buildingsky.net/processing/dft.js/audio.new.html (video [http://vimeo.com/8525101 here])
