reveil/ui/src/lib/components/CycleCounter.svelte

<script>
 import { createEventDispatcher, onMount, onDestroy } from 'svelte';

 export let begins = null;
 export let ends;

 const dispatch = createEventDispatcher();

 let interval;
 onMount(() => {
     if (!begins) {
         interval = setInterval(() => {
             begins = new Date();
             if (begins > ends) {
                 dispatch("reload")
             }
         }, 15000);
         begins = new Date();
     }
 });
 onDestroy(() => {
     if (interval) {
         clearInterval(interval);
     }
 });

 export { className as class };
 let className = 'text-muted';
</script>

{#if begins && ends}
    <span class="{className}">
        (dans {Math.trunc((ends.getTime()-begins.getTime())/5400000)}&nbsp;cycles + {Math.trunc(((ends.getTime()-begins.getTime())%5400000)/60000)}&nbsp;min)
    </span>
{/if}