// Blazor Server Integration Script
document.addEventListener('DOMContentLoaded', async function() {
    console.log('Blazor: DOM Content Loaded');

    // Loading screen is visible by default (no display:none in HTML)
    // This eliminates the blank white screen on initial page load
    const loadingScreen = document.getElementById('pwa-loading-screen');
    console.log('Blazor: Loading screen visible, starting Blazor Server...');

    // Blazor Server is available on all Admin pages, so always start it
    // The blazor.server.js script is already loaded in _Layout.cshtml
    try {
        // Start Blazor Server with reconnection UI
        await Blazor.start({
            reconnectionOptions: {
                maxRetries: 8,
                retryIntervalMilliseconds: 2000
            },
            reconnectionHandler: {
                onConnectionDown: () => {
                    console.log('Blazor: Connection lost, attempting to reconnect...');
                    showReconnectingUI();
                },
                onConnectionUp: () => {
                    console.log('Blazor: Reconnected successfully');
                    hideReconnectingUI();
                }
            }
        });

        console.log('Blazor: Started successfully, hiding loading screen');
        hideLoadingScreen();

    } catch (error) {
        console.error('Blazor: Failed to start:', error);
        hideLoadingScreen();
    }
});

// Loading screen management
function hideLoadingScreen() {
    const loadingScreen = document.getElementById('pwa-loading-screen');
    if (loadingScreen && loadingScreen.style.display !== 'none') {
        console.log('Blazor: Hiding loading screen');
        loadingScreen.classList.add('fade-out');

        setTimeout(() => {
            loadingScreen.style.display = 'none';
        }, 500);
    }
}

// Reconnection UI for Blazor Server
function showReconnectingUI() {
    let reconnectUI = document.getElementById('blazor-reconnect-ui');

    if (!reconnectUI) {
        reconnectUI = document.createElement('div');
        reconnectUI.id = 'blazor-reconnect-ui';
        reconnectUI.className = 'alert alert-warning';
        reconnectUI.style.cssText = `
            position: fixed;
            top: 20px;
            left: 50%;
            transform: translateX(-50%);
            z-index: 9999;
            min-width: 300px;
            text-align: center;
        `;
        reconnectUI.innerHTML = `
            <i class="fas fa-exclamation-triangle me-2"></i>
            <strong>Connection lost</strong><br>
            <small>Attempting to reconnect...</small>
        `;
        document.body.appendChild(reconnectUI);
    }
}

function hideReconnectingUI() {
    const reconnectUI = document.getElementById('blazor-reconnect-ui');
    if (reconnectUI) {
        reconnectUI.remove();
    }
}

// Helper function to navigate to Blazor components from MVC
window.navigateToBlazor = function(componentPath) {
    window.location.href = '/blazor#' + componentPath;
};

// Export functions for use by other scripts
window.hideBlazorLoadingScreen = hideLoadingScreen;
window.showBlazorReconnectingUI = showReconnectingUI;
window.hideBlazorReconnectingUI = hideReconnectingUI;