5 <title>HTTP (Hurry, Time To Perth!)
</title>
6 <link rel=
"preconnect" href=
"https://fonts.gstatic.com">
7 <link href=
"https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300&display=swap" rel=
"stylesheet">
8 <script src=
"js/countdown.min.js"></script>
16 font-family: 'Open Sans Condensed', sans-serif;
20 place-items: center left;
21 background-size: cover;
22 background-position-y:
60%;
23 background-position-x:
50%;
56 <iframe width=
"560" height=
"315" id=
"audio" src=
"https://www.youtube.com/embed/B_QCJSTxqfI?controls=0&autoplay=1" frameborder=
"0" allow=
"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen
></iframe>
57 <div id=
"timer"></div>
58 <video autoplay muted loop
id=
"video">
59 <source src=
"video/1.mp4" type=
"video/mp4">
63 var timerElement = document.getElementById(
"timer");
64 var units = ['weeks', 'days', 'hours', 'minutes', 'seconds', 'milliseconds'];
67 var vidElement = document.getElementById('video');
68 var activeVideo = Math.floor((Math.random() *
4) +
1);
69 vidElement.src =
"video/" + activeVideo +
".mp4";
70 vidElement.addEventListener('ended', function(e) {
71 // update the active video index
72 activeVideo = (++activeVideo) % vidSources.length;
73 if(activeVideo === vidSources.length){
77 vidElement.src = vidSources[activeVideo];
81 var vid = document.getElementById(
"video");
82 vid.playbackRate =
0.5;
84 var youtubeIds = ['VG1gcnCVJ8M', 'B_QCJSTxqfI'];
85 var youtubeId = youtubeIds[Math.floor(Math.random() * youtubeIds.length)];
86 var iframe = document.getElementById('audio');
87 iframe.src =
"https://www.youtube.com/embed/" + youtubeId +
"?controls=0&autoplay=1"
89 function pad(n, width, z) {
92 return n.length
>= width ? n : new Array(width - n.length +
1).join(z) + n;
95 function formatUnit(timespan, unit) {
96 var padding = {'weeks':
1, 'days':
1, 'hours':
1, 'minutes':
1, 'seconds':
2, 'milliseconds':
3};
97 var unitDisplay = (timespan[unit]
> 1 || timespan[unit] ==
0) ? unit : unit.slice(
0, -
1);
99 .slice(
0, units.indexOf(unit) +
1)
100 .reduce((c,v) =
> c + timespan[v],
0)
> 0 ? '
<div class=
"chunk"><span class=
"num">' + pad(timespan[unit], padding[unit]) + '
</span><span class =
"unit">' + unitDisplay + '
</span></div>' : '';
104 var timespan = countdown(null, new Date('January
4,
2021 03:
47:
00'), countdown.ALL);
105 var text = timespan.value <
0 ? '
<span class=
"num">Welcome to Perth!
</span>' : units.reduce((c, v) =
> c + formatUnit(timespan, v),
"");
106 timerElement.innerHTML = text;
107 setTimeout(tick, delay);
110 setTimeout(tick, delay);