Web Audio API resume from pause Web Audio API resume from pause google-chrome google-chrome

Web Audio API resume from pause


Oskar's answer and ayke's comment are very helpful, but I was missing a code example. So I wrote one: http://jsfiddle.net/v3syS/2/ I hope it helps.

var url = 'http://thelab.thingsinjars.com/web-audio-tutorial/hello.mp3';var ctx = new webkitAudioContext();var buffer;var sourceNode;var startedAt;var pausedAt;var paused;function load(url) {    var request = new XMLHttpRequest();    request.open('GET', url, true);    request.responseType = 'arraybuffer';    request.onload = function() {        ctx.decodeAudioData(request.response, onBufferLoad, onBufferError);    };    request.send();};function play() {    sourceNode = ctx.createBufferSource();    sourceNode.connect(ctx.destination);    sourceNode.buffer = buffer;    paused = false;    if (pausedAt) {        startedAt = Date.now() - pausedAt;        sourceNode.start(0, pausedAt / 1000);    }    else {        startedAt = Date.now();        sourceNode.start(0);    }};function stop() {    sourceNode.stop(0);    pausedAt = Date.now() - startedAt;    paused = true;};function onBufferLoad(b) {    buffer = b;    play();};function onBufferError(e) {    console.log('onBufferError', e);};document.getElementById("toggle").onclick = function() {    if (paused) play();    else stop();};load(url);


In current browsers (Chrome 43, Firefox 40) there are now 'suspend' and 'resume' methods available for AudioContext:

var audioCtx = new AudioContext();susresBtn.onclick = function() {  if(audioCtx.state === 'running') {    audioCtx.suspend().then(function() {      susresBtn.textContent = 'Resume context';    });  } else if(audioCtx.state === 'suspended') {    audioCtx.resume().then(function() {      susresBtn.textContent = 'Suspend context';    });    }}

(modified example code from https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/suspend)


Actually the web-audio API can do the pause and play task for you. It knows the current state of the audio context (running or suspended), so you can do this in this easy way:

susresBtn.onclick = function() {  if(audioCtx.state === 'running') {    audioCtx.suspend()  } else if(audioCtx.state === 'suspended') {    audioCtx.resume()    }}