import './stimulus_bootstrap.js';
/*
 * Welcome to your app's main JavaScript file!
 *
 * We recommend including the built version of this JavaScript file
 * (and its CSS file) in your base layout (base.html.twig).
 */
// any CSS you import will output into a single css file (app.css in this case)
import './styles/app.css';

// --- Gestion du responsive de la barre de navigation (menu hamburger) --- //
document.addEventListener('click', (event) => {

    // Vérification : l'utilisateur a-t-il cliqué sur un élément interactif du menu ?
    const isClickOnButton = event.target.closest('#mobile-menu-button');
    const isClickOnLink = event.target.closest('#main-menu a');

    // Si le clic a lieu ailleurs sur la page, on arrête tout
    if (!isClickOnButton && !isClickOnLink) return;

    // Si l'utilisateur a bien cliqué sur un élément interactif, on récupère les éléments du DOM
    const menu = document.getElementById('main-menu');
    const btn = document.getElementById('mobile-menu-button');
    const iconClosed = document.getElementById('icon-menu-closed');
    const iconOpen = document.getElementById('icon-menu-open');

    // Option 1 : Clic sur le bouton hamburger
    if (isClickOnButton && menu) {
        menu.classList.toggle('hidden');
        iconClosed.classList.toggle('hidden');
        iconOpen.classList.toggle('hidden');

        btn.setAttribute('aria-expanded', !menu.classList.contains('hidden'));
        return;
    }

    // Option 2 : Clic sur un onglet du menu
    if (isClickOnLink && menu && !menu.classList.contains('hidden')) {
        menu.classList.add('hidden');
        iconClosed.classList.remove('hidden');
        iconOpen.classList.add('hidden');

        btn.setAttribute('aria-expanded', 'false');
    }
});