HTML5/Javascript web audio api - SoundManager

Question

私は単純なゲームのサウンドマネージャーを作成しようとしていますが、私はこのアプリケーションでは必要ないと知っていますが、私はそうしています。 私はいくつかのアプローチを試しましたが、実際の成功はありません。以下は私の現在の試みです。 私の主な問題は、私のファイルが読み込まれないような試行ごとに私のXMLリクエストにあると思います。

どこが間違っているのか、どういうことをすべきかアドバイスをいただければ幸いです。

マイオーディオマネージャが（遠い完全からではなく、音をロードして再生してください）

var audioctx = new (window.AudioContext || window.webkitAudioContext)(); 
function AudioManager(totalsounds) { 
this.ctx = audioctx; 
this.sounds = {}; 
this.totalSounds = totalsounds; 
this.loaded = 0; 
this.masterGain = this.ctx.createGain(); // master gain control 
this.masterGain.connect(this.ctx.destination); 
this.loadSound = function(name) { 
    this.sounds[name] = new Sound(name, this); 
    console.log("sound Loaded?"); 
}; 
this.play = function(name) { 
    if(this.sounds[name] !== undefined) 
    { 
     this.sounds[name].source.start(0); 
     console.log("playing?"); 
    } else 
    { 
     console.log(name + " - sound not found!"); 
    } 
}; 
}; 

サウンドオブジェクトマネージャによって作成され、内部に保存された。（コードは、ファイルをロードしないように思える）

function Sound(name, audiomanager){ 
this.manager = audiomanager; 
this.source; 
this.request = new XMLHttpRequest(); 
this.request.open('GET', name, true); 
this.request.responseType = 'arraybuffer'; 
console.log(" i think code stops here"); 
this.request.onload = function() { 
    this.manager.loaded += 1; 
    console.log("loaded?"); 
    this.manager.ctx.decodeAudioData(this.request.response).then(function(buffer){ 
     this.source = manager.ctx.createBufferSource(); 
     this.source.buffer = buffer; 
     this.source.connect(manager.masterGain); 
    }); 
}; 
    this.request.send(); 
} 

私はそれを次のようにテストしようとします。

var audio = new AudioManager(1); 
audio.loadSound("test.mp3"); 
if(audio.loaded == audio.totalSounds){setTimeout(game, 50);} 
function game() { 
    ctx.clearRect(0, 0, canvas.width, canvas.height); 
    setInterval(function() { 
     if(buttonDown[5]) 
     { 
      audio.play("test.mp3"); 
     } 
    },100); 

ありがとうございました。

Answer 1

だから私はそれを働かせました。誰かが同じような問題に対する答えを探しているときにこれを見つけた場合、ここでは動作します（まだ非常に粗くて醜いですが）。遅延機能を追加した後、わずかに修正コールで

var audioctx = new (window.AudioContext || window.webkitAudioContext)(); 
function AudioManager(totalsounds) { 
this.ctx = audioctx; 
this.sounds = {}; 
this.totalSounds = totalsounds; 
this.loaded = 0; 
this.masterGain = this.ctx.createGain(); // master gain control 
this.masterGain.connect(this.ctx.destination); 
this.loadSound = function(name, delaytime) { 
    this.sounds[name] = new Sound(name, this, delaytime); 
    console.log("sound Loaded?"); 
}; 
this.play = function(name) { 
    var buffer = this.ctx.createBufferSource(); 
    if(this.sounds[name] !== undefined && !this.sounds[name].delayed) 
    { 
     buffer.buffer = this.sounds[name].source; 
     buffer.connect(this.masterGain); 
     buffer.start(0); 
     console.log("playing?"); 
     this.sounds[name].delaySet(); 
    } else if(this.sounds[name].delayed) 
    { 
     console.log("audio delayed = " + this.sounds[name].delayed); 
    } else 
    { 
     console.log(name + " - sound not found!"); 
    } 

}; 
}; 
function Sound(name, audiomanager, delaytime){ 
this.manager = audiomanager; 
this.source; 
this.delay = delaytime; 
this.delayed = false; 
var self = this; 
this.delaySet = function(){ 
    console.log("RESET"); 
    self.delayed = true; 
    setTimeout(function(){self.delayed = false;}, self.delay); 
}; 
this.request = new XMLHttpRequest(); 
this.request.open('GET', name, true); 
this.request.responseType = 'arraybuffer'; 
console.log("stops here"); 
this.request.onload = function() { 
    self.manager.loaded += 1; 
    console.log("loaded?"); 

self.manager.ctx.decodeAudioData(self.request.response).then(function(buffer){ 
     self.source = buffer; 
    }); 
}; 
this.request.send(); 
} 

。（実際のソリューションの一部ではない）あなたは `（）`あなたのXHRリクエストを送信する必要があり

var audio = new AudioManager(1); 
audio.loadSound("test.mp3", 1500); 
var a = setInterval(function() { 
if(audio.loaded >= audio.totalSounds){setTimeout(game, 50); clearInterval(a);} 
}, 100); 
function game() { 
    ctx.clearRect(0, 0, canvas.width, canvas.height); 
    setInterval(function() { 
     if(buttonDown[5]) 
     { 
      console.log("SOUND"); 
      audio.play("test.mp3"); 
     } 
    },100);