In HTML5, posso riprodurre lo stesso suono più volte allo stesso tempo?

Question

Sto facendo un gioco, in cui i suoni vengono spesso riprodotti. Ho notato che un suono non suonerà di nuovo mentre viene suonato. Ad esempio, il giocatore entra in collisione con un muro, viene riprodotto un suono "thump". Ma, se il giocatore si scontra con un muro, e poi rapidamente si scontra con un altro muro, viene riprodotto solo un suono "thump", e credo che ciò avvenga perché il primo suono non è terminato. È vero? Come dovrei evitare questo? Ho pensato di precaricare il suono tre volte, sempre a giocare una copia diversa di quel suono, ma questo sembra un po 'stupida ...

risolto:

Risulta che avevo ragione ... hai bisogno di precaricare versioni multiple del suono e quindi riprodurle in modo circolare.

il codice:

var ns = 3; //The number of sounds to preload. This depends on how often the sounds need to be played, but if too big it will probably cause lond loading times. 
var sounds = []; //This will be a matrix of all the sounds 

for (i = 0; i < ns; i ++) //We need to have ns different copies of each sound, hence: 
    sounds.push([]); 

for (i = 0; i < soundSources.length; i ++) 
    for (j = 0; j < ns; j ++) 
     sounds[j].push(new Audio(sources[i])); //Assuming that you hold your sound sauces in a "sources" array, for example ["bla.wav", "smile.dog" "scream.wav"] 

var playing = []; //This will be our play index, so we know which version has been played the last. 

for (i = 0; i < soundSources.length; i ++) 
    playing[i] = 0; 

playSound = function(id, vol) //id in the sounds[i] array., vol is a real number in the [0, 1] interval 
{ 
    if (vol <= 1 && vol >= 0) 
     sounds[playing[id]][id].volume = vol; 
    else 
     sounds[playing[id]][id].volume = 1; 

    sounds[playing[id]][id].play(); 
    ++ playing[id]; //Each time a sound is played, increment this so the next time that sound needs to be played, we play a different version of it, 

    if (playing[id] >= ns) 
     playing[id] = 0; 
} 

Answer 1

Caricare i sonori più volte per simulare la polifonia. Giocali in modalità round robin. Controlla la mia demo allo matthewtoledo.com. In particolare, la funzione _initSoundBank()

Answer 2

Sì, un singolo oggetto <audio> può riprodurre solo una traccia alla volta. Si consideri che l'oggetto <audio> ha un attributo currentTime che indica la posizione corrente della traccia audio: se un oggetto può riprodurre più tracce una volta, quale valore corrisponderebbe a currentTime?

Vedere la mia soluzione per un superset di questo problema su Is playing sound in Javascript performance heavy?. (In sostanza, aggiungere duplicati <audio> tag con lo stesso suono.)

Answer 3

Anche se è implementato solo in Firefox e Chrome in questo momento, in futuro, si dovrebbe utilizzare l'API WebAudio, che è specificamente progettato per i giochi e le applicazioni audio nel browser.

Qui puoi riprodurre qualsiasi suono più volte e fare altre cose divertenti con esso.

Un buon tutorial per questo è qui: http://www.html5rocks.com/en/tutorials/webaudio/games/

Answer 4

È possibile clonare l'elemento audio. Non so se puoi suonarli più di una volta contemporaneamente, ma ecco come puoi suonare un suono più volte senza scaricarlo più di una volta.

var sound = document.getElementById("incomingMessageSound") 
var sound2 = sound.cloneNode() 
sound.play() 
sound2.play() 

So che questo funziona per Chrome, che è l'unico posto che mi serviva. Buona fortuna!