Slider Scroll Optimization

if ($('.overlay-slider-grid').length) {
    const $overlaySliderGrid = $('.overlay-slider-grid');
    const $overlayslider = $('.overlay-slider');
    const $mainparent = $overlaySliderGrid.find('.content-overlayslider');
    const $hoverItems = $mainparent.find('.hover-item');

    let currentIndex = 0;
    let isVisible = false;
    let scrollCooldown = false; // Prevents rapid fire

    const updateSlider = ($item) => {
        const newBg = $item.data('bg');
        $overlayslider.css('background-image', `url(${newBg})`);
        $item.find('.content, .description').addClass('active');
        $item.siblings().find('.content, .description').removeClass('active');
    };

    const changeSlide = (direction) => {
        if (scrollCooldown) return;

        if (direction === 'down' && currentIndex < $hoverItems.length - 1) {
            currentIndex++;
            updateSlider($hoverItems.eq(currentIndex));
        } else if (direction === 'up' && currentIndex > 0) {
            currentIndex--;
            updateSlider($hoverItems.eq(currentIndex));
        }

        scrollCooldown = true;
        setTimeout(() => scrollCooldown = false, 800); // Adjust delay for smoother transition
    };

    // Handle mouse wheel scroll
    $mainparent[0].addEventListener('wheel', function (e) {
        if (!isVisible) return;

        const delta = e.deltaY;

        if (delta > 0) {
            changeSlide('down');
        } else if (delta < 0) {
            changeSlide('up');
        }

        e.preventDefault(); // Prevent default scroll
    }, { passive: false });

    // Keyboard navigation
    $(document).on('keydown', function (e) {
        if (!isVisible) return;

        if (e.key === 'ArrowUp') {
            changeSlide('up');
        } else if (e.key === 'ArrowDown') {
            changeSlide('down');
        }
    });

    // Intersection Observer
    const observer = new IntersectionObserver((entries) => {
        entries.forEach((entry) => {
            isVisible = entry.isIntersecting;
            $mainparent.toggleClass('visible', isVisible);

            if (isVisible) {
                updateSlider($hoverItems.eq(currentIndex));
            }
        });
    }, {
        root: null,
        rootMargin: '0px',
        threshold: 0.5
    });

    observer.observe($overlaySliderGrid[0]);

    // Optional: Sync with scroll (if scrolling page should also control)
    $(window).on('scroll', function () {
        const scrollTop = $(window).scrollTop();
        const overlayOffset = $overlaySliderGrid.offset().top;
        const overlayHeight = $overlaySliderGrid.outerHeight();

        if (scrollTop >= overlayOffset && scrollTop <= overlayOffset + overlayHeight) {
            const newIndex = Math.floor((scrollTop - overlayOffset) / (overlayHeight / $hoverItems.length));

            if (newIndex !== currentIndex && newIndex >= 0 && newIndex < $hoverItems.length) {
                currentIndex = newIndex;
                updateSlider($hoverItems.eq(currentIndex));
            }
        }
    });
}