/**
 * single-tsprodukt.js
 *
 * Enthält alle JavaScript-Funktionen für die Produktseite:
 * - Slider-Funktionalität (inklusive Swipe- und Drag-Unterstützung)
 * - "Mehr Infos anzeigen"/"Weniger Infos anzeigen"
 * - Bild-Zoom-Effekt
 * - Einfache Slidersteuerung (zweiter Block)
 */

jQuery(document).ready(function($) {
	setTimeout(function() {
    $(".tsprodukt-slider-container").addClass("tsbilder-sichtbar");
	}, 100);

    // --- Slider-Funktionalität inklusive Swipe & Drag ---
    let currentIndex = 0;
    const images = $(".tsprodukt_image");
    const totalImages = images.length;
    const paginationContainer = $(".tsprodukt-pagination");

    function showImage(index) {
        images.hide();
        $(images[index]).fadeIn();
        $(".tsprodukt-pagination .dot").removeClass("active");
        $(".tsprodukt-pagination .dot").eq(index).addClass("active");
    }

    // Pagination-Dots dynamisch erstellen
    for (let i = 0; i < totalImages; i++) {
        paginationContainer.append("<span class='dot' data-index='" + i + "'></span>");
    }

    showImage(currentIndex);

    $(".tsprodukt-pagination .dot").click(function() {
        currentIndex = $(this).data("index");
        showImage(currentIndex);
    });

    $(".tsprodukt-next").click(function() {
        currentIndex = (currentIndex + 1) % totalImages;
        showImage(currentIndex);
    });

    $(".tsprodukt-prev").click(function() {
        currentIndex = (currentIndex - 1 + totalImages) % totalImages;
        showImage(currentIndex);
    });

    // Touch-Support
    let touchStartX = null, touchStartY = null;
    $(".tsprodukt-slider-container").on("touchstart", function(e) {
        const touch = e.originalEvent.touches[0];
        touchStartX = touch.clientX;
        touchStartY = touch.clientY;
    });
    $(".tsprodukt-slider-container").on("touchmove", function(e) {
        if (!touchStartX || !touchStartY) return;
        const touch = e.originalEvent.touches[0];
        const diffX = touchStartX - touch.clientX;
        const diffY = touchStartY - touch.clientY;
        if (Math.abs(diffX) > Math.abs(diffY)) {
            e.preventDefault();
        }
    });
    $(".tsprodukt-slider-container").on("touchend", function(e) {
        if (touchStartX === null || touchStartY === null) return;
        const touch = e.originalEvent.changedTouches[0];
        const diffX = touchStartX - touch.clientX;
        if (Math.abs(diffX) > 50) {
            diffX > 0 ? $(".tsprodukt-next").click() : $(".tsprodukt-prev").click();
        }
        touchStartX = touchStartY = null;
    });

    // Maus-Drag-Unterstützung
    let isDragging = false, dragStartX = null;
    $(".tsprodukt-slider-container").on("mousedown", function(e) {
        isDragging = true;
        dragStartX = e.clientX;
    });
    $(".tsprodukt-slider-container").on("mousemove", function(e) {
        if (!isDragging) return;
        e.preventDefault();
    });
    $(".tsprodukt-slider-container").on("mouseup", function(e) {
        if (!isDragging) return;
        isDragging = false;
        const dragDiff = dragStartX - e.clientX;
        if (dragDiff > 50) {
            $(".tsprodukt-next").click();
        } else if (dragDiff < -50) {
            $(".tsprodukt-prev").click();
        }
        dragStartX = null;
    });
    $(".tsprodukt-slider-container").on("mouseleave", function() {
        isDragging = false;
        dragStartX = null;
    });
});

/* "Mehr Infos anzeigen" / "Weniger Infos anzeigen" */
document.addEventListener("DOMContentLoaded", function() {
    const showMoreButton = document.querySelector(".tsprodukt-show-more");
    const showLessButton = document.querySelector(".tsprodukt-show-less");
    const hiddenItems = document.querySelectorAll(".tsprodukt-hidden");

    if (showMoreButton && showLessButton) {
        showMoreButton.addEventListener("click", function() {
            hiddenItems.forEach(item => item.classList.remove("tsprodukt-hidden"));
            showMoreButton.style.display = "none";
            showLessButton.style.display = "inline-block";
        });
        showLessButton.addEventListener("click", function() {
            hiddenItems.forEach(item => item.classList.add("tsprodukt-hidden"));
            showLessButton.style.display = "none";
            showMoreButton.style.display = "inline-block";
        });
    }
});

/* Bild-Zoom-Effekt */
document.addEventListener("DOMContentLoaded", function() {
    const zoomContainers = document.querySelectorAll(".tsprodukt_image");
    zoomContainers.forEach(container => {
        const zoomImage = container.querySelector("img");
        container.addEventListener("mousemove", function(event) {
            const rect = container.getBoundingClientRect();
            const x = event.clientX - rect.left;
            const y = event.clientY - rect.top;
            zoomImage.style.transformOrigin = `${x}px ${y}px`;
            zoomImage.style.transform = "scale(2.5)";
        });
        container.addEventListener("mouseleave", function() {
            zoomImage.style.transformOrigin = "center center";
            zoomImage.style.transform = "scale(1)";
        });
    });
});

/* Einfacher Slider (zweiter Block, falls benötigt) */
jQuery(document).ready(function($) {
    let currentIndex = 0;
    const images = $(".tsprodukt_image");
    const totalImages = images.length;
    function showImage(index) {
        images.hide();
        $(images[index]).show();
    }
    $(".tsprodukt-next").click(function() {
        currentIndex = (currentIndex + 1) % totalImages;
        showImage(currentIndex);
    });
    $(".tsprodukt-prev").click(function() {
        currentIndex = (currentIndex - 1 + totalImages) % totalImages;
        showImage(currentIndex);
    });
    showImage(currentIndex);
});
