/* ========================
   FICHIER : animations.js
   VERSION AMELIOREE PAR EXPERT UI DESIGNER
   Description :
   Améliorations des animations pour une UX optimale.
   Ajout de modularité, optimisation de l'IntersectionObserver
   et gestion de l'accessibilité.
   ======================== */

document.addEventListener('DOMContentLoaded', () => {
    initializeAnimations();
    initializeCounters();
    initializeParallax();
});

/* ========================
   INITIALISATION DES ANIMATIONS AU SCROLL
======================== */
function initializeAnimations() {
    const observer = new IntersectionObserver((entries, observer) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                const target = entry.target;
                target.classList.add('animated');
                // Gestion des classes spécifiques
                if (target.classList.contains('fade-in')) {
                    target.style.opacity = '1';
                    target.style.transform = 'translateY(0)';
                }
                observer.unobserve(target);
            }
        });
    }, { threshold: 0.1 });

    document.querySelectorAll('.animate-on-scroll, .fade-in, .slide-in-left, .slide-in-right')
        .forEach(element => observer.observe(element));
}

/* ========================
   EFFETS DE HOVER SUR LES CARTES
======================== */
function handleCardHover(card, isHovering) {
    const icon = card.querySelector('.icon-animate');
    const overlay = card.querySelector('.card-overlay');

    const scale = isHovering ? 'scale(1.2) translateY(-10px)' : 'scale(1) translateY(0)';
    const opacity = isHovering ? '1' : '0';

    icon.style.transform = scale;
    overlay.style.opacity = opacity;
}

/* ========================
   INITIALISATION DES COMPTEURS ANIMÉS
======================== */
function initializeCounters() {
    const counterObserver = new IntersectionObserver((entries, observer) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                const counter = entry.target;
                const target = parseInt(counter.dataset.count);
                animateCounter(counter, target);
                observer.unobserve(counter);
            }
        });
    }, { threshold: 0.5 });

    document.querySelectorAll('.stat-item').forEach(stat => counterObserver.observe(stat));
}

function animateCounter(element, target) {
    const counter = element.querySelector('.counter');
    let current = 0;
    const steps = 50; // Nombre d'étapes d'animation
    const increment = target / steps;
    const duration = 2000; // Durée totale en ms
    const interval = duration / steps;

    const timer = setInterval(() => {
        current += increment;
        counter.textContent = Math.round(current);
        if (current >= target) {
            counter.textContent = target;
            clearInterval(timer);
        }
    }, interval);
}

/* ========================
   EFFET PARALLAXE
======================== */
function initializeParallax() {
    window.addEventListener('scroll', () => {
        document.querySelectorAll('[data-parallax="scroll"]').forEach(element => {
            const speed = parseFloat(element.dataset.speed) || 0.5;
            const offset = window.pageYOffset;
            element.style.backgroundPositionY = `${offset * speed}px`;
        });
    });
}

/* ========================
   CHARGEMENT DES BOUTONS AVEC ETAT LOADING
======================== */
function handleButtonClick(button) {
    if (button.classList.contains('loading')) return;

    button.classList.add('loading');
    button.disabled = true;

    const originalText = button.textContent;
    button.textContent = 'Chargement...';

    setTimeout(() => {
        button.classList.remove('loading');
        button.disabled = false;
        button.textContent = originalText;
    }, 1000);
}

/* ========================
   SMOOTH SCROLLING POUR ANCRES
======================== */
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
    anchor.addEventListener('click', (e) => {
        e.preventDefault();
        const target = document.querySelector(anchor.getAttribute('href'));
        if (target) {
            target.scrollIntoView({ behavior: 'smooth', block: 'start' });
        }
    });
});