summaryrefslogtreecommitdiff
path: root/views/components/timer.twig
diff options
context:
space:
mode:
authorDaniel Weipert <code@drogueronin.de>2023-09-24 13:40:25 +0200
committerDaniel Weipert <code@drogueronin.de>2023-09-24 13:40:25 +0200
commitfa00b957378a393f8edbfc98ef111d35d18ecb09 (patch)
tree654e7dc5414f7f2795dbe996d3e1570793a5b1b8 /views/components/timer.twig
initial commit
Diffstat (limited to 'views/components/timer.twig')
-rw-r--r--views/components/timer.twig25
1 files changed, 25 insertions, 0 deletions
diff --git a/views/components/timer.twig b/views/components/timer.twig
new file mode 100644
index 0000000..97977da
--- /dev/null
+++ b/views/components/timer.twig
@@ -0,0 +1,25 @@
+<span class="timer" data-time="{{ time }}">
+ <span class="timer__time"></span>
+</span>
+<script>
+document.addEventListener('DOMContentLoaded', function (ev) {
+ const timer = document.querySelector('.timer[data-time="{{ time }}"] .timer__time');
+ const time = new Date('{{ time }}');
+
+ const interval = setInterval(setTime, 1000);
+ function setTime() {
+ let diff = time - new Date();
+ if (diff <= -1) {
+ clearInterval(interval);
+ }
+
+ const hh = Math.floor(diff/1000/60/60);
+ diff -= hh*1000*60*60;
+ const mm = Math.floor(diff/1000/60);
+ diff -= mm*1000*60;
+ const ss = Math.floor(diff/1000);
+ timer.innerHTML = `${('00' + hh).slice(-2)}:${('00' + mm).slice(-2)}:${('00' + ss).slice(-2)}`;
+ }
+ setTime();
+});
+</script>