// Check if the browser supports service workers and notifications
if ('serviceWorker' in navigator && 'Notification' in window) {
    // Register the service worker
    navigator.serviceWorker.register('/service-worker.js')
    .then(function(registration) {
        console.log('Service Worker Registered', registration);
    })
    .catch(function(error) {
        console.error('Service Worker Registration Failed:', error);
    });

    // Request permission for notifications
    Notification.requestPermission().then(function(permission) {
        if (permission === 'granted') {
            console.log('Notification permission granted');
        } else {
            console.log('Notification permission denied');
        }
    });
} else {
    console.log('Service Workers or Notifications are not supported in this browser.');
// Function to fetch alerts from the server every 2 seconds
function fetchAlerts() {
    fetch('alerts.php')
        .then(response => response.json())
        .then(data => {
            // Update the alerts section with the new alerts
            updateAlertList(data);
        })
        .catch(error => {
            console.error('Error fetching alerts:', error);
        });
}

// Function to update the alert list on the page
function updateAlertList(alerts) {
    const alertContainer = document.getElementById('alert-container');
    alertContainer.innerHTML = ''; // Clear existing alerts

    // Loop through the fetched alerts and display them
    alerts.forEach(alert => {
        const alertElement = document.createElement('div');
        alertElement.classList.add('alert');
        alertElement.innerHTML = `
            <h4>${alert.type}</h4>
            <p>${alert.message}</p>
            <small>${alert.timestamp}</small>
        `;
        alertContainer.appendChild(alertElement);
    });
}

// Start polling every 2 seconds
setInterval(fetchAlerts, 2000);

// Call fetchAlerts initially to load the alerts when the page loads
fetchAlerts();


}