diff --git a/time.html b/time.html index bf68c26..0e8e62e 100644 --- a/time.html +++ b/time.html @@ -9,8 +9,11 @@ const darkColor = "#000000"; const lightColor = "#ffffff"; const fontSizeFallbackPx = 300; const intervalMillisec = 200; +const bigFontSizeFactor = 1.2; +const smallFontSizeFactor = 1.05; let light = false; +let help = false; let fontSizePx = fontSizeFallbackPx; let getStrings = [ function(){return (new Date()).toTimeString().split(" ")[0];}, @@ -39,8 +42,11 @@ function setSize() { } function setColors() { - document.body.style.background = light ? lightColor : darkColor; - document.getElementById("time").style.color = light ? darkColor : lightColor; + const txt = light ? darkColor : lightColor; + const back = light ? lightColor : darkColor; + document.body.style.background = back; + document.body.style.color = txt; + document.getElementById("time").style.color = txt; } document.addEventListener("keypress", keyPress); @@ -55,11 +61,11 @@ function keyPress(event) { setColors(); break; case "+": - fontSizePx *= 1.2; + fontSizePx *= bigFontSizeFactor; setSize(); break; case "-": - fontSizePx /= 1.2; + fontSizePx /= bigFontSizeFactor; setSize(); break; case "0": @@ -67,19 +73,30 @@ function keyPress(event) { setSize(); break; case "*": - fontSizePx *= 1.05; + fontSizePx *= smallFontSizeFactor; setSize(); break; case "_": - fontSizePx /= 1.05; + fontSizePx /= smallFontSizeFactor; setSize(); break; + case "h": + toggleHelp(); + break; + } +} + +function toggleHelp() { + help = !help; + let elements = document.getElementsByClassName("help"); + for (let element of elements) { + element.style.display = help ? "block" : "none"; } }