WebAudio

Testing JavaScriptAudioNode ability to generate audio.

by egon

HTML

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>WebAudio Testing</title>
    <meta name="description" content="WebAudio testing grounds">
    <meta name="author" content="Egon Elbre">
</head>
<body>
    <header>
        <h1>WebAudio Sampler</h1>
    </header>
    <content id="notes">
    </content>
    <footer>
        <h3>&copy;2011 Egon Elbre</h3>
    </footer>
</body>
</html>

CSS

body { 
    font-family: Georgia;
}

JavaScript

actx = new webkitAudioContext();
playing = [];

var play = function(Frequency, time){
    var source = actx.createJavaScriptNode(4096, 0, 1),
          Time = 0,
          MasterVolume = 0.6,
          SampleRate = actx.sampleRate;
    var dphase = 2 * Math.PI * Frequency / SampleRate,
        phase = 0;
    source.onaudioprocess = function(e){
        var data = e.outputBuffer.getChannelData(0);
        var sin = Math.sin;
        for(var i = 0; i < data.length; i++){
            data[i] = MasterVolume * sin(phase);
            phase += dphase;
        }
        if( phase > 10000 ){
            source.disconnect(0);
        }
    };
    console.log(source);
    source.connect( actx.destination );
    playing.push(source);
}

var notes = document.getElementById('notes');

for(var i = 0; i < 13; i++){
    var freq = 440*Math.pow(2, i/12),
           e = document.createElement('button');
    e.innerHTML = String(i);
    e.click(function(){play(freq);})
    notes.appendChild(e);
}

var time = actx.currentTime + 10.0;
play(440, time);
play(466, time);
play(499, time);