KeyBeatX/drum.js at master · Hariharan1893/KeyBeatX · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
function play(id){
  let audio = new Audio('./drum_beats/'+id+'.mp3');
  audio.play();

  audio.addEventListener("play", (event)=>{
    let element = document.getElementById(id);
    element.classList.add('shadow-2xl');
    element.classList.add('bg-opacity-100');

    setTimeout(()=>{
      element.classList.remove('shadow-2xl');
      element.classList.remove('bg-opacity-100');
    },500);
  })
}

let isMouseDown = false;

function playOnEnter(id){
  if(isMouseDown){
    play(id);
  }
}

document.addEventListener("keypress",(event)=>{
  if (event.key >= 'a' && event.key <= 'z'){
    play(event.key);
  }
});

document.addEventListener("mousedown", (event)=>{
  isMouseDown = true;
})

document.addEventListener("mouseup", ()=>{
  isMouseDown = false;
})