diff options
author | Daniel Weipert <code@drogueronin.de> | 2023-09-24 13:40:25 +0200 |
---|---|---|
committer | Daniel Weipert <code@drogueronin.de> | 2023-09-24 13:40:25 +0200 |
commit | fa00b957378a393f8edbfc98ef111d35d18ecb09 (patch) | |
tree | 654e7dc5414f7f2795dbe996d3e1570793a5b1b8 /views/components/timer.twig |
initial commit
Diffstat (limited to 'views/components/timer.twig')
-rw-r--r-- | views/components/timer.twig | 25 |
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> |