1import"@archetype-themes/scripts/config";import"@archetype-themes/scripts/helpers/utils";class ImageCompare extends HTMLElement{constructor(){super(),this.el=this,this.sectionId=this.dataset.sectionId,this.button=this.querySelector("[data-button]"),this.draggableContainer=this.querySelector("[data-draggable]"),this.primaryImage=this.querySelector("[data-primary-image]"),this.secondaryImage=this.querySelector("[data-secondary-image]"),this.calculateSizes(),this.active=!1,this.currentX=0,this.initialX=0,this.xOffset=0,this.buttonOffset=this.button.offsetWidth/2,this.el.addEventListener("touchstart",this.dragStart,!1),this.el.addEventListener("touchend",this.dragEnd,!1),this.el.addEventListener("touchmove",this.drag,!1),this.el.addEventListener("mousedown",this.dragStart,!1),this.el.addEventListener("mouseup",this.dragEnd,!1),this.el.addEventListener("mousemove",this.drag,!1),window.on("resize",theme.utils.debounce(250,()=>{this.calculateSizes(!0)})),document.addEventListener("shopify:section:load",event=>{event.detail.sectionId===this.sectionId&&this.primaryImage!==null&&this.calculateSizes()})}calculateSizes(hasResized=!1){this.active=!1,this.currentX=0,this.initialX=0,this.xOffset=0,this.buttonOffset=this.button.offsetWidth/2,this.elWidth=this.el.offsetWidth,this.button.style.transform=`translate(-${this.buttonOffset}px, -50%)`,this.primaryImage&&(this.primaryImage.style.width=`${this.elWidth}px`),hasResized&&(this.draggableContainer.style.width=`${this.elWidth/2}px`)}dragStart(e){e.type==="touchstart"?this.initialX=e.touches[0].clientX-this.xOffset:this.initialX=e.clientX-this.xOffset,e.target===this.button&&(this.active=!0)}dragEnd(){this.initialX=this.currentX,this.active=!1}drag(event){this.active&&(event.preventDefault(),event.type==="touchmove"?this.currentX=event.touches[0].clientX-this.initialX:this.currentX=event.clientX-this.initialX,this.xOffset=this.currentX,this.setTranslate(this.currentX,this.button))}setTranslate(xPos,el){let newXpos=xPos-this.buttonOffset,newVal=this.elWidth/2+xPos;const boundaryPadding=50,XposMin=(this.elWidth/2+this.buttonOffset)*-1,XposMax=this.elWidth/2-this.buttonOffset;newXpos<XposMin+boundaryPadding?(newXpos=XposMin+boundaryPadding,newVal=boundaryPadding):newXpos>XposMax-boundaryPadding&&(newXpos=XposMax-boundaryPadding,newVal=this.elWidth-boundaryPadding),el.style.transform=`translate(${newXpos}px, -50%)`,this.draggableContainer.style.width=`${newVal}px`}}customElements.define("image-compare",ImageCompare); 2//# sourceMappingURL=/cdn/shop/t/134/assets/section-image-compare.js.map?v=25526173009852246331787799525
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.