1/*! Copyright (c) Safe As Milk. All rights reserved. */class ProductCardSwatches extends HTMLElement{constructor(){super(),this.product=this.closest(".js-product"),this.productLink=this.product.querySelector(".js-product-link"),this.image=this.product.querySelector(".js-img-grid"),this.hoverImage=this.product.querySelector(".js-img-grid-hover"),this.triggers=this.querySelectorAll(".js-product-swatch-item"),this.triggers.forEach((el=>el.addEventListener("click",(e=>{this.updateCardImage(e.target),this.updateQuickShopVariant(e.target)}))))}updateCardImage(swatch){const createSrcsetString=(srcSetWidths,url,originalWidth,originalHeight)=>{if(!srcSetWidths||!url||!originalWidth||!originalHeight)return"";const aspectRatio=parseInt(originalHeight,10)/parseInt(originalWidth,10);return srcSetWidths.reduce(((srcSetString,srcSetWidth)=>`${srcSetString}${url.replace("{width}",srcSetWidth)} ${srcSetWidth}w ${Math.floor(srcSetWidth*aspectRatio)}h,`),"")},variantProductImage=swatch.dataset.variantImage,variantProductImageWidth=swatch.dataset.variantImageWidth,variantProductImageHeight=swatch.dataset.variantImageHeight,{variantUrl}=swatch.dataset,newSrc=variantProductImage.replace("{width}","300"),newSrcset=createSrcsetString([180,360,540,720,900,1080,1296,1512],variantProductImage,variantProductImageWidth,variantProductImageHeight);this.image.setAttribute("src",newSrc),this.image.setAttribute("width","300"),this.image.setAttribute("height",Math.floor(300*(parseInt(variantProductImageHeight,10)/parseInt(variantProductImageWidth,10)))),this.image.setAttribute("srcset",newSrcset),this.productLink.setAttribute("href",variantUrl);const activeSwatch=this.product.querySelector(".js-active");if(activeSwatch&&activeSwatch.classList.remove("js-active"),swatch.classList.add("js-active"),this.hoverImage){const imageSrc=this.image.src,hoverSrc=this.hoverImage.src,hoverEnabledClass="hover-enabled",hoverDisabledClass="hover-disabled";imageSrc===hoverSrc?(this.image.classList.remove(hoverEnabledClass),this.hoverImage.classList.remove(hoverEnabledClass),this.image.classList.add(hoverDisabledClass),this.hoverImage.classList.add(hoverDisabledClass)):(this.image.classList.remove(hoverDisabledClass),this.hoverImage.classList.remove(hoverDisabledClass),this.image.classList.add(hoverEnabledClass),this.hoverImage.classList.add(hoverEnabledClass))}return!1}updateQuickShopVariant(swatch){const{variantId}=swatch.dataset,quickShop=this.product.querySelector("quick-shop");variantId&&quickShop&&(quickShop.variantId=variantId)}}customElements.define("product-card-swatches",ProductCardSwatches); 2//# sourceMappingURL=/cdn/shop/t/108/assets/product-card-swatches.js.map?v=29588182373378967521789968024
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.