export default function initDeadlineDisplay() {
    document.querySelectorAll('[data-behaviour="deadline_display"]').forEach((span) => {
        const deadline = new Date(span.dataset.deadline)

        function update() {
            const remaining = Math.floor((deadline - new Date()) / 1000)
            const days = Math.floor(remaining / (60 * 60 * 24))
            const hours = Math.floor((remaining % (60 * 60 * 24)) / (60 * 60))
            const minutes = Math.floor((remaining % (60 * 60)) / 60)
            const seconds = remaining % 60
            let remainingText = ""
            if (days > 0) {
                if (days == 1) {
                    remainingText += `${days} dag, `
                } else {
                    remainingText += `${days} dagen, `
                }
            }
            if (days > 0 || hours > 0) {
                if (hours == 1) {
                    remainingText += `${hours} uur, `
                } else {
                    remainingText += `${hours} uren, `
                }
            }
            if (days > 0 || hours > 0 || minutes > 0) {
                if (minutes == 1) {
                  remainingText += `${minutes} minuut en `
                } else {
                  remainingText += `${minutes} minuten en `
                }
            }
            if (seconds == 1) {
                remainingText += `${seconds} seconde`
            } else {
                remainingText += `${seconds} seconden`
            }
            span.innerText =  remainingText
        }

        setInterval(update, 200)
    })
}