-
Notifications
You must be signed in to change notification settings - Fork 17
/
Copy pathstandup.html
91 lines (90 loc) · 3.98 KB
/
standup.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
<html>
<head>
<title>2-min timer for standups</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<style>
@font-face {
font-family: sevenseg;
src: url(data:application/x-font-woff;base64,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);
}
body {
display: flex;
justify-content: center;
flex-direction: column;
cursor: pointer;
}
div {
align-self: center;
padding: 10px;
}
#timer {
font-family: sevenseg;
font-size: 18vmin;
}
.blink {
animation: blinker 0.5s ease-in-out infinite;
}
.red {
background-color: red;
color: white;
}
@keyframes blinker {
50% {
opacity: 0;
}
}
</style>
</head>
<body id="body">
<div id="timer"></div>
<div>[click, touch or hit space to reset]
<script>
var total = 0;
var start_time = 0;
var sndPlayed;
function restart() {
total = 121; // 2 min;
start_time = Date.now();
sndPlayed = false;
}
function update() {
var show;
var t = total - (Date.now() - start_time)/1000;
if (t < 0) {
t = 0;
}
body.className = "";
if (t < 30) {
body.className += "red"
}
timer.className = "";
if (t < 10) {
timer.className += "blink";
}
if ((t < 1) && !sndPlayed) {
sndPlayed = true;
speechSynthesis.speak(new SpeechSynthesisUtterance("Times up!"));
}
var h = (((t / 3600)|0)+"").padStart(2, "0");
var m = (((t % 3600 / 60)|0)+"").padStart(2, "0");
var s = (((t % 3600 % 60)|0)+"").padStart(2, "0");
show = h + ":" + m + ":" + s;
timer.innerText = show;
document.title = show;
}
restart();
setInterval(update, 100);
window.addEventListener("keypress", (e) => {if (e.code == "Space") {
restart();
}});
window.addEventListener("click", restart);
window.addEventListener("touchstart", (e) => {
e.preventDefault();
restart();
});
window.addEventListener("touchmove", (e) => e.preventDefault());
window.addEventListener("touchend", (e) => e.preventDefault());
window.addEventListener("gesturestart", (e) => e.preventDefault());
</script>
</body>
</html>