function createOverlay(image){const overlayImage=document.createElement("img");return overlayImage.setAttribute("src",`${image.src}`),overlay=document.createElement("div"),prepareOverlay(overlay,overlayImage),image.style.opacity="50%",toggleLoadingSpinner(image),overlayImage.onload=()=>{toggleLoadingSpinner(image),image.parentElement.insertBefore(overlay,image),image.style.opacity="100%"},overlay}function prepareOverlay(container,image){container.setAttribute("class","image-magnify-full-size"),container.setAttribute("aria-hidden","true"),container.style.backgroundImage=`url('${image.src}')`,container.style.backgroundColor="var(--gradient-background)"}function toggleLoadingSpinner(image){image.parentElement.parentElement.querySelector(".loading__spinner").classList.toggle("hidden")}function moveWithHover(image,event,zoomRatio){const ratio=image.height/image.width,container=event.target.getBoundingClientRect(),xPosition=event.clientX-container.left,yPosition=event.clientY-container.top,xPercent=`${xPosition/(image.clientWidth/100)}%`,yPercent=`${yPosition/(image.clientWidth*ratio/100)}%`;overlay.style.backgroundPosition=`${xPercent} ${yPercent}`,overlay.style.backgroundSize=`${image.width*zoomRatio}px`}function magnify(image,zoomRatio){const overlay2=createOverlay(image);overlay2.onclick=()=>overlay2.remove(),overlay2.onmousemove=event=>moveWithHover(image,event,zoomRatio),overlay2.onmouseleave=()=>overlay2.remove()}function enableZoomOnHover(zoomRatio){document.querySelectorAll(".image-magnify-hover").forEach(image=>{image.onclick=event=>{magnify(image,zoomRatio),moveWithHover(image,event,zoomRatio)}})}enableZoomOnHover(2);
//# sourceMappingURL=/cdn/shop/t/30/assets/magnify.js.map?v=137710018090829782941729889035
