// =============================================
// Dynamische Navigation
// Je nach Login-Status wird die Kopfzeile fuer
// alle Seiten mit passendem Markup aufgebaut.
// =============================================

document.addEventListener('DOMContentLoaded', () => {
    const CURRENT_USER_KEY = 'socialCookingCurrentUser';
    const navContainers = document.querySelectorAll('.nav-tab-links');
    const currentPage = (window.location.pathname.split('/').pop() || 'index.html').toLowerCase();

    // Beendet frueh, falls auf einer Seite keine Hauptnavigation vorhanden ist.
    if (!navContainers.length) {
        return;
    }

    // Liest den aktiven Benutzer robust aus localStorage.
    function getCurrentUser() {
        try {
            const stored = localStorage.getItem(CURRENT_USER_KEY);
            return stored ? JSON.parse(stored) : null;
        } catch (error) {
            console.error('Aktueller Benutzer konnte nicht gelesen werden.', error);
            return null;
        }
    }

    // Baut die Navigation fuer ausgeloggte Besucher.
    function buildLoggedOutNavigation() {
        const loginIsActive = currentPage === 'login.html';
        const signupIsActive = currentPage === 'signup.html';

        return `
            <a
                class="button-small auth-nav-button ${loginIsActive ? 'auth-nav-button--active' : 'auth-nav-button--default'}"
                href="login.html"
                aria-label="Login"
                ${loginIsActive ? 'aria-current="page"' : ''}
            >
                Login
            </a>
            <a
                class="button-small auth-nav-button ${signupIsActive ? 'auth-nav-button--active' : 'auth-nav-button--default'}"
                href="signup.html"
                aria-label="Signup"
                ${signupIsActive ? 'aria-current="page"' : ''}
            >
                Signup
            </a>
        `;
    }

    // Baut die Navigation fuer eingeloggte Benutzer.
    function buildLoggedInNavigation() {
        return `
            <a class="nav-tab" href="event_overview.html">Event finden</a>
            <a class="nav-tab" href="event_create.html">Event erstellen</a>
            <a class="button-small" href="my_profil.html" aria-label="Mein Profil">Mein Profil</a>
        `;
    }

    const currentUser = getCurrentUser();
    const nextMarkup = currentUser ? buildLoggedInNavigation() : buildLoggedOutNavigation();

    // Wendet das passende Markup auf alle vorhandenen Kopf-Navigationen an.
    navContainers.forEach(container => {
        container.innerHTML = nextMarkup;
    });
});