JSFiddle - React, Tailwind, and code Playground

by atesgoral

HTML

<button id="x">
X
</button>

JavaScript

var s = false;
var len = 8192;

x.onclick = () => {
  f = len;
};


(tiles = new Image).src =
  // browsers are resilient to omitting the content type (image/png) and the trailing base-64 paddings (=)
  'data:;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAQAgMAAAAZudU+AAAADFBMVEUAAABSUlKlKgD///8IGsOpAAAAi0lEQVQI12NgYAgN5VDiPwBkgJgLmsw3sAgAmY6Oaipv/7AGAJmBgYsWVe4XdAEyCwu7usLqgUyQWokZqemsAWBmpldUPKMDmNm1JBQmqpXlGiZ8BMyctCQwjbcAbO6MJNdQ5gNgc6XUAkPB2goLOzpCQrgfQNywSDSEQwHM7FRgmQBlKnQwOtjYAAC3bipFr0J0MQAAAABJRU5ErkJggg';

f=new AudioContext;a=f.createScriptProcessor(256,1,1);a.connect(f.destination);

f=0
l=l2=l3=0
a.onaudioprocess=e=>{
  q = e.outputBuffer.getChannelData(0);
  
  for(i=256;i--;)
  {
  	v = f>0?(Math.random()*f/len):0;
    q[256-i] = (v+l+l2+l3)/4
    l3=l2
    l2 = l
    l = v
    //q[i] *= .8
    //for(j=7;--j;) q[i] += Math.sin(i*(A*50%j)*Math.floor(b/150)*j/326) * Math.sin(i/2606) * Math.sin(A)/j/4;
  }
  f-=256
}