ここには2つの関数があります。loadはmp3へのパスを受け取り、countはロードされているトラックの数です。forループが最後のトラックに達すると、arraybufferListにはすべての曲の「arraybuffer」の配列が含まれます。次に、これは、webaudioapi関数'decodeAudioData'を使用してすべての情報をデコードし、すべてを「currentBuffer」内に配置するloadData関数に渡されます。ただし、クロージャーの外では、「currentBuffer」は消えるように見えます(私のグーグルクロームデバッガーでは)。
wavesurfer.jsライブラリを使用して、複数のトラックに拡張しようとしています。
load: function (src,count) {
var my = this;
var xhr = new XMLHttpRequest();
xhr.responseType = 'arraybuffer';
xhr.onload = function () {
console.log("loading mp3 & putting inside arraybufferList");
arraybufferList.push(xhr.response);
if (arraybufferList.length==count){
console.log(arraybufferList);
for (var i=0; i<arraybufferList.length; i++){
my.backend.loadData(
arraybufferList[i],
playList[i].draw.bind(playList[i])
);
console.log(playList);
//playList.push(my);
}
console.log(playList);
}
};
xhr.open('GET', src, true);
xhr.send();
},
loadData: function (audioData, cb) {
var my = this;
this.pause();
this.ac.decodeAudioData(
audioData,
function (buffer) {
my.currentBuffer = buffer;
my.lastStart = 0;
my.lastPause = 0;
my.startTime = null;
cb(buffer);
},
Error
);
},
各オーディオファイルの最初に、loadDataからの情報が入る場所にオブジェクトが作成されます
var WaveSurfer = {
init: function (params) {
var my = this;
var backend = WaveSurfer.Audio;
if (!params.predrawn) {
backend = WaveSurfer.WebAudio;
}
this.backend = Object.create(backend);
this.backend.init(params);
this.drawer = Object.create(WaveSurfer.Drawer);
this.drawer.init(params);
this.backend.bindUpdate(function () {
my.onAudioProcess();
});
this.bindClick(params.canvas, function (percents) {
my.playAt(percents);
});
playList.push(my);
},
いくつかの重要なコード:ac:new(window.AudioContext || window.webkitAudioCont