course wesbos#18 finished

Author: Jin Xu

18 - Adding Up Times with Reduce/index-START.html

@@ -182,6 +182,22 @@
     </li>
 
 <script>
+  // ugly way:
+  // var totalSeconds = 0;
+  // [...document.querySelectorAll('[data-time]')].forEach(ele => {
+  //   var arr = ele.getAttribute('data-time').split(':');
+  //   totalSeconds += Number((arr[0])) * 60 + Number((arr[1]));
+  // })
+
+  // elegant way:
+  var totalSeconds = [...document.querySelectorAll('[data-time]')]
+    .map(ele => ele.getAttribute('data-time').split(':'))
+    .map(arr => Number((arr[0])) * 60 + Number((arr[1])))
+    .reduce((prev, current) => prev += current, 0);
+
+  console.log(`%c Video length: ${parseInt(totalSeconds / 3600)} hours, 
+              ${parseInt((totalSeconds % 3600) / 60 )} minutes, 
+              ${parseInt((totalSeconds % 3600) % 60 )} seconds.`, 'font-size: 20px;color: red')
 </script>
 </body>
 </html>

readme.md

@@ -21,7 +21,7 @@
 15. [x] ~~LocalStorage~~
 16. [x] ~~Mouse Move Shadow~~
 17. [x] ~~Sort Without Articles~~
-18. [ ] Adding Up Times with Reduce
+18. [x] ~~Adding Up Times with Reduce~~
 19. [ ] Webcam Fun
 20. [ ] Speech Detection
 21. [ ] Geolocation