https://www.chemicalguys.com/cdn/shop/t/5/assets/wls-product-form.js?v=157749123406109565911786959505

1if(!customElements.get("wls-product-form")){class WLSProductForm extends HTMLElement{constructor(){super(),this.classes={inputQuantity:'input[name="quantity"]',inputVariantId:'input[name="id"]',inputSellingPlan:'input[name="selling_plan"]',inputPurchaseType:'input[name="purchase-type"]',productFormFrequency:"wls-product-form-frequency",totalPrice:"js-total-price",totalCompareAtPrice:"js-total-compare-at-price",frequencyPrice:"js-frequency-price",frequencyCompareAtPrice:"js-frequency-compare-at-price",loading:"loading",submitButton:'button[type="submit"]',errorMessage:"js-error-message",wlsForm:"js-wls-product-form"},this.purchaseType={OTP:"one-time",SUB:"subscription"},this.boundHandleInputChange=this._handleInputChange.bind(this),this.boundHandleSubmit=this._handleSubmit.bind(this),this.boundHandleMutation=this._handleMutation.bind(this)}get elements(){return{form:this.querySelector("form"),quantityInput:this.querySelector(this.classes.inputQuantity),variantIdInput:this.querySelector(this.classes.inputVariantId),sellingPlanInput:this.querySelector(this.classes.inputSellingPlan),purchaseTypeInputs:this.querySelectorAll(this.classes.inputPurchaseType),productFormFrequency:this.querySelector(this.classes.productFormFrequency),totalPrice:this.querySelector(`.${this.classes.totalPrice}`),totalCompareAtPrice:this.querySelector(`.${this.classes.totalCompareAtPrice}`),frequencyPrice:this.querySelector(`.${this.classes.frequencyPrice}`),frequencyCompareAtPrice:this.querySelector(`.${this.classes.frequencyCompareAtPrice}`),submitButtons:this.querySelectorAll(this.classes.submitButton),errorMessage:this.querySelector(`.${this.classes.errorMessage}`),wlsForm:this.querySelector(`${this.classes.wlsForm}`)}}get dataAttributes(){return{productForm:this.getAttribute("data-product-form"),formDisabled:this.getAttribute("data-form-disabled"),initPurchaseType:this.elements.productFormFrequency?.getAttribute("data-init-purchase-type")||"one-time",ctaDirectCheckout:this.getAttribute("data-wls-cta-direct-checkout"),preventOpenCartForMobile:this.hasAttribute("data-prevent-open-cart-for-mobile")}}get inputsWithEvents(){return[{element:this.elements.quantityInput,events:["change","input"]},{element:this.elements.variantIdInput,events:["change","input"]},{element:this.elements.sellingPlanInput,events:["change","input"]},{element:this.elements.purchaseTypeInputs,events:["change","input"]}]}get currentProductVariantObject(){return window.productVariants?.find(variant=>variant.id.toString()===this.currentFormState.variantId)}connectedCallback(){this._initializeFormState(),this._bindEvents(),this._setupMutationObserver()}disconnectedCallback(){this._unbindEvents(),this._disconnectMutationObserver()}reinitialize(){this._unbindEvents(),this._disconnectMutationObserver(),this._initializeFormState(),this._bindEvents(),this._setupMutationObserver()}_initializeFormState(){this.currentFormState={quantity:this.elements.quantityInput?.value||1,variantId:this.elements.variantIdInput?.value||"",sellingPlan:this.elements.sellingPlanInput?.value||"",purchaseType:this.dataAttributes.initPurchaseType||""}}_bindEvents(){this.inputsWithEvents.forEach(({element,events})=>{element&&(element.length!==void 0?Array.from(element):[element]).forEac

1h(el=>{el&&events.forEach(event=>{el.addEventListener(event,this.boundHandleInputChange)})})}),this.elements.form&&this.elements.form.addEventListener("submit",this.boundHandleSubmit)}_unbindEvents(){this.inputsWithEvents.forEach(({element,events})=>{element&&(element.length!==void 0?Array.from(element):[element]).forEach(el=>{el&&events.forEach(event=>{el.removeEventListener(event,this.boundHandleInputChange)})})}),this.elements.form&&this.elements.form.removeEventListener("submit",this.boundHandleSubmit)}_handleInputChange(e){const input=e.target,inputName=input.name,inputValue=input.value;this._updateCurrentState(inputName,inputValue)}_updateCurrentState(fieldName,value){const{frequencyPrice,frequencyCompareAtPrice,totalPrice,totalCompareAtPrice}=this.elements;switch(fieldName){case"quantity":this.currentFormState.quantity=parseInt(value)||1,this._updatePrices({priceElement:totalPrice,compareAtElement:totalCompareAtPrice,multiplier:this.currentFormState.quantity});break;case"id":this.currentFormState.variantId=value,this._updatePrices({priceElement:frequencyPrice,compareAtElement:frequencyCompareAtPrice}),this._updatePrices({priceElement:totalPrice,compareAtElement:totalCompareAtPrice,multiplier:this.currentFormState.quantity}),this.currentProductVariantObject;break;case"selling_plan":this.currentFormState.sellingPlan=value,this.currentFormState.purchaseType===this.purchaseType.SUB&&this._updatePrices({priceElement:frequencyPrice,compareAtElement:frequencyCompareAtPrice}),this._updatePrices({priceElement:totalPrice,compareAtElement:totalCompareAtPrice,multiplier:this.currentFormState.quantity});break;case"purchase-type":this.currentFormState.purchaseType=value,this._updatePrices({priceElement:totalPrice,compareAtElement:totalCompareAtPrice,multiplier:this.currentFormState.quantity});break}}_updatePrices({priceElement,compareAtElement,multiplier=1}){const variant=this.currentProductVariantObject,{purchaseType,sellingPlan}=this.currentFormState;if(!variant||!priceElement)return;const allocation=purchaseType===this.purchaseType.SUB?variant.selling_plan_allocations.find(a=>a.selling_plan_id.toString()===sellingPlan):null,toInt=x=>x==null?null:Number(x),price=toInt(allocation?.price??variant.price),compareAt=toInt(allocation?.compare_at_price??variant.compare_at_price);priceElement.textContent=this._formatMoney(price*multiplier),compareAtElement&&(compareAt&&compareAt!==price?compareAtElement.textContent=this._formatMoney(compareAt*multiplier):compareAtElement.textContent="")}async _handleSubmit(e){if(e.preventDefault(),this.dataAttributes.formDisabled||e.submitter?.getAttribute("aria-disabled")==="true"||this.elements.wlsForm&&typeof this.elements.wlsForm.validate=="function"&&!this.elements.wlsForm.validate())return;const cart=document.querySelector("cart-notification")||document.querySelector("cart-drawer"),config=fetchConfig("javascript");config.headers["X-Requested-With"]="XMLHttpRequest",delete config.headers["Content-Type"];const formData=new FormData(this.elements.form);cart&&(formData.append("sections",cart.getSectionsToRender().map(section=>section?.section||section.id)),formData.append("sections_url",window.location.pathname),cart.setActiveElement?.(document.activeElement)),config.body=formData;try{this._addFormLoadingState(e.submitter);const data=await(await fetch(routes.cart_add_url,config)).json();if(data.status){const errorMessage=data.description||data.message||"Unable to add this item to cart.";publish(PUB_SUB_EVENTS.cartError,{source:"product-form",productVariantId:formData.get("id"),errors:data.errors||data.description,message:data.message}),this._renderErrorMessage(errorMessage),this.dispatchEvent(new CustomEvent("wls:add-to-cart-error",{bubbles:!0,detail:{message:errorMessage}}));return}if(!cart){window.location=window.routes.cart_url;return}const suppressDrawer=this.dataAttributes.preventOpenCartForMobile&&window.innerWidth<1024;if(suppressDrawer){const originalOpenMinicart=cart.openMinicart.bind(cart);cart.openMinicart=()=>{},cart.renderContents(data),cart.openMinicart=originalOpenMinicart}else cart.renderContents(data);this.dispatchEvent(new CustomEvent("wls:add-to-cart-success",{bubbles:!0,detail:{data,showSuccessScreen:suppressDrawer}})),publish(PUB_SUB_EVENTS.cartUpdate,{source:"product-form",productVariantId:formData.get("id"),cartData:data})}catch(error){console.error("[WLSProductForm] Add to cart error:",error),this.dispatchEvent(new CustomEvent("wls:add-to-cart-error",{bubbles:!0,detail:{message:"Unable to add this item to cart. Please try again."}}))}finally{this._removeFormLoadingState(),this.elements.wlsForm&&typeof this.elements.wlsForm.handleSuccess=="function"&&this.elements.wlsForm.handleSuccess()}}_setupMutationObserver(){this.mutationObserver=new MutationObserver(this.boundHandleMutation),this.inputsWithEvents.forEac

1h(({element})=>{element&&(element instanceof NodeList?[...element]:[element]).forEach(el=>{el&&this.mutationObserver.observe(el,{attributes:!0,attributeFilter:["value"],subtree:!1})})})}_renderErrorMessage(message){const el=this.elements.errorMessage;if(!el)return;const text=Array.isArray(message)?message.join(" "):message||"";el.textContent=text,setTimeout(()=>{el.textContent=""},5e3)}_addFormLoadingState(submitter){const{submitButtons,form}=this.elements;form.classList.add(this.classes.loading),submitter?.closest(".js-wls-variant-drawer, .js-quick-add-dialog")&&form.classList.add("loading--overlay"),submitButtons.forEach(button=>{button.classList.add(this.classes.loading),button.setAttribute("aria-disabled","true")})}_removeFormLoadingState(){const{submitButtons,form}=this.elements;form.classList.remove(this.classes.loading,"loading--overlay"),submitButtons.forEach(button=>{button.classList.remove(this.classes.loading),button.removeAttribute("aria-disabled")})}_handleMutation(mutations){mutations.forEach(mutation=>{if(mutation.type==="attributes"&&mutation.attributeName==="value"){const input=mutation.target,inputName=input.name,inputValue=input.value;this._updateCurrentState(inputName,inputValue)}})}_formatMoney(cents){const moneyFormat=window.theme?.moneyFormat||"${{amount}}";let formatted=window.WLSNHelpers.formatMoney(cents,moneyFormat)||`$${(cents/100).toFixed(2)}`;return formatted.includes("<")&&(formatted=formatted.replace(/<[^>]*>/g,"").trim()),formatted}_disconnectMutationObserver(){this.mutationObserver&&this.mutationObserver.disconnect()}}customElements.define("wls-product-form",WLSProductForm)}
2//# sourceMappingURL=/cdn/shop/t/5/assets/wls-product-form.js.map?v=157749123406109565911786959505