let miniImageWidth = document.querySelector(".showerImageMiniPreviewContent");
let miniImageWidthAll = document.querySelectorAll(".showerImageMiniPreviewContent")
let PreviewImageContainer = document.getElementById("PreviewImageContainer-id");
const technicalInformationSections = document.querySelectorAll(".technicalInformation");
const SpecificationsButtons = document.querySelectorAll(".SpecificationsButtons");
const miniBackBtnId = document.getElementById("miniBackBtnId");
const miniNextBtnId = document.getElementById("miniNextBtnId");
let miniImageWidthAllLength = 0;
const showerImageMiniPreviewContent = document.querySelectorAll(".showerImageMiniPreviewContent img");


showerImageMiniPreviewContent.forEach(gelenDeger => {

    gelenDeger.addEventListener("click", () => {

        document.getElementById("showerBigPicture").src = gelenDeger.getAttribute("src");
       
    })
});

let imagesTotal=0;

function nextImage() {
    if (imagesTotal > 0) {
      // Bir önceki görsele kenarlık kaldırma
      showerImageMiniPreviewContent[imagesTotal - 1].style.border = "none";

    } else {
      // Son görsele gelindiğinde, ilk görsele kenarlık kaldırma
      showerImageMiniPreviewContent[showerImageMiniPreviewContent.length - 1].style.border = "none";
    }
    
  
    // Sıradaki görsele kenarlık ekleme
    showerImageMiniPreviewContent[imagesTotal].style.border = "2px solid rgb(138 138 138)";

    document.getElementById("showerBigPicture").src = showerImageMiniPreviewContent[imagesTotal].getAttribute("src");
    PreviewImageContainer.scrollLeft += miniImageWidth.offsetWidth + 10;
    imagesTotal++;
    if (imagesTotal == showerImageMiniPreviewContent.length) {
      imagesTotal = 0;
      PreviewImageContainer.scrollLeft="0";
    }
  }

let autoNext=setInterval(nextImage,7000);

miniImageWidthAll.forEach(gelenDeger=>{
    gelenDeger.addEventListener("mousemove",()=>{
      clearInterval(autoNext);
    });
})

miniImageWidthAll.forEach(gelenDeger=>{
    gelenDeger.addEventListener("mouseleave",()=>{
     autoNext=setInterval(nextImage,7000);
    });
})

miniBackBtnId.addEventListener("click", () => {

    PreviewImageContainer.scrollLeft -= miniImageWidth.offsetWidth + 10;
})

miniNextBtnId.addEventListener("click", () => {
    PreviewImageContainer.scrollLeft += miniImageWidth.offsetWidth + 10;
})

const toggleSection = (sectionNumber) => {

    technicalInformationSections.forEach(gelenDeger => {
        gelenDeger.style.display = "none";
    })

    SpecificationsButtons.forEach(gelenDeger => {

        gelenDeger.style.backgroundColor = "#eee";
        gelenDeger.style.color = "#000";

    })
    const tiklananiBul = document.getElementById("section" + sectionNumber);
    const tiklananiBulButton = document.getElementById("buttonId-" + sectionNumber);
    tiklananiBul.style.display = "block";
    tiklananiBulButton.style.backgroundColor = "#20496b";
    tiklananiBulButton.style.color = "#fff";
}

let metin = document.getElementById("result").innerText; document.getElementById("result").innerHTML = "";
let metinArray = metin.split("");
let metinLength = metin.length;
let i = 0;
let s = 0;

const metinSlide = () => {
    if (i < metinLength) {
        document.getElementById("result").innerHTML += metinArray[i];
        document.getElementById("result").style.display = "block";
        i++;
    }
};
setInterval(metinSlide, 32);
//Büyütec Baslangici
const buyutec = document.getElementById('buyutec');
const showerBigPicture = document.getElementById('showerBigPicture');

showerBigPicture.addEventListener('mouseenter', function (e) {
    buyutec.style.display = 'block';
});

showerBigPicture.addEventListener('mousemove', function (e) {
    const rect = showerBigPicture.getBoundingClientRect();
    const mouseX = e.clientX - rect.left;
    const mouseY = e.clientY - rect.top;

    buyutec.style.top = `${mouseY}px`;
    buyutec.style.left = `${mouseX}px`;
    buyutec.style.backgroundImage = `url('${showerBigPicture.src}')`;
    buyutec.style.backgroundPosition = `-${mouseX * 2}px -${mouseY * 2}px`;
});
showerBigPicture.addEventListener('mouseleave', function () {
    buyutec.style.display = 'none';
});
//Büyütec Bitis