import { defineStore } from 'pinia';

export const useHeaderStore = defineStore('header', {
    state: () => ({
        isHeaderVisible: true,
        isAutoHideEnabled: false,
        lastScrollY: 0,
        scrollDirection: 'up'
    }),

    getters: {
        shouldShowHeader: (state) => {
            // Si l'auto-hide n'est pas activé, toujours afficher le header
            if (!state.isAutoHideEnabled) {
                return true;
            }

            // Si l'auto-hide est activé, suivre la visibilité
            return state.isHeaderVisible;
        }
    },

    actions: {
        enableAutoHide() {
            this.isAutoHideEnabled = true;
        },

        disableAutoHide() {
            this.isAutoHideEnabled = false;
            this.isHeaderVisible = true; // Toujours visible quand désactivé
        },

                updateScrollDirection(scrollY) {
            // Éviter les calculs inutiles si pas d'auto-hide
            if (!this.isAutoHideEnabled) {
                this.lastScrollY = scrollY;
                return;
            }

            // Détecter la direction du scroll avec un seuil pour éviter les micro-mouvements
            const scrollDifference = Math.abs(scrollY - this.lastScrollY);

            if (scrollDifference < 5) {
                // Mouvement trop petit, on ignore
                return;
            }

            if (scrollY > this.lastScrollY && scrollY > 100) {
                // Scroll vers le bas et suffisamment de scroll
                if (this.scrollDirection !== 'down') {
                    this.scrollDirection = 'down';
                    this.isHeaderVisible = false;
                }
            } else if (scrollY < this.lastScrollY) {
                // Scroll vers le haut
                if (this.scrollDirection !== 'up') {
                    this.scrollDirection = 'up';
                    this.isHeaderVisible = true;
                }
            }

            this.lastScrollY = scrollY;
        },

        showHeader() {
            this.isHeaderVisible = true;
        },

        hideHeader() {
            this.isHeaderVisible = false;
        }
    }
});