Edit Question - KnowledgeHub

Title Body

I've been playing with the Web Audio API and I'm trying to load multiple parts of a song and append them to a new ArrayBuffer and then use that ArrayBuffer for playing all the parts as one song. In the following example I am using the same song data (which is a small loop) instead of different parts of a song. The problem is that it still plays just once instead of two times and I don't know why. Download song function init() { /** * Appends two ArrayBuffers into a new one. * * @param {ArrayBuffer} buffer1 The first buffer. * @param {ArrayBuffer} buffer2 The second buffer. */ function appendBuffer(buffer1, buffer2) { var tmp = new Uint8Array(buffer1.byteLength + buffer2.byteLength); tmp.set( new Uint8Array(buffer1), 0); tmp.set( new Uint8Array(buffer2), buffer1.byteLength); return tmp; } /** * Loads a song * * @param {String} url The url of the song. */ function loadSongWebAudioAPI(url) { var request = new XMLHttpRequest(); var context = new webkitAudioContext(); request.open('GET', url, true); request.responseType = 'arraybuffer'; /** * Appends two ArrayBuffers into a new one. * * @param {ArrayBuffer} data The ArrayBuffer that was loaded. */ function play(data) { // Concatenate the two buffers into one. var a = appendBuffer(data, data); var buffer = a.buffer; var audioSource = context.createBufferSource(); audioSource.connect(context.destination); //decode the loaded data context.decodeAudioData(buffer, function(buf) { console.log('The buffer', buf); audioSource.buffer = buf; audioSource.noteOn(0); audioSource.playbackRate.value = 1; }); }; // When the song is loaded asynchronously try to play it. request.onload = function() { play(request.response); } request.send(); }

Tags (comma-separated) Cancel