Panning Oscillator with slider

by stuartmemo

HTML

<input type="button" id="pan-button" value="Start"/>
<input type="range" id="pan-slider" min="-1" max="1"/>

JavaScript

var context = new webkitAudioContext(),
    sineWave = context.createOscillator(),
    panner = context.createPanner();

sineWave.connect(panner);
panner.connect(context.destination);

document.getElementById('pan-button').addEventListener('click', function () {
    sineWave.noteOn(0);
});

document.getElementById('pan-slider').addEventListener('change', function () {
    panner.setPosition(this.value, 0, 0);
});