forked from wesbos/JavaScript30
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathscript.js
More file actions
32 lines (27 loc) · 1004 Bytes
/
script.js
File metadata and controls
32 lines (27 loc) · 1004 Bytes
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
function playSound(e) {
// console.log(e.keyCode);
const audio = document.querySelector(`audio[data-key="${e.keyCode}"]`);
const key = document.querySelector(`.key[data-key="${e.keyCode}"]`);
if (!audio) return; //stops function from running altogether
audio.currentTime = 0; //rewinds to start
audio.play();
// console.log(key);
key.classList.add("playing"); //adds class playing
// key.classList.remove('playing');
// key.classList.toggle('playing');
// setTimeout(function() {
// }, 0.07) //function to set timeout
}
function removeTransition(e) {
// console.log(e);
if (e.propertyName !== "transform") return; //skip it if its not a transform
// console.log(e.propertyName);
this.classList.remove("playing");
// console.log(this);
}
const keys = document.querySelectorAll(".key");
// keys.addEventListener('transitionend'); // jquery
keys.forEach(key =>
key.addEventListener("transitionend", removeTransition)
);
window.addEventListener("keydown", playSound);