riffwave.js - HTML5 sound synthesis via PCM encoding


"riffwave.js" is a tiny javascript library that encodes audio data to a format (PCM inside a RIFF container) that can be used to play synthesized sounds with the HTML5 audio element.

Simply use the generated data URI as source.

Works in:

Other browsers not tested.

Download riffwave.js (version 0.03)

Some tests

Sample usage

var data = []; // just an array
for (var i=0; i<10000; i++) data[i] = Math.round(255 * Math.random()); // fill data with random samples
var wave = new RIFFWAVE(data); // create the wave file
var audio = new Audio(wave.dataURI); // create the HTML5 audio element
audio.play(); // some noise

Another one

var audio = new Audio(); // create the HTML5 audio element
var wave = new RIFFWAVE(); // create an empty wave file
var data = []; // yes, it's an array

wave.header.sampleRate = 44100; // set sample rate to 44KHz
wave.header.numChannels = 2; // two channels (stereo)

var i = 0;
while (i<100000) { 
  data[i++] = 128+Math.round(127*Math.sin(i/10)); // left speaker
  data[i++] = 128+Math.round(127*Math.sin(i/200)); // right speaker

wave.Make(data); // make the wave file
audio.src = wave.dataURI; // set audio source
audio.play(); // we should hear two tones one on each speaker

by Pedro Ladaria <pedro.ladaria at gmail dot com>
twitter: @pladaria

Go home