Webaudio Browser sound test
2019
A very simple exploration of the webaudio api.
html
<button id="beeper">beep()</button>
js
document.getElementById('beeper').onclick=beep;
let ctx;
function beep(){
const beepSpec = {
freq1: 5000, freq2: 2000,
dur: .5, //s
vol: .1, //normalized?
shape: 'sine', //OscillatorNode.type "sine", "square", "sawtooth", "triangle" and "custom" note: 'custom' is a PeriodicWave
};
// we do this because the audio context goes away sometimes.
ctx = ctx ? ctx : new AudioContext();
const osc = ctx.createOscillator();
const gainOsc = ctx.createGain();
const vol = beepSpec.vol || 1;
osc.type = beepSpec.shape;
osc.frequency.setValueAtTime(beepSpec.freq1, ctx.currentTime);
osc.frequency.exponentialRampToValueAtTime(beepSpec.freq2, ctx.currentTime + beepSpec.dur / 2);
osc.frequency.exponentialRampToValueAtTime(beepSpec.freq1, ctx.currentTime + beepSpec.dur);
gainOsc.gain.setValueAtTime(vol, ctx.currentTime);
gainOsc.gain.exponentialRampToValueAtTime(0.001, ctx.currentTime + beepSpec.dur);
osc.connect(gainOsc);
gainOsc.connect(ctx.destination);
osc.start(ctx.currentTime);
osc.stop(ctx.currentTime + beepSpec.dur);
}
Copyright SimpatiCorp 2024