aboutsummaryrefslogtreecommitdiff
path: root/timer.js
diff options
context:
space:
mode:
Diffstat (limited to 'timer.js')
-rw-r--r--timer.js66
1 files changed, 24 insertions, 42 deletions
diff --git a/timer.js b/timer.js
index c40bd4b..7e01036 100644
--- a/timer.js
+++ b/timer.js
@@ -6,63 +6,45 @@ let cd;
const page = document.getElementById("page");
function setupCountdown() {
+ var prompt_text = "";
+ var progress_bar = "";
params = new URLSearchParams(document.location.search);
for ([key, value] of params.entries()) {
console.log(`${key}: ${value}`);
}
switch (params.get("cdstyle")) {
- case "standard":
- page.innerHTML = `
- <div id="countdown">
- <div id="minutes">00</div>
- <div id="separator">:</div>
- <div id="seconds">00</div>
- </div>
- `;
- break;
case "labeled_bar":
- var label_text = params.get("label_text");
- page.innerHTML = `
- <div id="prompt">${label_text}</div>
- <div id="bar"><div id="progress"></div></div>
- <div id="countdown">
- <div id="minutes">00</div>
- <div id="separator">:</div>
- <div id="seconds">00</div>
- </div>
- `;
+ let label_text = params.get("label_text");
+ prompt_text = `<div id="prompt">${label_text}</div>`;
+ progress_bar = `<div id="bar"><div id="progress"></div></div>`;
break;
case "bar":
- page.innerHTML = `
- <div id="bar"><div id="progress"></div></div>
- <div id="countdown">
- <div id="minutes">00</div>
- <div id="separator">:</div>
- <div id="seconds">00</div>
- </div>
- `;
- break;
- case "p5":
- page.innerHTML = `
- <div id="prompt">Are you ready to <span>Enter Game Z</span>?</div>
- <div id="bar"><div id="progress"></div></div>
- <div id="countdown">
- <div id="minutes">00</div>
- <div id="separator">:</div>
- <div id="seconds">00</div>
- </div>
- `;
+ progress_bar = `<div id="bar"><div id="progress"></div></div>`;
break;
}
+ page_template = `
+ ${prompt_text}
+ ${progress_bar}
+ <div id="countdown">
+ <div id="minutes">00</div>
+ <div id="separator">:</div>
+ <div id="seconds">00</div>
+ </div>
+ `;
+ page.innerHTML = page_template;
cd = document.getElementById("countdown");
+ let prompt = document.getElementById("prompt");
cur_seconds = parseInt(params.get("duration"));
if (params.get("f_family") !== "") {
cd.style.fontFamily = params.get("f_family");
+ if (prompt) {
+ document.getElementById("prompt").style.fontFamily = params.get("f_family");
+ }
}
cd.style.color = params.get("f_color");
- if (params.get("cdstyle") == "labeled_bar" || params.get("cdstyle") == "bar" || params.get("cdstyle") == "p5") {
+ if (document.getElementById("progress")) {
document.getElementById("progress").style.backgroundColor = params.get("b_color");
}
@@ -84,12 +66,12 @@ function tick() {
}
cur_seconds--;
draw();
- if (params.get("cdstyle") == "labeled_bar" || params.get("cdstyle") == "bar" || params.get("cdstyle") == "p5") {
- draw_bar();
- }
}
function draw() {
+ if (document.getElementById("progress")) {
+ draw_bar();
+ }
document.getElementById("minutes").textContent = zero_pad(Math.floor(cur_seconds / 60));
document.getElementById("seconds").textContent = zero_pad((cur_seconds % 60));
}