JSFiddle - React, Tailwind, and code Playground

by mohayonao

HTML

<button id="test">test</button>
<hr>
<textarea id="result"></textarea>

CSS

* { font-size: 1.25em }
#result { width: 100%; height: 400px }

JavaScript

document.getElementById("test").onclick = function() {
  const audioContext = new OfflineAudioContext(1, 100, 44100);
  const oscillator = audioContext.createOscillator();
  const gain = audioContext.createGain();
  const waveShaper = audioContext.createWaveShaper();

  oscillator.start(0);
  oscillator.connect(gain);

  // to silence
  gain.gain.value = 0;
  // gain.gain.setValueAtTime(0, 0);
  gain.connect(waveShaper);

  // convert all signal into 1.0
  waveShaper.curve = new Float32Array([ 1, 1 ]);
  waveShaper.connect(audioContext.destination);

  audioContext.startRendering().then((audioBuffer) => {
    var result = audioBuffer.getChannelData(0);
    
    result = JSON.stringify([].slice.call(result));

    document.getElementById("result").value = result;
  });
};