Skip to content

Commit 337d680

Browse files
finished this one, fun
1 parent 3f0915d commit 337d680

File tree

1 file changed

+18
-0
lines changed

1 file changed

+18
-0
lines changed

01 - JavaScript Drum Kit/index-START.html

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,24 @@
5959

6060
<script>
6161

62+
function playSound(e) {
63+
const audio = document.querySelector(`audio[data-key="${e.keyCode}"]`);
64+
const key = document.querySelector(`.key[data-key="${e.keyCode}"]`);
65+
if (!audio) return;
66+
audio.currentTime = 0;
67+
audio.play();
68+
key.classList.add('playing');
69+
}
70+
71+
function removeTransition(e) {
72+
if (e.propertyName !== 'transform') return;
73+
this.classList.remove('playing');
74+
}
75+
76+
const keys = document.querySelectorAll('.key');
77+
keys.forEach(key => key.addEventListener('transitionend', removeTransition));
78+
window.addEventListener('keydown', playSound);
79+
6280
</script>
6381

6482

0 commit comments

Comments
 (0)