https://barneybutter.com/cdn/shop/t/7/assets/paginated-list.js?v=44806173703066979421767805398

1import{Component}from"@theme/component";import{sectionRenderer}from"@theme/section-renderer";import{requestIdleCallback,viewTransition}from"@theme/utilities";export default class PaginatedList extends Component{pages=new Map;infinityScrollObserver;#resolveNextPagePromise=null;#resolvePreviousPagePromise=null;#imageRatioSetting=null;connectedCallback(){super.connectedCallback(),this.#storeImageRatioSettings(),this.#fetchPage("next"),this.#fetchPage("previous"),this.#observeViewMore()}#storeImageRatioSettings(){const firstCardGallery=this.querySelector('[ref="cardGallery"]');firstCardGallery&&(this.#imageRatioSetting=firstCardGallery.getAttribute("data-image-ratio"))}disconnectedCallback(){super.disconnectedCallback(),this.infinityScrollObserver&&this.infinityScrollObserver.disconnect()}#observeViewMore(){const{viewMorePrevious,viewMoreNext}=this.refs;!viewMorePrevious||!viewMoreNext||(this.infinityScrollObserver=new IntersectionObserver(async entries=>{viewTransition.current&&await viewTransition.current;for(const entry of entries)entry.isIntersecting&&(entry.target===viewMorePrevious?this.#renderPreviousPage():this.#renderNextPage())},{rootMargin:"100px"}),this.infinityScrollObserver.observe(viewMorePrevious),this.infinityScrollObserver.observe(viewMoreNext))}#shouldUsePage(pageInfo){return!(!pageInfo||pageInfo.page>this.#getLastPage()||pageInfo.page<1)}#getLastPage(){const{grid}=this.refs;return grid?Number(grid.getAttribute("last-page")):0}async#fetchPage(type){const page=this.#getPage(type);!page||!this.#shouldUsePage(page)||(this.pages.set(page.page,await sectionRenderer.getSectionHTML(this.sectionId,!0,page.url)),type==="next"?(this.#resolveNextPagePromise?.(),this.#resolveNextPagePromise=null):(this.#resolvePreviousPagePromise?.(),this.#resolvePreviousPagePromise=null))}async#renderNextPage(){const{grid}=this.refs;if(!grid)return;const nextPage=this.#getPage("next");if(!nextPage||!this.#shouldUsePage(nextPage))return;let nextPageItemElements=this.#getGridForPage(nextPage.page);!nextPageItemElements&&(await new Promise(res=>{this.#resolveNextPagePromise=res}),nextPageItemElements=this.#getGridForPage(nextPage.page),!nextPageItemElements)||(grid.append(...nextPageItemElements),this.#processNewElements(),history.pushState("","",nextPage.url.toString()),requestIdleCallback(()=>{this.#fetchPage("next")}))}async#renderPreviousPage(){const{grid}=this.refs;if(!grid)return;const previousPage=this.#getPage("previous");if(!previousPage||!this.#shouldUsePage(previousPage))return;let previousPageItemElements=this.#getGridForPage(previousPage.page);if(!previousPageItemElements&&(await new Promise(res=>{this.#resolvePreviousPagePromise=res}),previousPageItemElements=this.#getGridForPage(previousPage.page),!previousPageItemElements))return;const scrollTop=window.scrollY,firstElement=grid.firstElementChild,oldHeight=firstElement?firstElement.getBoundingClientRect().top+window.scrollY:0;if(grid.prepend(...previousPageItemElements),this.#processNewElements(),history.pushState("","",previousPage.url.toString()),firstElement){const heightDiff=firstElement.getBoundingClientRect().top+window.scrollY-oldHeight;window.scrollTo({top:scrollTop+heightDiff,behavior:"instant"})}requestIdleCallback(()=>{this.#fetchPage("previous")})}#processNewElements(){requestAnimationFrame(()=>{this.#imageRatioSetting==="adapt"?this.#fixAdaptiveAspectRatios():this.#applyFixedAspectRatio()})}#getUnprocessedGalleries(){return this.querySelectorAll(".card-gallery:not([data-aspect-ratio-applied])")}#markAsProcessed(gallery){gallery instanceof HTMLElement&&gallery.setAttribute("data-aspect-ratio-applied","true")}#getSafeImageAspectRatio(width,height){const rawRatio=width/height;return Math.max(.1,Math.min(10,rawRatio)).toFixed(3)}#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)}#fixAdaptiveAspectRatios(){const newCardGalleries=this.#getUnprocessedGalleries();if(!newCardGalleries.length)return;const productRatioCache=new Map;

1newCardGalleries.forEach(gallery=>{if(!(gallery instanceof HTMLElement))return;const productId=gallery.getAttribute("data-product-id");if(productId&&productRatioCache.has(productId)){this.#applyAspectRatioToGallery(gallery,productRatioCache.get(productId));return}const img=gallery.querySelector("img");if(!img){this.#applyAspectRatioToGallery(gallery,"1");return}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.complete?loadAndSetRatio():img.addEventListener("load",loadAndSetRatio,{once:!0})})}#applyFixedAspectRatio(){if(!this.#imageRatioSetting)return;const aspectRatio=this.#getAspectRatioValue(this.#imageRatioSetting);if(!aspectRatio)return;const newCardGalleries=this.#getUnprocessedGalleries();newCardGalleries.length&&requestAnimationFrame(()=>{newCardGalleries.forEach(gallery=>{gallery instanceof HTMLElement&&this.#applyAspectRatioToGallery(gallery,aspectRatio)})})}static ASPECT_RATIOS={square:"1",portrait:"0.8",landscape:"1.778"};#getAspectRatioValue(ratioSetting){return PaginatedList.ASPECT_RATIOS[ratioSetting]||null}#getPage(type){const{cards}=this.refs,isPrevious=type==="previous";if(!Array.isArray(cards))return;const targetCard=cards[isPrevious?0:cards.length-1];if(!targetCard)return;const page=isPrevious?Number(targetCard.dataset.page)-1:Number(targetCard.dataset.page)+1,url=new URL(window.location.href);return url.searchParams.set("page",page.toString()),url.hash="",{page,url}}#getGridForPage(page){const pageHTML=this.pages.get(page);if(!pageHTML)return;const gridElement=new DOMParser().parseFromString(pageHTML,"text/html").querySelector('[ref="grid"]');if(gridElement)return gridElement.querySelectorAll(':scope > [ref="cards[]"]')}get sectionId(){const id=this.getAttribute("section-id");if(!id)throw new Error("The section-id attribute is required");return id}}
2//# sourceMappingURL=/cdn/shop/t/7/assets/paginated-list.js.map?v=44806173703066979421767805398