diff --git a/Drum Kit Starting Files/.DS_Store b/Drum Kit Starting Files/.DS_Store
new file mode 100644
index 0000000..91209ea
Binary files /dev/null and b/Drum Kit Starting Files/.DS_Store differ
diff --git a/Drum Kit Starting Files/images/crash.png b/Drum Kit Starting Files/images/crash.png
new file mode 100644
index 0000000..a992fa0
Binary files /dev/null and b/Drum Kit Starting Files/images/crash.png differ
diff --git a/Drum Kit Starting Files/images/kick.png b/Drum Kit Starting Files/images/kick.png
new file mode 100644
index 0000000..b64877e
Binary files /dev/null and b/Drum Kit Starting Files/images/kick.png differ
diff --git a/Drum Kit Starting Files/images/snare.png b/Drum Kit Starting Files/images/snare.png
new file mode 100644
index 0000000..1e089ba
Binary files /dev/null and b/Drum Kit Starting Files/images/snare.png differ
diff --git a/Drum Kit Starting Files/images/tom1.png b/Drum Kit Starting Files/images/tom1.png
new file mode 100644
index 0000000..855b211
Binary files /dev/null and b/Drum Kit Starting Files/images/tom1.png differ
diff --git a/Drum Kit Starting Files/images/tom2.png b/Drum Kit Starting Files/images/tom2.png
new file mode 100644
index 0000000..3e9f363
Binary files /dev/null and b/Drum Kit Starting Files/images/tom2.png differ
diff --git a/Drum Kit Starting Files/images/tom3.png b/Drum Kit Starting Files/images/tom3.png
new file mode 100644
index 0000000..762cbf8
Binary files /dev/null and b/Drum Kit Starting Files/images/tom3.png differ
diff --git a/Drum Kit Starting Files/images/tom4.png b/Drum Kit Starting Files/images/tom4.png
new file mode 100644
index 0000000..e79c49e
Binary files /dev/null and b/Drum Kit Starting Files/images/tom4.png differ
diff --git a/Drum Kit Starting Files/index.html b/Drum Kit Starting Files/index.html
new file mode 100644
index 0000000..da93f41
--- /dev/null
+++ b/Drum Kit Starting Files/index.html
@@ -0,0 +1,50 @@
+
+
+
+
+
+ Drum Kit
+
+
+
+
+
+
+ Drum 🥁 Kit
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Drum Kit Starting Files/index.js b/Drum Kit Starting Files/index.js
new file mode 100644
index 0000000..fc05c89
--- /dev/null
+++ b/Drum Kit Starting Files/index.js
@@ -0,0 +1,187 @@
+// document.querySelector("button").addEventListener("click",handleClicked);
+// function handleClicked(){
+// alert("I got clicked");
+// }
+
+// dont used paranthesis inside the event listeer because it will call the function immediately after the button is loaded
+
+// document.querySelector("button").addEventListener("click",function(){
+// alert("I got clicked");
+// });
+
+/*
+document.getElementsByTagName("button")[2].addEventListener("click",function(){
+ alert("I got clicked");
+});
+
+*/
+
+// applying function to all the buttons, whose class name contain drum
+var numbberOfDrums = document.querySelectorAll(".drum").length;
+var drumButton = document.querySelectorAll(".drum");
+var q = document.getElementById("q");
+
+
+// for mouse click
+
+for (var i = 0; i < numbberOfDrums; i++) {
+
+ document.querySelectorAll(".drum")[i].addEventListener("click", function () {
+ // alert("I got clicked");
+
+ // var audio = new Audio("sounds/tom-1.mp3");
+ // audio.play();
+
+ /*
+ this : is a identity of a button that triggered when we click on button
+ we can use this to find out which button is clicked and play the sound
+
+ */
+ // console.log(this);
+ // console.log(this.innerHTML);
+
+ // this.style.color = "yellow";
+
+ var buttonInnerHTML = this.innerHTML;
+
+ makeSound(buttonInnerHTML);
+ buttonAnimation(buttonInnerHTML);
+ });
+
+}
+
+// Using Keyboard Event Listeners to Check for Key Presses
+document.addEventListener("keypress", function (event) {
+
+ // event : is a object that contains information about the event that occured
+ // example which keyboard key is pressed and information about the key
+ // console.log(event);
+ // console.log(event.key);
+ // alert("Key was pressed");
+ makeSound(event.key);
+ buttonAnimation(event.key);
+});
+
+function makeSound(key) {
+ switch (key) {
+ case "q":
+ var audio = new Audio("sounds/tom-1.mp3");
+ audio.play();
+ break;
+ case "w":
+ var audio = new Audio("sounds/tom-2.mp3");
+ audio.play();
+ break;
+ case "e":
+ var audio = new Audio("sounds/tom-3.mp3");
+ audio.play();
+ break;
+ case "r":
+ var audio = new Audio("sounds/tom-4.mp3");
+ audio.play();
+ break;
+ case "t":
+ var audio = new Audio("sounds/snare.mp3");
+ audio.play();
+ break;
+ case "y":
+ var audio = new Audio("sounds/crash.mp3");
+ audio.play();
+ break;
+ case "u":
+ var audio = new Audio("sounds/kick-bass.mp3");
+ audio.play();
+ break;
+ case "i":
+ var audio = new Audio("sounds/tom-1.mp3");
+ audio.play();
+ break;
+ case "o":
+ var audio = new Audio("sounds/tom-2.mp3");
+ audio.play();
+ break;
+ case "p":
+ var audio = new Audio("sounds/tom-3.mp3");
+ audio.play();
+ break;
+ case "a":
+ var audio = new Audio("sounds/tom-4.mp3");
+ audio.play();
+ break;
+ case "s":
+ var audio = new Audio("sounds/snare.mp3");
+ audio.play();
+ break;
+ case "d":
+ var audio = new Audio("sounds/crash.mp3");
+ audio.play();
+ break;
+ case "f":
+ var audio = new Audio("sounds/kick-bass.mp3");
+ audio.play();
+ break;
+ case "g":
+ var audio = new Audio("sounds/tom-1.mp3");
+ audio.play();
+ break;
+ case "h":
+ var audio = new Audio("sounds/tom-2.mp3");
+ audio.play();
+ break;
+ case "j":
+ var audio = new Audio("sounds/tom-3.mp3");
+ audio.play();
+ break;
+ case "k":
+ var audio = new Audio("sounds/tom-4.mp3");
+ audio.play();
+ break;
+ case "l":
+ var audio = new Audio("sounds/snare.mp3");
+ audio.play();
+ break;
+ case "z":
+ var audio = new Audio("sounds/crash.mp3");
+ audio.play();
+ break;
+ case "x":
+ var audio = new Audio("sounds/kick-bass.mp3");
+ audio.play();
+ break;
+ case "c":
+ var audio = new Audio("sounds/tom-1.mp3");
+ audio.play();
+ break;
+ case "v":
+ var audio = new Audio("sounds/tom-2.mp3");
+ audio.play();
+ break;
+ case "b":
+ var audio = new Audio("sounds/tom-3.mp3");
+ audio.play();
+ break;
+ case "n":
+ var audio = new Audio("sounds/tom-4.mp3");
+ audio.play();
+ break;
+ case "m":
+ var audio = new Audio("sounds/snare.mp3");
+ audio.play();
+ break;
+
+ default: alert("wrong key pressed");
+ }
+
+}
+
+
+// adding animation to the buttons
+function buttonAnimation(currentKey){
+ var activate = document.querySelector("." + currentKey);
+ activate.classList.add("pressed");
+// button become normal after 100 milisecond
+ setTimeout(function(){
+ activate.classList.remove("pressed");
+ },100);
+
+}
\ No newline at end of file
diff --git a/Drum Kit Starting Files/sounds/crash.mp3 b/Drum Kit Starting Files/sounds/crash.mp3
new file mode 100644
index 0000000..d568062
Binary files /dev/null and b/Drum Kit Starting Files/sounds/crash.mp3 differ
diff --git a/Drum Kit Starting Files/sounds/kick-bass.mp3 b/Drum Kit Starting Files/sounds/kick-bass.mp3
new file mode 100644
index 0000000..faf06c6
Binary files /dev/null and b/Drum Kit Starting Files/sounds/kick-bass.mp3 differ
diff --git a/Drum Kit Starting Files/sounds/q.wav b/Drum Kit Starting Files/sounds/q.wav
new file mode 100644
index 0000000..92ace0e
Binary files /dev/null and b/Drum Kit Starting Files/sounds/q.wav differ
diff --git a/Drum Kit Starting Files/sounds/snare.mp3 b/Drum Kit Starting Files/sounds/snare.mp3
new file mode 100644
index 0000000..e7cf5b8
Binary files /dev/null and b/Drum Kit Starting Files/sounds/snare.mp3 differ
diff --git a/Drum Kit Starting Files/sounds/tom-1.mp3 b/Drum Kit Starting Files/sounds/tom-1.mp3
new file mode 100644
index 0000000..7dc3003
Binary files /dev/null and b/Drum Kit Starting Files/sounds/tom-1.mp3 differ
diff --git a/Drum Kit Starting Files/sounds/tom-2.mp3 b/Drum Kit Starting Files/sounds/tom-2.mp3
new file mode 100644
index 0000000..f3c0485
Binary files /dev/null and b/Drum Kit Starting Files/sounds/tom-2.mp3 differ
diff --git a/Drum Kit Starting Files/sounds/tom-3.mp3 b/Drum Kit Starting Files/sounds/tom-3.mp3
new file mode 100644
index 0000000..3806033
Binary files /dev/null and b/Drum Kit Starting Files/sounds/tom-3.mp3 differ
diff --git a/Drum Kit Starting Files/sounds/tom-4.mp3 b/Drum Kit Starting Files/sounds/tom-4.mp3
new file mode 100644
index 0000000..58b04be
Binary files /dev/null and b/Drum Kit Starting Files/sounds/tom-4.mp3 differ
diff --git a/Drum Kit Starting Files/styles.css b/Drum Kit Starting Files/styles.css
new file mode 100644
index 0000000..2b946a7
--- /dev/null
+++ b/Drum Kit Starting Files/styles.css
@@ -0,0 +1,58 @@
+*{
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+body {
+ text-align: center;
+ background-color: #09132eee;
+
+}
+
+h1 {
+ font-size: 5rem;
+ color: #DBEDF3;
+ font-family: "Arvo", cursive;
+ text-shadow: 3px 0 #DA0463;
+
+}
+
+footer {
+ color: #DBEDF3;
+ font-family: sans-serif;
+}
+
+.set {
+ margin: 10% auto;
+}
+
+.game-over {
+ background-color: red;
+ opacity: 0.8;
+}
+
+.pressed {
+ box-shadow: 0 3px 4px 0 #DBEDF3;
+ opacity: 0.5;
+}
+
+.red {
+ color: red;
+}
+
+.drum {
+ outline: none;
+ border: 10px solid #404B69;
+ font-size: 5rem;
+ font-family: 'Arvo', cursive;
+ font-weight: 900;
+ color: #DA0463;
+ text-shadow: 3px 0 #DBEDF3;
+ border-radius: 15px;
+ display: inline-block;
+ width: 150px;
+ height: 150px;
+ text-align: center;
+ margin: 5px;
+ background-color: white;
+}
diff --git a/Screenshot (351).png b/Screenshot (351).png
new file mode 100644
index 0000000..1d92fdc
Binary files /dev/null and b/Screenshot (351).png differ
diff --git a/__MACOSX/._Drum Kit Starting Files b/__MACOSX/._Drum Kit Starting Files
new file mode 100644
index 0000000..bd8eba4
Binary files /dev/null and b/__MACOSX/._Drum Kit Starting Files differ
diff --git a/__MACOSX/Drum Kit Starting Files/._.DS_Store b/__MACOSX/Drum Kit Starting Files/._.DS_Store
new file mode 100644
index 0000000..dfb7c0d
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/._.DS_Store differ
diff --git a/__MACOSX/Drum Kit Starting Files/._images b/__MACOSX/Drum Kit Starting Files/._images
new file mode 100644
index 0000000..bd8eba4
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/._images differ
diff --git a/__MACOSX/Drum Kit Starting Files/._index.html b/__MACOSX/Drum Kit Starting Files/._index.html
new file mode 100644
index 0000000..e9f8a25
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/._index.html differ
diff --git a/__MACOSX/Drum Kit Starting Files/._index.js b/__MACOSX/Drum Kit Starting Files/._index.js
new file mode 100644
index 0000000..b698146
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/._index.js differ
diff --git a/__MACOSX/Drum Kit Starting Files/._sounds b/__MACOSX/Drum Kit Starting Files/._sounds
new file mode 100644
index 0000000..bd8eba4
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/._sounds differ
diff --git a/__MACOSX/Drum Kit Starting Files/._styles.css b/__MACOSX/Drum Kit Starting Files/._styles.css
new file mode 100644
index 0000000..5637473
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/._styles.css differ
diff --git a/__MACOSX/Drum Kit Starting Files/images/._crash.png b/__MACOSX/Drum Kit Starting Files/images/._crash.png
new file mode 100644
index 0000000..e94d4ea
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/images/._crash.png differ
diff --git a/__MACOSX/Drum Kit Starting Files/images/._kick.png b/__MACOSX/Drum Kit Starting Files/images/._kick.png
new file mode 100644
index 0000000..0193ffb
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/images/._kick.png differ
diff --git a/__MACOSX/Drum Kit Starting Files/images/._snare.png b/__MACOSX/Drum Kit Starting Files/images/._snare.png
new file mode 100644
index 0000000..db88a00
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/images/._snare.png differ
diff --git a/__MACOSX/Drum Kit Starting Files/images/._tom1.png b/__MACOSX/Drum Kit Starting Files/images/._tom1.png
new file mode 100644
index 0000000..a06ac76
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/images/._tom1.png differ
diff --git a/__MACOSX/Drum Kit Starting Files/images/._tom2.png b/__MACOSX/Drum Kit Starting Files/images/._tom2.png
new file mode 100644
index 0000000..98c4291
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/images/._tom2.png differ
diff --git a/__MACOSX/Drum Kit Starting Files/images/._tom3.png b/__MACOSX/Drum Kit Starting Files/images/._tom3.png
new file mode 100644
index 0000000..0a0344a
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/images/._tom3.png differ
diff --git a/__MACOSX/Drum Kit Starting Files/images/._tom4.png b/__MACOSX/Drum Kit Starting Files/images/._tom4.png
new file mode 100644
index 0000000..b56aacc
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/images/._tom4.png differ
diff --git a/__MACOSX/Drum Kit Starting Files/sounds/._crash.mp3 b/__MACOSX/Drum Kit Starting Files/sounds/._crash.mp3
new file mode 100644
index 0000000..bd8eba4
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/sounds/._crash.mp3 differ
diff --git a/__MACOSX/Drum Kit Starting Files/sounds/._kick-bass.mp3 b/__MACOSX/Drum Kit Starting Files/sounds/._kick-bass.mp3
new file mode 100644
index 0000000..bd8eba4
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/sounds/._kick-bass.mp3 differ
diff --git a/__MACOSX/Drum Kit Starting Files/sounds/._snare.mp3 b/__MACOSX/Drum Kit Starting Files/sounds/._snare.mp3
new file mode 100644
index 0000000..bd8eba4
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/sounds/._snare.mp3 differ
diff --git a/__MACOSX/Drum Kit Starting Files/sounds/._tom-1.mp3 b/__MACOSX/Drum Kit Starting Files/sounds/._tom-1.mp3
new file mode 100644
index 0000000..bd8eba4
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/sounds/._tom-1.mp3 differ
diff --git a/__MACOSX/Drum Kit Starting Files/sounds/._tom-2.mp3 b/__MACOSX/Drum Kit Starting Files/sounds/._tom-2.mp3
new file mode 100644
index 0000000..bd8eba4
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/sounds/._tom-2.mp3 differ
diff --git a/__MACOSX/Drum Kit Starting Files/sounds/._tom-3.mp3 b/__MACOSX/Drum Kit Starting Files/sounds/._tom-3.mp3
new file mode 100644
index 0000000..bd8eba4
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/sounds/._tom-3.mp3 differ
diff --git a/__MACOSX/Drum Kit Starting Files/sounds/._tom-4.mp3 b/__MACOSX/Drum Kit Starting Files/sounds/._tom-4.mp3
new file mode 100644
index 0000000..bd8eba4
Binary files /dev/null and b/__MACOSX/Drum Kit Starting Files/sounds/._tom-4.mp3 differ