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
36 lines (36 loc) · 1.06 KB
/
script.js
File metadata and controls
36 lines (36 loc) · 1.06 KB
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
var keys = [].slice.call(document.querySelectorAll("audio[data-key]"));
;
function keysToKeyMap(acc, currVal) {
var keyCode = currVal.getAttribute('data-key');
var thisButton = document.querySelector("div[data-key=\"" + keyCode + "\"]");
if (keyCode && thisButton) {
acc[keyCode] = {
button: thisButton,
audio: currVal
};
}
return acc;
}
var keyMap = keys.reduce(keysToKeyMap, {});
function playAudio(audio) {
var audioSrc = audio.src;
var thisAudio = new Audio(audioSrc);
thisAudio.play();
}
function removeTransition(event) {
if (event.propertyName !== 'transform' ||
!event.target) {
return;
}
event.target.classList.remove('playing');
}
function handleKeyEvent(event) {
if (!keyMap[event.keyCode]) {
return;
}
var _a = keyMap[event.keyCode], button = _a.button, audio = _a.audio;
playAudio(audio);
button.classList.add('playing');
button.addEventListener('transitionend', removeTransition);
}
window.addEventListener('keydown', handleKeyEvent);