if(!customElements.get("media-gallery")){class MediaGallery extends HTMLElement{constructor(){super(),Shopify.designMode?setTimeout(()=>this.init(),200):this.init()}disconnectedCallback(){window.removeEventListener("on:debounced-resize",this.resizeHandler),this.resizeInitHandler&&window.removeEventListener("on:debounced-resize",this.resizeInitHandler),this.zoomInitHandler&&window.removeEventListener("on:debounced-resize",this.zoomInitHandler)}init(){this.section=this.closest(".js-product"),this.mediaGroupingEnabled=this.hasAttribute("data-media-grouping-enabled")&&this.getMediaGroupData(),this.stackedScroll=this.dataset.stackedScroll,this.stackedUnderline=this.dataset.stackedUnderline==="true"&&!this.mediaGroupingEnabled,this.isFeatured=this.dataset.isFeatured==="true",this.viewer=this.querySelector(".media-viewer"),this.thumbs=this.querySelector(".media-thumbs"),this.thumbsItems=this.querySelectorAll(".media-thumbs__item"),this.controls=this.querySelector(".media-ctrl"),this.prevBtn=this.querySelector('.media-ctrl__btn[name="prev"]'),this.nextBtn=this.querySelector('.media-ctrl__btn[name="next"]'),this.counterCurrent=this.querySelector(".media-ctrl__current-item"),this.counterTotal=this.querySelector(".media-ctrl__total-items"),this.liveRegion=this.querySelector(".media-gallery__status"),this.zoomLinks=this.querySelectorAll(".js-zoom-link"),this.loadingSpinner=this.querySelector(".loading-spinner"),this.xrButton=this.querySelector(".media-xr-button"),this.mediaGroupingEnabled&&this.setActiveMediaGroup(this.getMediaGroupFromOptionSelectors()),this.dataset.layout==="stacked"&&theme.mediaMatches.md?(this.resizeInitHandler=this.resizeInitHandler||this.initGallery.bind(this),window.addEventListener("on:debounced-resize",this.resizeInitHandler),this.setVisibleItems(),this.previousMediaItem=this.querySelector(".media-viewer__item.is-current-variant"),setTimeout(()=>this.customSetActiveMedia(this.previousMediaItem,this.stackedScroll==="always"),200)):this.initGallery(),this.zoomLinks&&(this.zoomInitHandler=this.zoomInitHandler||this.initZoom.bind(this),this.zoomEventListener=this.zoomEventListener||this.handleZoomMouseMove.bind(this),window.addEventListener("on:debounced-resize",this.zoomInitHandler),this.initZoom(),this.zoomLinks.forEach(el=>{el.addEventListener("click",evt=>{evt.preventDefault()})})),this.section.addEventListener("on:variant:change",this.onVariantChange.bind(this))}onVariantChange(evt){if(this.mediaGroupingEnabled&&this.setActiveMediaGroup(this.getMediaGroupFromOptionSelectors()),evt.detail.variant&&evt.detail.variant.featured_media){const variantMedia=this.viewer.querySelector(`[data-media-id="${evt.detail.variant.featured_media.id}"]`);this.customSetActiveMedia(variantMedia,!0)}}getMediaGroupFromOptionSelectors(){const optionSelectors=this.section.querySelectorAll(".option-selector");if(optionSelectors.length>this.getMediaGroupData().groupOptionIndex){const selector=optionSelectors[this.getMediaGroupData().groupOptionIndex];return selector.dataset.selectorType==="dropdown"?selector.querySelector(".custom-select__btn").textContent.trim():selector.querySelector("input:checked").value}return null}getMediaGroupData(){if(typeof this.variantMediaData>"u"){const dataEl=this.querySelector(".js-data-variant-media");this.variantMediaData=dataEl?JSON.parse(dataEl.textContent):!1}return this.variantMediaData}getMediaGroupMap(){if(!this.mediaGroupMap){this.mediaGroupMap={groups:{}};const variantMediaData=this.getMediaGroupData();let currentMediaOptionName=!1;this.viewerItems=this.querySelectorAll(".media-viewer__item"),this.viewerItems.forEach(item=>{for(let i=0;i<variantMediaData.variantMedia.length;i+=1)parseInt(item.dataset.mediaId,10)===variantMediaData.variantMedia[i].mediaId&&currentMediaOptionName!==variantMediaData.variantMedia[i].option&&(currentMediaOptionName=variantMediaData.variantMedia[i].option);if(currentMediaOptionName){this.mediaGroupMap.groups[currentMediaOptionName]||(this.mediaGroupMap.groups[currentMediaOptionName]={name:currentMediaOptionName,items:[]});const groupItem={main:item};this.thumbs&&(groupItem.thumb=this.thumbs.querySelector(`[data-media-id="${item.dataset.mediaId}"].media-thumbs__item`)),this.mediaGroupMap.groups[currentMediaOptionName].items.push(groupItem)}}),this.mediaGroupMap.groupFromItem=item=>{const groups=Object.keys(this.mediaGroupMap.groups);for(let i=0;i<groups;i+=1){const group=groups[i];for(let j=0;j<this.mediaGroupMap.groups[group].items.length;j+=1)if(this.mediaGroupMap.groups[group].items[j]===item)return this.mediaGroupMap.groups[group]}return this.mediaGroupMap.groups[Object.keys(this.mediaGroupMap.groups)[0]]}}return this.mediaGroupMap}setActiveMediaGroup(groupName){const mediaGroupMap=this.getMediaGroupMap(),selectedGroup=groupName?mediaGroupMap.groups[groupName]:mediaGroupMap.groupFromItem(this.currentItem);if(selectedGroup){if(this.currentGroup!==selectedGroup){this.currentGroup=selectedGroup,this.viewerItems.forEach(item=>{item.style.display="none",item.classList.remove("media-viewer__item--single")}),this.thumbsItems.forEach(item=>{item.style.display="none"});let currentItemIsVisible=!1;selectedGroup.items.forEach(item=>{item.main.style.display="",item.thumb&&(item.thumb.style.display=""),item.main===this.currentItem&&(currentItemIsVisible=!0)}),this.setVisibleItems(),currentItemIsVisible||this.customSetActiveMedia(selectedGroup.items[0].main,!0),selectedGroup.items.length===1&&selectedGroup.items[0].main.classList.add("media-viewer__item--single")}}else this.viewerItems.forEach(item=>{item.style.display=""}),this.thumbsItems.forEach(item=>{item.style.display=""})}initGallery(){if(this.setVisibleItems(),this.visibleItems.length<=1)return;this.viewerItemOffset=this.visibleItems[1].offsetLeft-this.visibleItems[0].offsetLeft,this.currentIndex=Math.round(this.viewer.scrollLeft/this.viewerItemOffset),this.currentItem=this.visibleItems[this.currentIndex],this.addListeners(),this.thumbs&&this.currentItem&&(this.currentThumb=this.thumbs.querySelector(`[data-media-id="${this.currentItem.dataset.mediaId}"]`)),!this.isFeatured&&document.hasFocus()&&this.viewer.querySelectorAll('.product-image[loading="lazy"]').forEach((img,index)=>{setTimeout(()=>{img.loading="eager"},500*(index+1))});const currentItem=this.querySelector(".media-viewer__item.is-current-variant");this.customSetActiveMedia(currentItem,!0)}addListeners(){this.viewer.addEventListener("scroll",this.handleScroll.bind(this)),this.controls&&this.controls.addEventListener("click",this.handleNavClick.bind(this)),this.thumbs&&this.thumbs.addEventListener("click",this.handleThumbClick.bind(this)),this.resizeHandler=this.resizeHandler||this.handleResize.bind(this),window.addEventListener("on:debounced-resize",this.resizeHandler)}initZoom(){this.zoomLinks.forEach(el=>{const zoomWidth=Number(el.querySelector(".zoom-image").dataset.originalWidth||0),imageWidth=el.querySelector(".product-image").getBoundingClientRect().width;theme.mediaMatches.md&&zoomWidth-75>imageWidth?(el.addEventListener("mousemove",this.zoomEventListener),el.classList.remove("pointer-events-none")):(el.removeEventListener("mousemove",this.zoomEventListener),el.classList.add("pointer-events-none"))})}handleZoomMouseMove(evt){const hoverElem=evt.currentTarget,zoomImage=hoverElem.querySelector(".js-zoom-image");if(zoomImage.dataset.src){this.loadingSpinner.classList.remove("loading-spinner--out");const img=new Image;img.src=zoomImage.dataset.src,img.onload=()=>{zoomImage.src=img.src,hoverElem.classList.remove("media--zoom-not-loaded"),this.loadingSpinner.classList.add("loading-spinner--out")},zoomImage.removeAttribute("data-src")}try{const offsetX=evt.offsetX?evt.offsetX:evt.touches[0].pageX,offsetY=evt.offsetY?evt.offsetY:evt.touches[0].pageY,x=offsetX/zoomImage.offsetWidth*100,y=offsetY/zoomImage.offsetHeight*100;zoomImage.style.objectPosition=`${x}% ${y}%`}catch{}}handleScroll(){const newIndex=Math.round(this.viewer.scrollLeft/this.viewerItemOffset);newIndex!==this.currentIndex&&this.visibleItems[1].offsetLeft-this.visibleItems[0].offsetLeft===this.viewerItemOffset&&this.customSetActiveMedia(this.visibleItems[newIndex],!1)}handleNavClick(evt){if(!evt.target.matches(".media-ctrl__btn"))return;const itemToShow=evt.target===this.nextBtn?this.visibleItems[this.currentIndex+1]:this.visibleItems[this.currentIndex-1];this.viewer.scrollTo({left:itemToShow.offsetLeft,behavior:"smooth"})}handleThumbClick(evt){const thumb=evt.target.closest("[data-media-id]");if(!thumb)return;const itemToShow=this.querySelector(`[data-media-id="${thumb.dataset.mediaId}"]`);this.customSetActiveMedia(itemToShow),MediaGallery.playActiveMedia(itemToShow)}handleResize(){this.viewerItemOffset=this.visibleItems[1].offsetLeft-this.visibleItems[0].offsetLeft,this.thumbs&&this.currentThumb&&this.checkThumbVisibilty(this.currentThumb)}setActiveMedia(){}customSetActiveMedia(mediaItem,scrollToItem=!0){if(mediaItem!==this.currentItem){if(window.pauseAllMedia(this),this.currentItem=mediaItem,this.currentIndex=this.visibleItems.indexOf(this.currentItem),this.dataset.layout==="stacked"&&theme.mediaMatches.md){if(this.stackedUnderline&&(this.previousMediaItem&&this.previousMediaItem.classList.remove("is-active"),mediaItem.classList.add("is-active"),this.previousMediaItem=mediaItem),this.stackedScroll!=="never"){const y=mediaItem.getBoundingClientRect().top+document.documentElement.scrollTop-150;Math.abs(y-document.documentElement.scrollTop)>300&&window.scrollTo({top:y<100?0:y,behavior:"smooth"})}return}scrollToItem&&this.viewer.scrollTo({left:this.currentItem.offsetLeft}),this.thumbs&&this.setActiveThumb(),this.controls&&(this.prevBtn&&(this.prevBtn.disabled=this.currentIndex===0),this.nextBtn&&(this.nextBtn.disabled=this.currentIndex===this.visibleItems.length-1),this.counterCurrent&&(this.counterCurrent.textContent=this.currentIndex+1)),this.announceLiveRegion(this.currentItem,this.currentIndex+1),this.xrButton&&mediaItem.dataset.mediaType==="model"&&(this.xrButton.dataset.shopifyModel3dId=mediaItem.dataset.mediaId)}}setActiveThumb(){this.currentThumb=this.thumbs.querySelector(`[data-media-id="${this.currentItem.dataset.mediaId}"]`);const btn=this.currentThumb.querySelector("button");this.thumbs.querySelectorAll(".media-thumbs__btn").forEach(el=>{el.classList.remove("is-active"),el.removeAttribute("aria-current")}),btn.classList.add("is-active"),btn.setAttribute("aria-current","true"),this.checkThumbVisibilty(this.currentThumb)}setVisibleItems(){this.viewerItems=this.querySelectorAll(".media-viewer__item"),this.visibleItems=Array.from(this.viewerItems).filter(el=>el.clientWidth>0),this.counterTotal&&(this.counterTotal.textContent=this.visibleItems.length)}checkThumbVisibilty(thumb){const scrollPos=this.thumbs.scrollLeft,lastVisibleThumbOffset=this.thumbs.clientWidth+scrollPos,thumbOffset=thumb.offsetLeft;(thumbOffset+thumb.clientWidth>lastVisibleThumbOffset||thumbOffset<scrollPos)&&this.thumbs.scrollTo({left:thumbOffset,behavior:"smooth"})}announceLiveRegion(mediaItem,index){mediaItem.querySelector(".media-viewer img")&&(this.liveRegion.setAttribute("aria-hidden","false"),this.liveRegion.innerHTML=theme.strings.imageAvailable.replace("[index]",index),setTimeout(()=>{this.liveRegion.setAttribute("aria-hidden","true")},2e3))}static playActiveMedia(mediaItem){window.pauseAllMedia();const deferredMedia=mediaItem.querySelector("deferred-media");deferredMedia&&deferredMedia.loadContent()}}customElements.define("media-gallery",MediaGallery)}
//# sourceMappingURL=/cdn/shop/t/15/assets/media-gallery.js.map?v=46185889428595610521710950269