From 13ad0ddf33720fcaf47a59f76d8dfed3fa3285d6 Mon Sep 17 00:00:00 2001 From: Piotr Sarna Date: Sun, 25 Dec 2016 10:03:08 +0100 Subject: [PATCH 1/7] Resolve exercise no.1 --- 01 - JavaScript Drum Kit/index-START.html | 55 +++++++++++++++-------- 1 file changed, 37 insertions(+), 18 deletions(-) diff --git a/01 - JavaScript Drum Kit/index-START.html b/01 - JavaScript Drum Kit/index-START.html index 4070d32767..6f32b04914 100644 --- a/01 - JavaScript Drum Kit/index-START.html +++ b/01 - JavaScript Drum Kit/index-START.html @@ -9,56 +9,75 @@
-
+
A clap
-
+
S hihat
-
+
D kick
-
+
F openhat
-
+
G boom
-
+
H ride
-
+
J snare
-
+
K tom
-
+
L tink
- - - - - - - - - + + + + + + + + + From dbf499cbf83e2f15d9e20bbbccd16b4bd94308c7 Mon Sep 17 00:00:00 2001 From: Piotr Sarna Date: Sun, 25 Dec 2016 11:26:27 +0100 Subject: [PATCH 2/7] Add solution to exercise no.2 --- 02 - JS + CSS Clock/index-START.html | 42 ++++++++++++++++++++++++++++ 1 file changed, 42 insertions(+) diff --git a/02 - JS + CSS Clock/index-START.html b/02 - JS + CSS Clock/index-START.html index 2712384201..642ddeb861 100644 --- a/02 - JS + CSS Clock/index-START.html +++ b/02 - JS + CSS Clock/index-START.html @@ -61,13 +61,55 @@ background:black; position: absolute; top:50%; + transform-origin: 100%; + transition: all 0.1s; + transform: rotate(90deg); + transition-timing-function: cubic-bezier(0.1, 2.7, 0.58, 1); } From 23e82025bd37e40aeec656ece1b2bcb323a0c418 Mon Sep 17 00:00:00 2001 From: Piotr Sarna Date: Sun, 25 Dec 2016 11:56:49 +0100 Subject: [PATCH 3/7] Add solution to exercise no.3 --- 03 - CSS Variables/index-START.html | 29 ++++++++++++++++++++++++++++- 1 file changed, 28 insertions(+), 1 deletion(-) diff --git a/03 - CSS Variables/index-START.html b/03 - CSS Variables/index-START.html index 7171607a8b..64703b1432 100644 --- a/03 - CSS Variables/index-START.html +++ b/03 - CSS Variables/index-START.html @@ -9,7 +9,7 @@

Update CSS Variables with JS

- + @@ -21,6 +21,21 @@

Update CSS Variables with JS

From 18541ca83eae79e8c68e5476cdfe089a651b615c Mon Sep 17 00:00:00 2001 From: Piotr Sarna Date: Sun, 25 Dec 2016 17:50:04 +0100 Subject: [PATCH 4/7] Add resolved exercise no.4 --- 04 - Array Cardio Day 1/index-START.html | 43 ++++++++++++++++++++++++ 1 file changed, 43 insertions(+) diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index 4162bce339..a3ba75c56c 100644 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -33,29 +33,72 @@ // Array.prototype.filter() // 1. Filter the list of inventors for those who were born in the 1500's + const inventors1500 = inventors.filter(inventor => inventor.year >= 1500 && inventor.year < 1600); + + console.table(inventors1500); // Array.prototype.map() // 2. Give us an array of the inventors' first and last names + const inventorsNames = inventors.map(inventor => `${inventor.first} ${inventor.last}`); + + console.log(inventorsNames); // Array.prototype.sort() // 3. Sort the inventors by birthdate, oldest to youngest + const inventorsOldestToYoungest = inventors.sort((invA, invB) => invA.year > invB.year ? 1 : -1); + + console.table(inventorsOldestToYoungest); // Array.prototype.reduce() // 4. How many years did all the inventors live? + const lifetimeOfAllInventors = inventors.reduce((total, inventor) => total + (inventor.passed - inventor.year), 0); + + console.log(lifetimeOfAllInventors); // 5. Sort the inventors by years lived + const inventorsOrderedByLifetime = inventors.sort((invA, invB) => { + const invALifetime = invA.passed - invA.year; + const invBLifetime = invB.passed - invB.year; + + return invALifetime > invBLifetime ? 1 : -1; + }); + + console.table(inventorsOrderedByLifetime); // 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 deBoulevards = Array.from(document.querySelectorAll('.mw-category a')) + // .map(aElement => aElement.textContent) + // .filter(name => name.includes('de')); + // console.log(deBoulevards); + // 7. sort Exercise // Sort the people alphabetically by last name + const peoplesSortedByLastName = people.sort((pA, pB) => { + const [lastNameA, firstNameA] = pA.split(', '); + const [lastNameB, firstNameB] = pB.split(', '); + + return lastNameA > lastNameB ? 1 : -1; + }); + console.log(peoplesSortedByLastName); // 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 transportationCategories = data.reduce((reduced, el) => { + if (!reduced[el]) { + reduced[el] = 0; + } + + ++reduced[el]; + + return reduced; + }, {}); + + console.log(transportationCategories); From 4ce9d04ab50581fa95021151a8de5fd3802d9b85 Mon Sep 17 00:00:00 2001 From: Piotr Sarna Date: Mon, 26 Dec 2016 10:42:35 +0100 Subject: [PATCH 5/7] Complete exercise no.5 --- 05 - Flex Panel Gallery/index-START.html | 28 ++++++++++++++++++++++++ 1 file changed, 28 insertions(+) diff --git a/05 - Flex Panel Gallery/index-START.html b/05 - Flex Panel Gallery/index-START.html index e1d643ad5c..9fbd4dddcb 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,10 @@ font-size: 20px; background-size:cover; background-position:center; + display: flex; + flex: 1; + flex-direction: column; + justify-content: center; } @@ -54,8 +59,17 @@ margin:0; width: 100%; transition:transform 0.5s; + display: flex; + flex: 1 0 auto; + 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 +81,7 @@ } .panel.open { + flex: 5; font-size:40px; } @@ -107,7 +122,20 @@
From 92d564599354729825dd0a6d10a897a7f260c0d4 Mon Sep 17 00:00:00 2001 From: Piotr Sarna Date: Mon, 26 Dec 2016 11:05:24 +0100 Subject: [PATCH 6/7] Add solution to exercise no.6 --- 06 - Type Ahead/index-START.html | 42 +++++++++++++++++++++++++++++++- 1 file changed, 41 insertions(+), 1 deletion(-) diff --git a/06 - Type Ahead/index-START.html b/06 - Type Ahead/index-START.html index 1436886918..2ce2fba5c9 100644 --- a/06 - Type Ahead/index-START.html +++ b/06 - Type Ahead/index-START.html @@ -15,8 +15,48 @@ From 7f4816194d9b65cb50735e1f4ad1f1d162b097d0 Mon Sep 17 00:00:00 2001 From: Piotr Sarna Date: Mon, 26 Dec 2016 11:23:38 +0100 Subject: [PATCH 7/7] Resolve exercise no.7 --- 07 - Array Cardio Day 2/index-START.html | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/07 - Array Cardio Day 2/index-START.html b/07 - Array Cardio Day 2/index-START.html index 206ec31aa0..aa15e2efda 100644 --- a/07 - Array Cardio Day 2/index-START.html +++ b/07 - Array Cardio Day 2/index-START.html @@ -24,18 +24,31 @@ { text: 'Nice Nice Nice!', id: 542328 } ]; + const currentYear = (new Date()).getFullYear(); + // Some and Every Checks // Array.prototype.some() // is at least one person 19? + const isAnyPersonOver19 = people.some(person => (currentYear - person.year) >= 19); + console.log(isAnyPersonOver19); + // Array.prototype.every() // is everyone 19? + const areEveryPersonOver19 = people.every(person => (currentYear - person.year) >= 19); + console.log(areEveryPersonOver19); // Array.prototype.find() // Find is like filter, but instead returns just the one you are looking for // find the comment with the ID of 823423 + const comment = comments.find(comment => comment.id == 823423); + console.log(comment); // Array.prototype.findIndex() // Find the comment with this ID // delete the comment with the ID of 823423 + const indexOfElementToRemove = comments.findIndex(comment => comment.id == 823423); + const removedElements = indexOfElementToRemove !== -1 ? comments.splice(indexOfElementToRemove, 1) : []; + console.table(comments); + console.table(removedElements);