web audio test

by mohayonao

HTML

<button id="start">start</button><div id="message"></div>

JavaScript

var interval = 0.125;
var dur = 2.5;

var audioContext = new AudioContext();

var timerId = 0;
var totalCount = 0;
var noteCount = 0;

var whiteNoise = (function() {
  var length = audioContext.sampleRate * 4;
  var data = new Float32Array(length);

  for (var i = 0; i < length; i++) {
    data[i] = Math.random() * 2 - 1;
  }

  var buf = audioContext.createBuffer(1, length, audioContext.sampleRate);

  buf.getChannelData(0).set(data);

  return buf;
})();

function play(t0, t1) {
  var osc1 = audioContext.createOscillator();
  var osc2 = audioContext.createOscillator();
  var osc3 = audioContext.createOscillator();
  var buf1 = audioContext.createBufferSource();
  var amp1 = audioContext.createGain();
  var amp2 = audioContext.createGain();
  var lfo1 = audioContext.createBiquadFilter();

  osc1.frequency.value = 523;
  osc2.frequency.value = 784;
  osc3.frequency.value = 988;
  buf1.buffer = whiteNoise;
  buf1.loop = true;

  osc1.start(t0);
  osc2.start(t0);
  osc3.start(t0);
  buf1.start(t0);

  amp1.gain.value = 0.25;
  amp2.gain.setValueAtTime(1, t0);
  amp2.gain.exponentialRampToValueAtTime(0.001, t1);

  osc1.connect(amp1);
  osc2.connect(amp1);
  osc3.connect(amp1);
  buf1.connect(amp2);
  amp1.connect(amp2);
  amp2.connect(lfo1);
  lfo1.connect(audioContext.destination);

  noteCount += 1;

  setTimeout(function() {
    osc1.stop(t1);
    osc2.stop(t1);
    osc3.stop(t1);
    buf1.stop(t1);

    osc1.disconnect();
    osc2.disconnect();
    osc3.disconnect();
    buf1.disconnect();
    amp1.disconnect();
    amp2.disconnect();
    lfo1.disconnect();
    noteCount -= 1;
  }, (t1 - t0) * 1000);
}

var message = document.getElementById("message");

function start() {
  totalCount = 0;
  var startTime = audioContext.currentTime;
  timerId = setInterval(function() {
    totalCount += 1;

    var playbackTime = startTime + totalCount * interval;

    play(playbackTime, playbackTime + dur);

    message.innerHTML = "totalCount=" + totalCount + ", noteCount=" +...