this.kickAudio.play(); is not playing i dont know why?? Please help
I am trying to play the audio by loop over the div but some how audio file is not playing
class DrumKit {
constructor() {
this.pads = document.querySelectorAll(".pad");
this.playBtn = document.querySelector(".play");
this.kickAudio = document.querySelectorAll(".kick-sound");
this.snareAudio = document.querySelectorAll(".snare-sound");
this.hithatAudio = document.querySelectorAll(".hithat-sound");
this.index = 0;
this.bpm = 150;
}
activePad() {
this.classList.toggle("active");
}
repeat() {
let step = this.index % 8;
const activeBars = document.querySelectorAll(`.b${step}`);
console.log(step);
// Looping over the pads for animation
activeBars.forEach((bar) => {
bar.style.animation = `playTrack 0.3s alternate ease-in-out 2`;
// Check for the active pad
if (bar.classList.contains("active")) {
if (bar.classList.contains("kick-pad")) {
this.kickAudio.currentTime = 0;
this.kickAudio.play();
}
}
});
this.index++;
}
start() {
const interval = (60 / this.bpm) * 1000;
setInterval(() => {
this.repeat();
}, interval);
}
}
const drumKit = new DrumKit();
drumKit.pads.forEach((pad) => {
pad.addEventListener("click", drumKit.activePad);
pad.addEventListener("animationend", function () {
// this.style.animation = '';
});
});
drumKit.playBtn.addEventListener("click", function () {
drumKit.start();
});
this.kickAudio.play(); is not playing i dont know why?? Please help
I am trying to play the audio by loop over the div but some how audio file is not playing