https://lokoe.fr/scripts/learn_scripts.js

1/**
2 * Lokoe Learn Page - Scripts
3 * Gestion du menu mobile et des interactions
4 */
5
6document.addEventListener('DOMContentLoaded', function() {
7    // Mobile menu toggle
8    initMobileMenu();
9    
10    // Dropdown menu for mobile
11    initDropdownMenu();
12    
13    // Header scroll effect
14    const header = document.querySelector('.header');
15    if (header) {
16        window.addEventListener('scroll', function() {
17            if (window.scrollY > 50) {
18                header.classList.add('scrolled');
19            } else {
20                header.classList.remove('scrolled');
21            }
22        });
23    }
24    
25    // Initialize AOS animations
26    if (typeof AOS !== 'undefined') {
27        AOS.init({
28            duration: 800,
29            easing: 'ease-in-out',
30            once: true,
31            mirror: false
32        });
33    }
34});
35
36// Fonction pour initialiser le menu mobile
37function initMobileMenu() {
38    const menuToggle = document.querySelector('.nav-toggle');
39    const navMenu = document.querySelector('.nav-menu');
40    const body = document.body;
41    
42    if (menuToggle && navMenu) {
43        // Supprimer les écouteurs d'événements existants pour éviter les doublons
44        const newMenuToggle = menuToggle.cloneNode(true);
45        menuToggle.parentNode.replaceChild(newMenuToggle, menuToggle);
46        
47        // Ajouter le nouvel écouteur d'événement
48        newMenuToggle.addEventListener('click', function() {
49            this.classList.toggle('active');
50            navMenu.classList.toggle('active');
51            body.classList.toggle('menu-open'); // Ajouter/supprimer une classe au body pour le fond noir
52        });
53    }
54}
55
56// Fonction pour initialiser les menus déroulants
57function initDropdownMenu() {
58    const dropdownItems = document.querySelectorAll('.dropdown');
59    
60    dropdownItems.forEach(item => {
61        const dropdownToggle = item.querySelector('.dropdown-toggle');
62        
63        if (dropdownToggle) {
64            // Supprimer les écouteurs d'événements existants
65            const newDropdownToggle = dropdownToggle.cloneNode(true);
66            dropdownToggle.parentNode.replaceChild(newDropdownToggle, dropdownToggle);
67            
68            // Ajouter le nouvel écouteur d'événement
69            newDropdownToggle.addEventListener('click', function(e) {
70                e.preventDefault();
71                e.stopPropagation();
72                
73                // Ajouter/supprimer la classe active pour l'animation de l'icône en mode mobile
74                const dropdownIcon = this.querySelector('.dropdown-icon');
75                if (dropdownIcon) {
76                    dropdownIcon.classList.toggle('rotated');
77                }
78                
79                item.classList.toggle('active');
80            });
81        }
82    });
83}