https://urbanroad.com/cdn/shop/t/184/assets/pairs-well-with-section.js?v=137245564494986743021787809863

1if(!customElements.get("pairs-well-with-section")){class PairsWellWithSection extends HTMLElement{connectedCallback(){if(this.dataset.initialized!=="true"){if(this.dataset.initialized="true",this.onClick=this.onClick.bind(this),this.onScroll=this.onScroll.bind(this),this.addEventListener("click",this.onClick),this.dataset.recommendationsPerformed==="true"){this.prepareProducts(),this.finishLoading();return}if(!this.dataset.url){this.hideEmptySection();return}this.loadRecommendations()}}disconnectedCallback(){this.removeEventListener("click",this.onClick),this.list?.removeEventListener("scroll",this.onScroll),this.duplicateObserver?.disconnect(),window.clearTimeout(this.duplicateObserverTimer)}async loadRecommendations(){try{const response=await fetch(this.dataset.url);if(!response.ok)throw new Error(`HTTP ${response.status}`);const html=await response.text(),incoming=new DOMParser().parseFromString(html,"text/html").querySelector(`pairs-well-with-section[data-section-id="${this.dataset.sectionId}"]`);if(!incoming||!incoming.innerHTML.trim()){this.hideEmptySection();return}this.innerHTML=incoming.innerHTML,this.dataset.recommendationsPerformed="true",this.prepareProducts(),this.finishLoading()}catch(error){console.error("You might also like recommendations failed to load.",error),this.hideEmptySection()}}prepareProducts(){this.list=this.querySelector(".pdp-pairs-well-with__list"),this.list&&(this.dataset.shuffle==="true"&&this.shuffleItems(),this.dataset.excludeExisting==="true"&&(this.removeProductsShownElsewhere(),this.watchForOtherRecommendationSections()),this.applyProductLimit(),this.list.addEventListener("scroll",this.onScroll,{passive:!0}),requestAnimationFrame(()=>this.updateControls()))}getItems(){return this.list?Array.from(this.list.querySelectorAll(".pdp-pairs-well-with__item")):[]}shuffleItems(){const items=this.getItems();for(let index=items.length-1;index>0;index-=1){const randomIndex=Math.floor(Math.random()*(index+1));[items[index],items[randomIndex]]=[items[randomIndex],items[index]]}items.forEach(item=>this.list.appendChild(item))}getProductHandle(url){const match=String(url||"").match(/\/products\/([^/?#]+)/i);return match?match[1].toLowerCase():""}getHandlesShownElsewhere(){const handles=new Set;return document.querySelectorAll(".pdp-pairs-well-with").forEach(container=>{container===this||this.contains(container)||container.querySelectorAll('a[href*="/products/"]').forEach(link=>{const handle=this.getProductHandle(link.getAttribute("href"));handle&&handles.add(handle)})}),handles}removeProductsShownElsewhere(){const existingHandles=this.getHandlesShownElsewhere();

1existingHandles.size&&(this.getItems().forEach(item=>{const link=item.querySelector('a[href*="/products/"]'),handle=this.getProductHandle(link?.getAttribute("href"));handle&&existingHandles.has(handle)&&item.remove()}),this.applyProductLimit(),this.updateControls())}watchForOtherRecommendationSections(){this.duplicateObserver?.disconnect(),this.duplicateObserver=new MutationObserver(()=>{this.removeProductsShownElsewhere()}),this.duplicateObserver.observe(document.body,{childList:!0,subtree:!0}),this.duplicateObserverTimer=window.setTimeout(()=>{this.duplicateObserver?.disconnect()},5e3)}applyProductLimit(){const limit=Number.parseInt(this.dataset.productLimit,10)||8;this.getItems().forEach((item,index)=>{item.hidden=index>=limit})}getVisibleItems(){return this.getItems().filter(item=>!item.hidden)}finishLoading(){if(!this.getVisibleItems().length){this.hideEmptySection();return}this.hidden=!1,this.closest(".pairs-well-with-section-shell")?.classList.add("pairs-well-with-section-shell--loaded"),this.updateControls()}hideEmptySection(){this.hidden=!0;const shell=this.closest(".pairs-well-with-section-shell");shell&&(shell.hidden=!0)}onClick(event){const button=event.target.closest("[data-pairs-direction]");if(!button||!this.contains(button)||!this.list)return;const direction=button.dataset.pairsDirection,maximumScroll=this.list.scrollWidth-this.list.clientWidth,isAtStart=this.list.scrollLeft<=2,isAtEnd=this.list.scrollLeft>=maximumScroll-2;direction==="previous"?this.list.scrollTo({left:isAtStart?maximumScroll:Math.max(0,this.list.scrollLeft-this.list.clientWidth),behavior:"smooth"}):this.list.scrollTo({left:isAtEnd?0:Math.min(maximumScroll,this.list.scrollLeft+this.list.clientWidth),behavior:"smooth"})}onScroll(){window.cancelAnimationFrame(this.scrollFrame),this.scrollFrame=requestAnimationFrame(()=>this.updateControls())}updateControls(){if(!this.list)return;const previous=this.querySelector('[data-pairs-direction="previous"]'),next=this.querySelector('[data-pairs-direction="next"]'),hasOverflow=this.list.scrollWidth>this.list.clientWidth+2;previous&&(previous.hidden=!hasOverflow||this.list.scrollLeft<=2),next&&(next.hidden=!hasOverflow)}}customElements.define("pairs-well-with-section",PairsWellWithSection)}
2//# sourceMappingURL=/cdn/shop/t/184/assets/pairs-well-with-section.js.map?v=137245564494986743021787809863