1customElements.get("media-gallery")||customElements.define("media-gallery",class extends HTMLElement{constructor(){super(),this.elements={mains:this.querySelectorAll(".product-media-main"),thumbnails:this.querySelectorAll(".product-media-thumbnail:not(.product-media-thumbnail-variant), .product-media-thumbnail:first-child"),slideshow:this.querySelector(".product-media-main-wrapper")},this.elements.thumbnails.length&&this.elements.thumbnails.forEach(thumbnail=>{const mediaToggle=thumbnail.querySelector("button");mediaToggle&&mediaToggle.addEventListener("click",this.setActiveMedia.bind(this,mediaToggle.dataset.mediaId,!1))})}connectedCallback(){window.Flickity&&(this.elements.slideshow.style.display="block",this.flickity=new Flickity(this.elements.slideshow,{autoPlay:!1,cellAlign:"center",groupCells:!1,contain:!0,resize:!0,draggable:!0,prevNextButtons:!1,cellSelector:".product-media",initialIndex:0,pageDots:!1,wrapAround:!0,accessibility:!1,adaptiveHeight:!0,watchCSS:!0,on:{change:index=>{const{element}=this.flickity.cells[index],mediaId=element.dataset.mediaId;this.setActiveMedia(mediaId)}}}))}setActiveMedia(mediaId,prepend){const activeMainMedia=[...this.elements.mains].find(element=>element.classList.contains("is-active")),nextMainMedia=[...this.elements.mains].find(element=>element.dataset.mediaId===mediaId.toString()),index=[...this.elements.mains].indexOf(nextMainMedia);this.flickity&&this.flickity.select(index),this.elements.thumbnails.forEach(thumb=>{thumb.classList.remove("is-active")});const thumbnail=[...this.elements.thumbnails].find(element=>element.dataset.mediaId===mediaId.toString());activeMainMedia.classList.remove("is-active"),nextMainMedia.classList.add("is-active"),thumbnail?.classList.add("is-active"),this.playActiveMedia(nextMainMedia),thumbnail&&(prepend?thumbnail.parentElement.prepend(thumbnail):thumbnail.scrollIntoView({behavior:"smooth",block:"nearest"}))}playActiveMedia(activeItem){window.pauseAllMedia();const deferredMedia=activeItem.querySelector("deferred-media");deferredMedia&&deferredMedia.loadContent(!1)}}),customElements.get("media-zoom")||customElements.define("media-zoom",class extends HTMLElement{constructor(){super(),this.mode=this.getAttribute("data-mode"),this.zoomWidth=parseInt(this.getAttribute("data-zoom-width"),10)||150,this.zoomHeight=parseInt(this.getAttribute("data-zoom-height"),10)||150,this.lastEvent=null,this.onMouseEnter=this.onMouseEnter.bind(this),this.onMouseMove=this.onMouseMove.bind(this),this.onMouseLeave=this.onMouseLeave.bind(this),this.onClick=this.onClick.bind(this)}connectedCallback(){this.innerHTML+='<div class="media-zoom-zoom-area"></div>',this.original=this.querySelector("img"),this.zoomArea=this.querySelector(".media-zoom-zoom-area"),this.original.addEventListener("mouseenter",this.onMouseEnter),this.original.addEventListener("mousemove",this.onMouseMove),this.original.addEventListener("mouseleave",this.onMouseLeave),this.mode==="lightbox_zoom_hover"&&this.original.addEventListener("click",this.onClick),this.zoomArea.style.width=`${this.zoomWidth}px`,this.zoomArea.style.height=`${this.zoomHeight}px`,this.preview=document.createElement("div"),this.preview.classList.add("media-zoom-preview-area","color-background-2"),this.preview.innerHTML='<div class="spinner"></div>',document.body.appendChild(this.preview)}disconnectedCallback(){this.original.removeEventListener("mouseenter",this.onMouseEnter),this.original.removeEventListener("mousemove",this.onMouseMove),this.original.removeEventListener("mouseleave",this.onMouseLeave),document.body.removeChild(this.preview)}onMouseEnter(){this.zoomArea.style.display="block",this.preview.style.display="block";const previewSize=`${this.original.offsetWidth+25}px`;if(this.preview.style.width=previewSize,this.preview.style.height=previewSize,!this.previewImg)this.previewImg=new Image,this.previewImg.src=this.getAttribute("data-zoom"),this.previewImg.onload=()=>{const zoomScale=this.original.offsetWidth/this.zoomWidth;this.previewImg.style.width=`${(this.original.offsetWidth+25)*zoomScale}px`,this.previewImg.style.height=`${(this.original.offsetHeight+25)*zoomScale}px`,this.preview.innerHTML="",this.preview.appendChild(this.previewImg),this.lastEvent&&this.original.dispatchEvent(new MouseEvent("mousemove",this.lastEvent))};else{const zoomScale=this.original.offsetWidth/this.zoomWidth;this.previewImg.style.width=`${(this.original.offsetWidth+25)*zoomScale}px`,this.previewImg.style.height=`${(this.original.offsetHeight+25)*zoomScale}px`}}onMouseMove(e){this.lastEvent=e;const{left,top,width,height}=this.original.getBoundingClientRect(),x=e.pageX-(window.pageXOffset+left),y=e.pageY-(window.pageYOffset+top),zoomX=Math.min(Math.max(x-this.zoomWidth/2,0),width-this.zoomWidth),zoomY=Math.min(Math.max(y-this.zoomHeight/2,0),height-this.zoomHeight);if(this.zoomArea.style.left=`${zoomX}px`,this.zoomArea.style.top=`${zoomY}px`,this.preview.style.position="fixed",this.preview.style.left=`${left+width+50}px`,this.preview.style.top=`${top-14}px`,this.previewImg&&this.previewImg.complete){const previewX=zoomX/width*this.previewImg.width,previewY=zoomY/height*this.previewImg.he
1ight;this.previewImg.style.transform=`translate(${-previewX}px, ${-previewY}px)`}}onMouseLeave(){this.zoomArea.style.display="none",this.preview.style.display="none"}onClick(){const sectionId=this.getAttribute("data-modal-id"),modal=document.querySelector(`#ProductModal-${sectionId}`);modal&&modal.show(this)}}); 2//# sourceMappingURL=/cdn/shop/t/4/assets/media-gallery.js.map?v=26618068748454338881773963733
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.