https://essentialbag.com/cdn/shop/t/186/assets/product-addons.js?v=180288248198925971541791342733

1class ProductAddons extends HTMLElement{constructor(){super(),this.selectedAddons=new Map}connectedCallback(){this.visibleCount=parseInt(this.dataset.visibleCount)||2,this.toggleBtn=this.querySelector("[data-toggle-addons]"),this.toggleText=this.querySelector("[data-toggle-text]"),this.items=this.querySelectorAll("addon-item"),this.isExpanded=!1,this.initToggleButton()}initToggleButton(){this.toggleBtn&&this.toggleBtn.addEventListener("click",()=>{this.isExpanded=!this.isExpanded,this.toggleBtn.setAttribute("data-expanded",this.isExpanded),this.items.forEach((item,index)=>{index>=this.visibleCount&&(item.classList.toggle("product-addon-item--hidden",!this.isExpanded),item.classList.toggle("product-addon-item--visible",this.isExpanded))}),this.toggleText&&(this.toggleText.textContent=this.isExpanded?this.toggleText.dataset.openText:this.toggleText.dataset.closeText)})}initFormInterception(){document.addEventListener("submit",this.handleFormSubmit.bind(this))}handleFormSubmit(e){const form=e.target;if(!form.matches('form[action*="/cart/add"]')||this.selectedAddons.size===0)return;e.preventDefault();const formData=new FormData(form),formId=form.id;formId&&document.querySelectorAll(`[form="${formId}"]`).forEach(field=>{field.name&&!field.disabled&&(field.type==="file"?field.files.length>0&&formData.append(field.name,field.files[0]):field.type==="checkbox"||field.type==="radio"?field.checked&&formData.append(field.name,field.value):formData.append(field.name,field.value))}),console.log("All captured fields:");for(const[key,value]of formData.entries())console.log(`${key}:`,value);fetch("/cart/add.js",{method:"POST",body:formData}).then(response=>{if(!response.ok)throw new Error("Failed to add main product");return response.json()}).then(()=>{const addonItems=[];return this.selectedAddons.forEach(addon=>{addonItems.push({id:addon.variantId,quantity:addon.quantity})}),fetch("/cart/add.js",{method:"POST",headers:{"Content-Type":"application/json",Accept:"application/json"},body:JSON.stringify({items:addonItems})})}).then(response=>{if(!response.ok)throw new Error("Failed to add addons");return response.json()}).then(()=>{this.clearSelection(),this.handlePostAddToCart(form)}).catch(error=>{console.error("Error:",error),this.handlePostAddToCart(form)})}async addItemsToCart(items,form){try{const response=await fetch("/cart/add.js",{method:"POST",headers:{"Content-Type":"application/json",Accept:"application/json"},body:JSON.stringify({items})});if(!response.ok)throw new Error("Failed to add items to cart");const result=await response.json();this.dispatchEvent(new CustomEvent("cart:items-added",{bubbles:!0,detail:{items:result.items}})),this.clearSelection(),this.handlePostAddToCart(form)}catch(error){console.error("Error adding items to cart:",error),this.dispatchEvent(new CustomEvent("cart:error",{bubbles:!0,detail:{error:error.message}})),form.submit()}}handlePostAddToCart(form){const cartType=document.body.dataset.cartType||"drawer";cartType==="drawer"?document.dispatchEvent(new CustomEvent("cart:refresh")):cartType==="page"?window.location.href="/cart":document.dispatchEvent(new CustomEvent("cart:refresh"))}addAddon(id,data){const item=this.querySelector(`addon-item[data-addon-id="${id}"]`);if(item&&item.dataset.addonAvailable==="false"){this.selectedAddons.delete(id),this.dispatchSelectionEvent();return}this.selectedAddons.set(id,data),this.dispatchSelectionEvent()}removeAddon(id){this.selectedAddons.delete(id),this.dispatchSelectionEvent()}dispatchSelectionEvent(){this.dispatchEvent(new CustomEvent("addons:selection-changed",{bubbles:!0,detail:{selectedAddons:Array.from(this.selectedAddons.entries()),totalPrice:this.getTotalPrice()}}))}getTotalPrice(){let total=0;return this.selectedAddons.forEach(addon=>{total+=addon.price*addon.quantity}),total}markSoldOut(variantIds){const ids=(variantIds||[]).map(String);this.querySelectorAll("addon-item").forEach(item=>{ids.includes(String(item.dataset.addonVariant))&&item.applyAvailability&&item.applyAvailability(!1)}),this.dispatchSelectionEvent()}

1clearSelection(){this.selectedAddons.clear(),this.items.forEach(item=>item.deselect()),this.dispatchSelectionEvent()}getSelectedAddons(){return Array.from(this.selectedAddons.entries())}}class AddonItem extends HTMLElement{constructor(){super(),this.isSelected=!1}connectedCallback(){this.addonId=this.dataset.addonId,this.variantId=this.dataset.addonVariant,this.price=parseFloat(this.dataset.addonPrice)||0,this.toggleBtn=this.querySelector("[data-addon-toggle]"),this.infoBtn=this.querySelector("[data-addon-popup-trigger]"),this.popup=this.querySelector("addon-popup"),this.expandable=this.querySelector("[data-addon-expandable]"),this.variantSelector=this.querySelector("[data-variant-selector]"),this.priceEl=this.querySelector("[data-price]"),this.comparePriceEl=this.querySelector("[data-compare-price]"),this.discountBadgeEl=this.querySelector("[data-discount-badge]"),this.variantImageEl=this.querySelector("[data-variant-image]"),this.soldOutBadgeEl=this.querySelector("[data-sold-out-badge]"),this.available=this.dataset.add

1onAvailable!=="false",this.initToggle(),this.initInfoButton(),this.initVariantSelector(),this.applyAvailability(this.available)}applyAvailability(available){if(this.available=!!available,this.dataset.addonAvailable=this.available,this.classList.toggle("product-addon-item--sold-out",!this.available),this.soldOutBadgeEl&&(this.soldOutBadgeEl.hidden=this.available),this.toggleBtn&&(this.toggleBtn.disabled=!this.available,this.available?this.toggleBtn.removeAttribute("aria-disabled"):this.toggleBtn.setAttribute("aria-disabled","true")),!this.available&&this.isSelected){this.deselect();const container=this.closest("product-addons");container&&container.removeAddon(this.addonId)}}initToggle(){this.toggleBtn&&this.toggleBtn.addEventListener("click",()=>{if(!this.available)return;this.isSelected=!this.isSelected,this.updateToggleState();const container=this.closest("product-addons");this.isSelected?(this.classList.add("product-addon-item--selected"),this.showExpandable(),container&&container.addAddon(this.addonId,{variantId:this.variantId,price:this.price,quantity:1})):(this.classList.remove("product-addon-item--selected"),this.hideExpandable(),container&&container.removeAddon(this.addonId))})}updateToggleState(){this.toggleBtn&&this.toggleBtn.setAttribute("aria-checked",this.isSelected.toString())}showExpandable(){this.expandable&&this.expandable.setAttribute("aria-hidden","false")}hideExpandable(){this.expandable&&this.expandable.setAttribute("aria-hidden","true")}initInfoButton(){!this.infoBtn||!this.popup||this.infoBtn.addEventListener("click",e=>{e.preventDefault(),e.stopPropagation(),this.popup.open()})}initVariantSelector(){if(!this.variantSelector)return;this.variantSelector.querySelectorAll('input[type="radio"]').forEach(input=>{input.addEventListener("change",()=>{this.handleVariantChange(input)})})}handleVariantChange(input){if(input.dataset.variantAvailable==="false"){this.applyAvailability(!1);return}this.applyAvailability(!0);const newVariantId=input.dataset.variantId,newPrice=parseFloat(input.dataset.variantPrice)||0,newComparePrice=parseFloat(input.dataset.variantComparePrice)||0,newImage=input.dataset.variantImage;if(this.variantId=newVariantId,this.price=newPrice,this.dataset.add

1onVariant=newVariantId,this.dataset.addonPrice=newPrice,this.priceEl&&(this.priceEl.textContent=this.formatMoney(newPrice)),newComparePrice&&newComparePrice>newPrice){const discountPercent=Math.round((newComparePrice-newPrice)/newComparePrice*100);this.comparePriceEl&&(this.comparePriceEl.textContent=this.formatMoney(newComparePrice),this.comparePriceEl.style.display=""),this.discountBadgeEl&&(this.discountBadgeEl.textContent=`-${discountPercent}%`,this.discountBadgeEl.style.display="")}else this.comparePriceEl&&(this.comparePriceEl.style.display="none"),this.discountBadgeEl&&(this.discountBadgeEl.style.display="none");if(newImage&&this.variantImageEl&&(this.variantImageEl.src=newImage,this.variantImageEl.srcset=`${newImage} 1x, ${newImage.replace("width=120","width=240")} 2x`),this.variantSelector.querySelectorAll(".variant-option").forEach(option=>{const optionInput=option.querySelector("input");option.classList.toggle("variant-option--active",optionInput.value===newVariantId)}),this.isSelected){const container=this.closest("product-addons");container&&container.addAddon(this.addonId,{variantId:this.variantId,price:this.price,quantity:1})}this.dispatchEvent(new CustomEvent("variant:changed",{bubbles:!0,detail:{addonId:this.addonId,variantId:newVariantId,price:newPrice,comparePrice:newComparePrice}}))}formatMoney(cents){const amount=cents/100,currency=document.querySelector("product-addons.product-addons")?.dataset.currency;return["\u20AC","kr","z\u0142","K\u010D","lei","\u20B4"].includes(currency)?`${amount} ${currency}`:`${currency} ${amount}`}select(){this.isSelected||(this.isSelected=!0,this.updateToggleState(),this.classList.add("product-addon-item--selected"),this.showExpandable())}deselect(){this.isSelected&&(this.isSelected=!1,this.updateToggleState(),this.classList.remove("product-addon-item--selected"),this.hideExpandable())}}class AddonPopup extends HTMLElement{constructor(){super(),this.isOpen=!1}connectedCallback(){this.overlay=this.querySelector(".product-addon-popup__overlay"),this.closeBtn=this.querySelector("[data-addon-popup-close]"),this.slider=this.querySelector("addon-slider"),this.initCloseHandlers(),this.initKeyboardHandler()}initCloseHandlers(){this.closeBtn&&this.closeBtn.addEventListener("click",()=>this.close()),this.overlay&&this.overlay.addEventListener("click",()=>this.close())}initKeyboardHandler(){this.keyHandler=e=>{e.key==="Escape"&&this.isOpen&&this.close()}}open(){this.isOpen=!0,this.setAttribute("aria-hidden","false"),document.body.classList.add("addon-popup-open"),document.addEventListener("keydown",this.keyHandler),this.slider&&this.slider.goToSlide(0);const focusable=this.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');focusable.length>0&&focusable[0].focus(),this.dispatchEvent(new CustomEvent("popup:opened",{bubbles:!0}))}close(){this.isOpen=!1,this.setAttribute("aria-hidden","true"),document.body.classList.remove("addon-popup-open"),document.removeEventListener("keydown",this.keyHandler);const item=this.closest("addon-item");if(item){const trigger=item.querySelector("[data-addon-popup-trigger]");trigger&&trigger.focus()}this.dispatchEvent(new CustomEvent("popup:closed",{bubbles:!0}))}disconnectedCallback(){document.removeEventListener("keydown",this.keyHandler)}}class AddonSlider extends HTMLElement{constructor(){super(),this.currentIndex=0}connectedCallback(){this.track=this.querySelector(".popup-slider__track"),this.slides=this.querySelectorAll(".popup-slider__slide"),this.prevBtn=this.querySelector("[data-slider-prev]"),this.nextBtn=this.querySelector("[data-slider-next]"),this.dots=this.querySelectorAll("[data-slider-dot]"),!(this.slides.length<=1)&&(this.initNavigation(),this.initTouch(),this.initKeyboard())}initNavigation(){this.prevBtn&&this.prevBtn.addEventListener("click",()=>this.prev()),this.nextBtn&&this.nextBtn.addEventListener("click",()=>this.next()),this.dots.forEach((dot,index)=>{dot.addEventListener("click",()=>this.goToSlide(index))})}initTouch(){let touchStartX=0,touchEndX=0;this.addEventListener("touchstart",e=>{touchStartX=e.changedTouches[0].screenX},{passive:!0}),this.addEventListener("touchend",e=>{touchEndX=e.changedTouches[0].screenX,this.handleSwipe(touchStartX,touchEndX)},{passive:!0})}handleSwipe(startX,endX){const diff=startX-endX;Math.abs(diff)>50&&(diff>0?this.next():this.prev())}initKeyboard(){this.setAttribute("tabindex","0"),this.addEventListener("keydown",e=>{e.key==="ArrowLeft"?this.prev():e.key==="ArrowRight"&&this.next()})}prev(){const newIndex=this.currentIndex===0?this.slides.length-1:this.currentIndex-1;this.goToSlide(newIndex)}next(){const newIndex=this.currentIndex===this.slides.length-1?0:this.currentIndex+1;this.goToSlide(newIndex)}goToSlide(index){index<0||index>=this.slides.length||(this.currentIndex=index,this.track&&(this.track.style.transform=`translateX(-${index*100}

1%)`),this.slides.forEach((slide,i)=>{slide.classList.toggle("popup-slider__slide--active",i===index)}),this.dots.forEach((dot,i)=>{dot.classList.toggle("popup-slider__dot--active",i===index)}),this.dispatchEvent(new CustomEvent("slider:changed",{bubbles:!0,detail:{index}})))}get slideCount(){return this.slides.length}}class AddonToggle extends HTMLElement{constructor(){super()}connectedCallback(){this.input=this.querySelector('input[type="checkbox"]'),this.input||this.createInput()}createInput(){this.input=document.createElement("input"),this.input.type="checkbox",this.input.className="addon-toggle__input",this.input.setAttribute("data-addon-checkbox","");const slider=document.createElement("span");slider.className="addon-toggle__slider";const label=document.createElement("label");label.className="addon-toggle",label.appendChild(this.input),label.appendChild(slider),this.appendChild(label)}get checked(){return this.input?.checked||!1}set checked(value){this.input&&(this.input.checked=value)}toggle(){this.input&&(this.input.checked=!this.input.checked,this.input.dispatchEvent(new Event("change",{bubbles:!0})))}}customElements.get("product-addons")||customElements.define("product-addons",ProductAddons),customElements.get("addon-item")||customElements.define("addon-item",AddonItem),customElements.get("addon-popup")||customElements.define("addon-popup",AddonPopup),customElements.get("addon-slider")||customElements.define("addon-slider",AddonSlider),customElements.get("addon-toggle")||customElements.define("addon-toggle",AddonToggle),window.ProductAddons={getContainer:(selector="product-addons")=>document.querySelector(selector),getSelectedAddons:container=>{const el=container||document.querySelector("product-addons");return el?el.getSelectedAddons():[]},getTotalPrice:container=>{const el=container||document.querySelector("product-addons");return el?el.getTotalPrice():0},clearSelection:container=>{const el=container||document.querySelector("product-addons");el&&el.clearSelection()}};
2//# sourceMappingURL=/cdn/shop/t/186/assets/product-addons.js.map?v=180288248198925971541791342733