/**
 * app/assets/js/dashboard.js
 */

window.Dashboard = (function () {
    const modules = [
        { id: 'device_types', label: 'Geraetetypen', description: 'Geraetetypen und Port-Definitionen', url: '?module=device_types&action=list', icon: 'DT' },
        { id: 'devices', label: 'Geraete', description: 'Physische Geraete in Racks und Raeumen', url: '?module=devices&action=list', icon: 'DV' },
        { id: 'connections', label: 'Verbindungen', description: 'Kabel, Ports und VLANs', url: '?module=connections&action=list', icon: 'CN' },
        { id: 'floors', label: 'Stockwerke', description: 'Standorte, Gebaeude und Etagen', url: '?module=floors&action=list', icon: 'FL' },
        { id: 'racks', label: 'Racks', description: 'Racks und Positionierung', url: '?module=racks&action=list', icon: 'RK' },
        { id: 'infra', label: 'Infrastruktur', description: 'Patchpanels und Wandbuchsen', url: '?module=floor_infrastructure&action=list', icon: 'IF' }
    ];

    function init() {
        const container = document.querySelector('#dashboard-modules');
        if (container) {
            renderModules(container);
        }

        loadStats();
        showWarnings();
        renderRecentChanges();
    }

    function renderModules(container) {
        container.innerHTML = '';

        modules.forEach((module) => {
            const el = document.createElement('a');
            el.className = 'dashboard-tile';
            el.href = module.url;
            el.innerHTML = `
                <div class="dashboard-icon">${module.icon}</div>
                <div class="dashboard-content">
                    <h3>${module.label}</h3>
                    <p>${module.description}</p>
                </div>
            `;
            container.appendChild(el);
        });
    }

    function loadStats() {
        const stats = {
            devices: countRows('.device-list tbody tr'),
            connections: countRows('.connection-list tbody tr'),
            outlets: countRows('.infra-table tbody tr')
        };

        const target = document.querySelector('[data-dashboard-stats]');
        if (!target) {
            return;
        }

        target.textContent = `Geraete: ${stats.devices} | Verbindungen: ${stats.connections} | Infrastruktur-Eintraege: ${stats.outlets}`;
    }

    function showWarnings() {
        const target = document.querySelector('[data-dashboard-warnings]');
        if (!target) {
            return;
        }

        const warnings = [];
        if (countRows('.device-list tbody tr') === 0) {
            warnings.push('Noch keine Geraete vorhanden');
        }
        if (countRows('.connection-list tbody tr') === 0) {
            warnings.push('Noch keine Verbindungen vorhanden');
        }

        target.textContent = warnings.length ? warnings.join(' | ') : 'Keine offenen Warnungen erkannt';
    }

    function renderRecentChanges() {
        const target = document.querySelector('[data-dashboard-recent]');
        if (!target) {
            return;
        }

        target.textContent = 'Letzte Aenderungen werden serverseitig noch nicht protokolliert.';
    }

    function countRows(selector) {
        return document.querySelectorAll(selector).length;
    }

    return { init };
})();