JSFiddle - React, Tailwind, and code Playground

by replicateur

JavaScript

//setup audio context
window.AudioContext = window.AudioContext || window.webkitAudioContext;
var context = new window.AudioContext();
var scriptNode = context.createScriptProcessor(4096, 1, 1);
var masterGain = context.createGain();
scriptNode.connect(context.destination);

function wavefilter(sample) {
  var random = Math.random() * 2 + Math.random();
  if (Math.random() > 0.9) {
    return (Math.random() * sample + random);
  } else {
    return 1
  }
}

// Give the node a function to process audio events
scriptNode.onaudioprocess = function(audioProcessingEvent) {
  // The input buffer is the song we loaded earlier
  var inputBuffer = audioProcessingEvent.inputBuffer;

  // The output buffer contains the samples that will be modified and played
  var outputBuffer = audioProcessingEvent.outputBuffer;

  // Loop through the output channels (in this case there is only one)
  for (var channel = 0; channel < outputBuffer.numberOfChannels; channel++) {
    var inputData = inputBuffer.getChannelData(channel);
    var outputData = outputBuffer.getChannelData(channel);

    // Loop through the 4096 samples
    for (var sample = 0; sample < inputBuffer.length; sample++) {
      // make output equal to the same as the input
      outputData[sample] = inputData[sample];

      // add noise to each output sample
      outputData[sample] += wavefilter(sample);
    }
  }
}