From 09d02c8228415b63afcf1dd2cc6725b11a382e46 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Sat, 10 Dec 2016 14:15:40 +0000 Subject: [PATCH 01/31] Start --- .gitignore | 0 01 - JavaScript Drum Kit/index-FINISHED.html | 0 01 - JavaScript Drum Kit/index-START.html | 4 +++- 01 - JavaScript Drum Kit/index.html | 0 01 - JavaScript Drum Kit/style.css | 0 02 - JS + CSS Clock/index-FINISHED.html | 0 02 - JS + CSS Clock/index-START.html | 0 02 - JS + CSS Clock/index.html | 0 03 - CSS Variables/index-FINISHED.html | 0 03 - CSS Variables/index-START.html | 0 04 - Array Cardio Day 1/index-FINISHED.html | 0 04 - Array Cardio Day 1/index-START.html | 0 05 - Flex Panel Gallery/index-FINISHED.html | 0 05 - Flex Panel Gallery/index-START.html | 0 06 - Type Ahead/index-FINISHED.html | 0 06 - Type Ahead/index-START.html | 0 06 - Type Ahead/style.css | 0 07 - Array Cardio Day 2/index-FINISHED.html | 0 07 - Array Cardio Day 2/index-START.html | 0 08 - Fun with HTML5 Canvas/index-FINISHED.html | 0 08 - Fun with HTML5 Canvas/index-START.html | 0 09 - Dev Tools Domination/index-FINISHED.html | 0 09 - Dev Tools Domination/index-START.html | 0 10 - Hold Shift and Check Checkboxes/index-FINISHED.html | 0 10 - Hold Shift and Check Checkboxes/index-START.html | 0 11 - Custom Video Player/index.html | 0 11 - Custom Video Player/scripts-FINISHED.js | 0 11 - Custom Video Player/scripts.js | 0 11 - Custom Video Player/style.css | 0 12 - Key Sequence Detection/index-FINISHED.html | 0 12 - Key Sequence Detection/index-START.html | 0 13 - Slide in on Scroll/index-FINISHED.html | 0 13 - Slide in on Scroll/index-START.html | 0 14 - JavaScript References VS Copying/index-FINISHED.html | 0 14 - JavaScript References VS Copying/index-START.html | 0 15 - LocalStorage/index-FINISHED.html | 0 15 - LocalStorage/index-START.html | 0 15 - LocalStorage/style.css | 0 16 - Mouse Move Shadow/index-finished.html | 0 16 - Mouse Move Shadow/index-start.html | 0 17 - Sort Without Articles/index-FINISHED.html | 0 17 - Sort Without Articles/index-START.html | 0 18 - Adding Up Times with Reduce/index-FINISHED.html | 0 18 - Adding Up Times with Reduce/index-START.html | 0 19 - Webcam Fun/scripts.js | 0 20 - Speech Detection/index-FINISHED.html | 0 20 - Speech Detection/index-START.html | 0 21 - Geolocation/index-FINISHED.html | 0 21 - Geolocation/index-START.html | 0 22 - Follow Along Link Highlighter/index-FINISHED.html | 0 22 - Follow Along Link Highlighter/index-START.html | 0 22 - Follow Along Link Highlighter/style.css | 0 23 - Speech Synthesis/index-FINISHED.html | 0 23 - Speech Synthesis/index-START.html | 0 23 - Speech Synthesis/style.css | 0 24 - Sticky Nav/index-FINISHED.html | 0 24 - Sticky Nav/index-START.html | 0 24 - Sticky Nav/style-FINISHED.css | 0 24 - Sticky Nav/style-START.css | 0 .../index-FINISHED.html | 0 .../index-START.html | 0 26 - Stripe Follow Along Nav/index-FINISHED.html | 0 26 - Stripe Follow Along Nav/index-START.html | 0 27 - Click and Drag/index-FINISHED.html | 0 27 - Click and Drag/index-START.html | 0 27 - Click and Drag/style.css | 0 28 - Video Speed Controller/index-FINISHED.html | 0 28 - Video Speed Controller/index-START.html | 0 28 - Video Speed Controller/style.css | 0 29 - Countown Timer/index.html | 0 29 - Countown Timer/scripts-FINISHED.js | 0 29 - Countown Timer/scripts-START.js | 0 29 - Countown Timer/style.css | 0 30 - Whack A Mole/dirt.svg | 0 30 - Whack A Mole/index-FINISHED.html | 0 30 - Whack A Mole/index-START.html | 0 30 - Whack A Mole/mole.svg | 0 30 - Whack A Mole/style.css | 0 readme.md | 0 79 files changed, 3 insertions(+), 1 deletion(-) mode change 100644 => 100755 .gitignore mode change 100644 => 100755 01 - JavaScript Drum Kit/index-FINISHED.html mode change 100644 => 100755 01 - JavaScript Drum Kit/index-START.html mode change 100644 => 100755 01 - JavaScript Drum Kit/index.html mode change 100644 => 100755 01 - JavaScript Drum Kit/style.css mode change 100644 => 100755 02 - JS + CSS Clock/index-FINISHED.html mode change 100644 => 100755 02 - JS + CSS Clock/index-START.html mode change 100644 => 100755 02 - JS + CSS Clock/index.html mode change 100644 => 100755 03 - CSS Variables/index-FINISHED.html mode change 100644 => 100755 03 - CSS Variables/index-START.html mode change 100644 => 100755 04 - Array Cardio Day 1/index-FINISHED.html mode change 100644 => 100755 04 - Array Cardio Day 1/index-START.html mode change 100644 => 100755 05 - Flex Panel Gallery/index-FINISHED.html mode change 100644 => 100755 05 - Flex Panel Gallery/index-START.html mode change 100644 => 100755 06 - Type Ahead/index-FINISHED.html mode change 100644 => 100755 06 - Type Ahead/index-START.html mode change 100644 => 100755 06 - Type Ahead/style.css mode change 100644 => 100755 07 - Array Cardio Day 2/index-FINISHED.html mode change 100644 => 100755 07 - Array Cardio Day 2/index-START.html mode change 100644 => 100755 08 - Fun with HTML5 Canvas/index-FINISHED.html mode change 100644 => 100755 08 - Fun with HTML5 Canvas/index-START.html mode change 100644 => 100755 09 - Dev Tools Domination/index-FINISHED.html mode change 100644 => 100755 09 - Dev Tools Domination/index-START.html mode change 100644 => 100755 10 - Hold Shift and Check Checkboxes/index-FINISHED.html mode change 100644 => 100755 10 - Hold Shift and Check Checkboxes/index-START.html mode change 100644 => 100755 11 - Custom Video Player/index.html mode change 100644 => 100755 11 - Custom Video Player/scripts-FINISHED.js mode change 100644 => 100755 11 - Custom Video Player/scripts.js mode change 100644 => 100755 11 - Custom Video Player/style.css mode change 100644 => 100755 12 - Key Sequence Detection/index-FINISHED.html mode change 100644 => 100755 12 - Key Sequence Detection/index-START.html mode change 100644 => 100755 13 - Slide in on Scroll/index-FINISHED.html mode change 100644 => 100755 13 - Slide in on Scroll/index-START.html mode change 100644 => 100755 14 - JavaScript References VS Copying/index-FINISHED.html mode change 100644 => 100755 14 - JavaScript References VS Copying/index-START.html mode change 100644 => 100755 15 - LocalStorage/index-FINISHED.html mode change 100644 => 100755 15 - LocalStorage/index-START.html mode change 100644 => 100755 15 - LocalStorage/style.css mode change 100644 => 100755 16 - Mouse Move Shadow/index-finished.html mode change 100644 => 100755 16 - Mouse Move Shadow/index-start.html mode change 100644 => 100755 17 - Sort Without Articles/index-FINISHED.html mode change 100644 => 100755 17 - Sort Without Articles/index-START.html mode change 100644 => 100755 18 - Adding Up Times with Reduce/index-FINISHED.html mode change 100644 => 100755 18 - Adding Up Times with Reduce/index-START.html mode change 100644 => 100755 19 - Webcam Fun/scripts.js mode change 100644 => 100755 20 - Speech Detection/index-FINISHED.html mode change 100644 => 100755 20 - Speech Detection/index-START.html mode change 100644 => 100755 21 - Geolocation/index-FINISHED.html mode change 100644 => 100755 21 - Geolocation/index-START.html mode change 100644 => 100755 22 - Follow Along Link Highlighter/index-FINISHED.html mode change 100644 => 100755 22 - Follow Along Link Highlighter/index-START.html mode change 100644 => 100755 22 - Follow Along Link Highlighter/style.css mode change 100644 => 100755 23 - Speech Synthesis/index-FINISHED.html mode change 100644 => 100755 23 - Speech Synthesis/index-START.html mode change 100644 => 100755 23 - Speech Synthesis/style.css mode change 100644 => 100755 24 - Sticky Nav/index-FINISHED.html mode change 100644 => 100755 24 - Sticky Nav/index-START.html mode change 100644 => 100755 24 - Sticky Nav/style-FINISHED.css mode change 100644 => 100755 24 - Sticky Nav/style-START.css mode change 100644 => 100755 25 - Event Capture, Propagation, Bubbling and Once/index-FINISHED.html mode change 100644 => 100755 25 - Event Capture, Propagation, Bubbling and Once/index-START.html mode change 100644 => 100755 26 - Stripe Follow Along Nav/index-FINISHED.html mode change 100644 => 100755 26 - Stripe Follow Along Nav/index-START.html mode change 100644 => 100755 27 - Click and Drag/index-FINISHED.html mode change 100644 => 100755 27 - Click and Drag/index-START.html mode change 100644 => 100755 27 - Click and Drag/style.css mode change 100644 => 100755 28 - Video Speed Controller/index-FINISHED.html mode change 100644 => 100755 28 - Video Speed Controller/index-START.html mode change 100644 => 100755 28 - Video Speed Controller/style.css mode change 100644 => 100755 29 - Countown Timer/index.html mode change 100644 => 100755 29 - Countown Timer/scripts-FINISHED.js mode change 100644 => 100755 29 - Countown Timer/scripts-START.js mode change 100644 => 100755 29 - Countown Timer/style.css mode change 100644 => 100755 30 - Whack A Mole/dirt.svg mode change 100644 => 100755 30 - Whack A Mole/index-FINISHED.html mode change 100644 => 100755 30 - Whack A Mole/index-START.html mode change 100644 => 100755 30 - Whack A Mole/mole.svg mode change 100644 => 100755 30 - Whack A Mole/style.css mode change 100644 => 100755 readme.md diff --git a/.gitignore b/.gitignore old mode 100644 new mode 100755 diff --git a/01 - JavaScript Drum Kit/index-FINISHED.html b/01 - JavaScript Drum Kit/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/01 - JavaScript Drum Kit/index-START.html b/01 - JavaScript Drum Kit/index-START.html old mode 100644 new mode 100755 index 4070d32767..a0326ce0c6 --- a/01 - JavaScript Drum Kit/index-START.html +++ b/01 - JavaScript Drum Kit/index-START.html @@ -58,7 +58,9 @@ diff --git a/01 - JavaScript Drum Kit/index.html b/01 - JavaScript Drum Kit/index.html old mode 100644 new mode 100755 diff --git a/01 - JavaScript Drum Kit/style.css b/01 - JavaScript Drum Kit/style.css old mode 100644 new mode 100755 diff --git a/02 - JS + CSS Clock/index-FINISHED.html b/02 - JS + CSS Clock/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/02 - JS + CSS Clock/index-START.html b/02 - JS + CSS Clock/index-START.html old mode 100644 new mode 100755 diff --git a/02 - JS + CSS Clock/index.html b/02 - JS + CSS Clock/index.html old mode 100644 new mode 100755 diff --git a/03 - CSS Variables/index-FINISHED.html b/03 - CSS Variables/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/03 - CSS Variables/index-START.html b/03 - CSS Variables/index-START.html old mode 100644 new mode 100755 diff --git a/04 - Array Cardio Day 1/index-FINISHED.html b/04 - Array Cardio Day 1/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html old mode 100644 new mode 100755 diff --git a/05 - Flex Panel Gallery/index-FINISHED.html b/05 - Flex Panel Gallery/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/05 - Flex Panel Gallery/index-START.html b/05 - Flex Panel Gallery/index-START.html old mode 100644 new mode 100755 diff --git a/06 - Type Ahead/index-FINISHED.html b/06 - Type Ahead/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/06 - Type Ahead/index-START.html b/06 - Type Ahead/index-START.html old mode 100644 new mode 100755 diff --git a/06 - Type Ahead/style.css b/06 - Type Ahead/style.css old mode 100644 new mode 100755 diff --git a/07 - Array Cardio Day 2/index-FINISHED.html b/07 - Array Cardio Day 2/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/07 - Array Cardio Day 2/index-START.html b/07 - Array Cardio Day 2/index-START.html old mode 100644 new mode 100755 diff --git a/08 - Fun with HTML5 Canvas/index-FINISHED.html b/08 - Fun with HTML5 Canvas/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/08 - Fun with HTML5 Canvas/index-START.html b/08 - Fun with HTML5 Canvas/index-START.html old mode 100644 new mode 100755 diff --git a/09 - Dev Tools Domination/index-FINISHED.html b/09 - Dev Tools Domination/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/09 - Dev Tools Domination/index-START.html b/09 - Dev Tools Domination/index-START.html old mode 100644 new mode 100755 diff --git a/10 - Hold Shift and Check Checkboxes/index-FINISHED.html b/10 - Hold Shift and Check Checkboxes/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/10 - Hold Shift and Check Checkboxes/index-START.html b/10 - Hold Shift and Check Checkboxes/index-START.html old mode 100644 new mode 100755 diff --git a/11 - Custom Video Player/index.html b/11 - Custom Video Player/index.html old mode 100644 new mode 100755 diff --git a/11 - Custom Video Player/scripts-FINISHED.js b/11 - Custom Video Player/scripts-FINISHED.js old mode 100644 new mode 100755 diff --git a/11 - Custom Video Player/scripts.js b/11 - Custom Video Player/scripts.js old mode 100644 new mode 100755 diff --git a/11 - Custom Video Player/style.css b/11 - Custom Video Player/style.css old mode 100644 new mode 100755 diff --git a/12 - Key Sequence Detection/index-FINISHED.html b/12 - Key Sequence Detection/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/12 - Key Sequence Detection/index-START.html b/12 - Key Sequence Detection/index-START.html old mode 100644 new mode 100755 diff --git a/13 - Slide in on Scroll/index-FINISHED.html b/13 - Slide in on Scroll/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/13 - Slide in on Scroll/index-START.html b/13 - Slide in on Scroll/index-START.html old mode 100644 new mode 100755 diff --git a/14 - JavaScript References VS Copying/index-FINISHED.html b/14 - JavaScript References VS Copying/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/14 - JavaScript References VS Copying/index-START.html b/14 - JavaScript References VS Copying/index-START.html old mode 100644 new mode 100755 diff --git a/15 - LocalStorage/index-FINISHED.html b/15 - LocalStorage/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/15 - LocalStorage/index-START.html b/15 - LocalStorage/index-START.html old mode 100644 new mode 100755 diff --git a/15 - LocalStorage/style.css b/15 - LocalStorage/style.css old mode 100644 new mode 100755 diff --git a/16 - Mouse Move Shadow/index-finished.html b/16 - Mouse Move Shadow/index-finished.html old mode 100644 new mode 100755 diff --git a/16 - Mouse Move Shadow/index-start.html b/16 - Mouse Move Shadow/index-start.html old mode 100644 new mode 100755 diff --git a/17 - Sort Without Articles/index-FINISHED.html b/17 - Sort Without Articles/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/17 - Sort Without Articles/index-START.html b/17 - Sort Without Articles/index-START.html old mode 100644 new mode 100755 diff --git a/18 - Adding Up Times with Reduce/index-FINISHED.html b/18 - Adding Up Times with Reduce/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/18 - Adding Up Times with Reduce/index-START.html b/18 - Adding Up Times with Reduce/index-START.html old mode 100644 new mode 100755 diff --git a/19 - Webcam Fun/scripts.js b/19 - Webcam Fun/scripts.js old mode 100644 new mode 100755 diff --git a/20 - Speech Detection/index-FINISHED.html b/20 - Speech Detection/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/20 - Speech Detection/index-START.html b/20 - Speech Detection/index-START.html old mode 100644 new mode 100755 diff --git a/21 - Geolocation/index-FINISHED.html b/21 - Geolocation/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/21 - Geolocation/index-START.html b/21 - Geolocation/index-START.html old mode 100644 new mode 100755 diff --git a/22 - Follow Along Link Highlighter/index-FINISHED.html b/22 - Follow Along Link Highlighter/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/22 - Follow Along Link Highlighter/index-START.html b/22 - Follow Along Link Highlighter/index-START.html old mode 100644 new mode 100755 diff --git a/22 - Follow Along Link Highlighter/style.css b/22 - Follow Along Link Highlighter/style.css old mode 100644 new mode 100755 diff --git a/23 - Speech Synthesis/index-FINISHED.html b/23 - Speech Synthesis/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/23 - Speech Synthesis/index-START.html b/23 - Speech Synthesis/index-START.html old mode 100644 new mode 100755 diff --git a/23 - Speech Synthesis/style.css b/23 - Speech Synthesis/style.css old mode 100644 new mode 100755 diff --git a/24 - Sticky Nav/index-FINISHED.html b/24 - Sticky Nav/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/24 - Sticky Nav/index-START.html b/24 - Sticky Nav/index-START.html old mode 100644 new mode 100755 diff --git a/24 - Sticky Nav/style-FINISHED.css b/24 - Sticky Nav/style-FINISHED.css old mode 100644 new mode 100755 diff --git a/24 - Sticky Nav/style-START.css b/24 - Sticky Nav/style-START.css old mode 100644 new mode 100755 diff --git a/25 - Event Capture, Propagation, Bubbling and Once/index-FINISHED.html b/25 - Event Capture, Propagation, Bubbling and Once/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/25 - Event Capture, Propagation, Bubbling and Once/index-START.html b/25 - Event Capture, Propagation, Bubbling and Once/index-START.html old mode 100644 new mode 100755 diff --git a/26 - Stripe Follow Along Nav/index-FINISHED.html b/26 - Stripe Follow Along Nav/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/26 - Stripe Follow Along Nav/index-START.html b/26 - Stripe Follow Along Nav/index-START.html old mode 100644 new mode 100755 diff --git a/27 - Click and Drag/index-FINISHED.html b/27 - Click and Drag/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/27 - Click and Drag/index-START.html b/27 - Click and Drag/index-START.html old mode 100644 new mode 100755 diff --git a/27 - Click and Drag/style.css b/27 - Click and Drag/style.css old mode 100644 new mode 100755 diff --git a/28 - Video Speed Controller/index-FINISHED.html b/28 - Video Speed Controller/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/28 - Video Speed Controller/index-START.html b/28 - Video Speed Controller/index-START.html old mode 100644 new mode 100755 diff --git a/28 - Video Speed Controller/style.css b/28 - Video Speed Controller/style.css old mode 100644 new mode 100755 diff --git a/29 - Countown Timer/index.html b/29 - Countown Timer/index.html old mode 100644 new mode 100755 diff --git a/29 - Countown Timer/scripts-FINISHED.js b/29 - Countown Timer/scripts-FINISHED.js old mode 100644 new mode 100755 diff --git a/29 - Countown Timer/scripts-START.js b/29 - Countown Timer/scripts-START.js old mode 100644 new mode 100755 diff --git a/29 - Countown Timer/style.css b/29 - Countown Timer/style.css old mode 100644 new mode 100755 diff --git a/30 - Whack A Mole/dirt.svg b/30 - Whack A Mole/dirt.svg old mode 100644 new mode 100755 diff --git a/30 - Whack A Mole/index-FINISHED.html b/30 - Whack A Mole/index-FINISHED.html old mode 100644 new mode 100755 diff --git a/30 - Whack A Mole/index-START.html b/30 - Whack A Mole/index-START.html old mode 100644 new mode 100755 diff --git a/30 - Whack A Mole/mole.svg b/30 - Whack A Mole/mole.svg old mode 100644 new mode 100755 diff --git a/30 - Whack A Mole/style.css b/30 - Whack A Mole/style.css old mode 100644 new mode 100755 diff --git a/readme.md b/readme.md old mode 100644 new mode 100755 From 31fdf2a2901a0b70d84964e9369df3496a31192f Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Sat, 10 Dec 2016 14:59:46 +0000 Subject: [PATCH 02/31] 1 --- 01 - JavaScript Drum Kit/index-START.html | 84 ++++++++++++++--------- 1 file changed, 50 insertions(+), 34 deletions(-) diff --git a/01 - JavaScript Drum Kit/index-START.html b/01 - JavaScript Drum Kit/index-START.html index a0326ce0c6..567c3918bd 100755 --- a/01 - JavaScript Drum Kit/index-START.html +++ b/01 - JavaScript Drum Kit/index-START.html @@ -1,66 +1,82 @@ - + - + JS Drum Kit - + -
-
+
+
A - clap + clap
-
+
S - hihat + hihat
-
+
D - kick + kick
-
+
F - openhat + openhat
-
+
G - boom + boom
-
+
H - ride + ride
-
+
J - snare + snare
-
+
K - tom + tom
-
+
L - tink + tink
- - - - - - - - - + + + + + + + + + From 2f57aaf4af3ed71f6a59f56f5420c1fafaf55251 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Mon, 12 Dec 2016 15:53:28 +0000 Subject: [PATCH 03/31] 2 --- 02 - JS + CSS Clock/index-START.html | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) diff --git a/02 - JS + CSS Clock/index-START.html b/02 - JS + CSS Clock/index-START.html index 2712384201..28bb102015 100755 --- a/02 - JS + CSS Clock/index-START.html +++ b/02 - JS + CSS Clock/index-START.html @@ -61,13 +61,36 @@ background:black; position: absolute; top:50%; + transform-origin: 100%; + transform: rotate(90deg); + transition: all 0.05s; + transition-timing-function: cubic-bezier(0.1, 2.7, 0.56, 1) } From 2495b6667df956fbd6485cda9f8d4cf2decbcb87 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Fri, 27 Jan 2017 09:59:28 +0000 Subject: [PATCH 04/31] 3 --- 03 - CSS Variables/index-START.html | 24 ++++++++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/03 - CSS Variables/index-START.html b/03 - CSS Variables/index-START.html index bf0f33e3ba..70a4934b1e 100755 --- a/03 - CSS Variables/index-START.html +++ b/03 - CSS Variables/index-START.html @@ -21,6 +21,21 @@

Update CSS Variables with JS

From 97f2a134f61e4f78e29baf9125ef63285f6365f7 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Fri, 27 Jan 2017 10:05:14 +0000 Subject: [PATCH 05/31] 4.1 --- 04 - Array Cardio Day 1/index-START.html | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index 6e28e357d0..e9f1b76dac 100755 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -27,6 +27,10 @@ // Array.prototype.filter() // 1. Filter the list of inventors for those who were born in the 1500's + const bornInThe1500s = inventors.filter(inventor => { + return (inventor.year >= 1500 && inventor.year < 1600) + }) + console.log(bornInThe1500s) // Array.prototype.map() // 2. Give us an array of the inventory first and last names From 3970e142dab98baf6007b4f4773c9e45fcfc9692 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Fri, 27 Jan 2017 10:15:13 +0000 Subject: [PATCH 06/31] 4.1 Shorthand and table log --- 04 - Array Cardio Day 1/index-START.html | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index e9f1b76dac..a80a804772 100755 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -27,10 +27,8 @@ // Array.prototype.filter() // 1. Filter the list of inventors for those who were born in the 1500's - const bornInThe1500s = inventors.filter(inventor => { - return (inventor.year >= 1500 && inventor.year < 1600) - }) - console.log(bornInThe1500s) + const bornInThe1500s = inventors.filter(inventor => inventor.year >= 1500 && inventor.year < 1600) + console.table(bornInThe1500s) // Array.prototype.map() // 2. Give us an array of the inventory first and last names From c6a9cb9165ac2afe0b47d0fa66e404ce1fb8069a Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Fri, 27 Jan 2017 10:18:04 +0000 Subject: [PATCH 07/31] 4.2 --- 04 - Array Cardio Day 1/index-START.html | 2 ++ 1 file changed, 2 insertions(+) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index a80a804772..00565dccf7 100755 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -32,6 +32,8 @@ // Array.prototype.map() // 2. Give us an array of the inventory first and last names + const inventorNames = inventors.map(inventor => `${inventor.first} ${inventor.last}`) + console.log(inventorNames) // Array.prototype.sort() // 3. Sort the inventors by birthdate, oldest to youngest From 183354a68a791996dbbe0a79c7fafd1e2f337d23 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Fri, 27 Jan 2017 10:26:54 +0000 Subject: [PATCH 08/31] 4.3 --- 04 - Array Cardio Day 1/index-START.html | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index 00565dccf7..6e30dbcc7c 100755 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -37,7 +37,13 @@ // Array.prototype.sort() // 3. Sort the inventors by birthdate, oldest to youngest - + const oldestToYoungest = inventors.sort((inventorA, inventorB) => { + if (inventorA.year > inventorB.year) return 1 + else if (inventorA.year < inventorB.year) return -1 + else return 0 // equivalent + }) + console.table(oldestToYoungest + ) // Array.prototype.reduce() // 4. How many years did all the inventors live? From 6446ec6a53f7059104fc9fc75288d1bf0099e408 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Fri, 27 Jan 2017 10:28:05 +0000 Subject: [PATCH 09/31] 4.3 Single line, no equivalence --- 04 - Array Cardio Day 1/index-START.html | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index 6e30dbcc7c..ba75a84cd7 100755 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -37,13 +37,9 @@ // Array.prototype.sort() // 3. Sort the inventors by birthdate, oldest to youngest - const oldestToYoungest = inventors.sort((inventorA, inventorB) => { - if (inventorA.year > inventorB.year) return 1 - else if (inventorA.year < inventorB.year) return -1 - else return 0 // equivalent - }) - console.table(oldestToYoungest - ) + const oldestToYoungest = inventors.sort((inventorA, inventorB) => inventorA.year > inventorB.year ? 1 : -1) + console.table(oldestToYoungest) + // Array.prototype.reduce() // 4. How many years did all the inventors live? From f37abcfb8eea112c85cbe1dae7e19a972f3827e8 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Fri, 27 Jan 2017 10:35:34 +0000 Subject: [PATCH 10/31] 4.4 --- 04 - Array Cardio Day 1/index-START.html | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index ba75a84cd7..54259ba5bc 100755 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -42,6 +42,10 @@ // Array.prototype.reduce() // 4. How many years did all the inventors live? + const yearsLived = inventors.reduce((total, inventor) => { + return total + (inventor.passed - inventor.year) + }, 0) + console.log(yearsLived) // 5. Sort the inventors by years lived From 00b62e91b63c50f8b1df48a5fbd7decdaebbef2f Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Fri, 27 Jan 2017 10:48:28 +0000 Subject: [PATCH 11/31] 4.5 --- 04 - Array Cardio Day 1/index-START.html | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index 54259ba5bc..a38a29d3b0 100755 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -42,12 +42,15 @@ // Array.prototype.reduce() // 4. How many years did all the inventors live? - const yearsLived = inventors.reduce((total, inventor) => { + const totalYearsLived = inventors.reduce((total, inventor) => { return total + (inventor.passed - inventor.year) }, 0) - console.log(yearsLived) + console.log(totalYearsLived) // 5. Sort the inventors by years lived + const yearsLived = inventor => inventor.passed - inventor.year + const sortedYearsLived = inventors.sort((inventorA, inventorB) => yearsLived(inventorA) > yearsLived(inventorB) ? 1 : -1) + console.table(sortedYearsLived) // 6. create a list of Boulevards in Paris that contain 'de' anywhere in the name // https://en.wikipedia.org/wiki/Category:Boulevards_in_Paris From 690f79fc7af162d1345481032e621b40b881c014 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Fri, 27 Jan 2017 11:02:35 +0000 Subject: [PATCH 12/31] 4.6 --- 04 - Array Cardio Day 1/index-START.html | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index a38a29d3b0..67a2dce43f 100755 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -54,6 +54,13 @@ // 6. create a list of Boulevards in Paris that contain 'de' anywhere in the name // https://en.wikipedia.org/wiki/Category:Boulevards_in_Paris + const category = document.querySelector('.mw-category') + const links = Array.from(category.querySelectorAll('a')) // could also do with spread [...NodeList] + + const de = links + .map(link => link.textContent) + .filter(streetName => streetName.includes('de')) + // Have to run in console on wikipedia page // 7. sort Exercise From afbeecb5e35184d3a168337aa33162511dd515c8 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Fri, 27 Jan 2017 13:49:13 +0000 Subject: [PATCH 13/31] 4.7 --- 04 - Array Cardio Day 1/index-START.html | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index 67a2dce43f..fed06acae7 100755 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -54,17 +54,19 @@ // 6. create a list of Boulevards in Paris that contain 'de' anywhere in the name // https://en.wikipedia.org/wiki/Category:Boulevards_in_Paris - const category = document.querySelector('.mw-category') - const links = Array.from(category.querySelectorAll('a')) // could also do with spread [...NodeList] - - const de = links - .map(link => link.textContent) - .filter(streetName => streetName.includes('de')) + // const category = document.querySelector('.mw-category') + // const links = Array.from(category.querySelectorAll('a')) // could also do with spread [...NodeList] + // + // const de = links + // .map(link => link.textContent) + // .filter(streetName => streetName.includes('de')) // Have to run in console on wikipedia page // 7. sort Exercise // Sort the people alphabetically by last name + const sortedAlphabetically = people.sort((previous, next) => previous > next ? 1 : -1) + console.log(sortedAlphabetically) // 8. Reduce Exercise // Sum up the instances of each of these From aaac2683912f8974b9dd445a365482df584c30ce Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Fri, 27 Jan 2017 13:55:45 +0000 Subject: [PATCH 14/31] 4.7 Other solution --- 04 - Array Cardio Day 1/index-START.html | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index fed06acae7..68530b53bb 100755 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -65,7 +65,11 @@ // 7. sort Exercise // Sort the people alphabetically by last name - const sortedAlphabetically = people.sort((previous, next) => previous > next ? 1 : -1) + const sortedAlphabetically = people.sort((previous, next) => { + const [previousLast, previousFirst] = previous.split(', ') + const [nextLast, nextFirst] = next.split(', ') + return previousLast > nextLast ? 1 : -1 + }) console.log(sortedAlphabetically) // 8. Reduce Exercise From 9a5f1ecdcfad0edd27d3404cf9e9dc01bf7e5c1d Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Fri, 27 Jan 2017 14:55:07 +0000 Subject: [PATCH 15/31] 4.8 My way --- 04 - Array Cardio Day 1/index-START.html | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index 68530b53bb..703e9633f5 100755 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -75,6 +75,20 @@ // 8. Reduce Exercise // Sum up the instances of each of these const data = ['car', 'car', 'truck', 'truck', 'bike', 'walk', 'car', 'van', 'bike', 'walk', 'car', 'van', 'car', 'truck' ]; + const sumUpInstances = data.reduce((counts, item) => { + let counted = false + counts.map((count) => { + if (count.vehicle == item){ + count.count = count.count + 1 + counted = true + } + }) + if (!counted){ + counts.push({vehicle: item, count: 1}) + } + return counts + }, []) + console.log(sumUpInstances) From f6dbc25bc62406c7500217ecc220ae8bac60f531 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Fri, 27 Jan 2017 14:59:07 +0000 Subject: [PATCH 16/31] 4.8 Actual solution --- 04 - Array Cardio Day 1/index-START.html | 18 ++++++------------ 1 file changed, 6 insertions(+), 12 deletions(-) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index 703e9633f5..b7e2ba8971 100755 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -75,19 +75,13 @@ // 8. Reduce Exercise // Sum up the instances of each of these const data = ['car', 'car', 'truck', 'truck', 'bike', 'walk', 'car', 'van', 'bike', 'walk', 'car', 'van', 'car', 'truck' ]; - const sumUpInstances = data.reduce((counts, item) => { - let counted = false - counts.map((count) => { - if (count.vehicle == item){ - count.count = count.count + 1 - counted = true - } - }) - if (!counted){ - counts.push({vehicle: item, count: 1}) + const sumUpInstances = data.reduce((object, item) => { + if (!object[item]) { + object[item] = 0 } - return counts - }, []) + object[item]++ + return object + }, {}) console.log(sumUpInstances) From 7b9c284af3f911bd8d5a6538e53e62442975ef14 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Wed, 1 Feb 2017 14:40:52 +0000 Subject: [PATCH 17/31] 5.1 CSS done --- 05 - Flex Panel Gallery/index-START.html | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/05 - Flex Panel Gallery/index-START.html b/05 - Flex Panel Gallery/index-START.html index e1d643ad5c..f0cb9b27ef 100755 --- a/05 - Flex Panel Gallery/index-START.html +++ b/05 - Flex Panel Gallery/index-START.html @@ -24,6 +24,7 @@ .panels { min-height:100vh; overflow: hidden; + display: flex; } .panel { @@ -41,6 +42,10 @@ font-size: 20px; background-size:cover; background-position:center; + flex: 1; + justify-content: center; + display: flex; + flex-direction: column; } @@ -54,8 +59,18 @@ margin:0; width: 100%; transition:transform 0.5s; + border: 1px solid red; + flex: 1 0 auto; + display: flex; + justify-content: center; + align-items: center; } + .panel > *:first-child { transform: translateY(-100%);} + .panel.open-active > *:first-child { transform: translateY(0);} + .panel > *:last-child { transform: translateY(100%);} + .panel.open-active > *:last-child { transform: translateY(0);} + .panel p { text-transform: uppercase; font-family: 'Amatic SC', cursive; @@ -67,6 +82,7 @@ } .panel.open { + flex: 5; font-size:40px; } From bb53d09bb690d14b34f45a914d03a76a0988a80f Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Wed, 1 Feb 2017 15:30:56 +0000 Subject: [PATCH 18/31] 5.2 JS --- 05 - Flex Panel Gallery/index-START.html | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/05 - Flex Panel Gallery/index-START.html b/05 - Flex Panel Gallery/index-START.html index f0cb9b27ef..e1be9c8e22 100755 --- a/05 - Flex Panel Gallery/index-START.html +++ b/05 - Flex Panel Gallery/index-START.html @@ -59,7 +59,6 @@ margin:0; width: 100%; transition:transform 0.5s; - border: 1px solid red; flex: 1 0 auto; display: flex; justify-content: center; @@ -123,7 +122,20 @@
From 8501c0e60155919fbe2db5bf49a82f4ca5dc5d72 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Wed, 1 Feb 2017 16:02:36 +0000 Subject: [PATCH 19/31] 6.1 Matching function --- 06 - Type Ahead/index-START.html | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/06 - Type Ahead/index-START.html b/06 - Type Ahead/index-START.html index 1436886918..4dad72fcc3 100755 --- a/06 - Type Ahead/index-START.html +++ b/06 - Type Ahead/index-START.html @@ -17,6 +17,19 @@ From 7b262bf8e8e241006d8040b319c46ae35556fcb6 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Wed, 1 Feb 2017 16:32:36 +0000 Subject: [PATCH 20/31] 6.2 Fix the matcher and display --- 06 - Type Ahead/index-START.html | 31 ++++++++++++++++++++++++++++--- 1 file changed, 28 insertions(+), 3 deletions(-) diff --git a/06 - Type Ahead/index-START.html b/06 - Type Ahead/index-START.html index 4dad72fcc3..80de07e61d 100755 --- a/06 - Type Ahead/index-START.html +++ b/06 - Type Ahead/index-START.html @@ -23,13 +23,38 @@ .then(blob => blob.json()) .then(data => cities.push(...data)) +function numberWithCommas(x) { + return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); +} + function findMatches (wordToMatch, cities) { return cities.filter(place => { - const regex = new RegExp() - return place.city.match(regex, 'gi') || place.city.match(regex, 'gi') - // The 'gi' is the 'global' (not just at the start) and (case) 'insensitive' flags + const regex = new RegExp(wordToMatch, 'gi') // The 'gi' is the 'global' (not just at the start) and (case) 'insensitive' flags + return place.city.match(regex) || place.city.match(regex) }) } + +function displayMatches () { + const matchArray = findMatches(this.value, cities) + const html = matchArray.map(place => { + const regex = new RegExp(this.value, 'gi') + const cityName = place.city.replace(regex, `${this.value}`) + const stateName = place.state.replace(regex, `${this.value}`) + return ` +
  • + ${cityName}, ${stateName} + ${numberWithCommas(place.population)} +
    • + ` + }).join('') // joins multiple list items into a single string + suggestions.innerHTML = html +} + +const searchInput = document.querySelector('.search') +const suggestions = document.querySelector('.suggestions') + +searchInput.addEventListener('change', displayMatches) +searchInput.addEventListener('keyup', displayMatches) From d44b9757dbe5fd197383902b84d13209ccb00192 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Wed, 1 Feb 2017 16:35:27 +0000 Subject: [PATCH 21/31] 6.3 Fixed annoying case problem --- 06 - Type Ahead/index-START.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/06 - Type Ahead/index-START.html b/06 - Type Ahead/index-START.html index 80de07e61d..68e00adc58 100755 --- a/06 - Type Ahead/index-START.html +++ b/06 - Type Ahead/index-START.html @@ -38,8 +38,8 @@ const matchArray = findMatches(this.value, cities) const html = matchArray.map(place => { const regex = new RegExp(this.value, 'gi') - const cityName = place.city.replace(regex, `${this.value}`) - const stateName = place.state.replace(regex, `${this.value}`) + const cityName = place.city.replace(regex, `${this.value.toLowerCase()}`) + const stateName = place.state.replace(regex, `${this.value.toLowerCase()}`) return `
  • ${cityName}, ${stateName} From 5c62dfa8511fbe80480dc1da77e5e74a05c0fffe Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Thu, 2 Feb 2017 17:48:28 +0000 Subject: [PATCH 22/31] 8 --- 08 - Fun with HTML5 Canvas/index-START.html | 59 +++++++++++++++++++++ 1 file changed, 59 insertions(+) diff --git a/08 - Fun with HTML5 Canvas/index-START.html b/08 - Fun with HTML5 Canvas/index-START.html index 37c148df07..52e13dfb1b 100755 --- a/08 - Fun with HTML5 Canvas/index-START.html +++ b/08 - Fun with HTML5 Canvas/index-START.html @@ -7,6 +7,65 @@ From 3739e52bbcefad1e4629ddcfe046d9197b99cf49 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Wed, 22 Feb 2017 09:53:48 +0000 Subject: [PATCH 30/31] 17.1 My attempt --- 17 - Sort Without Articles/index-START.html | 43 ++++++++++++++++++++- 1 file changed, 42 insertions(+), 1 deletion(-) diff --git a/17 - Sort Without Articles/index-START.html b/17 - Sort Without Articles/index-START.html index cfaf3e0440..dc009af08b 100755 --- a/17 - Sort Without Articles/index-START.html +++ b/17 - Sort Without Articles/index-START.html @@ -43,8 +43,49 @@
      From 168826521375e324e122634b24bbe02bf0835925 Mon Sep 17 00:00:00 2001 From: Ben Barrett Date: Wed, 22 Feb 2017 10:06:06 +0000 Subject: [PATCH 31/31] 17.2 Swap to use RegEx --- 17 - Sort Without Articles/index-START.html | 32 ++++++++++++++------- 1 file changed, 21 insertions(+), 11 deletions(-) diff --git a/17 - Sort Without Articles/index-START.html b/17 - Sort Without Articles/index-START.html index dc009af08b..92b95f43b8 100755 --- a/17 - Sort Without Articles/index-START.html +++ b/17 - Sort Without Articles/index-START.html @@ -51,18 +51,28 @@ ] const bands = ['The Plot in You', 'The Devil Wears Prada', 'Pierce the Veil', 'Norma Jean', 'The Bled', 'Say Anything', 'The Midway State', 'We Came as Romans', 'Counterparts', 'Oh, Sleeper', 'A Skylit Drive', 'Anywhere But Here', 'An Old Dog'] +// const removeUnsortedPrefix = (string, unsortedPrefixes) => { +// const array = string.split(SPACE) +// let firstWordUnsorted = false +// unsortedPrefixes.forEach(prefix => { +// if (prefix.toLowerCase() === array[0].toLowerCase()) { +// firstWordUnsorted = true +// } +// }) +// if (firstWordUnsorted) { +// return array.slice(1).join(SPACE) +// } +// return array.join(SPACE) +// } + +const buildRegex = (unsortedPrefixes) => { + const expression = unsortedPrefixes.map(prefix => prefix.toLowerCase() + SPACE).join('|') + return new RegExp(expression, 'i') +} + const removeUnsortedPrefix = (string, unsortedPrefixes) => { - const array = string.split(SPACE) - let firstWordUnsorted = false - unsortedPrefixes.forEach(prefix => { - if (prefix.toLowerCase() === array[0].toLowerCase()) { - firstWordUnsorted = true - } - }) - if (firstWordUnsorted) { - return array.slice(1).join(SPACE) - } - return array.join(SPACE) + const regex = buildRegex(unsortedPrefixes) + return string.replace(regex, '').trim() } const sortAlphabetically = (stringArray, unsortedPrefixes) => {