-
Notifications
You must be signed in to change notification settings - Fork 0
/
index2.html
145 lines (126 loc) · 5.39 KB
/
index2.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
<!DOCTYPE HTML>
<html>
<head>
<title id="Name"></title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
p {
text-align: center;
font-size: 60px;
margin-top: 0px;
}
#Video {
display: none;
}
</style>
</head>
<body>
<h1 id="Name"></h1>
<br />
<center><span id=button><div>Choose a video:</div>
<form>
<input type="radio" name="num" id="CrabRave" value="43600" onclick="Crab()" checked>Crab Rave<br>
<input type="radio" name="num" id="SansRave" value="75000" onclick="Sans()">Sans Rave<br>
</form>
<br />
<button onclick="CreateTimer()">Create a countdown</button>
<br />
<br />
A few notes:
<br />*Thanks to Monstercat, Noisestorm, Toby Fox, Fluxxy, and Dat Boi DXY for the music and the video.
<br />*Make a timer at least <b><span id="CR" style="display:inline-block">44</span><span id="SR" style="display:none">75</span></b> seconds ahead of the current time, since that is how long it is until the beat drops.
<br />*The time on the website may not match the clock on your computer since most likely they did not reference the same time sever at the same time.</span></center>
<p id="Timer"></p>
<center><video id="Video" width='852' height='480' controls autoplay></video></center>
<script>
function Crab() {
var checkBox = document.getElementById("CrabRave");
var text = document.getElementById("CR");
if (checkBox.checked == true){
text.style.display = "inline-block";
document.getElementById("SR").style.display = "none";
} else {
text.style.display = "none";
}
}
function Sans() {
var checkBox = document.getElementById("SansRave");
var text = document.getElementById("SR");
if (checkBox.checked == true){
text.style.display = "inline-block";
document.getElementById("CR").style.display = "none";
} else {
text.style.display = "none";
}
}
function CreateTimer() {
var radios = document.getElementsByName('num');
for (var i = 0, length = radios.length; i < length; i++) {
if (radios[i].checked) {
// do whatever you want with the checked radio
var offset = (radios[i].value);
// only one radio can be logically checked, don't check the rest
break;
}
}
for (var i = 0, length = radios.length; i < length; i++) {
if (radios[i].checked) {
// do whatever you want with the checked radio
var url = (radios[i].id);
// only one radio can be logically checked, don't check the rest
break;
}
}
var g = new Date();
const monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
const hourNames = ["24", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23"];
const msNames = ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55", "56", "57", "58", "59"];
var current = monthNames[g.getMonth()] + " "+g.getDate() + ", " + g.getFullYear() + " " + hourNames[g.getHours()] + ":" + msNames[g.getMinutes()]+":"+msNames[g.getSeconds()]
var TimerName = prompt("What do you want to call the timer? (Can Be left Blank)", "");
var time = prompt("Please enter a time in the following format (Local Military Time)", current);
var Message = prompt("What do you want the timer to say when finished (Can Be left Blank)", "");
if (time != null) {
document.getElementById("button").innerHTML = "";
document.getElementById("Name").innerHTML = TimerName;
// Set the date we're counting down to
var countDownDate = new Date(new Date(time) - offset).getTime();
// Update the count down every 1 second
var x = setInterval(function() {
// Get today's date and time
var now = new Date().getTime();
// Find the distance between now and the count down date
var distance = countDownDate - now;
// If the count down is over, write some text
if (distance < 0) {
clearInterval(x);
document.getElementById("Video").style.display = "block";
document.getElementById("Video").innerHTML = "<source src='"+url+".mp4' type='video/mp4'>Your browser does not support the video tag. :(";
}
}, 1000);
// Set the date we're counting down to
var countDownDate2 = new Date(time).getTime();
// Update the count down every 1 second
var x2 = setInterval(function() {
// Get today's date and time
var now2 = new Date().getTime();
// Find the distance between now and the count down date
var distance2 = countDownDate2 - now2;
// Time calculations for days, hours, minutes and seconds
var days2 = Math.floor(distance2 / (1000 * 60 * 60 * 24));
var hours2 = Math.floor((distance2 % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes2 = Math.floor((distance2 % (1000 * 60 * 60)) / (1000 * 60));
var seconds2 = Math.floor((distance2 % (1000 * 60)) / 1000);
// Output the result in an element with id="demo"
document.getElementById("Timer").innerHTML = days2 + "d " + hours2 + "h "
+ minutes2 + "m " + seconds2 + "s ";
// If the count down is over, write some text
if (distance2 < 0) {
clearInterval(x2);
document.getElementById("Timer").innerHTML = Message ;
}
}, 1000);
}
}
</script>
</body>
</html>