<script>
let time = $state({ h:0, m:0, s:0, pm: false });
const start = new Date();
function setDates() {
const now = new Date();
const diffS = ((now - start) / 1000);
const diffM = diffS / 60;
const diffH = diffM / 60;
const pm = now.getHours() >= 12;
const h = start.getHours() / 12 + (diffH / 12);
const m = start.getMinutes() / 60 + (diffM / 60);
const s = (start.getSeconds() / 60) + (diffS / 60);
time = { h, m, s, pm };
}
setDates();
$effect(() => {
let timeout;
(function inc() {
timeout = setTimeout(inc, 1000);
setDates();
})();
return () => clearTimeout(timeout);
});
</script>
<div
style:--h="{time.h}"
style:--m="{time.m}"
style:--s="{time.s}"