var c = new webkitAudioContext(); var d = c.createDelayNode(); var df = c.createBiquadFilter(); var dg = c.createGainNode(); var dgo = c.createGainNode(); d.delayTime.value = 0.35; d.connect(df); d.connect(dgo); df.connect(dg); dg.connect(d); dgo.connect(c.destination); df.type = df.HIGHPASS; df.frequency.value = 500; df.Q = 2; dg.gain.value = 0.6; dgo.gain.value = 0.6; var i = 0; $('#play').click(function() { var o = c.createOscillator(); var g = c.createGainNode(); var f = c.createBiquadFilter(); var highF = 880.0 * Math.pow(2, i); var lowF = highF / 32; g.connect(d); g.connect(c.destination); o.connect(f); f.connect(g); o.type = o.SAWTOOTH; o.frequency.value = highF / 16; f.type = f.LOWPASS; f.frequency.setValueAtTime(lowF, c.currentTime); f.frequency.linearRampToValueAtTime(highF, c.currentTime + 0.1); f.frequency.setValueAtTime(highF, c.currentTime + 0.40); f.frequency.linearRampToValueAtTime(lowF, c.currentTime + 0.5); f.Q.value = 10; g.gain.setValueAtTime(0.0, c.currentTime); g.gain.linearRampToValueAtTime(0.2, c.currentTime + 0.05); g.gain.setValueAtTime(0.2, c.currentTime + 0.45); g.gain.linearRampToValueAtTime(0.0, c.currentTime + 0.5); o.noteOn(0); o.noteOff(c.currentTime + 0.5); i = (i + 1) % 5; });
<button id="play">></button>
button { font-size: 3em;}