#include utility.js

const MakaiDevHome = () => {
    const digitalClock = $q('.php-time-digital');
    const analogClock  = $q('.php-time-analog');
    const dateZone     = $q('.php-time-date');
    const digHours     = digitalClock.querySelector('.php-time-digital-hours');
    const digSeparator = digitalClock.querySelector('.php-time-digital-separator');
    const digMinutes   = digitalClock.querySelector('.php-time-digital-minutes');
    const angHours     = analogClock.querySelector('.clock-hand-hours');
    const angMinutes   = analogClock.querySelector('.clock-hand-minutes');
    const angSeconds   = analogClock.querySelector('.clock-hand-seconds');
    const dateWeek     = dateZone.querySelector('.php-date-week');
    const dateDay      = dateZone.querySelector('.php-date-day');
    const dateMonth    = dateZone.querySelector('.php-date-month');
    const dateYear     = dateZone.querySelector('.php-date-year');

    homeInterval = setInterval(() => {
        if(!document.body.contains(digitalClock)) {
            clearInterval(homeInterval);
            homeInterval = undefined;
            return;
        }

        const time = new Date;

        let dHour = time.getHours();
        let dMin  = time.getMinutes();

        if(dHour < 10)
            dHour = '0' + dHour;
        if(dMin < 10)
            dMin = '0' + dMin;

        dateWeek.textContent = (() => {
            const wd = new Date(time.getTime());
            wd.setHours(0, 0, 0, 0);
            wd.setDate(wd.getDate() + 3 - (wd.getDay() + 6) % 7);
            const week1 = new Date(wd.getFullYear(), 0, 4);
            return 1 + Math.round(((wd.getTime() - week1.getTime()) / 86400000 - 3 + (week1.getDay() + 6) % 7) / 7);
        })();

        dateDay.textContent = time.getDate();
        dateMonth.textContent = time.getMonth() + 1;
        dateYear.textContent = time.getFullYear();

        digHours.textContent = dHour;
        digMinutes.textContent = dMin;
        digSeparator.classList[time.getSeconds() % 2 ? 'add' : 'remove']('php-time-digital-separator-hidden');

        const rSec  = time.getSeconds() / 60;
        const rMin  = (time.getMinutes() + Math.min(.99, rSec)) / 60;
        const rHour = (time.getHours() + Math.min(.99, rMin)) / 12;

        angHours.style.setProperty('--hand-rotation', (rHour * 360).toString() + 'deg');
        angMinutes.style.setProperty('--hand-rotation', (rMin * 360).toString() + 'deg');
        angSeconds.style.setProperty('--hand-rotation', (rSec * 360).toString() + 'deg');
    }, 200);
};