1import{yieldToMainThread}from"@theme/utilities";export class PaginatedListAspectRatioHelper{#imageRatioSetting=null;#ASPECT_RATIOS={square:"1",portrait:"0.8",landscape:"1.778"};constructor({templateCard}){Shopify.designMode&&this.#storeImageRatioSettings(templateCard)}processNewElements(){Shopify.designMode&&requestAnimationFrame(()=>{this.#imageRatioSetting==="adapt"?this.#fixAdaptiveAspectRatios():this.#applyFixedAspectRatio()})}#storeImageRatioSettings(templateCard){this.#imageRatioSetting=templateCard.getAttribute("data-image-ratio")}async#fixAdaptiveAspectRatios(){const newCardGalleries=this.#getUnprocessedGalleries();if(!newCardGalleries.length)return;const BATCH_SIZE=15,productRatioCache=new Map;let processed=0;for(const gallery of newCardGalleries){if(!(gallery instanceof HTMLElement))continue;const productId=gallery.getAttribute("data-product-id");if(productId&&productRatioCache.has(productId))this.#applyAspectRatioToGallery(gallery,productRatioCache.get(productId));else{const img=gallery.querySelector("img");if(!img)this.#applyAspectRatioToGallery(gallery,"1");else if(img.complete&&img.naturalWidth&&img.naturalHeight){const imgRatio=this.#getSafeImageAspectRatio(img.naturalWidth,img.naturalHeight);
1productId&&productRatioCache.set(productId,imgRatio),this.#applyAspectRatioToGallery(gallery,imgRatio)}else{const loadAndSetRatio=()=>{if(!img.naturalWidth||!img.naturalHeight)return;const imgRatio=this.#getSafeImageAspectRatio(img.naturalWidth,img.naturalHeight);productId&&productRatioCache.set(productId,imgRatio),this.#applyAspectRatioToGallery(gallery,imgRatio)};img.addEventListener("load",loadAndSetRatio,{once:!0});continue}}++processed%BATCH_SIZE===0&&await yieldToMainThread()}}async#applyFixedAspectRatio(){if(!this.#imageRatioSetting)return;const aspectRatio=this.#getAspectRatioValue(this.#imageRatioSetting);if(!aspectRatio)return;const newCardGalleries=this.#getUnprocessedGalleries();if(!newCardGalleries.length)return;const BATCH_SIZE=15;let processed=0;for(const gallery of newCardGalleries)gallery instanceof HTMLElement&&(this.#applyAspectRatioToGallery(gallery,aspectRatio),++processed%BATCH_SIZE===0&&await yieldToMainThread())}#getSafeImageAspectRatio(width,height){const rawRatio=width/height;return Math.max(.1,Math.min(10,rawRatio)).toFixed(3)}#getAspectRatioValue(ratioSetting){return this.#ASPECT_RATIOS[ratioSetting]||null}#applyAspectRatioToGallery(gallery,aspectRatio){if(!(gallery instanceof HTMLElement))return;gallery.style.setProperty("--gallery-aspect-ratio",aspectRatio),gallery.querySelectorAll(".product-media-container").forEach(container=>{container instanceof HTMLElement&&(container.style.aspectRatio=aspectRatio)}),this.#markAsProcessed(gallery)}#getUnprocessedGalleries(){return document.querySelectorAll(".card-gallery:not([data-aspect-ratio-applied])")}#markAsProcessed(gallery){gallery instanceof HTMLElement&&gallery.setAttribute("data-aspect-ratio-applied","true")}} 2//# sourceMappingURL=/cdn/shop/t/503/assets/paginated-list-aspect-ratio.js.map?v=83462542864828850261790725531
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.