https://www.exalt.co.uk/cdn/shop/t/528/assets/product-form.js?v=149827545062933102261789785101

1import{Component}from"@theme/component";import{onAnimationEnd,preloadImage}from"@theme/utilities";import{ThemeEvents}from"@theme/events";import{cartPerformance}from"@theme/performance";import{morph}from"@theme/morph";export const ADD_TO_CART_TEXT_ANIMATION_DURATION=2e3;export function launchFlyToCart(sourceButton,image){const cartIcon=document.querySelector(".header-actions__cart-icon");if(!cartIcon||!sourceButton||!image)return;const sourceRect=sourceButton.getBoundingClientRect();if(!sourceRect.width||!sourceRect.height)return;const flyToCartElement=document.createElement("fly-to-cart");flyToCartElement.style.setProperty("background-image",`url(${image})`),flyToCartElement.source=sourceButton,flyToCartElement.destination=cartIcon,document.body.appendChild(flyToCartElement)}export function nearestCardImage(from){let node=from?.parentElement;for(let depth=0;node&&depth<8;depth+=1,node=node.parentElement)for(const img of node.querySelectorAll("img")){if(img.naturalWidth&&img.naturalWidth<40)continue;const src=img.currentSrc||img.src;if(src)return src}return null}export class AddToCartComponent extends Component{requiredRefs=["addToCartButton"];#animationTimeout;#cleanupTimeout;connectedCallback(){super.connectedCallback(),this.addEventListener("pointerenter",this.#preloadImage)}disconnectedCallback(){super.disconnectedCallback(),this.#animationTimeout&&clearTimeout(this.#animationTimeout),this.#cleanupTimeout&&clearTimeout(this.#cleanupTimeout),this.removeEventListener("pointerenter",this.#preloadImage)}disable(){this.refs.addToCartButton.disabled=!0}enable(){this.refs.addToCartButton.disabled=!1}handleClick(event){this.animateAddToCart(),event.target.closest(".quick-add-modal")||this.flyToCart()}#preloadImage=()=>{const image=this.dataset.productVariantMedia;image&&preloadImage(image)};flyToCart(){launchFlyToCart(this.refs.addToCartButton,this.dataset.productVariantMedia||nearestCardImage(this))}animateAddToCart(){const{addToCartButton}=this.refs;this.#animationTimeout&&clearTimeout(this.#animationTimeout),this.#cleanupTimeout&&clearTimeout(this.#cleanupTimeout),addToCartButton.classList.contains("atc-added")||addToCartButton.classList.add("atc-added"),this.#animationTimeout=setTimeout(()=>{this.#cleanupTimeout=setTimeout(()=>{this.refs.addToCartButton.classList.remove("atc-added")},10)},ADD_TO_CART_TEXT_ANIMATION_DURATION)}}customElements.get("add-to-cart-component")||customElements.define("add-to-cart-component",AddToCartComponent);class ProductFormComponent extends Component{requiredRefs=["variantId","liveRegion"];#abortController=new AbortController;connectedCallback(){super.connectedCallback();const{signal}=this.#abortController,target=this.closest(".shopify-section, dialog, product-card");target?.addEventListener(ThemeEvents.variantUpdate,this.#onVariantUpdate,{signal}),target?.addEventListener(ThemeEvents.variantSelected,this.#onVariantSelected,{signal})}disconnectedCallback(){super.disconnectedCallback(),this.#abortController.abort()}async handleSubmit(event){if(event.preventDefault(),this.refs.addToCartButtonContainer?.refs.addToCartButton?.getAttribute("disabled")==="true")return;let added=!1;this.dispatchEvent(new CustomEvent("cart-add-start",{bubbles:!0}));const cartDrawer=document.querySelector("cart-drawer-component");cartDrawer?.openForPendingAdd?.({source:this.refs.addToCartButtonContainer?.refs?.addToCartButton??this.querySelector('button[name="add"]')});try{const form=this.querySelector("form");if(!form)throw new Error("Product form element missing");const formData=new FormData(form),id=formData.get("id");if(!id)throw new Error("Form ID is required");const body=this.#convertFormDataToBody(formData);if(!window.cartController?.add){const error=new Error(`cart-controller.js is not loaded; no cart request was sent for variant ${id}`);console.error("[product-form]",error.message),window.ctrNotifyCartFailure("Sorry, your basket could not be updated. Please try again.","product-form",error);return}if(!(await window.cartController.add(body,{source:"product-form"})).ok)return;added=!0,this.#clearAddToCartError(),this.#announceAdded(),this.closest("quick-add-dialog")?.closeDialog?.()}catch(error){console.error("[product-form] add to cart failed",error),window.ctrNotifyCartFailure?.("Sorry, your basket could not be updated. Please try again.","product-form",error)}finally{cartDrawer?.clearPendingAdd?.(),this.dispatchEvent(new CustomEvent("cart-add-settle",{bubbles:!0,detail:{ok:added}})),cartPerformance.measureFromEvent("add:user-action",event)}}#clearAddToCartError(){const{addToCartTextError}=this.refs;addToCartTextError&&(addToCartTextError.classList.add("hidden"),addToCartTextError.removeAttribute("aria-live"))}#announceAdded(){const addToCartButton=this.refs.addToCartButtonContainer?.refs.addToCartButton;if(!addToCartButton)return;const addedText=addToCartButton.querySelector(".add-to-cart-text--added")?.textContent?.trim()||Theme.translations.added;this.#setLiveRegionText(addedText),setTimeout(()=>{this.#clearLiveRegionText()},5e3)}#convertFormDataToBody(formData,options={}){const{typeConversions={_dynamicBoxIndex:parseInt},propertiesPrefix="properties["}=options,body={properties:{}};return formData.forEach((value,key)=>{if(key.startsWith(propertiesPrefix)&&key.endsWith("]")){const propertyName=key.slice(propertiesPrefix.length,-1);typeConversions[propertyName]?body.properties[propertyName]=typeConversions[propertyName](value):body.properties[propertyName]=value}else body[key]=value}),body}#setLiveRegionText(text){const liveRegion=this.refs.liveRegion;liveRegion.textContent=text}#clearLiveRegionText(){const liveRegion=this.refs.liveRegion;liveRegion.textContent=""}#onVariantUpdate=event=>{if(event.detail.data.newProduct)this.dataset.productId=event.detail.data.newProduct.id;else if(event.detail.data.productId!==this.dataset.productId)return;const{variantId,addToCartButtonContainer}=this.refs,currentAddToCartButton=addToCartButtonContainer?.refs.addToCartButton,newAddToCartButton=event.detail.data.html.querySelector('[ref="addToCartButton"]');if(currentAddToCartButton&&(event.detail.resource==null||event.detail.resource.available==!1?(addToCartButtonContainer.disable(),this.refs.acceleratedCheckoutButtonContainer?.setAttribute("hidden","true")):(addToCartButtonContainer.enable(),this.refs.acceleratedCheckoutButtonContainer?.removeAttribute("hidden")),newAddToCartButton&&morph(currentAddToCartButton,newAddToCartButton),variantId.value=event.detail.resource.id??"",event.detail.resource)){const productVariantMedia=event.detail.resource.featured_media?.preview_image?.src;productVariantMedia&&addToCartButtonContainer?.setAttribute("data-product-variant-media",productVariantMedia+"&width=100")}};#onVariantSelected=()=>{this.refs.addToCartButtonContainer?.disable()}}customElements.get("product-form-component")||customElements.define("product-form-component",ProductFormComponent);class FlyToCart extends HTMLElement{source;destination;connectedCallback(){this.#animate()}#animate(){const rect=this.getBoundingClientRect(),sourceRect=this.source.getBoundingClientRect(),destinationRect=this.destination.getBoundingClientRect(),offset={x:rect.width/2,y:rect.height/2},startPoint={x:sourceRect.left+sourceRect.width/2-offset.x,y:sourceRect.top+sourceRect.height/2-offset.y},endPoint={x:destinationRect.left+destinationRect.width/2-offset.x,y:destinationRect.top+destinationRect.height/2-offset.y},controlPoint1={x:startPoint.x,y:startPoint.y-200},controlPoint2={x:endPoint.x-300,y:endPoint.y-100};let startTime=null;const duration=600;this.style.opacity="1";const animate=currentTime=>{startTime||(startTime=currentTime);const elapsed=currentTime-startTime,progress=Math.min(elapsed/duration,1),position=bezierPoint(progress,startPoint,controlPoint1,controlPoint2,endPoint);this.style.setProperty("--x",`${position.x}px`),this.style.setProperty("--y",`${position.y}px`);const scale=1-progress*.5;this.style.setProperty("--scale",`${scale}`),progress<1?requestAnimationFrame(animate):(this.style.opacity="0",onAnimationEnd(this,()=>this.remove()))};this.style.setProperty("--x",`${startPoint.x}px`),this.style.setProperty("--y",`${startPoint.y}px`),requestAnimationFrame(animate)}}function bezierPoint(t,p0,p1,p2,p3){const cX=3*(p1.x-p0.x),bX=3*(p2.x-p1.x)-cX,aX=p3.x-p0.x-cX-bX,cY=3*(p1.y-p0.y),bY=3*(p2.y-p1.y)-cY,aY=p3.y-p0.y-cY-bY,x=aX*Math.pow(t,3)+bX*Math.pow(t,2)+cX*t+p0.x,y=aY*Math.pow(t,3)+bY*Math.pow(t,2)+cY*t+p0.y;return{x,y}}customElements.get("fly-to-cart")||customElements.define("fly-to-cart",FlyToCart);
2//# sourceMappingURL=/cdn/shop/t/528/assets/product-form.js.map?v=149827545062933102261789785101