notatio/static/build/darkmode.js

let darkModeEnabled = false; // Default to false

// Check if user preference for dark mode is stored in a cookie
const cookieValue = document.cookie;
if (cookieValue.indexOf('darkModeEnabled=true') !== -1) {
    darkModeEnabled = true;
} else {
    // Check if user preference for dark mode is set at the system level
    const prefersDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;
    if (prefersDarkMode) {
        darkModeEnabled = true;
    }
}

// Apply dark mode based on the user's preference
function applyDarkMode() {
    const theme = darkModeEnabled ? "dark" : "light";
    document.documentElement.setAttribute("data-bs-theme", theme);

    // Change the icon based on the theme
    const icon = darkModeEnabled ? "fa-sun" : "fa-moon";
    const iconElement = document.getElementById("darkModeIcon");
    iconElement.classList.remove(darkModeEnabled ? "fa-moon" : "fa-sun");
    iconElement.classList.add(icon);
}

// Toggle dark mode and store the preference in a cookie
function toggleDarkMode() {
    darkModeEnabled = !darkModeEnabled;
    const expirationDate = new Date();
    expirationDate.setFullYear(expirationDate.getFullYear() + 1);
    const cookieValue = `darkModeEnabled=${darkModeEnabled}; expires=${expirationDate.toUTCString()}`;
    document.cookie = cookieValue;
    applyDarkMode();
}

// Add event listener to the toggle button if it exists
const darkModeButton = document.getElementById("darkModeButton");
if (darkModeButton) {
    darkModeButton.addEventListener("click", toggleDarkMode);
}

// Apply dark mode on page load
applyDarkMode();