https://selletonscales.com/cdn/shop/t/53/assets/lightbox.js?v=116354114233759933611782623121

1import"vendor.photoswipe";import"vendor.photoswipe-ui-default";import EventHandler from"util.events";const THUMBNAIL_ACTIVE_CLASS="thumbnail--active";export default class Lightbox{constructor(triggers,images,thumbnails,{events:{onOpen=()=>{},onClose=()=>{}}}){this.triggers=triggers,this.images=images,this.thumbnails=thumbnails,this.onOpen=onOpen,this.onClose=onClose,this.lightboxThumbnails=[],this.photoswipe=null,this.events=new EventHandler,this.items=this.getImageData(),this.lastFocusedElement=null,this.templateEl=this.getTemplateEl(),this.thumbScroller=this.templateEl.querySelector("[data-photoswipe-thumb-scroller]"),this.closeButton=this.templateEl.querySelector(".pswp__button--close"),this.scrollPrevButton=this.templateEl.querySelector("[data-scroll-prev]"),this.scrollNextButton=this.templateEl.querySelector("[data-scroll-next]"),this.triggers.forEach(trigger=>{trigger.addEventListener("click",this.triggerClick.bind(this))})}destroy(){this.events.unregisterAll();try{this.photoswipe?.destroy()}catch(e){if(!(e instanceof TypeError&&e.message.includes("Cannot read properties of null")))throw e}this.templateEl.remove()}initPhotoswipe(index=0){this.onOpen();let options={index,barsSize:{top:0,bottom:75},captionEl:!1,fullscreenEl:!1,zoomEl:!1,shareEl:!1,counterEl:!1,arrowEl:!1,preloaderEl:!1,closeOnScroll:!1,showHideOpacity:!0,history:!1,loop:!0,clickToCloseNonZoomable:!1,timeToIdle:!1,timeToIdleOutside:!1};this.thumbnails.length>1&&(options.getThumbBoundsFn=()=>{const pageYScroll=window.pageYOffset||document.documentElement.scrollTop,bounds=this.images[this.photoswipe.getCurrentIndex()].getBoundingClientRect();return{x:bounds.left,y:bounds.top+pageYScroll,w:bounds.width}}),this.photoswipe=new PhotoSwipe(this.templateEl,PhotoSwipeUI_Default,this.items,options),this.photoswipe.init(),this.thumbScroller.innerHTML="",this.thumbnails.length>1&&this.initThumbnails(index),this.onLoadAndOpen(index),this.photoswipe.listen("resize",()=>{this.photoswipe.close()}),this.photoswipe.listen("close",()=>{this.onClose(),this.cleanupFocusTrap()}),this.events.register(this.closeButton,"click",()=>this.photoswipe.close())}onLoadAndOpen(index=0){this.thumbnails.length>1?this.lightboxThumbnails[index].focus():(this.scrollPrevButton.disabled=!0,this.scrollNextButton.disabled=!0,this.closeButton.focus()),this.setFocusTrap(this.templateEl)}setFocusTrap(container){const focusableElements=container.querySelectorAll('button:not([disabled]), [href], [tabindex]:not([tabindex="-1"])'),firstFocusableElement=focusableElements[0],lastFocusableElement=focusableElements[focusableElements.length-1];this.events.register(container,"keydown",e=>{e.key==="Tab"&&(e.shiftKey?document.activeElement===firstFocusableElement&&(e.preventDefault(),lastFocusableElement.focus()):document.activeElement===lastFocusableElement&&(e.preventDefault(),firstFocusableElement.focus()))})}cleanupFocusTrap(){this.lastFocusedElement&&this.lastFocusedElement.focus()}initThumbnails(index=0){this.cloneThumbnails(),this.setActiveThumbnail(index),this.scrollToThumbnail(index),this.updateScrollButtons(),this.photoswipe.listen("afterChange",()=>{const index2=this.photoswipe.getCurrentIndex();this.setActiveThumbnail(index2),this.scrollToThumbnail(index2)}),this.events.register(this.scrollPrevButton,"click",()=>this.scroll("prev")),this.events.register(this.scrollNextButton,"click",()=>this.scroll("next")),this.events.register(this.thumbScroller,"scroll",this.updateScrollButtons.bind(this))}cloneThumbnails(){this.lightboxThumbnails=[],this.thumbnails.forEach((thumb,thumbIndex)=>{const newThumb=thumb.cloneNode(!0);newThumb.querySelector("img").setAttribute("loading","eager"),this.lightboxThumbnails.push(newThumb);const wrappedThumb=document.createElement("div");

1wrappedThumb.classList.add("product-gallery--media-thumbnail"),wrappedThumb.appendChild(newThumb),this.thumbScroller.appendChild(wrappedThumb),this.events.register(newThumb,"click",()=>{this.goTo(thumbIndex)}),this.events.register(newThumb,"keydown",e=>{(e.keyCode===13||e.keyCode===32)&&(e.preventDefault(),this.goTo(thumbIndex))})})}updateScrollButtons(){const{scrollLeft,scrollWidth,clientWidth}=this.thumbScroller,isAtStart=scrollLeft<=0,isAtEnd=scrollLeft>=scrollWidth-clientWidth;this.scrollPrevButton.disabled=isAtStart,this.scrollNextButton.disabled=isAtEnd}scroll(direction){const currentScroll=this.thumbScroller.scrollLeft,scrollAmount=400;let targetScroll;if(direction==="prev")targetScroll=Math.max(0,currentScroll-scrollAmount);else if(direction==="next"){const maxScroll=this.thumbScroller.scrollWidth-this.thumbScroller.clientWidth;targetScroll=Math.min(maxScroll,currentScroll+scrollAmount)}this.thumbScroller.scrollTo({left:targetScroll,behavior:"smooth"})}scrollToThumbnail(index){this.lightboxThumbnails[index].scrollIntoView({behavior:"smooth",block:"nearest",inline:"center"})}setActiveThumbnail(index){this.thumbScroller.querySelector(`.${THUMBNAIL_ACTIVE_CLASS}`)?.classList.remove(THUMBNAIL_ACTIVE_CLASS),this.lightboxThumbnails[index].classList.add(THUMBNAIL_ACTIVE_CLASS),this.lightboxThumbnails[index].focus()}goTo(index){this.photoswipe.goTo(index)}triggerClick(evt){const mediaId=evt.currentTarget.dataset.photoswipeTriggerFor,index=[...this.images].findIndex(media=>media.dataset.photoswipeId===mediaId);this.unload(),this.lastFocusedElement=evt.target,this.initPhotoswipe(index)}getTemplateEl(){const pswpEl=document.getElementById("pswp");if(pswpEl)return pswpEl;const templateEl=document.querySelector(".photoswipe-template");if(!templateEl){console.error("Photoswipe template not found");return}const clone=templateEl.content.cloneNode(!0);return document.body.appendChild(clone),document.getElementById("pswp")}getImageData(){return[...this.images].map(el=>({src:el.getAttribute("data-photoswipe-src"),w:el.getAttribute("data-photoswipe-width"),h:el.getAttribute("data-photoswipe-height")}))}unload(){this.events.unregisterAll(),this.cleanupFocusTrap()}}
2//# sourceMappingURL=/cdn/shop/t/53/assets/lightbox.js.map?v=116354114233759933611782623121