https://www.drvegan.com/cdn/shop/t/427/assets/product-form.js?v=19568753226784474481789680542

1class ProductForm extends HTMLElement{constructor(){super(),this.form=this.querySelector("form"),this.product_name=this.getAttribute("product-name"),this.max_per_order=this.getAttribute("max-per-order"),this.variant_id=this.form.querySelector('input[name="id"]'),this.options=this.form.querySelectorAll('input[name="options"]'),this.quantity=this.form.querySelector('input[name="quantity"]'),this.sellingPlan=this.form.querySelector('input[name="selling_plan"]'),this.quantitySelectors=this.form.querySelectorAll('button[type="button"]'),this.form.addEventListener("submit",event=>{this.handleSubmit(event)})}connectedCallback(){this.options.length&&(this.options.forEach(option=>{option.addEventListener("change",event=>{switch(event.target.dataset.change){case"selling_plan":this.sellingPlan.value=event.target.value;break;case"variant":this.variant_id.value=event.target.value,this.syncSellingPlanForVariant(event.target);break}})}),this.options[0].checked=!0,this.options[0].dataset.change==="selling_plan"?this.sellingPlan.value=this.options[0].value:(this.variant_id.value=this.options[0].value,this.syncSellingPlanForVariant(this.options[0]))),this.quantitySelectors.length&&this.quantitySelectors.forEach(button=>{button.addEventListener("click",event=>{switch(event.target.dataset.action){case"decrement":this.decrementQuantity(event);break;case"increment":this.incrementQuantity(event);break}})})}decrementQuantity(event){this.quantity.value=parseInt(this.quantity.value)-1,this.changeButtonText(),event.target.blur()}incrementQuantity(event){this.quantity.value=parseInt(this.quantity.value)+1,this.changeButtonText(),event.target.blur()}syncSellingPlanForVariant(variantOption){if(!variantOption)return;const variantSellingPlanId=variantOption.dataset.sellingPlanId||"",subscriptionSellingPlanOption=this.form.querySelector('input[data-change="selling_plan"][js-subs-option], input[data-change="selling_plan"][value]:not([value=""])');if(!subscriptionSellingPlanOption)return;subscriptionSellingPlanOption.value=variantSellingPlanId;const selectedSellingPlanOption=this.form.querySelector('input[data-change="selling_plan"]:checked');selectedSellingPlanOption&&selectedSellingPlanOption.value!==""&&(this.sellingPlan.value=variantSellingPlanId)}async handleSubmit(event){event.preventDefault(),event.submitter.setAttribute("data-loading","");const formData=new FormData(this.form),response=await fetch(window.Shopify.routes.cart_add_url,{method:"POST",body:formData}),{sections}=await response.json();for(const[key,value]of Object.entries(sections))document.querySelector(`#${key}`).innerHTML=new DOMParser().parseFromString(value,"text/html").body.firstChild.innerHTML;const cartDrawerEl=document.querySelector("cart-drawer");cartDrawerEl&&cartDrawerEl.openDrawer();const productCard=this.closest("product-card");if(productCard){const closeDialogButton=productCard.querySelector('button[data-action="close-dialog"]');closeDialogButton&&closeDialogButton.click()}const bannerHtml=`
2      <style>
3      @media (max-width: 768px) {
4        #confirmation-banner {
5          display: none;
6        }
7      }
8     </style>
9      <div id="confirmation-banner" class="bg-gray-800 rounded-xl shadow-lg max-w-3xl mx-auto fixed max-md:inset-x-4 max-lg:inset-x-6 inset-x-8 max-md:bottom-4 max-lg:bottom-6 bottom-8 flex items-center p-4 z-50 opacity-0 transition-opacity data-[active]:opacity-100">        
10        <p class="text-sm font-medium text-white pr-4">
11          ${this.product_name} added to basket!
12        </p>
13        <a href="${window.Shopify.routes.cart_url}" class="ml-auto text-sm font-medium text-teal whitespace-nowrap">View basket</a>
14      </div>
15      `,banner=document.createElement("div");banner.innerHTML=bannerHtml,document.body.appendChild(banner),setTimeout(()=>{document.querySelector("#confirmation-banner").setAttribute("data-active","")},100),setTimeout(()=>{banner.remove()},2500),this.productFormReset(event)}productFormReset(event){this.form.classList.contains("template-electrolytes")||this.form.reset(),event.submitter.removeAttribute("data-loading"),this.max_per_order&&(event.submitter.disabled=!0),this.form.classList.contains("template-electrolytes")||this.options.length&&(this.options[0].checked=!0),this.changeButtonText()}changeButtonText(){this.querySelector("[data-quantity]").innerHTML=this.hasAttribute("subscription-only")?"Subscribe":`Add ${this.quantity.value} to basket`,this.quantitySelectors.length&&(this.quantity.value==="1"?this.quantitySelectors[0].disabled=!0:this.quantitySelectors[0].disabled=!1)}}customElements.define("product-form",ProductForm);
16//# sourceMappingURL=/cdn/shop/t/427/assets/product-form.js.map?v=19568753226784474481789680542