From 1f9550221fef67eeea4800f0da24cdcf01472dcc Mon Sep 17 00:00:00 2001 From: bangner Date: Fri, 9 Dec 2016 16:54:35 -0800 Subject: [PATCH 1/6] add listener, add play class, remove play class --- 01 - JavaScript Drum Kit/index-START.html | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/01 - JavaScript Drum Kit/index-START.html b/01 - JavaScript Drum Kit/index-START.html index 4070d32767..3b914e3167 100644 --- a/01 - JavaScript Drum Kit/index-START.html +++ b/01 - JavaScript Drum Kit/index-START.html @@ -58,7 +58,23 @@ From a320d102210db3c8eb8c71dd5fb43c239e404281 Mon Sep 17 00:00:00 2001 From: bangner Date: Fri, 9 Dec 2016 17:43:46 -0800 Subject: [PATCH 2/6] add transition to hands and add js for transforming the hands --- 02 - JS + CSS Clock/index-START.html | 27 ++++++++++++++++++++++++++- 1 file changed, 26 insertions(+), 1 deletion(-) diff --git a/02 - JS + CSS Clock/index-START.html b/02 - JS + CSS Clock/index-START.html index 2712384201..2c4d44efbc 100644 --- a/02 - JS + CSS Clock/index-START.html +++ b/02 - JS + CSS Clock/index-START.html @@ -61,12 +61,37 @@ background:black; position: absolute; top:50%; + transform-origin: 100%; + transform: rotate(90deg); + transition: all 0.5s; + transition-timing-function: cubic-bezier(0.1, 2.7, 0.58, 1); } - From 63cefbf132e32f7f53b1cf27dbb6b1fbcbf29de3 Mon Sep 17 00:00:00 2001 From: bangner Date: Fri, 9 Dec 2016 17:59:05 -0800 Subject: [PATCH 3/6] add variables for css, add js to update properties --- 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..c64e92436a 100644 --- a/03 - CSS Variables/index-START.html +++ b/03 - CSS Variables/index-START.html @@ -21,6 +21,21 @@

Update CSS Variables with JS

From dede45db427a3f93a7310273b6c82f9122b1e791 Mon Sep 17 00:00:00 2001 From: bangner Date: Fri, 9 Dec 2016 18:12:38 -0800 Subject: [PATCH 4/6] stopped at cardio day 1, 7 minutes 41 seconds --- 04 - Array Cardio Day 1/index-START.html | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index 6e28e357d0..00c300841b 100644 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -27,12 +27,29 @@ // Array.prototype.filter() // 1. Filter the list of inventors for those who were born in the 1500's + const fifteen = inventors.filter(inventor => (inventor.year > 1500 && inventor.year < 1600)); + + console.table(fifteen); // Array.prototype.map() // 2. Give us an array of the inventory first and last names + const fullNames = inventors.map(inventor => `${inventor.first} ${inventor.last}`); + + console.log(fullNames); // Array.prototype.sort() // 3. Sort the inventors by birthdate, oldest to youngest + //const ordered = inventors.sort(function(a, b) { + // if(a.year > b.year) { + // return 1; + // } else { + // return -1; + // } + //}); + + const ordered = inventors.sort((a, b) => a.year > b.year ? 1 : -1); // same thing as lines 40-46 + + console.log(ordered); // Array.prototype.reduce() // 4. How many years did all the inventors live? From 0c48f07bc813c84f98ca31ca87a1c47527533f89 Mon Sep 17 00:00:00 2001 From: bangner Date: Sat, 10 Dec 2016 10:30:58 -0800 Subject: [PATCH 5/6] index-started is now complete --- 04 - Array Cardio Day 1/index-START.html | 42 +++++++++++++++++++++++- 1 file changed, 41 insertions(+), 1 deletion(-) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index 00c300841b..da996504c7 100644 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -53,20 +53,60 @@ // Array.prototype.reduce() // 4. How many years did all the inventors live? + const totalYears = inventors.reduce((total, inventor) => { + return total + (inventor.passed - inventor.year); + }, 0); + console.log(totalYears); // 5. Sort the inventors by years lived + const oldest = inventors.sort(function(a,b) { + const lastGuy = a.passed - a.year; + const nextGuy = b.passed - b.year; + return lastGuy > nextGuy ? -1 : 1; + }); + console.table(oldest); // 6. create a list of Boulevards in Paris that contain 'de' anywhere in the name // https://en.wikipedia.org/wiki/Category:Boulevards_in_Paris + // NEED TO OPEN URL ABOVE + + //const category = document.querySelector('.mw-category'); + //const links = Array.from(category.querySelectorAll('a')); + //const de = links + // .map(link => link.textContent) + // .filter(streetName => streetName.includes('de')); + + //console.log(de); // 7. sort Exercise // Sort the people alphabetically by last name + const alpha = people.sort(function(lastOne, nextOne) { + console.log(lastOne); + const [aLast, aFirst] = lastOne.split(', '); + const [bLast, bFirst] = nextOne.split(', '); + return aLast > bLast ? 1 : -1; + }); + + console.log(alpha); // 8. Reduce Exercise // Sum up the instances of each of these + // we start with a blank object (line 107) with reduce and loop through all items const data = ['car', 'car', 'truck', 'truck', 'bike', 'walk', 'car', 'van', 'bike', 'walk', 'car', 'van', 'car', 'truck' ]; - + const transportation = data.reduce(function(obj, item) { + // log all items in the console first + // console.log(item); + // return obj; + + if(!obj[item]) { + obj[item] = 0; + } + obj[item]++; + return obj; + }, {}); + + console.log(transportation); From 12d37bec1b5cf4b62057aae6313330d9ea3d7fbc Mon Sep 17 00:00:00 2001 From: bangner Date: Sat, 10 Dec 2016 10:41:18 -0800 Subject: [PATCH 6/6] come back to flex panels 5 minute marker --- 05 - Flex Panel Gallery/index-START.html | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/05 - Flex Panel Gallery/index-START.html b/05 - Flex Panel Gallery/index-START.html index e1d643ad5c..513c56b532 100644 --- 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,12 @@ font-size: 20px; background-size:cover; background-position:center; + flex: 1; + justify-content: center; + align-tems: center; + display: flex; + flex-direction: column; + } @@ -54,6 +61,11 @@ 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 p {