/* ===========================================================
   ReliefMap
   Dashboard Controller
   Author : Vigneshan S
   Year : 2026
=========================================================== */

"use strict";

/* ===========================================================
   DASHBOARD ELEMENTS
=========================================================== */

const hospitalElement = document.getElementById("hospitals");
const foodElement = document.getElementById("food");
const shelterElement = document.getElementById("shelters");
const volunteerElement = document.getElementById("volunteers");

/* ===========================================================
   DEMO DATA
=========================================================== */

const DEMO_STATS = {

    Hospitals: 12,

    "Food Centers": 8,

    Shelters: 6,

    Volunteers: 315

};

/* ===========================================================
   ANIMATE COUNTER
=========================================================== */

function animateCounter(element, target) {

    if (!element) return;

    let current = 0;

    const increment = Math.max(1, Math.ceil(target / 80));

    const timer = setInterval(() => {

        current += increment;

        if (current >= target) {

            current = target;

            clearInterval(timer);

        }

        element.textContent = formatNumber(current);

    }, 20);

}

/* ===========================================================
   UPDATE DASHBOARD
=========================================================== */

function updateDashboard(stats) {

    animateCounter(
        hospitalElement,
        stats.Hospitals || 0
    );

    animateCounter(
        foodElement,
        stats["Food Centers"] || 0
    );

    animateCounter(
        shelterElement,
        stats.Shelters || 0
    );

    animateCounter(
        volunteerElement,
        stats.Volunteers || 0
    );

    updateDashboardTime();

}

/* ===========================================================
   LOAD DASHBOARD
=========================================================== */

async function loadDashboard() {

    showLoader();

    try {

        if (
            typeof API !== "undefined" &&
            typeof API.getStats === "function"
        ) {

            const response = await API.getStats();

            if (response && response.data) {

                updateDashboard(response.data);

            } else {

                updateDashboard(DEMO_STATS);

            }

        } else {

            updateDashboard(DEMO_STATS);

        }

    }

    catch (error) {

        console.warn("Backend unavailable. Loading demo data.");

        updateDashboard(DEMO_STATS);

    }

    finally {

        hideLoader();

    }

}

/* ===========================================================
   LAST UPDATED
=========================================================== */

function updateDashboardTime() {

    const element = document.getElementById("lastUpdated");

    if (!element) return;

    element.textContent = formatTime(new Date());

}

/* ===========================================================
   REFRESH BUTTON
=========================================================== */

const dashboardRefreshButton =
document.getElementById("refreshMap");

if (dashboardRefreshButton) {

    dashboardRefreshButton.addEventListener(

        "click",

        loadDashboard

    );

}

/* ===========================================================
   CARD HOVER
=========================================================== */

document.querySelectorAll(".dashboard-cards .card")

.forEach(card => {

    card.addEventListener("mouseenter", () => {

        card.style.transform =
        "translateY(-10px) scale(1.03)";

    });

    card.addEventListener("mouseleave", () => {

        card.style.transform = "";

    });

});

/* ===========================================================
   QUICK ACTIONS
=========================================================== */

document.querySelectorAll(".action-card")

.forEach(card => {

    card.addEventListener("click", () => {

        const title =
        card.querySelector("h3")?.textContent ||
        "Action";

        showToast(

            `${title} selected`,

            "info"

        );

    });

});

/* ===========================================================
   AUTO REFRESH
=========================================================== */

function startDashboardRefresh() {

    if (
        typeof CONFIG !== "undefined" &&
        CONFIG.AUTO_REFRESH
    ) {

        setInterval(

            loadDashboard,

            CONFIG.REFRESH_INTERVAL

        );

    }

}

/* ===========================================================
   INITIALIZE
=========================================================== */

document.addEventListener(

    "DOMContentLoaded",

    () => {

        loadDashboard();

        startDashboardRefresh();

    }

);

/* ===========================================================
   END
=========================================================== */

console.log("✅ Dashboard Ready");