forked from wesbos/JavaScript30
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathmain.js
More file actions
22 lines (20 loc) · 791 Bytes
/
main.js
File metadata and controls
22 lines (20 loc) · 791 Bytes
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
window.addEventListener('keydown', function(e){
const audio = document.querySelector(`audio[data-key="${e.keyCode}"]`);
const key = document.querySelector(`.key[data-key="${e.keyCode}"]`)
if(!audio) return; // stops the audio from running all together
audio.currentTime = 0; // rewinds to the start
audio.play(); // plays keys over and over again\
// key.classList.toggle('playing');
key.classList.add('playing');
});
const keys = Array.from(document.querySelectorAll('.key'));
// cannot listen for events on an array
keys.forEach(key => key.addEventListener('transitionend', removeTransition));
console.log(keys);
function removeTransition(e) {
console.log(e);
if(e.propertyName !== 'transform') {
return; // skip if it's not a transform
}
this.classList.remove('playing');
}