(() => {

    const SLIDER_ID = "portfolio";
    const TRIGGER_SELECTOR = ".slider-trigger";

    let slider = null;
    let trigger = null;
    let isAnimating = false;

    let startX = 0;
    let startY = 0;


    /**
     * Bricks Splide Instanz holen
     */
    function getSlider() {
        return window.bricksData?.splideInstances?.[SLIDER_ID] || null;
    }


    /**
     * Slider bewegen
     */
    function moveSlider(direction) {

        if (!slider || isAnimating) return;

        isAnimating = true;

        if (direction === "next") {
            slider.go(">");
        }

        if (direction === "prev") {
            slider.go("<");
        }

    }


    /**
     * Initialisierung
     */
    function init() {

        slider = getSlider();
        trigger = document.querySelector(TRIGGER_SELECTOR);

        if (!slider || !trigger) {
            requestAnimationFrame(init);
            return;
        }


        /**
         * Nach Slide-Wechsel wieder freigeben
         */
        slider.on("moved", () => {
            isAnimating = false;
        });


        /**
         * SCROLL / MAUSRAD
         */
        trigger.addEventListener(
            "wheel",
            (e) => {

                e.preventDefault();

                if (isAnimating) return;

                // Vertikale Scrollrichtung
                if (Math.abs(e.deltaY) < 5) return;

                if (e.deltaY > 0) {
                    moveSlider("next");
                } else {
                    moveSlider("prev");
                }

            },
            { passive: false }
        );


        /**
         * DRAG START
         */
        trigger.addEventListener(
            "pointerdown",
            (e) => {

                startX = e.clientX;
                startY = e.clientY;

            }
        );


        /**
         * DRAG ENDE
         */
        trigger.addEventListener(
            "pointerup",
            (e) => {

                const diffX = e.clientX - startX;
                const diffY = e.clientY - startY;

                // Mindestbewegung
                if (Math.abs(diffY) < 50) return;

                // Nur vertikale Drags verwenden
                if (Math.abs(diffY) < Math.abs(diffX)) return;


                if (diffY < 0) {
                    moveSlider("next");
                } else {
                    moveSlider("prev");
                }

            }
        );


        /**
         * Verhindert Kontextmenü / Browser Drag
         */
        trigger.addEventListener("dragstart", (e) => {
            e.preventDefault();
        });

    }


    window.addEventListener("DOMContentLoaded", init);

})();

.project-slide-content {
    opacity: 1;
    transition: opacity 0.6s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity;
}

function initProjectHover() {

    const contents = document.querySelectorAll('.project-slide-content');

    if (!contents.length) return;

    const resetOpacity = () => {
        contents.forEach(item => {
            item.style.opacity = '1';
        });
    };

    contents.forEach(content => {

        content.addEventListener('mouseenter', () => {

            contents.forEach(item => {
                item.style.opacity = item === content ? '1' : '0.8';
            });

        });

        content.addEventListener('mouseleave', resetOpacity);

    });

}


// Init
if (document.readyState === 'loading') {

    document.addEventListener('DOMContentLoaded', initProjectHover);

} else {

    initProjectHover();

}