私はHTML5を使用してゲームをプログラムしています。私が今遭遇した障害は、効果音をどのように演奏するかです。
特定の要件は数が少ないです:
- 複数のサウンドを再生してミックスし、
- 同じサンプルを複数回再生し、再生が重複する可能性があります。
- いつでもサンプルの再生を中断し、
- できれば(低品質の)生のPCMを含むWAVファイルを再生しますが、もちろんこれらを変換することもできます。
私の最初のアプローチは、HTML5<audio>
要素を使用して、ページ内のすべての効果音を定義することでした。FirefoxはWAVファイルをほんの少しだけ再生しますが、#play
複数回呼び出すと実際にはサンプルが複数回再生されるわけではありません。HTML5仕様の私の理解から、<audio>
要素は再生状態も追跡するので、それが理由を説明しています。
私の当面の考えはオーディオ要素のクローンを作成することだったので、それを行うために次の小さなJavaScriptライブラリを作成しました(jQueryに依存します)。
var Snd = {
init: function() {
$("audio").each(function() {
var src = this.getAttribute('src');
if (src.substring(0, 4) !== "snd/") { return; }
// Cut out the basename (strip directory and extension)
var name = src.substring(4, src.length - 4);
// Create the helper function, which clones the audio object and plays it
var Constructor = function() {};
Constructor.prototype = this;
Snd[name] = function() {
var clone = new Constructor();
clone.play();
// Return the cloned element, so the caller can interrupt the sound effect
return clone;
};
});
}
};
これSnd.boom();
で、Firebugコンソールから実行して再生snd/boom.wav
できますが、同じサンプルを複数回再生することはできません。この<audio>
要素は、効果音を再生するためのものというよりも、実際にはストリーミング機能のようなもののようです。
私が見逃している、できればHTML5とJavaScriptのみを使用して、これを実現するための賢い方法はありますか?
また、私のテスト環境はUbuntu9.10上のFirefox3.5です。私が試した他のブラウザ(Opera、Midori、Chromium、Epiphany)では、さまざまな結果が得られました。何も再生しないものもあれば、例外をスローするものもあります。