From 40ff776515ac14595b971c1216894593396898b2 Mon Sep 17 00:00:00 2001
From: pharaoh111 <ammon.pro@gmail.com>
Date: Wed, 21 Apr 2021 20:42:02 +0200
Subject: [PATCH] fixing bug drumkit, alternative solution to ex 6

---
 01 - JavaScript Drum Kit/index-FINISHED.html | 45 ++++++++++++++------
 04 - Array Cardio Day 1/index-FINISHED.html  |  3 ++
 2 files changed, 35 insertions(+), 13 deletions(-)

diff --git a/01 - JavaScript Drum Kit/index-FINISHED.html b/01 - JavaScript Drum Kit/index-FINISHED.html
index 1a16d0997c..affbe67357 100644
--- a/01 - JavaScript Drum Kit/index-FINISHED.html	
+++ b/01 - JavaScript Drum Kit/index-FINISHED.html	
@@ -58,23 +58,42 @@
   <audio data-key="76" src="sounds/tink.wav"></audio>
 
 <script>
-  function removeTransition(e) {
-    if (e.propertyName !== 'transform') return;
-    e.target.classList.remove('playing');
-  }
+  // function removeTransition(e) {
+  //   if (e.propertyName !== 'transform') return;
+  //   e.target.classList.remove('playing');
+  // }
+
+  // function playSound(e) {
+  //   const audio = document.querySelector(`audio[data-key="${e.keyCode}"]`);
+  //   const key = document.querySelector(`div[data-key="${e.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);
+
+  // ALTERNATIVE =================================================================>
+  function playSound(key) {
+
+  const audio = document.querySelector(`audio[data-key="${key.keyCode}"]`);
+  const keyAnimation = document.querySelector(`.key[data-key="${key.keyCode}"]`);
+
+  keyAnimation.classList.add('playing');
+  audio.currentTime = 0;
+  audio.play();
 
-  function playSound(e) {
-    const audio = document.querySelector(`audio[data-key="${e.keyCode}"]`);
-    const key = document.querySelector(`div[data-key="${e.keyCode}"]`);
-    if (!audio) return;
+  setTimeout(() => {
+      keyAnimation.classList.remove('playing');           
+  }, 150);
 
-    key.classList.add('playing');
-    audio.currentTime = 0;
-    audio.play();
   }
 
-  const keys = Array.from(document.querySelectorAll('.key'));
-  keys.forEach(key => key.addEventListener('transitionend', removeTransition));
+  const keys = document.getElementsByClassName('key');
   window.addEventListener('keydown', playSound);
 </script>
 
diff --git a/04 - Array Cardio Day 1/index-FINISHED.html b/04 - Array Cardio Day 1/index-FINISHED.html
index d1f6ce33d6..32fa9a12d9 100644
--- a/04 - Array Cardio Day 1/index-FINISHED.html	
+++ b/04 - Array Cardio Day 1/index-FINISHED.html	
@@ -74,6 +74,9 @@
       return lastInventor > nextInventor ? -1 : 1;
     });
     console.table(oldest);
+    // ALTERNATIVE =================================================================================>
+    const sortByLiving = inventors.sort((a,b) => (a.passed - a.year) > (b.passed - b.year) ? -1 : 1);
+    console.table(sortByLiving)
 
     // 6. create a list of Boulevards in Paris that contain 'de' anywhere in the name
     // https://en.wikipedia.org/wiki/Category:Boulevards_in_Paris