https://girlbeer.com/cdn/shop/t/24/assets/product-showcase.js?v=153549062821426459831765479671

1let productShowcaseThumbnails=null,productShowcaseMainSlider=null;function initProductShowcaseSwipers(){const thumbnailsContainer=document.querySelector(".product-showcase__thumbnails"),mainSliderContainer=document.querySelector(".product-showcase__main-slider");if(!thumbnailsContainer||!mainSliderContainer)return;const thumbnailSlides=thumbnailsContainer.querySelectorAll(".swiper-slide").length;productShowcaseThumbnails&&typeof productShowcaseThumbnails.destroy=="function"&&productShowcaseThumbnails.destroy(!0,!0),productShowcaseMainSlider&&typeof productShowcaseMainSlider.destroy=="function"&&productShowcaseMainSlider.destroy(!0,!0),productShowcaseThumbnails=new Swiper(".product-showcase__thumbnails",{spaceBetween:4.5,slidesPerView:5,watchSlidesProgress:!0,breakpoints:{990:{direction:"vertical",spaceBetween:10,slidesPerView:4.8536}}});const swiperWrapper=thumbnailsContainer.querySelector(".swiper-wrapper");swiperWrapper&&thumbnailSlides<5?swiperWrapper.classList.add("swiper-wrapper--centered"):swiperWrapper&&swiperWrapper.classList.remove("swiper-wrapper--centered"),productShowcaseMainSlider=new Swiper(".product-showcase__main-slider",{spaceBetween:10,loop:!0,thumbs:{swiper:productShowcaseThumbnails}})}initProductShowcaseSwipers(),window.initProductShowcaseSwipers=initProductShowcaseSwipers,window.addEventListener("resize",function(){const thumbnailsContainer=document.querySelector(".product-showcase__thumbnails"),swiperWrapper=thumbnailsContainer?thumbnailsContainer.querySelector(".swiper-wrapper"):null,thumbnailSlides=thumbn

1ailsContainer?thumbnailsContainer.querySelectorAll(".swiper-slide").length:0;swiperWrapper&&thumbnailSlides<5?swiperWrapper.classList.add("swiper-wrapper--centered"):swiperWrapper&&swiperWrapper.classList.remove("swiper-wrapper--centered")}),(()=>{const ingredientsContainers=document.querySelectorAll(".product-showcase__ingredients");if(!ingredientsContainers.length)return;ingredientsContainers.forEach(container=>{const toggle=container.querySelector("[data-ingredients-toggle]"),content=container.querySelector("[data-ingredients-content]");!toggle||!content||(content.style.maxHeight="0px",toggle.addEventListener("click",()=>{container.classList.toggle("is-open")?content.style.maxHeight=content.scrollHeight+400+"px":content.style.maxHeight="0px"}))});const nutritionButtons=document.querySelectorAll("[data-nutrition-modal]"),modal=document.querySelector("[data-modal]"),modalBackdrop=document.querySelector("[data-modal-backdrop]"),modalClose=document.querySelector("[data-modal-close]"),modalContainer=document.querySelector(".nutrition-modal__container");if(nutritionButtons.length&&modal){nutritionButtons.forEach(button=>{button.addEventListener("click",function(e){e.preventDefault(),modal.classList.add("is-open"),document.body.style.overflow="hidden"})});const closeModal=()=>{modal.classList.remove("is-open"),document.body.style.overflow=""};modal.addEventListener("click",e=>{(e.target===modal||e.target===modalBackdrop)&&closeModal()}),modalContainer&&modalContainer.addEventListener("click",e=>{e.stopPropagation()}),modalClose&&modalClose.addEventListener("click",closeModal),document.addEventListener("keydown",e=>{e.key==="Escape"&&modal.classList.contains("is-open")&&closeModal()})}})(),document.querySelectorAll(".product-showcase__quantity").forEach(container=>{const input=container.querySelector("[data-quantity-input]"),display=container.querySelector("[data-quantity-display]"),minusBtn=container.querySelector(".product-showcase__quantity-minus"),plusBtn=container.querySelector(".product-showcase__quantity-plus");if(!input||!display||!minusBtn||!plusBtn)return;const updateDisplay=()=>{display.textContent=input.value};minusBtn.addEventListener("click",()=>{const currentValue=parseInt(input.value);currentValue>1&&(input.value=currentValue-1,updateDisplay())}),plusBtn.addEventListener("click",()=>{const currentValue=parseInt(input.value);input.value=currentValue+1,updateDisplay()}),input.addEventListener("change",updateDisplay)});class ProductShowcase extends HTMLElement{constructor(){super(),this.productId=this.dataset.productId,this.form=document.querySelector(`#product-form-${this.closest("section").id.replace("section--","")}`),this.variantIdInput=this.form?.querySelector('input[name="id"]'),this.priceElement=document.querySelector("[data-product-price]"),this.addToCartButton=document.querySelector("[data-add-to-cart]"),this.variantTitleElement=document.querySelector("[data-variant-title]"),this.variantImageTitleElement=document.querySelector("[data-variant-image-title]"),this.variantDescriptionElement=document.querySelector(".product-showcase__description-desktop"),this.variantDescriptionMobileElement=document.querySelector(".product-showcase__description-mobile"),this.initVariantSelectors(),this.initAddToCart()}initAddToCart(){this.form&&this.form.addEventListener("submit",async e=>{if(e.preventDefault(),this.addToCartButton){this.addToCartButton.disabled=!0;try{const formData=new FormData(this.form),response=await fetch("/cart/add.js",{method:"POST",body:formData});if(response.ok){const data=await response.json();document.dispatchEvent(new CustomEvent("cart:item-added",{detail:data})),this.addToCartButton.disabled=!1}else throw new Error("Failed to add to cart")}catch(error){console.error("Error adding to cart:",error),this.addToCartButton.disabled=!1}}})}initVariantSelectors(){document.querySelectorAll(".product-showcase__variants[data-option-index]").forEach(container=>{const buttons=container.querySelectorAll("[data-variant-option]"),valueDisplay=container.querySelector("[data-selected-value]");buttons.forEach(button=>{button.addEventListener("click",e=>{e.preventDefault(),buttons.forEach(btn=>

1btn.closest(".product-showcase__variant").classList.remove("product-showcase__variant--active")),button.closest(".product-showcase__variant").classList.add("product-showcase__variant--active"),valueDisplay&&(valueDisplay.textContent=button.dataset.optionValue.toLowerCase()),this.updateVariant()})})})}updateVariant(){const selectedOptions=this.getSelectedOptions(),variant=this.getVariantFromOptions(selectedOptions);variant&&(this.updateVariantId(variant.id),this.updatePrice(variant.price),this.updateUrl(variant.id),this.updateGalleryImage(variant),this.updateVariantTitle(variant),this.updateVariantImageTitle(variant),this.updateVariantDescription(variant),this.updateAddToCartButton(variant))}updateGalleryImage(variant){if(variant.featured_image&&productShowcaseMainSlider){const slides=document.querySelectorAll(".product-showcase__main-img img");let targetIndex=0;slides.forEach((img,index)=>{img.src.includes(variant.featured_image.split("?")[0].split("/").pop().split(".")[0])&&(targetIndex=index)}),productShowcaseMainSlider.slideTo(targetIndex)}}getSelectedOptions(){const options=[];return document.querySelectorAll(".product-showcase__variants[data-option-index]").forEach(container=>{const activeButton=container.querySelector(".product-showcase__variant--active [data-variant-option]");activeButton&&options.push(activeButton.dataset.optionValue)}),options}getVariantFromOptions(options){return((window.productData||{}).variants||[]).find(variant=>options.every((option,index)=>variant[`option${index+1}`]===option))}updateVariantId(variantId){this.variantIdInput&&(this.variantIdInput.value=variantId)}updatePrice(price){if(this.priceElement){const formattedPrice=`$${(price/100).toFixed(2)}`;this.priceElement.textContent=formattedPrice}}updateUrl(variantId){const url=new URL(window.location.href);url.searchParams.set("variant",variantId),window.history.replaceState({},"",url)}updateVariantTitle(variant){}updateVariantImageTitle(variant){if(this.variantImageTitleElement){const imgElement=this.variantImageTitleElement.querySelector("img");imgElement&&(variant.label_tag_icon?(imgElement.style.display="block",imgElement.src=variant.label_tag_icon,imgElement.alt=variant.title||""):imgElement.style.display="none")}}updateVariantDescription(variant){variant.description&&(this.variantDescriptionElement&&(this.variantDescriptionElement.innerHTML=variant.description),this.variantDescriptionMobileElement&&(this.variantDescriptionMobileElement.innerHTML=variant.description))}updateAddToCartButton(variant){if(!this.addToCartButton)return;const buttonTextElement=this.addToCartButton;if(variant.available){buttonTextElement.disabled=!1,buttonTextElement.classList.remove("disabled","is-out-of-stock"),buttonTextElement.removeAttribute("aria-disabled"),buttonTextElement.style.backgroundColor="",buttonTextElement.style.borderColor="",buttonTextElement.style.color="",buttonTextElement.style.cursor="";const originalText=buttonTextElement.dataset.originalText||"ADD TO CART";buttonTextElement.textContent=originalText}else buttonTextElement.disabled=!0,buttonTextElement.classList.add("disabled","is-out-of-stock"),buttonTextElement.setAttribute("aria-disabled","true"),buttonTextElement.style.backgroundColor="#E0E0E0",buttonTextElement.style.borderColor="#D5D5D5",buttonTextElement.style.color="#666",buttonTextElement.style.cursor="not-allowed",buttonTextElement.textContent="SOLD OUT"}initSelectedVariant(){console.log("initSelectedVariant");const productData=window.productData||{},selectedVariantId=productData.selected_variant_id;if(selectedVariantId&&productData.variants){const selectedVariant=productData.variants.find(v=>v.id===selectedVariantId);selectedVariant&&(this.updateVariantId(selectedVariant),this.updatePrice(selectedVariant),this.updateUrl(selectedVariant),this.updateGalleryImage(selectedVariant),this.updateVariantTitle(selectedVariant),this.updateVariantImageTitle(selectedVariant),this.updateVariantDescription(selectedVariant))}}}customElements.define("product-showcase",ProductShowcase);
2//# sourceMappingURL=/cdn/shop/t/24/assets/product-showcase.js.map?v=153549062821426459831765479671