JS Drum Kit

From 2797c132b032468337081ab79a0cc22524adac32 Mon Sep 17 00:00:00 2001 From: AWhiteRabbit Date: Mon, 12 Dec 2016 10:27:36 -0500 Subject: [PATCH 1/8] starting 1st of 30 projects. Javascript drum kit. --- 01 - JavaScript Drum Kit/index-PROGRESS.html | 68 ++++++++++++++++++++ 1 file changed, 68 insertions(+) create mode 100644 01 - JavaScript Drum Kit/index-PROGRESS.html diff --git a/01 - JavaScript Drum Kit/index-PROGRESS.html b/01 - JavaScript Drum Kit/index-PROGRESS.html new file mode 100644 index 0000000000..510bafea7d --- /dev/null +++ b/01 - JavaScript Drum Kit/index-PROGRESS.html @@ -0,0 +1,68 @@ + + + + + JS Drum Kit + + + + + +

+ A + clap +

+ S + hihat +

+ D + kick +

+ F + openhat +

+ G + boom +

+ H + ride +

+ J + snare +

+ K + tom +

+ L + tink +

+ +

+ + + + + + From fc9030bc8f92a04fa03effdbaba61bc785c418f1 Mon Sep 17 00:00:00 2001 From: AWhiteRabbit Date: Mon, 12 Dec 2016 12:23:05 -0500 Subject: [PATCH 2/8] play audio on keypress --- 01 - JavaScript Drum Kit/index-PROGRESS.html | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/01 - JavaScript Drum Kit/index-PROGRESS.html b/01 - JavaScript Drum Kit/index-PROGRESS.html index 510bafea7d..1047c97fcd 100644 --- a/01 - JavaScript Drum Kit/index-PROGRESS.html +++ b/01 - JavaScript Drum Kit/index-PROGRESS.html @@ -58,9 +58,12 @@

From e40b0c396d29ac16ad19ff66c9c4e9fc34645b25 Mon Sep 17 00:00:00 2001 From: AWhiteRabbit Date: Mon, 12 Dec 2016 12:50:48 -0500 Subject: [PATCH 3/8] fix keydown to reset and add transition. --- 01 - JavaScript Drum Kit/index-PROGRESS.html | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/01 - JavaScript Drum Kit/index-PROGRESS.html b/01 - JavaScript Drum Kit/index-PROGRESS.html index 1047c97fcd..a37ee58e18 100644 --- a/01 - JavaScript Drum Kit/index-PROGRESS.html +++ b/01 - JavaScript Drum Kit/index-PROGRESS.html @@ -60,10 +60,19 @@ From 3f37dcfaf22a61112c10b67c2cd7c576488935ca Mon Sep 17 00:00:00 2001 From: AWhiteRabbit Date: Mon, 12 Dec 2016 12:55:31 -0500 Subject: [PATCH 4/8] moved into playSound func --- 01 - JavaScript Drum Kit/index-PROGRESS.html | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/01 - JavaScript Drum Kit/index-PROGRESS.html b/01 - JavaScript Drum Kit/index-PROGRESS.html index a37ee58e18..fe81ac43c7 100644 --- a/01 - JavaScript Drum Kit/index-PROGRESS.html +++ b/01 - JavaScript Drum Kit/index-PROGRESS.html @@ -58,21 +58,26 @@

From 200c7206c560a3c1398017cef63785bada469407 Mon Sep 17 00:00:00 2001 From: AWhiteRabbit Date: Mon, 12 Dec 2016 13:26:15 -0500 Subject: [PATCH 5/8] 02 start. and add cool tick. --- 02 - JS + CSS Clock/index-PROGRESS.html | 77 +++++++++++++++++++++++++ 1 file changed, 77 insertions(+) create mode 100644 02 - JS + CSS Clock/index-PROGRESS.html diff --git a/02 - JS + CSS Clock/index-PROGRESS.html b/02 - JS + CSS Clock/index-PROGRESS.html new file mode 100644 index 0000000000..4f0ed4c62e --- /dev/null +++ b/02 - JS + CSS Clock/index-PROGRESS.html @@ -0,0 +1,77 @@ + + + + + JS + CSS Clock + + + + +

+ + + + + + + From 7091fe1df2470b3ab028e9d1ac085acc2f2ad9de Mon Sep 17 00:00:00 2001 From: AWhiteRabbit Date: Mon, 12 Dec 2016 13:52:45 -0500 Subject: [PATCH 6/8] second hand movement --- 02 - JS + CSS Clock/index-PROGRESS.html | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/02 - JS + CSS Clock/index-PROGRESS.html b/02 - JS + CSS Clock/index-PROGRESS.html index 4f0ed4c62e..125bbf0017 100644 --- a/02 - JS + CSS Clock/index-PROGRESS.html +++ b/02 - JS + CSS Clock/index-PROGRESS.html @@ -63,14 +63,24 @@ top:50%; transform-origin: 100%; transform: rotate(90deg); - transition: all 0.5s; + transition: all 0.05s; transition-timing-function: cubic-bezier(0.26, 1.81, 0.58, 1); } From 8dc9a8ccda60f64be42665cf5777bbb853337b61 Mon Sep 17 00:00:00 2001 From: AWhiteRabbit Date: Mon, 12 Dec 2016 14:20:01 -0500 Subject: [PATCH 7/8] minute and hour hand added. --- 02 - JS + CSS Clock/index-PROGRESS.html | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/02 - JS + CSS Clock/index-PROGRESS.html b/02 - JS + CSS Clock/index-PROGRESS.html index 125bbf0017..7f558433d5 100644 --- a/02 - JS + CSS Clock/index-PROGRESS.html +++ b/02 - JS + CSS Clock/index-PROGRESS.html @@ -71,13 +71,20 @@