https://www.qwetch.com/cdn/shop/t/650/assets/component-product-sub…?v=128652729630569069401790070583

1!function(){class t extends HTMLElement{constructor(){super(),this.total=0,this.products=[],this.formData={items:[]},this.showMoreProducts=this.showMoreProducts.bind(this),this.updateChoiceCta=this.updateChoiceCta.bind(this)}connectedCallback(){this.init(),console.log("Connected subscription"),this.Cart=document.querySelector("w3-cart")}init(){this.products=[...this.querySelectorAll(".subscription__product")],this.updateTotalPrice(),this.updateProgressBar(),this.select=this.querySelector(this.selectSelector||".subscription__selling-plan"),console.log(this.select,this.selectSelector),this.selectValue=this.select.value,this.updateFormData(),console.log("select value: ",this.selectValue),this.select.addEventListener("change",(()=>{this.selectValue=this.select.value,console.log("select change"),this.updateFormData();const t=this.select.options[this.select.selectedIndex].getAttribute("translate");this.querySelector(".subscription__infos-delivery").textContent=t})),this.products.forEach((t=>{parseInt(t.getAttribute("price"),10);const e=t.querySelector(".subscription__product-quantity--input"),s=t.querySelector(".subscription__product-quantity--less"),i=t.querySelector(".subscription__product-quantity--more"),r=t=>{let s=parseInt(e.value,10)||0;s=Math.max(0,s+t),e.value=s,this.updateTotalPrice(),this.updateFormData(),this.updateProgressBar()};s.addEventListener("click",(()=>r(-1))),i.addEventListener("click",(()=>r(1)))})),this.seeMore=this.querySelector(".subscription__see-more--button"),this.seeMore&&this.seeMore.addEventListener("click",(()=>this.showMoreProducts())),this.choiceCta=this.querySelectorAll(".choice-cta__wrapper"),this.choiceCta.forEach((t=>{t.addEventListener("click",(e=>{this.updateChoiceCta(t)}))})),this.addToCartButton=this.querySelector(this.addToCartButtonSelector||".subscription__cta-infos--cta"),this.addToCartButton.addEventListener("click",(t=>{this.addToCart()}))}createFormDataForCartUpdate(){const t=new FormData;return this.formData.items.forEach(((e,s)=>{t.append(`items[${s}][id]`,e.id),t.append(`items[${s}][quantity]`,e.quantity),e.selling_plan&&t.append(`items[${s}][selling_plan]`,e.selling_plan),t.append(`items[${s}][properties][_subscription]`,"true")})),this.Cart&&(t.append("sections",this.Cart.getSectionsToRender().map((t=>t.id))),t.append("sections_url",window.location.pathname)),console.log(t),t}addToCart(){const t=this.createFormDataForCartUpdate();fetch(window.Shopify.routes.root+"cart/add.js",{method:"POST",headers:{Accept:"application/javascript","X-Requested-With":"XMLHttpRequest"},body:t}).then((t=>t.json())).then((t=>{console.log(t),this.Cart&&this.Cart.updateCart(t);const e=new CustomEvent("theme:drawer:cart:update");document.dispatchEvent(e);const s=new CustomEvent("theme:drawer:cart:open");document.dispatchEvent(s)})).catch((t=>{console.error("Error:",t)}))}updateChoiceCta(t){this.choiceCta.forEach((t=>t.classList.remove("active"))),t.classList.add("active");const e=t.getAttribute("mode");var s=document.querySelector(".product-form"),i=this.querySelector(".subscription__cta-infos"),r=this.querySelector(".subscription"),o=document.querySelector(".product-bundle"),a=document.querySelector(".product-sticky-buybox");"subscription"===e?(r.classList.remove("hidden"),i.classList.remove("hidden"),s.classList.add("hidden"),o&&o.classList.add("hidden"),a&&a.classList.add("hidden")):(r.classList.add("hidden"),i.classList.add("hidden"),s.classList.remove("hidden"),o&&o.classList.remove("hidden"),a&&a.classList.remove("hidden"))}showMoreProducts(){var t=this.seeMore.getAttribute("see-more"),e=this.seeMore.getAttribute("see-less");const s=this.querySelectorAll(".subscription__product--to-hide");this.seeMore.classList.contains("active")?(s.forEach((t=>{t.classList.add("subscription__product--hide")})),this.seeMore.innerText=t,this.seeMore.classList.remove("active")):(s.forEach((t=>{t.classList.remove("subscription__product--hide")})),this.seeMore.innerText=e,this.seeMore.classList.add("active"))}updateProgressBar(){const t=this.querySelector(".subscription__progress-bar"),e=[...t.querySelectorAll(".subscription__progress-bar--infos")],s=this.querySelector(".subscription__progress-bar--sub-wrapper");let i=0;

1this.products.forEach((t=>{const e=parseInt(t.querySelector(".subscription__product-quantity--input").value,10)||0;i+=e}));const r=parseInt(this.getAttribute("data-in-cart"))||0;i+=r,console.log(i),i>=4?s.classList.add("active"):s.classList.remove("active");let o=0;i>=1&&i<=2?o=0:3===i?o=1:4===i?o=2:i>=5&&i<=6?o=3:i>6&&(o=4),t.setAttribute("data-total",i),t.setAttribute("data-step",o),e.forEach((t=>t.classList.remove("active")));let a=0;a=i>=6?e.length:i>=4?3:i>=3?2:i>=2?1:0,e.forEach((t=>t.classList.remove("active")));for(let t=0;t<a&&t<e.length;t++)e[t].classList.add("active")}updateFormData(){this.formData={items:[]},this.products.forEach((t=>{const e=t.getAttribute("id"),s=parseInt(t.querySelector(".subscription__product-quantity--input").value,10)||0;if(s>0){t.classList.add("active");const i={id:e,quantity:s},r=t.getAttribute(this.selectValue);r&&(i.selling_plan=r),this.formData.items.push(i)}else t.classList.remove("active")})),console.log(this.formData)}updateTotalPrice(){let t=0,e=0,s=0;this.products.forEach((t=>{s+=parseInt(t.querySelector(".subscription__product-quantity--input").value,10)||0}));const i=parseInt(this.getAttribute("data-in-cart"))||0;s+=i;let r=0;s>=6?r=.18:s>=3?r=.15:s>=2&&(r=.1),this.products.forEach((s=>{const i=parseInt(s.getAttribute("price"),10),o=parseInt(s.querySelector(".subscription__product-quantity--input").value,10)||0,a=Math.round(i*(1-r)),c=s.querySelector(".subscription__product-compare"),n=s.querySelector(".subscription__product-price");r>0?(c.textContent=this.formatMoney(i),n.textContent=this.formatMoney(a)):(c.textContent="",n.textContent=this.formatMoney(i)),t+=a*o,e+=i*o})),this.total=t;const o=this.querySelector(this.totalDisplaySelector||".subscription__cta-price"),a=this.querySelector(this.compareDisplaySelector||".subscription__cta-compare");console.log("total",o,this.totalDisplaySelector),console.log("compare",a),r>0&&"0"!=e?(o.textContent=this.formatMoney(t),a.textContent=this.formatMoney(e)):(o.textContent=this.formatMoney(t),a.textContent="");const c=s-i,n=this.querySelector(".subscription__infos-quantity-product");if(n){const t=n.getAttribute("data-string-zero"),e=n.getAttribute("data-string-single"),s=n.getAttribute("data-string-other");n.textContent=0==c?t:1==c?e:s.replace("2",c)}const u=this.querySelector(".subscription__infos-quantity-pastilles");if(u){const t=u.getAttribute("data-string-zero"),e=(u.getAttribute("data-string-single"),u.getAttribute("data-string-other"));u&&(u.textContent=0==c?`(${t})`:`(${e.replace("2",12*c)})`)}}formatMoney(t){return(t/100).toLocaleString("fr-FR",{style:"currency",currency:"EUR"})}}customElements.define("w3-subscription",t)}();