There was a point where I got stuck in a javascript project. I want to play mp3 audio files when an event occurs. Sometimes I need to play maybe 5 mp3 files back to back instantly. In my experiments, all files play at the same time. What I want is to make them play in order. The mp3 files are listened to in a loop. When a new mp3 play request comes in, I want it to add 100s of mp3 files to a queue and play them all. I tried to do my experiments using Howler.js.
connection.on("send", (data) => {
playSound(data.mp3Filename) // --> I'm listen the mp3 files here.
});
var sound = null;
var soundQueue = [];
function playSound(soundURL) {
if (sound === null || !sound.playing()) {
sound = new Howl({
src: [soundURL],
onend: function () {
if (soundQueue.length > 0) {
var nextSound = soundQueue.shift();
playSound(nextSound);
}
},
});
sound.play();
} else {
soundQueue.push(soundURL);
}
}
But still the soundQueue plays more than the number added, where is my mistake?
I fixed the problem, there was no error in the code above. It was looping extra where I called the function. Thanks to all of you.