// Service Worker Registration for Offline Capability
if ('serviceWorker' in navigator) {
    window.addEventListener('load', () => {
        navigator.serviceWorker.register('/sw.js')
            .then(reg => {
                console.log('Service Worker registered');
                // Check for updates
                reg.onupdatefound = () => {
                    const installingWorker = reg.installing;
                    installingWorker.onstatechange = () => {
                        if (installingWorker.state === 'installed' && navigator.serviceWorker.controller) {
                            console.log('New content is available; please refresh.');
                        }
                    };
                };
            })
            .catch(err => console.log('Service Worker registration failed', err));
    });
}

// Online/Offline Status
window.addEventListener('online', updateOnlineStatus);
window.addEventListener('offline', updateOnlineStatus);

function updateOnlineStatus() {
    const status = navigator.onLine ? 'online' : 'offline';
    console.log('Status changed to:', status);
    
    // Create/Update UI indicator if it doesn't exist
    let indicator = document.getElementById('offline-indicator');
    if (!navigator.onLine) {
        if (!indicator) {
            indicator = document.createElement('div');
            indicator.id = 'offline-indicator';
            indicator.className = 'alert alert-warning fixed-bottom m-0 text-center rounded-0';
            indicator.style.zIndex = '9999';
            indicator.innerHTML = '<i class="bi bi-wifi-off me-2"></i> You are currently offline. Changes will be synced when you reconnect.';
            document.body.appendChild(indicator);
        }
    } else {
        if (indicator) {
            indicator.remove();
            // Show brief "Back online" message
            const onlineToast = document.createElement('div');
            onlineToast.className = 'alert alert-success fixed-bottom m-0 text-center rounded-0';
            onlineToast.style.zIndex = '9999';
            onlineToast.innerHTML = '<i class="bi bi-wifi me-2"></i> Back online! Syncing data...';
            document.body.appendChild(onlineToast);
            setTimeout(() => onlineToast.remove(), 3000);
        }
    }
}

// Initial check
document.addEventListener('DOMContentLoaded', () => {
    updateOnlineStatus();
    
    // Attendance Table Search (Re-initialize if present)
    const learnerSearch = document.getElementById('learnerSearch');
    if (learnerSearch) {
        learnerSearch.addEventListener('keyup', function() {
            let filter = this.value.toUpperCase();
            let rows = document.querySelector("#learnersTable tbody").rows;
            for (let i = 0; i < rows.length; i++) {
                let nameCol = rows[i].cells[0].textContent.toUpperCase();
                let idCol = rows[i].cells[2].textContent.toUpperCase();
                if (nameCol.indexOf(filter) > -1 || idCol.indexOf(filter) > -1) {
                    rows[i].style.display = "";
                } else {
                    rows[i].style.display = "none";
                }
            }
        });
    }

    // Attendance Toggle Feedback
    const tableRows = document.querySelectorAll('#learnersTable tbody tr');
    tableRows.forEach(row => {
        const inputs = row.querySelectorAll('input[type="radio"]');
        inputs.forEach(input => {
            input.addEventListener('change', () => {
                row.classList.add('table-light');
                setTimeout(() => row.classList.remove('table-light'), 500);
            });
        });
    });
});