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

106
time.html
View file

@ -1,38 +1,58 @@
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<script>
let light = false;
let darkColor = "#000000";
let lightColor = "#ffffff";
const fontSizeFallback = 300;
let fontSizePx = 300;
let getStrings = [
<head>
<title>time</title>
<meta charset="UTF-8">
<script>
const darkColor = "#000000";
const lightColor = "#ffffff";
const fontSizeFallbackPx = 300;
const intervalMillisec = 200;
let light = false;
let fontSizePx = fontSizeFallbackPx;
let getStrings = [
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];},
function(){const a = (new Date()).toTimeString().split(" ")[0].split(":"); return a[1];},
function(){const a = (new Date()).toTimeString().split(" ")[0].split(":"); return a[2];},
];
let getStrInd = 0;
];
let getStrInd = 0;
document.addEventListener("keypress", keyPress);
function load() {
setLight();
function load() {
setTime();
setSize();
setInterval(setTime, 200);
}
setColors();
setInterval(setTime, intervalMillisec);
}
function keyPress(event) {
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) {
switch (event.key) {
case " ":
getStrInd = ((getStrInd + 1) % getStrings.length);
break;
case "c":
reverseColors();
light = !light;
setColors();
break;
case "+":
fontSizePx *= 1.2;
@ -43,7 +63,7 @@
setSize();
break;
case "0":
fontSizePx = fontSizeFallback;
fontSizePx = fontSizeFallbackPx;
setSize();
break;
case "*":
@ -54,39 +74,13 @@
fontSizePx /= 1.05;
setSize();
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>
<style>
</script>
<style>
#time {
font-size: 16.0vw;
font-family: "Monoid";
font-family: monospace;
}
.container {
position: absolute;
@ -96,11 +90,11 @@
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
</style>
</head>
<body onload="load();">
<div class="container">
</style>
</head>
<body onload="load();">
<div class="container">
<span id="time"></span>
</div>
</body>
</div>
</body>
</html>