https://museumstore.hmns.org/cdn/shop/t/40/assets/item-grid.js?v=109905781791598941741789141419

1import CollectionSidebar from"@archetype-themes/modules/collection-sidebar";import AjaxRenderer from"@archetype-themes/utils/ajax-renderer";import{debounce}from"@archetype-themes/utils/utils";import{EVENTS}from"@archetype-themes/utils/events";class ItemGrid extends HTMLElement{constructor(){super(),this.isAnimating=!1,this.abortController=new AbortController,this.selectors={sortSelect:"#SortBy",viewChange:".grid-view-btn",productGrid:".product-grid",collectionGrid:".collection-grid__wrapper",sidebar:"#CollectionSidebar",activeTagList:".tag-list--active-tags",tags:".tag-list input",activeTags:".tag-list a",tagsForm:".filter-form",filterBar:".collection-filter",priceRange:".price-range",trigger:".collapsible-trigger"},this.classes={activeTag:"tag--active",removeTagParent:"tag--remove",collapsibleContent:"collapsible-content",isOpen:"is-open"},this.sectionId=this.getAttribute("data-section-id"),this.ajaxRenderer=new AjaxRenderer({sections:[{sectionId:this.sectionId,nodeId:"AjaxContent"}],onReplace:this.onReplaceAjaxContent.bind(this)}),this.isStickyHeader=!1}connectedCallback(){this.abortController=new AbortController,this.init(),document.querySelector('header[data-sticky="true"]')&&this.setFilterStickyPosition(),document.addEventListener(EVENTS.stickyHeaderChange,this.handleStickyHeaderChange.bind(this),{signal:this.abortController.signal}),document.addEventListener(EVENTS.toggleMobileFilters,this.handleToggleMobileFilters.bind(this),{signal:this.abortController.signal})}disconnectedCallback(){this.abortController.abort(),this.headerStickyChangeListener&&document.removeEventListener("headerStickyChange",this.headerStickyChangeListener),this.resizeListener&&window.removeEventListener("resize",this.resizeListener)}handleToggleMobileFilters(evt){const{isOpen}=evt.detail;if(isOpen){document.dispatchEvent(new CustomEvent(EVENTS.sizeDrawer,{detail:{heights:[document.querySelector(this.selectors.filterBar).offsetHeight]}}));let scrollTo=this.getScrollFilterTop();window.scrollTo({top:scrollTo,behavior:"smooth"})}}init(){this.initSort(),this.initFilters(),this.initPriceRange(),this.initGridOptions(),this.sidebar=new CollectionSidebar}handleStickyHeaderChange(evt){this.isStickyHeader=evt.detail.isSticky,this.isStickyHeader&&this.setFilterStickyPosition()}initSort(){this.queryParams=new URLSearchParams(window.location.search),this.sortSelect=document.querySelector(this.selectors.sortSelect),this.sortSelect&&(this.defaultSort=this.getDefaultSortValue(),this.sortSelect.addEventListener("change",()=>{this.onSortChange()},{signal:this.abortController.signal})),document.addEventListener(EVENTS.sortSelected,evt=>{this.onSortChange(evt.detail.sortValue)})}getSortValue(){return this.sortSelect.value||this.defaultSort}getDefaultSortValue(){return this.sortSelect.getAttribute("data-default-sortby")}onSortChange(sortValue=null){this.queryParams=new URLSearchParams(window.location.search),sortValue?this.queryParams.set("sort_by",sortValue):this.queryParams.set("sort_by",this.getSortValue()),this.queryParams.delete("page"),window.location.search=this.queryParams.toString()}initGridOptions(){const grid=this.querySelector(this.selectors.productGrid),viewBtns=this.querySelectorAll(this.selectors.viewChange);viewBtns.forEach(btn=>{btn.addEventListener("click",()=>{viewBtns.forEach(el=>{el.classList.remove("is-active")}),btn.classList.add("is-active");const newView=btn.dataset.view;grid.dataset.view=newView,this.updateAttribute("product_view",newView),window.dispatchEvent(new Event("resize"))},{signal:this.abortController.signal})})}updateAttribute(key,value){return fetch(window.Shopify.routes.root+"cart/update.js",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({attributes:{[key]:value}})}).then(response=>{if(!response.ok)throw response;return response.json()})}initFilters(){document.querySelectorAll(this.selectors.filterBar).length&&(this.bindBackButton(),this.dispatchEvent(new CustomEvent(EVENTS.headerStickyCheck),{bubbles:!0}),this.isStickyHeader&&(this.setFilterStickyPosition(),document.addEventListener("headerStickyChange",debounce(500,this.setFilterStickyPosition.bind(this)),{signal:this.abortController.signal}),window.addEventListener("resize",debounce(500,this.setFilterStickyPosition.bind(this)),{signal:this.abortController.signal}

1)),document.querySelectorAll(this.selectors.activeTags).forEach(tag=>{tag.addEventListener("click",this.onTagClick.bind(this),{signal:this.abortController.signal})}),document.querySelectorAll(this.selectors.tagsForm).forEach(form=>{form.addEventListener("input",this.onFormSubmit.bind(this),{signal:this.abortController.signal})}))}initPriceRange(){document.addEventListener("price-range:change",this.onPriceRangeChange.bind(this),{once:!0,signal:this.abortController.signal})}onPriceRangeChange(event){this.renderFromFormData(event.detail)}renderActiveTag(parent,el){const textEl=parent.querySelector(".tag__text");parent.classList.contains(this.classes.activeTag)?parent.classList.remove(this.classes.activeTag):(parent.classList.add(this.classes.activeTag),el.closest("li").classList.contains(this.classes.removeTagParent)?parent.remove():document.querySelectorAll(this.selectors.activeTagList).forEach(list=>{const newTag=document.createElement("li"),newTagLink=document.createElement("a");newTag.classList.add("tag","tag--remove"),newTagLink.classList.add("btn","btn--small"),newTagLink.innerText=textEl.innerText,newTag.appendChild(newTagLink),list.appendChild(newTag)}))}onTagClick(evt){const el=evt.currentTarget;if(this.dispatchEvent(new Event("filter:selected",{bubbles:!0})),el.classList.contains("no-ajax")||(evt.preventDefault(),this.isAnimating))return;this.isAnimating=!0;const parent=el.parentNode,newUrl=new URL(el.href);this.renderActiveTag(parent,el),this.updateScroll(!0),this.startLoading(),this.renderCollectionPage(newUrl.searchParams)}onFormSubmit(evt){const el=evt.target;if(this.dispatchEvent(new Event("filter:selected",{bubbles:!0})),el.classList.contains("no-ajax")||(evt.preventDefault(),this.isAnimating))return;this.isAnimating=!0;const parent=el.closest("li"),formEl=el.closest("form"),formData=new FormData(formEl);this.renderActiveTag(parent,el),this.updateScroll(!0),this.startLoading(),this.renderFromFormData(formData)}onReplaceAjaxContent(newDom,section){this.fetchOpenCollapsibleFilters().forEach(selector=>{newDom.querySelectorAll(`[data-collapsible-id=${selector}]`).forEach(this.openCollapsible.bind(this))});const newContentEl=newDom.getElementById(section.nodeId);if(!newContentEl)return;document.getElementById(section.nodeId).innerHTML=newContentEl.innerHTML;const countEl=document.getElementById(section.nodeId).querySelector(".collection-filter__item--count");if(countEl){const count=countEl.innerText;document.querySelectorAll("[data-collection-count]").forEach(el=>{el.innerText=count})}}renderFromFormData(formData){const searchParams=new URLSearchParams(formData);this.renderCollectionPage(searchParams)}renderCollectionPage(searchParams,updateURLHash=!0){this.ajaxRenderer.renderPage(window.location.pathname,searchParams,updateURLHash).then(()=>{this.init(),this.updateScroll(!1),this.dispatchEvent(new CustomEvent("collection:reloaded",{bubbles:!0})),this.isAnimating=!1})}updateScroll(animate){let scrollTo=document.getElementById("AjaxContent").offsetTop;this.isStickyHeader&&(scrollTo=scrollTo-document.querySelector("#SiteHeader").offsetHeight),matchMedia("(max-width: 768px)").matches||(scrollTo-=10),animate?window.scrollTo({top:scrollTo,behavior:"smooth"}):window.scrollTo({top:scrollTo})}bindBackButton(){window.removeEventListener("popstate",this._popStateHandler),this._popStateHandler=state=>{if(state){const newUrl=new URL(window.location.href);this.renderCollectionPage(newUrl.searchParams,!1)}},window.addEventListener("popstate",this._popStateHandler,{signal:this.abortController.signal})}fetchOpenCollapsibleFilters(){const openDesktopCollapsible=Array.from(document.querySelectorAll(`${this.selectors.sidebar} ${this.selectors.trigger}.${this.classes.isOpen}`)),openMobileCollapsible=Array.from(document.querySelectorAll(`${this.selectors.inlineWrapper} ${this.selectors.trigger}.${this.classes.isOpen}`));return[...openDesktopCollapsible,...openMobileCollapsible].map(trigger=>trigger.dataset.collapsibleId)}openCollapsible(el){el.classList.contains(this.classes.collapsibleContent)&&(el.style.height="auto"),el.classList.add(this.classes.isOpen)}setFilterStickyPosition(){const headerHeight=document.querySelector(".site-header").offsetHeight-1;document.querySelector(this.selectors.filterBar).style.top=headerHeight+"px";const stickySidebar=this.querySelector("[data-sticky-sidebar]");stickySidebar&&(stickySidebar.style.top=headerHeight+30+"px")}startLoading(){this.querySelector(this.selectors.collectionGrid).classList.add("unload")}forceReload(){this.init()}getScrollFilterTop(){let scrollTop=window.pageYOffset||document.documentElement.scrollTop;return document.querySelector(this.selectors.filterBar).getBoundingClientRect().top+scrollTop}}customElements.define("item-grid",ItemGrid);
2//# sourceMappingURL=/cdn/shop/t/40/assets/item-grid.js.map?v=109905781791598941741789141419