Benjamin/time
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Refactoring

Browse source
This commit is contained in:
Benjamin 2020-12-13 18:22:00 +01:00
parent a4a90bf61b
commit 3b838722ff
No known key found for this signature in database
GPG key ID: 99C8C88768F0F905
1 changed files with 93 additions and 99 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

68
time.html
View file

@ -1,13 +1,17 @@
<!DOCTYPE HTML> <!DOCTYPE HTML>
<html lang="en"> <html lang="en">
<head> <head>
<title>time</title>
<meta charset="UTF-8"> <meta charset="UTF-8">
<script> <script>
const darkColor = "#000000";
const lightColor = "#ffffff";
const fontSizeFallbackPx = 300;
const intervalMillisec = 200;
let light = false; let light = false;
let darkColor = "#000000"; let fontSizePx = fontSizeFallbackPx;
let lightColor = "#ffffff";
const fontSizeFallback = 300;
let fontSizePx = 300;
let getStrings = [ let getStrings = [
function(){return (new Date()).toTimeString().split(" ")[0];}, function(){return (new Date()).toTimeString().split(" ")[0];},
function(){const a = (new Date()).toTimeString().split(" ")[0].split(":"); return a[0] + ":" + a[1];}, function(){const a = (new Date()).toTimeString().split(" ")[0].split(":"); return a[0] + ":" + a[1];},
@ -17,22 +21,38 @@
]; ];
let getStrInd = 0; let getStrInd = 0;
document.addEventListener("keypress", keyPress);
function load() { function load() {
setLight();
setTime(); setTime();
setSize(); setSize();
setInterval(setTime, 200); setColors();
setInterval(setTime, intervalMillisec);
} }
function setTime() {
let str = getStrings[getStrInd]();
document.getElementById("time").innerHTML = str;
document.title = str;
}
function setSize() {
document.getElementById("time").style.fontSize = fontSizePx + "px";
}
function setColors() {
document.body.style.background = light ? lightColor : darkColor;
document.getElementById("time").style.color = light ? darkColor : lightColor;
}
document.addEventListener("keypress", keyPress);
function keyPress(event) { function keyPress(event) {
switch (event.key) { switch (event.key) {
case " ": case " ":
getStrInd = ((getStrInd + 1) % getStrings.length); getStrInd = ((getStrInd + 1) % getStrings.length);
break; break;
case "c": case "c":
reverseColors(); light = !light;
setColors();
break; break;
case "+": case "+":
fontSizePx *= 1.2; fontSizePx *= 1.2;
@ -43,7 +63,7 @@
setSize(); setSize();
break; break;
case "0": case "0":
fontSizePx = fontSizeFallback; fontSizePx = fontSizeFallbackPx;
setSize(); setSize();
break; break;
case "*": case "*":
@ -54,39 +74,13 @@
fontSizePx /= 1.05; fontSizePx /= 1.05;
setSize(); setSize();
break; break;
} }
} }
function setTime() {
document.getElementById("time").innerHTML = getStrings[getStrInd]();
}
function setSize() {
document.getElementById("time").style.fontSize = fontSizePx + "px";
}
function reverseColors() {
if (light) { setDark(); } else { setLight(); }
}
function setDark() {
document.body.style.background = darkColor;
document.getElementById("time").style.color = lightColor;
light = false;
}
function setLight() {
document.body.style.background = lightColor;
document.getElementById("time").style.color = darkColor;
light = true;
}
</script> </script>
<style> <style>
#time { #time {
font-size: 16.0vw; font-family: monospace;
font-family: "Monoid";
} }
.container { .container {
position: absolute; position: absolute;