File tree Expand file tree Collapse file tree 1 file changed +0
-29
lines changed
Expand file tree Collapse file tree 1 file changed +0
-29
lines changed Original file line number Diff line number Diff line change 5959
6060< script >
6161
62- /****************** resources ******************
63- http://keycode.info
64- shows the keycodes of the key typed
65- ****************** ******************/
66-
67-
68- // refactored function
69- function playSound ( e ) {
70- const audio = document . querySelector ( `audio[data-key="${ e . keyCode } "]` ) ;
71- const key = document . querySelector ( `.key[data-key="${ e . keyCode } "]` ) ;
72- if ( ! audio ) return ; // stop function
73- audio . currentTime = 0 ; // rewind to the start
74- // console.log(audio);
75- audio . play ( ) ;
76- key . classList . add ( "playing" ) ;
77- }
78-
79- // need to add a transition end event
80- // first, get an array of all the keys that we're traacking
81- const keys = document . querySelectorAll ( ".key" ) ;
82- // keys is a NodeList , not an array
83-
84- function removeTransition ( e ) {
85- if ( e . propertyName !== "transform" ) return ; // skip
86- console . log ( e . propertyName ) ;
87- this . classList . remove ( "playing" ) ;
88- }
89- keys . forEach ( key => key . addEventListener ( 'transitionend' , removeTransition ) ) ;
90- window . addEventListener ( 'keydown' , playSound ) ;
9162</ script >
9263
9364
You can’t perform that action at this time.
0 commit comments