https://www.bl101.com/cdn/shop/t/206/assets/custom-product-card.js?v=141886529723886724611787314548

1const CPC_SIZE_ORDER=["YXXS","YXS","YS","YM","YL","YXL","S","M","L","XL","2XL","3XL"];function cpcSortVariants(variants){return[...variants].sort((a,b)=>{const ai=CPC_SIZE_ORDER.indexOf((a.title||"").toUpperCase()),bi=CPC_SIZE_ORDER.indexOf((b.title||"").toUpperCase()),aN=parseFloat(a.title),bN=parseFloat(b.title);return ai!==-1&&bi!==-1?ai-bi:ai!==-1?-1:bi!==-1?1:!isNaN(aN)&&!isNaN(bN)?aN-bN:(a.title||"").localeCompare(b.title||"")})}function cpcFormatMoney(cents){return cents==null?"":`$${((typeof cents=="number"?cents:parseFloat(cents))/100).toFixed(2)} USD`}function cpcPriceHTML(priceCents,compareCents){const price=parseInt(priceCents,10),compare=compareCents?parseInt(compareCents,10):0,onSale=Number.isFinite(compare)&&compare>price,cur='<span class="cpc__currency">USD</span>',money=c=>`$${(c/100).toFixed(2)}`;let html=`<div class="price__regular"><span class="price-item price-item--regular">${money(price)} ${cur}</span></div>`;return onSale&&(html+=`<div class="price__sale"><s class="price-item price-item--regular">${money(compare)}</s><span class="price-item price-item--sale">${money(price)} ${cur}</span></div>`),{html,onSale}}class CustomProductCard extends HTMLElement{connectedCallback(){this._selectedVariantId=null,this._qvSelectedVariantId=null,this._qvQty=1,this._activeProduct=null,this._qvStale=!1,this._boundOnClick=this._onClick.bind(this),this.addEventListener("click",this._boundOnClick),this._qvModal=this.querySelector("[data-cpc-qv-modal]"),this._videoModal=this.querySelector("[data-cpc-video-modal]"),this._priceContainer=this.querySelector('.cpc__price [ref="priceContainer"]'),this._priceContainer&&(this._defaultPriceHTML=this._priceContainer.innerHTML,this._defaultPriceClass=this._priceContainer.className),this._escHandler=e=>{e.key==="Escape"&&this._closeAll()},document.addEventListener("keydown",this._escHandler),this._initHoverImage(),this._bindMobileAtc()}_portal(modal){modal&&(modal.parentNode!==document.body&&document.body.appendChild(modal),modal._cpcBound||(modal.addEventListener("click",this._boundOnClick),modal._cpcBound=!0))}_bindMobileAtc(){const btn=this.querySelector(".cpc__mobile-atc:not([disabled])");btn&&btn.addEventListener("click",e=>{e.stopPropagation(),this._openQv()})}_initHoverImage(){}updateHoverSrc(newSrc){const link=this.querySelector(".cpc__img-link");!link||!newSrc||link.setAttribute("onmouseenter",`var p=this.querySelector('img');if(p){p._s=p.src;p.src='${newSrc}'}`)}disconnectedCallback(){document.removeEventListener("keydown",this._escHandler),[this._qvModal,this._videoModal].forEach(m=>{m&&m.parentNode===document.body&&this.appendChild(m)}),document.body.style.overflow=""}_onClick(e){const t=e.target,vBtn=t.closest(".cpc__variant-btn:not([disabled])");if(vBtn){e.preventDefault(),this._selectVariant(vBtn);return}const atcBtn=t.closest("[data-cpc-atc]");if(atcBtn&&!atcBtn.disabled){e.preventDefault(),this._addToCart();return}const playBtn=t.closest("[data-cpc-play]");if(playBtn){e.preventDefault(),e.stopPropagation(),this._openVideo(playBtn.dataset.videoId);return}if(t.closest("[data-cpc-open-qv]")){e.preventDefault(),e.stopPropagation(),this._openQv();return}if(t.closest("[data-cpc-video-to-qv]")){e.preventDefault(),e.stopPropagation(),this._closeVideo(),this._openQv();return}if(t.closest("[data-cpc-close-video]")){e.preventDefault(),this._closeVideo();return}if(t.closest("[data-cpc-close-qv]")){e.preventDefault(),this._closeQv();return}if(t.hasAttribute("data-cpc-modal-bg")||t.classList.contains("cpc__modal-bg")){e.preventDefault(),this._closeAll();return}const qvVBtn=t.closest(".cpc__qv-variant-btn:not([disabled])");if(qvVBtn){e.preventDefault(),this._qvSelectVariant(qvVBtn);return}const qtyBtn=t.closest("[data-cpc-qty]");if(qtyBtn){e.preventDefault(),this._qvChangeQty(parseInt(qtyBtn.dataset.cpcQty));return}const qvAtc=t.closest("[data-cpc-qv-atc]");if(qvAtc&&!qvAtc.disabled){e.preventDefault(),this._qvAddToCart();return}}_selectVariant(btn){const id=btn.dataset.variantId,alreadySelected=this._selectedVariantId===id;this.querySelectorAll(".cpc__variant-btn").forEach(b=>b.classList.remove("cpc__variant-btn--selected")),alreadySelected?(this._selectedVariantId=null,this._restoreCardPrice()):(this._selectedVariantId=id,btn.classList.add("cpc__variant-btn--selected"),this._setCardPrice(btn.dataset.variantPrice,btn.dataset.variantCompareAtPrice)),this._refreshAtcBtn()}

1_setCardPrice(priceCents,compareCents){if(!this._priceContainer||priceCents==null||priceCents==="")return;const{html,onSale}=cpcPriceHTML(priceCents,compareCents);this._priceContainer.className=onSale?"price price--on-sale":"price",this._priceContainer.innerHTML=html}_restoreCardPrice(){!this._priceContainer||this._defaultPriceHTML==null||(this._priceContainer.className=this._defaultPriceClass,this._priceContainer.innerHTML=this._defaultPriceHTML)}_refreshAtcBtn(){const btn=this.querySelector("[data-cpc-atc]");if(!btn)return;const hasVariants=this.dataset.hasVariants==="true";if(!(this.dataset.productAvailable!=="false")){btn.disabled=!0,btn.textContent="Sold Out";return}if(!hasVariants){btn.disabled=!1,btn.textContent="Add to Cart";return}this._selectedVariantId?(btn.disabled=!1,btn.textContent="Add to Cart"):(btn.disabled=!0,btn.textContent="Select a Size")}_resolveVariantId(){return this.dataset.hasVariants==="true"?this._selectedVariantId:this.querySelector("[data-variant-id]")?.dataset.variantId}_addToCart(variantId=null,qty=1){const vid=variantId||this._resolveVariantId();if(!vid)return;const id=String(vid).includes("/")?String(vid).split("/").pop():String(vid);fetch("/cart/add.js",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({items:[{id,quantity:qty}]})}).then(r=>r.json()).then(()=>{document.dispatchEvent(new CustomEvent("cart:refresh",{bubbles:!0}))}).catch(err=>console.error("[cpc] add-to-cart error:",err))}_openVideo(videoId){const modal=this._videoModal;if(!modal)return;this._portal(modal);const iframe=modal.querySelector("[data-cpc-video-iframe]");iframe&&videoId&&(iframe.src=`https://www.youtube.com/embed/${videoId}?rel=0&modestbranding=1&autoplay=1&enablejsapi=1&controls=0&loop=1`),modal.hidden=!1,document.body.style.overflow="hidden"}_closeVideo(){const modal=this._videoModal;if(!modal)return;const iframe=modal.querySelector("[data-cpc-video-iframe]");iframe&&(iframe.src=""),modal.hidden=!0,this._restoreScroll()}_setActiveProduct(productData){productData&&(this._activeProduct=productData,this._qvStale=!0)}_openQv(){const modal=this._qvModal;if(!modal)return;this._portal(modal),this._qvStale&&this._activeProduct?(this._rebuildQv(this._activeProduct),this._qvStale=!1):this._ensureQvGallery(modal),clearTimeout(this._qvCloseTimer),modal.classList.remove("cpc__qv-modal--closing");const flyFrom=this._captureFlyFrom();modal.hidden=!1,document.body.style.overflow="hidden",this._flyCardImageIntoQv(modal,flyFrom);const bg=modal.querySelector(".cpc__modal-bg");bg&&(bg.style.animation="none",bg.offsetWidth,bg.style.animation="")}_ensureQvGallery(modal){const gallery=modal.querySelector(".cpc__qv-gallery");if(!gallery||gallery.dataset.cpcQvBuilt)return;gallery.dataset.cpcQvBuilt="1";const manifest=modal.querySelector("[data-cpc-qv-media]");if(!manifest)return;let media=[];try{media=JSON.parse(manifest.textContent)}catch{return}if(!Array.isArray(media)||!media.length)return;const esc=s=>String(s??"").replace(/"/g,"&quot;"),html=media.map((m,i)=>{const idx=i+1;return`<img src="${m.src}" alt="${esc(m.alt)}" class="cpc__qv-img" data-qv-img="${idx}" width="800" height="800" loading="lazy">`}).join("");gallery.insertAdjacentHTML("beforeend",html)}_rebuildQv(p){const modal=this._qvModal;if(!modal||!p)return;const money=c=>`$${(parseInt(c,10)/100).toFixed(2)}`,cur='<span class="cpc__currency">USD</span>',esc=s=>String(s??"").replace(/"/g,"&quot;"),gallery=modal.querySelector(".cpc__qv-gallery");if(gallery){const media=p.media&&p.media.length?p.media:(p.images||[]).map(src=>({src,alt:p.title}));gallery.innerHTML=media.map((m,i)=>`<img src="${m.src||m}" alt="${esc(m.alt||p.title)}" class="cpc__qv-img" data-qv-img="${i}" width="800" height="800" loading="${i===0?"eager":"lazy"}">`).join(""),gallery.dataset.cpcQvBuilt="1"}const titleEl=modal.querySelector(".cpc__qv-title");if(titleEl){const[name,color]=(p.title||"").split(" - ");if(titleEl.textContent=name||p.title||"",color){const span=document.createElement("span");span.className="cpc__title-color",span.textContent=color,titleEl.appendChild(span)}}const priceEl=modal.querySelector("[data-cpc-qv-price]");priceEl&&(p.price_varies?priceEl.innerHTML=`${money(p.price_min)} \u2013 ${money(p.price_max)} ${cur}`:p.compare_at_price&&p.compare_at_price>p.price?priceEl.innerHTML=`<s>${money(p.compare_at_price)}</s> <span>${money(p.price)} ${cur}</span>`:priceEl.innerHTML=`${money(p.price)} ${cur}`);const variants=p.variants||[],hasRealVariants=variants.length>1||variants.length===1&&variants[0].title!=="Default Title",variantsWrap=modal.querySelector(".cpc__qv-variants"),sizeWrap=modal.querySelector(".cpc__qv-size-wrap");variantsWrap&&hasRealVariants?(variantsWrap.innerHTML=cpcSortVariants(variants).map(v=>{const soldOut=v.inventory_quantity!=null?v.inventory_quantity<=0:v.available===!1,title=v.title==="Default Title"?"One Size":v.title||"";return`<button class="cpc__qv-variant-btn${soldOut?" cpc__qv-variant-btn--sold-out":""}" data-qv-variant-id="${v.id}" data-qv-variant-price="${v.price}" data-qv-variant-title="${esc(title)}" type="button"${soldOut?" disabled":""}>${title}</button>`}).join(""),sizeWrap&&(sizeWrap.style.display="")):sizeWrap&&(sizeWrap.style.display="none",variantsWrap&&(variantsWrap.innerHTML=""));const fullLink=modal.querySelector(".cpc__qv-full-link");fullLink&&(fullLink.href=p.url||`/products/${p.handle}`),this._qvSelectedVariantId=null,this._qvQty=1;

1const qtyInput=modal.querySelector(".cpc__qv-qty-input");qtyInput&&(qtyInput.value="1");const[minus,plus]=modal.querySelectorAll("[data-cpc-qty]");minus&&(minus.disabled=!0),plus&&(plus.disabled=!1);const atc=modal.querySelector("[data-cpc-qv-atc]");if(atc){const soldOut=p.available===!1;atc.disabled=soldOut||hasRealVariants,atc.textContent=soldOut?"Sold Out":hasRealVariants?"Select a Size":"Add to Cart"}}_captureFlyFrom(){if(window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches)return null;const img=this.querySelector(".cpc__img--primary");if(!img)return null;const rect=img.getBoundingClientRect();return!rect.width||!rect.height?null:{src:img.currentSrc||img.src,rect}}_flyCardImageIntoQv(modal,from){if(!from)return;const qvImg=modal.querySelector('.cpc__qv-img[data-qv-img="0"]');if(!qvImg)return;modal.classList.add("cpc__qv-modal--flying");const content=modal.querySelector(".cpc__qv-content"),prevAnim=content?content.style.animation:null;content&&(content.style.animation="none");const to=qvImg.getBoundingClientRect();if(content&&(content.style.animation=prevAnim),!to.width||!to.height){modal.classList.remove("cpc__qv-modal--flying");return}const clone=document.createElement("img");clone.src=from.src,clone.className="cpc__qv-fly",clone.style.left=`${to.left}px`,clone.style.top=`${to.top}px`,clone.style.width=`${to.width}px`,clone.style.height=`${to.height}px`;const dx=from.rect.left-to.left,dy=from.rect.top-to.top,sx=from.rect.width/to.width,sy=from.rect.height/to.height;clone.style.transform=`translate(${dx}px, ${dy}px) scale(${sx}, ${sy})`,document.body.appendChild(clone),qvImg.style.opacity="0";const cleanup=()=>{qvImg.style.opacity="",clone.remove()};requestAnimationFrame(()=>{clone.classList.add("cpc__qv-fly--in"),clone.style.transform="translate(0, 0) scale(1)"}),clone.addEventListener("transitionend",cleanup,{once:!0}),setTimeout(cleanup,700)}_closeQv(){const modal=this._qvModal;if(!modal||modal.hidden)return;if(window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches){this._finishCloseQv(modal);return}this._flyQvImageBackToCard(modal),modal.classList.add("cpc__qv-modal--closing"),clearTimeout(this._qvCloseTimer),this._qvCloseTimer=setTimeout(()=>this._finishCloseQv(modal),360)}_finishCloseQv(modal){modal.hidden=!0,modal.classList.remove("cpc__qv-modal--flying","cpc__qv-modal--closing");const qvImg=modal.querySelector('.cpc__qv-img[data-qv-img="0"]');qvImg&&(qvImg.style.opacity=""),this._restoreScroll()}_flyQvImageBackToCard(modal){const qvImg=modal.querySelector('.cpc__qv-img[data-qv-img="0"]'),cardImg=this.querySelector(".cpc__img--primary");if(!qvImg||!cardImg)return!1;const from=qvImg.getBoundingClientRect(),to=cardImg.getBoundingClientRect();if(!from.width||!from.height||!to.width||!to.height)return!1;const clone=document.createElement("img");clone.src=qvImg.currentSrc||qvImg.src,clone.className="cpc__qv-fly cpc__qv-fly--in",clone.style.left=`${from.left}px`,clone.style.top=`${from.top}px`,clone.style.width=`${from.width}px`,clone.style.height=`${from.height}px`,clone.style.transform="translate(0, 0) scale(1)",document.body.appendChild(clone),qvImg.style.opacity="0";const dx=to.left-from.left,dy=to.top-from.top,sx=to.width/from.width,sy=to.height/from.height;requestAnimationFrame(()=>{clone.style.transform=`translate(${dx}px, ${dy}px) scale(${sx}, ${sy})`});const remove=()=>clone.remove();return clone.addEventListener("transitionend",remove,{once:!0}),setTimeout(remove,600),!0}_closeAll(){this._closeVideo(),this._closeQv()}_restoreScroll(){const videoOpen=this._videoModal?!this._videoModal.hidden:!1,qvOpen=this._qvModal?!this._qvModal.hidden:!1;!videoOpen&&!qvOpen&&(document.body.style.overflow="")}_qvSelectVariant(btn){this._qvSelectedVariantId=btn.dataset.qvVariantId;const modal=this._qvModal;modal.querySelectorAll(".cpc__qv-variant-btn").forEach(b=>b.classList.remove("cpc__qv-variant-btn--selected")),btn.classList.add("cpc__qv-variant-btn--selected");const variantPrice=btn.dataset.qvVariantPrice;if(variantPrice){const priceEl=modal.querySelector("[data-cpc-qv-price]");priceEl&&(priceEl.textContent=cpcFormatMoney(parseInt(variantPrice)))}const atcBtn=modal.querySelector("[data-cpc-qv-atc]");atcBtn&&(atcBtn.disabled=!1,atcBtn.textContent="Add to Cart");let matchedCardBtn=null;this.querySelectorAll(".cpc__variant-btn").forEach(b=>{const match=b.dataset.variantId===this._qvSelectedVariantId;b.classList.toggle("cpc__variant-btn--selected",match),match&&(matchedCardBtn=b)}),matchedCardBtn&&this._setCardPrice(matchedCardBtn.dataset.variantPrice,matchedCardBtn.dataset.variantCompareAtPrice),this._selectedVariantId=this._qvSelectedVariantId,this._refreshAtcBtn()}_qvChangeQty(delta){this._qvQty=Math.max(1,Math.min(3,this._qvQty+delta));

1const modal=this._qvModal,input=modal.querySelector(".cpc__qv-qty-input");input&&(input.value=this._qvQty);const[minus,plus]=modal.querySelectorAll("[data-cpc-qty]");minus&&(minus.disabled=this._qvQty<=1),plus&&(plus.disabled=this._qvQty>=3)}_qvAddToCart(){const qvBtns=this._qvModal.querySelectorAll("[data-qv-variant-id]");if(qvBtns.length>0&&!this._qvSelectedVariantId)return;const vid=this._qvSelectedVariantId||qvBtns[0]?.dataset.qvVariantId;this._addToCart(vid,this._qvQty),this._closeQv()}}customElements.get("custom-product-card")||customElements.define("custom-product-card",CustomProductCard);
2//# sourceMappingURL=/cdn/shop/t/206/assets/custom-product-card.js.map?v=141886529723886724611787314548