/**
 * Global configuration handler for UI elements
 * - Updates Topbar Logo based on device type
 * - Shows/Hides "Screen" sidebar tab based on device type
 * - Updates sidebar device name
 * - Shows hotspot badge in sidebar when in hotspot mode
 *
 * Fetches config at window.onload (not DOMContentLoaded) to avoid
 * saturating the browser's 6-connection-per-domain limit.
 */
(function() {
    let config = null;

    // Observe DOM changes to apply config when sidebar/topbar are loaded
    const observer = new MutationObserver(() => {
        if (config) applyConfig();
    });
    observer.observe(document.body, { childList: true, subtree: true });

    // Fetch config after all initial resources are loaded
    window.addEventListener('load', () => {
        fetch('launcher.php?type=get_config_sqlite')
            .then(response => response.json())
            .then(data => {
                config = data;
                window._nebuleairConfig = data;
                applyConfig();
                document.dispatchEvent(new CustomEvent('nebuleair-config-ready', { detail: data }));
            })
            .catch(error => console.error('Error loading config:', error));
    });

    function applyConfig() {
        if (!config) return;

        const isModuleAirPro = (config.device_type === 'moduleair_pro' || config.type === 'moduleair_pro');

        // 1. Topbar Logo Logic
        const logo = document.getElementById('topbar-logo');
        if (logo && isModuleAirPro) {
            if (!logo.src.includes('logoModuleAir.png')) {
                logo.src = 'assets/img/logoModuleAir.png';
            }
        }

        // 2. Sidebar Screen Tab Logic
        const navScreenElements = document.querySelectorAll('.nav-screen-item');
        if (navScreenElements.length > 0) {
            navScreenElements.forEach(navScreen => {
                if (isModuleAirPro) {
                    if (navScreen.style.display === 'none') {
                        navScreen.style.display = 'flex';
                    }
                } else {
                    if (navScreen.style.display !== 'none') {
                        navScreen.style.display = 'none';
                    }
                }
            });
        }

        // 3. Sidebar device name
        if (config.deviceName) {
            document.querySelectorAll('.sideBar_sensorName').forEach(el => {
                el.textContent = config.deviceName;
            });
            document.title = config.deviceName;
        }

        // 4. Hotspot badge in sidebar
        document.querySelectorAll('.sidebar-hotspot-badge').forEach(badge => {
            badge.style.display = (config.WIFI_status === 'hotspot') ? '' : 'none';
        });
    }
})();