js drum kit

Spacing: Blur: - + Base Color @@ -22,6 +22,21 @@

Update CSS Variables with JS

diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index 4162bce339..1fadf3b089 100644 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -29,33 +29,55 @@ const flavours = ['Chocolate Chip', 'Kulfi', 'Caramel Praline', 'Chocolate', 'Burnt Caramel', 'Pistachio', 'Rose', 'Sweet Coconut', 'Lemon Cookie', 'Toffeeness', 'Toasted Almond', 'Black Raspberry Crunch', 'Chocolate Brownies', 'Pistachio Almond', 'Strawberry', 'Lavender Honey', 'Lychee', 'Peach', 'Black Walnut', 'Birthday Cake', 'Mexican Chocolate', 'Mocha Almond Fudge', 'Raspberry']; - const people = ['Beck, Glenn', 'Becker, Carl', 'Beckett, Samuel', 'Beddoes, Mick', 'Beecher, Henry', 'Beethoven, Ludwig', 'Begin, Menachem', 'Belloc, Hilaire', 'Bellow, Saul', 'Benchley, Robert', 'Benenson, Peter', 'Ben-Gurion, David', 'Benjamin, Walter', 'Benn, Tony', 'Bennington, Chester', 'Benson, Leana', 'Bent, Silas', 'Bentsen, Lloyd', 'Berger, Ric', 'Bergman, Ingmar', 'Berio, Luciano', 'Berle, Milton', 'Berlin, Irving', 'Berne, Eric', 'Bernhard, Sandra', 'Berra, Yogi', 'Berry, Halle', 'Berry, Wendell', 'Bethea, Erin', 'Bevan, Aneurin', 'Bevel, Ken', 'Biden, Joseph', 'Bierce, Ambrose', 'Biko, Steve', 'Billings, Josh', 'Biondo, Frank', 'Birrell, Augustine', 'Black Elk', 'Blair, Robert', 'Blair, Tony', 'Blake, William']; +// // 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 <=1599); + console.table(fifteen); // Array.prototype.map() // 2. Give us an array of the inventors' first and last names - + const justNames = inventors.map(inventor => `${inventor.first} ${inventor.last}`); + console.log(justNames); // Array.prototype.sort() // 3. Sort the inventors by birthdate, oldest to youngest - + const alphabeticInventors = inventors.sort((a,b) => a.year > b.year ? 1 : -1); + console.table(alphabeticInventors); // Array.prototype.reduce() // 4. How many years did all the inventors live? - + const ages = inventors.reduce((total, inventor) =>{ + return total + (inventor.passed - inventor.year); + },0); + console.log(ages); // 5. Sort the inventors by years lived - + const ageIndex = inventors.sort((a,b) => (a.passed - a.year) > (b.passed - b.year) ? a : b ); + console.table(ageIndex); // 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')); + // const de = links.map(link => link.textContent).filter(streetName => streetName.includes('de')); // 7. sort Exercise // Sort the people alphabetically by last name + // const lastNames = people.sort(function(lastguy,nextguy){ + // const [alast,bfirst] = lastguy.split(','); + // const [blast,bfirst] = nextguy.split(','); + // return alast > blast ? 1 : -1; + // }); + // console.log(alast,first); // 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 sums = data.reduce(function (obj, item){ + if (!obj[item]){ + obj [item] = 0; + } + obj[item]++; + return obj; + }, {}); + console.log(sums); diff --git a/05 - Flex Panel Gallery/index-START.html b/05 - Flex Panel Gallery/index-START.html index e1d643ad5c..ebf7d068d5 100644 --- a/05 - Flex Panel Gallery/index-START.html +++ b/05 - Flex Panel Gallery/index-START.html @@ -3,7 +3,7 @@ Flex Panels 💪 - +