Skip to content

Commit 5d48264

Browse files
LeiGLeiG
committed
Finish challenge wesbos#18 
1 parent 78dfc6d commit 5d48264

File tree

1 file changed

+207
-0
lines changed

1 file changed

+207
-0
lines changed

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

Lines changed: 207 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,207 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>Videos</title>
6+
</head>
7+
<body>
8+
<ul class="videos">
9+
<li data-time="5:43">
10+
Video 1
11+
</li>
12+
<li data-time="2:33">
13+
Video 2
14+
</li>
15+
<li data-time="3:45">
16+
Video 3
17+
</li>
18+
<li data-time="0:47">
19+
Video 4
20+
</li>
21+
<li data-time="5:21">
22+
Video 5
23+
</li>
24+
<li data-time="6:56">
25+
Video 6
26+
</li>
27+
<li data-time="3:46">
28+
Video 7
29+
</li>
30+
<li data-time="5:25">
31+
Video 8
32+
</li>
33+
<li data-time="3:14">
34+
Video 9
35+
</li>
36+
<li data-time="3:31">
37+
Video 10
38+
</li>
39+
<li data-time="5:59">
40+
Video 11
41+
</li>
42+
<li data-time="3:07">
43+
Video 12
44+
</li>
45+
<li data-time="11:29">
46+
Video 13
47+
</li>
48+
<li data-time="8:57">
49+
Video 14
50+
</li>
51+
<li data-time="5:49">
52+
Video 15
53+
</li>
54+
<li data-time="5:52">
55+
Video 16
56+
</li>
57+
<li data-time="5:50">
58+
Video 17
59+
</li>
60+
<li data-time="9:13">
61+
Video 18
62+
</li>
63+
<li data-time="11:51">
64+
Video 19
65+
</li>
66+
<li data-time="7:58">
67+
Video 20
68+
</li>
69+
<li data-time="4:40">
70+
Video 21
71+
</li>
72+
<li data-time="4:45">
73+
Video 22
74+
</li>
75+
<li data-time="6:46">
76+
Video 23
77+
</li>
78+
<li data-time="7:24">
79+
Video 24
80+
</li>
81+
<li data-time="7:12">
82+
Video 25
83+
</li>
84+
<li data-time="5:23">
85+
Video 26
86+
</li>
87+
<li data-time="3:34">
88+
Video 27
89+
</li>
90+
<li data-time="8:22">
91+
Video 28
92+
</li>
93+
<li data-time="5:17">
94+
Video 29
95+
</li>
96+
<li data-time="3:10">
97+
Video 30
98+
</li>
99+
<li data-time="4:43">
100+
Video 31
101+
</li>
102+
<li data-time="19:43">
103+
Video 32
104+
</li>
105+
<li data-time="0:47">
106+
Video 33
107+
</li>
108+
<li data-time="0:47">
109+
Video 34
110+
</li>
111+
<li data-time="3:14">
112+
Video 35
113+
</li>
114+
<li data-time="3:59">
115+
Video 36
116+
</li>
117+
<li data-time="2:43">
118+
Video 37
119+
</li>
120+
<li data-time="4:17">
121+
Video 38
122+
</li>
123+
<li data-time="6:56">
124+
Video 39
125+
</li>
126+
<li data-time="3:05">
127+
Video 40
128+
</li>
129+
<li data-time="2:06">
130+
Video 41
131+
</li>
132+
<li data-time="1:59">
133+
Video 42
134+
</li>
135+
<li data-time="1:49">
136+
Video 43
137+
</li>
138+
<li data-time="3:36">
139+
Video 44
140+
</li>
141+
<li data-time="7:10">
142+
Video 45
143+
</li>
144+
<li data-time="3:44">
145+
Video 46
146+
</li>
147+
<li data-time="3:44">
148+
Video 47
149+
</li>
150+
<li data-time="4:36">
151+
Video 48
152+
</li>
153+
<li data-time="3:16">
154+
Video 49
155+
</li>
156+
<li data-time="1:10">
157+
Video 50
158+
</li>
159+
<li data-time="6:10">
160+
Video 51
161+
</li>
162+
<li data-time="2:14">
163+
Video 52
164+
</li>
165+
<li data-time="3:44">
166+
Video 53
167+
</li>
168+
<li data-time="5:05">
169+
Video 54
170+
</li>
171+
<li data-time="6:03">
172+
Video 55
173+
</li>
174+
<li data-time="12:39">
175+
Video 56
176+
</li>
177+
<li data-time="1:56">
178+
Video 57
179+
</li>
180+
<li data-time="4:04">
181+
Video 58
182+
</li>
183+
</ul>
184+
<script>
185+
const timeNodes = Array.from(document.querySelectorAll('[data-time]'));
186+
187+
const seconds = timeNodes
188+
.map(node => node.dataset.time)
189+
.map(timeString => {
190+
const [mins, secs] = timeString.split(':').map(parseFloat);
191+
return 60 * mins + secs;
192+
})
193+
.reduce((totalSecs, secs) => totalSecs = totalSecs + secs);
194+
195+
let secondsLeft = seconds;
196+
197+
const hours = Math.floor(secondsLeft / 3600);
198+
secondsLeft = secondsLeft % 3600;
199+
200+
const mins = Math.floor(secondsLeft / 60);
201+
secondsLeft = secondsLeft % 60;
202+
203+
console.log(hours, mins, secondsLeft);
204+
205+
</script>
206+
</body>
207+
</html>

0 commit comments

Comments
 (0)