JS + CSS Clock

- +

diff --git a/02 - JS and CSS Clock/testModule.js b/02 - JS and CSS Clock/testModule.js new file mode 100644 index 0000000000..2f5b62a729 --- /dev/null +++ b/02 - JS and CSS Clock/testModule.js @@ -0,0 +1,52 @@ +let testSeconds = 56; +let testMinutes = 54; +let testMinutesZeroCounter = 0; +let testHoursZeroCounter = 0; +let testHours = 9; + +/** + * This function tries to simulate more dangerous use cases + * @return {object} time values + */ +const getTestTime = () => { + testSeconds++; + testMinutes++; // secs == 54,55,56 + testHours++; + if (testSeconds === 60) { + testSeconds = 0; + } else if (testSeconds === 3) { + testSeconds = 56; + } + + if (testMinutes === 60) { + testMinutes = 0; + } else if (testMinutes === 4) { + testMinutes = 54; + } else if (testMinutes === 1 && testMinutesZeroCounter < 3) { + testMinutes = 0; + testMinutesZeroCounter++; + } else { + testMinutesZeroCounter = 0; + } + + if (testHours === 12) { + testHours = 0; + } else if (testHours === 5) { + testHours = 9; + } else if (testHours === 1 && testHoursZeroCounter < 3) { + testHours = 0; + testHoursZeroCounter++; + } else { + testHoursZeroCounter = 0; + } + + const time = { + seconds: testSeconds, + minutes: testMinutes, + hours: testHours, + }; + + console.debug("test time values: ", time); + + return time; +} \ No newline at end of file diff --git a/03 - CSS Variables/index-START.html b/03 - CSS Variables/index-START.html index 8a4f0d556e..24c9672430 100644 --- a/03 - CSS Variables/index-START.html +++ b/03 - CSS Variables/index-START.html @@ -21,6 +21,26 @@

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 eec0ffc31d..1cf9c856ba 100644 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -27,32 +27,70 @@ { first: 'Hanna', last: 'Hammarström', year: 1829, passed: 1909 } ]; - 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']; + 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 - // Array.prototype.map() - // 2. Give us an array of the inventors' first and last names + const getResults = async () => { + let result = null; + // Array.prototype.filter() + result = inventors.filter(({ year }) => year >= 1500 && year < 1600); + log("1. Filter the list of inventors for those who were born in the 1500's"); + + // Array.prototype.map() + result = inventors.map(inventor => `${inventor.first}, ${inventor.last}`); + log("2. Give us an array of the inventors' first and last names"); - // Array.prototype.sort() - // 3. Sort the inventors by birthdate, oldest to youngest + // Array.prototype.sort() + result = inventors.sort((a, b) => a.year - b.year); + log("3. Sort the inventors by birthdate, oldest to youngest"); - // Array.prototype.reduce() - // 4. How many years did all the inventors live? + // Array.prototype.reduce() + result = inventors.reduce((total, { year, passed }) => total + (passed - year), 0); + log("4. How many years did all the inventors live?"); - // 5. Sort the inventors by years lived + result = inventors.sort((a, b) => (a.passed - a.year) - (b.passed - b.year)); + log("5. Sort the inventors by years lived"); - // 6. create a list of Boulevards in Paris that contain 'de' anywhere in the name - // https://en.wikipedia.org/wiki/Category:Boulevards_in_Paris + // https://en.wikipedia.org/wiki/Category:Boulevards_in_Paris + // there is a request to Wiki, using its API + const boulevardsRequest = async () => { + const json = await fetch("https://en.wikipedia.org/w/api.php" + + "?action=query&list=categorymembers&cmtitle=Category%3ABoulevards_in_Paris&format=json&cmlimit=500&origin=*"). + then(response => response.json()); + return json.query.categorymembers.map(member => member.title); + }; + const boulevards = await boulevardsRequest(); + result = boulevards.filter(boulevardName => boulevardName.includes(' de ')); + log("6. create a list of Boulevards in Paris that contain 'de' anywhere in the name"); + // 7. sort Exercise + result = people.sort((a, b) => { + const getLastName = fullName => fullName.split(', ')[0]; + return getLastName(a) > getLastName(b); + }); + log("7. Sort the people alphabetically by last name"); - // 7. sort Exercise - // Sort the people alphabetically by last name + // 8. Reduce Exercise + const data = ['car', 'car', 'truck', 'truck', 'bike', 'walk', 'car', 'van', 'bike', 'walk', 'car', 'van', 'car', 'truck' ]; + result = data.reduce((sumUp, instance) => { + sumUp[instance] = (sumUp[instance] ? sumUp[instance] : 0) + 1; + return sumUp; + }, {}); + log("8. Sum up the instances of each of these"); - // 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' ]; + function log(message) { + console.log(message); + console.table(result); + } + }; + + getResults();