forked from wesbos/JavaScript30
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.ts
More file actions
37 lines (27 loc) · 930 Bytes
/
index.ts
File metadata and controls
37 lines (27 loc) · 930 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
33
34
35
36
37
var keysDown: INumberMap<boolean> = {};
window.addEventListener("keydown", (e) => {
const audio = <HTMLAudioElement>document.querySelector(`audio[data-key="${e.keyCode}"]`);
if (!audio) return;
if (keysDown[e.keyCode]) return;
keysDown[e.keyCode] = true;
const key = document.querySelector(`.key[data-key="${e.keyCode}"]`);
key && key.classList.add('playing');
audio.currentTime = 0;
audio.play();
});
window.addEventListener("keyup", (e) => {
e.key
if (keysDown[e.keyCode]) {
keysDown[e.keyCode] = false;
}
})
function removeTransition(e: TransitionEvent) {
if (e.propertyName !== 'transform') return; // skip it if it's not a transform
this.classList.remove('playing');
}
const keys = document.querySelectorAll('.key');
console.log(keys);
// keys.forEach(key => key.addEventListener('transitionend', removeTransition));
for (var key of keys) {
key.addEventListener('transitionend', removeTransition);
}