diff --git a/01 - JavaScript Drum Kit/img/prabh.png b/01 - JavaScript Drum Kit/img/prabh.png new file mode 100644 index 0000000000..2c1b6161e4 Binary files /dev/null and b/01 - JavaScript Drum Kit/img/prabh.png differ diff --git a/01 - JavaScript Drum Kit/index-START.html b/01 - JavaScript Drum Kit/index-START.html deleted file mode 100644 index 4070d32767..0000000000 --- a/01 - JavaScript Drum Kit/index-START.html +++ /dev/null @@ -1,66 +0,0 @@ - - - - - JS Drum Kit - - - - - -
-
- A - clap -
-
- S - hihat -
-
- D - kick -
-
- F - openhat -
-
- G - boom -
-
- H - ride -
-
- J - snare -
-
- K - tom -
-
- L - tink -
-
- - - - - - - - - - - - - - - - diff --git a/01 - JavaScript Drum Kit/index.html b/01 - JavaScript Drum Kit/index.html index 246639f990..42ad3c7e7f 100644 --- a/01 - JavaScript Drum Kit/index.html +++ b/01 - JavaScript Drum Kit/index.html @@ -2,82 +2,84 @@ - JS Drum Kit + Sounds of the Squad -
-
- A - clap -
-
- S - hihat +
+ P + Prabh
-
- D - kick +
+ K + Kyra
-
- F - openhat +
+ M + Mary
-
- G - boom +
+ I + Ian
H - ride -
-
- J - snare + Helene
-
- K - tom +
+ R + Raisa
-
- L - tink +
+ B + Ping
- - - - - - - - - + + + + + + + + keys.forEach(key => { + key.addEventListener('transitionend', function(e){ + if(e.propertyName !== 'transform') + return; + e.target.classList.remove("playing"); + }); + }); + + keys.forEach(key =>{ + key.addEventListener('click', function(e){ + var curKey = e.currentTarget.getAttribute('data-key'); + playSoundForKey(cujhrKey); + }); + }); + window.addEventListener('keydown', onKeyPress) + diff --git a/01 - JavaScript Drum Kit/sounds/boom.wav b/01 - JavaScript Drum Kit/sounds/boom.wav deleted file mode 100755 index 8d6423bcdb..0000000000 Binary files a/01 - JavaScript Drum Kit/sounds/boom.wav and /dev/null differ diff --git a/01 - JavaScript Drum Kit/sounds/clap.wav b/01 - JavaScript Drum Kit/sounds/clap.wav deleted file mode 100755 index ef952e5eb4..0000000000 Binary files a/01 - JavaScript Drum Kit/sounds/clap.wav and /dev/null differ diff --git a/01 - JavaScript Drum Kit/sounds/helene.mp3 b/01 - JavaScript Drum Kit/sounds/helene.mp3 new file mode 100644 index 0000000000..df944ea380 Binary files /dev/null and b/01 - JavaScript Drum Kit/sounds/helene.mp3 differ diff --git a/01 - JavaScript Drum Kit/sounds/hihat.wav b/01 - JavaScript Drum Kit/sounds/hihat.wav deleted file mode 100755 index 885cb196a3..0000000000 Binary files a/01 - JavaScript Drum Kit/sounds/hihat.wav and /dev/null differ diff --git a/01 - JavaScript Drum Kit/sounds/ian.mp3 b/01 - JavaScript Drum Kit/sounds/ian.mp3 new file mode 100644 index 0000000000..0bcaaceaa0 Binary files /dev/null and b/01 - JavaScript Drum Kit/sounds/ian.mp3 differ diff --git a/01 - JavaScript Drum Kit/sounds/kick.wav b/01 - JavaScript Drum Kit/sounds/kick.wav deleted file mode 100755 index 8fe46dea0c..0000000000 Binary files a/01 - JavaScript Drum Kit/sounds/kick.wav and /dev/null differ diff --git a/01 - JavaScript Drum Kit/sounds/kyra.mp3 b/01 - JavaScript Drum Kit/sounds/kyra.mp3 new file mode 100644 index 0000000000..b6c00d3f17 Binary files /dev/null and b/01 - JavaScript Drum Kit/sounds/kyra.mp3 differ diff --git a/01 - JavaScript Drum Kit/sounds/mary.mp3 b/01 - JavaScript Drum Kit/sounds/mary.mp3 new file mode 100644 index 0000000000..8db3ceb8d6 Binary files /dev/null and b/01 - JavaScript Drum Kit/sounds/mary.mp3 differ diff --git a/01 - JavaScript Drum Kit/sounds/openhat.wav b/01 - JavaScript Drum Kit/sounds/openhat.wav deleted file mode 100755 index 50637521dc..0000000000 Binary files a/01 - JavaScript Drum Kit/sounds/openhat.wav and /dev/null differ diff --git a/01 - JavaScript Drum Kit/sounds/ping.mp3 b/01 - JavaScript Drum Kit/sounds/ping.mp3 new file mode 100644 index 0000000000..88a7c08767 Binary files /dev/null and b/01 - JavaScript Drum Kit/sounds/ping.mp3 differ diff --git a/01 - JavaScript Drum Kit/sounds/prabh.mp3 b/01 - JavaScript Drum Kit/sounds/prabh.mp3 new file mode 100644 index 0000000000..be9bb7a1a2 Binary files /dev/null and b/01 - JavaScript Drum Kit/sounds/prabh.mp3 differ diff --git a/01 - JavaScript Drum Kit/sounds/raisa.mp3 b/01 - JavaScript Drum Kit/sounds/raisa.mp3 new file mode 100644 index 0000000000..e07f87cd1a Binary files /dev/null and b/01 - JavaScript Drum Kit/sounds/raisa.mp3 differ diff --git a/01 - JavaScript Drum Kit/sounds/ride.wav b/01 - JavaScript Drum Kit/sounds/ride.wav deleted file mode 100755 index e5829dfef9..0000000000 Binary files a/01 - JavaScript Drum Kit/sounds/ride.wav and /dev/null differ diff --git a/01 - JavaScript Drum Kit/sounds/snare.wav b/01 - JavaScript Drum Kit/sounds/snare.wav deleted file mode 100755 index c4edfc7534..0000000000 Binary files a/01 - JavaScript Drum Kit/sounds/snare.wav and /dev/null differ diff --git a/01 - JavaScript Drum Kit/sounds/tink.wav b/01 - JavaScript Drum Kit/sounds/tink.wav deleted file mode 100755 index f907ea2c0e..0000000000 Binary files a/01 - JavaScript Drum Kit/sounds/tink.wav and /dev/null differ diff --git a/01 - JavaScript Drum Kit/sounds/tom.wav b/01 - JavaScript Drum Kit/sounds/tom.wav deleted file mode 100755 index 9e2cdf691e..0000000000 Binary files a/01 - JavaScript Drum Kit/sounds/tom.wav and /dev/null differ diff --git a/01 - JavaScript Drum Kit/style.css b/01 - JavaScript Drum Kit/style.css index 3e0a320b37..ce75593170 100644 --- a/01 - JavaScript Drum Kit/style.css +++ b/01 - JavaScript Drum Kit/style.css @@ -1,6 +1,6 @@ html { font-size: 10px; - background:url(http://i.imgur.com/b9r5sEL.jpg) bottom center; + background:url(http://i.imgur.com/Z27jAZG.jpg) bottom center; background-size: cover; } body,html { @@ -18,6 +18,7 @@ body,html { } .key { + cursor: pointer; border:4px solid black; border-radius:5px; margin:1rem; diff --git a/02 - JS + CSS Clock/index-START.html b/02 - JS + CSS Clock/index-START.html index 2712384201..61cd491f84 100644 --- a/02 - JS + CSS Clock/index-START.html +++ b/02 - JS + CSS Clock/index-START.html @@ -14,8 +14,28 @@
+
+ + st ast
+ - -