From bf1b3c3577797a5107c0ecb1946a41698cf02c50 Mon Sep 17 00:00:00 2001
From: Pranava S Balugari <stalin.pranava@gmail.com>
Date: Mon, 13 Feb 2017 23:24:08 +1100
Subject: [PATCH 1/3] Add GitIgnore

---
 .gitignore                  | 1 +
 .idea/jsLibraryMappings.xml | 6 ++++++
 .idea/misc.xml              | 6 ++++++
 .idea/vcs.xml               | 6 ++++++
 4 files changed, 19 insertions(+)
 create mode 100644 .idea/jsLibraryMappings.xml
 create mode 100644 .idea/misc.xml
 create mode 100644 .idea/vcs.xml

diff --git a/.gitignore b/.gitignore
index 6e1a3738b8..ebd704f6e0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -2,3 +2,4 @@
 node_modules/
 *.log
 haters/
+.idea/*
\ No newline at end of file
diff --git a/.idea/jsLibraryMappings.xml b/.idea/jsLibraryMappings.xml
new file mode 100644
index 0000000000..b8387eb1ba
--- /dev/null
+++ b/.idea/jsLibraryMappings.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="JavaScriptLibraryMappings">
+    <includedPredefinedLibrary name="ECMAScript 6" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/misc.xml b/.idea/misc.xml
new file mode 100644
index 0000000000..28a804d893
--- /dev/null
+++ b/.idea/misc.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="JavaScriptSettings">
+    <option name="languageLevel" value="ES6" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
new file mode 100644
index 0000000000..94a25f7f4c
--- /dev/null
+++ b/.idea/vcs.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="$PROJECT_DIR$" vcs="Git" />
+  </component>
+</project>
\ No newline at end of file

From 17fff43ec8791b6ff15260e3e7ba0f07aabb6e10 Mon Sep 17 00:00:00 2001
From: Pranava S Balugari <stalin.pranava@gmail.com>
Date: Mon, 13 Feb 2017 23:24:24 +1100
Subject: [PATCH 2/3] remove idea files

---
 .idea/jsLibraryMappings.xml | 6 ------
 .idea/misc.xml              | 6 ------
 .idea/vcs.xml               | 6 ------
 3 files changed, 18 deletions(-)
 delete mode 100644 .idea/jsLibraryMappings.xml
 delete mode 100644 .idea/misc.xml
 delete mode 100644 .idea/vcs.xml

diff --git a/.idea/jsLibraryMappings.xml b/.idea/jsLibraryMappings.xml
deleted file mode 100644
index b8387eb1ba..0000000000
--- a/.idea/jsLibraryMappings.xml
+++ /dev/null
@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="JavaScriptLibraryMappings">
-    <includedPredefinedLibrary name="ECMAScript 6" />
-  </component>
-</project>
\ No newline at end of file
diff --git a/.idea/misc.xml b/.idea/misc.xml
deleted file mode 100644
index 28a804d893..0000000000
--- a/.idea/misc.xml
+++ /dev/null
@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="JavaScriptSettings">
-    <option name="languageLevel" value="ES6" />
-  </component>
-</project>
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
deleted file mode 100644
index 94a25f7f4c..0000000000
--- a/.idea/vcs.xml
+++ /dev/null
@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="VcsDirectoryMappings">
-    <mapping directory="$PROJECT_DIR$" vcs="Git" />
-  </component>
-</project>
\ No newline at end of file

From f649fc0bdddbd2d29dcaa72e06f7e6f843589281 Mon Sep 17 00:00:00 2001
From: Pranava S Balugari <stalin.pranava@gmail.com>
Date: Tue, 14 Mar 2017 23:19:49 +1100
Subject: [PATCH 3/3] Completed Drum Kit

---
 01 - JavaScript Drum Kit/index-START.html | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/01 - JavaScript Drum Kit/index-START.html b/01 - JavaScript Drum Kit/index-START.html
index 4070d32767..dca829a711 100644
--- a/01 - JavaScript Drum Kit/index-START.html	
+++ b/01 - JavaScript Drum Kit/index-START.html	
@@ -59,6 +59,24 @@
 
 <script>
 
+    function removeTransition(e){
+      if(e.propertyName != 'transform') return;
+      e.target.classList.remove('playing');
+    }
+
+    function playSound(event){
+        const audio = document.querySelector(`audio[data-key="${event.keyCode}"]`);
+        const key = document.querySelector(`div[data-key="${event.keyCode}"]`);
+        if(!audio) return;
+
+        key.classList.add('playing');
+        audio.currentTime = 0;
+        audio.play();
+    }
+
+    const keys = Array.from(document.querySelectorAll('.key'));
+    keys.forEach(key => key.addEventListener('transitionend', removeTransition));
+    window.addEventListener('keydown', playSound);
 </script>