README.md

@@ -37,3 +37,4 @@ Or alternatively with `/addwidget`:
 ```
 /addwidget https://goodtimer.lubiland.de/#2020-11-24T00:00+01:00
 ```
+

index.html

@@ -9,10 +9,10 @@
 <link rel="stylesheet" type="text/css" href="main.css?1602704189">
 
 
-∞∞ Days<br>
-∞∞ Hours<br>
-∞∞ Minutes<br>
-∞∞ Seconds<br>
+<span id="days">∞∞</span> Days<br>
+<span id="hours">∞∞</span> Hours<br>
+<span id="minutes">∞∞</span> Minutes<br>
+<span id="seconds">∞∞</span> Seconds<br>
 
 
 <script src="main.js?1602704189"></script>

main.js

@@ -1,9 +1,11 @@
+const target = new Date(location.hash.substr(1));
+
 const second = 1000;
 const minute = second*60;
 const hour = minute*60;
 const day = hour*24;
 
-const countdown = (target, heading) => {
+const update_countdown = () => {
     const now = new Date();
     const diff = target - now;
 
@@ -13,38 +15,15 @@ const countdown = (target, heading) => {
     timeleft.minutes = Math.trunc(diff%day%hour/minute);
     timeleft.seconds = Math.trunc(diff%day%hour%minute/second);
 
-    const formatted = Object.keys(timeleft).map(unit => {
+    Object.keys(timeleft).forEach((unit) => {
         // retrieve value, cast it to string and optionally pad it with a leading 0
-        return timeleft[unit]
+        const value = timeleft[unit]
         .toString()
         .padStart(2, '0');
-    });
 
-    if (heading === 1 || formatted.filter(timespan => timespan.substr(0, 1) == '-').length === 0) {
-        return `
-<span style="font-size:${Math.round(100 - 60 * (4 - 4 / heading) / 4)}%">
-${formatted[0]} Days<br>
-${formatted[1]} Hours<br>
-${formatted[2]} Minutes<br>
-${formatted[3]} Seconds<br>
-</span>
-`;
-    }
+        document.getElementById(unit).innerHTML = value;
+    });
 };
 
-const hash_date = new Date(location.hash.substr(1));
-const update_all = () => {
-    let i = 0;
-    const curDate = new Date();
-
-    document.body.innerHTML = location
-    .hash
-    .split('#')
-    .slice(1)
-    .map(fragment => new Date(fragment))
-    .sort((a, b) => b - a)
-    .map(date => countdown(date, ++i))
-    .join('');
-}
-update_all();
-setInterval(update_all, 500);
+update_countdown();
+setInterval(update_countdown, 500);