https://www.drinknovice.com/cdn/shop/t/15/assets/component-compare…?v=109060278557111993951777983331

1const x=()=>{const a={addButton:".js-compare-products-button",productButton:".js-compare-products-popup-button",stickyAddToCart:".js-sticky-add-to-cart",compareProductCard:".js-compare-product",compareProducts:".js-compare-products",modal:"compare-products",compareProductRow:".js-product-compare-row",removeButton:".js-product-compare-remove"},d={product:"data-product-handle",productTitle:"data-product-title",ariaLabel:"aria-label",count:"data-count",empty:"data-empty"},v=6,p={...window.themeCore.utils.cssClasses,bigPadding:"big-padding"};let n,m,w,h,u,l;function L(){n=document.querySelector(a.productButton),n&&(T(),g(),b(),_())}function b(){window.themeCore.EventBus.listen("compare-products:init",g)}function g(){m={add:window.themeCore.translations.get("products.compare_products.product_button_add"),remove:window.themeCore.translations.get("products.compare_products.product_button_remove"),error:window.themeCore.translations.get("products.compare_products.quantity_error")},w=window.themeCore.utils.overlay,h=window.themeCore.utils.Toggle;const e=[...document.querySelectorAll(a.addButton)];if(!e.length)return;const t=i();e.forEach(o=>{const c=o.getAttribute(d.product);if(!c)return;const r=o.getAttribute(d.productTitle);if(r){const s=m[t.includes(c)?"remove":"add"].replaceAll("{{ product }}",r);o.setAttribute(d.ariaLabel,s)}o.classList.toggle(p.active,t.includes(c)),o.classList.remove(p.hidden)}),n.setAttribute(d.count,t.length)}function i(){const e=localStorage.getItem("theme-compare-products");if(!e)return[];try{return JSON.parse(e)}catch{return[]}}function f(e){if(e){if(e.length>v){B();return}localStorage.setItem("theme-compare-products",JSON.stringify(e)),g()}}function P(e){let t=i();t.includes(e)?t=t.filter(o=>o!==e):t=[...t,e],f(t)}function C(e){let t=i();t=t.filter(o=>o!==e),f(t)}function _(){document.addEventListener("click",A),document.addEventListener("click",S),n.addEventListener("click",E)}function A(e){const t=e.target.closest(a.addButton);if(!t)return;const o=t.getAttribute(d.product);o&&P(o)}function S(e){const t=e.target.closest(a.removeButton);if(!t)return;const o=t.getAttribute(d.product);if(!o)return;C(o);const c=i().length,r=document.querySelector(a.compareProducts);if(r){if(c<2){l.close(u);return}[...r.querySelectorAll(`[${d.product}="${o}"]`)].forEach(M=>M.remove()),r.style=`--compare-products-count: ${c}`}}function T(){!!document.querySelector(a.stickyAddToCart)&&n.classList.add(p.bigPadding)}function B(){setTimeout(()=>{const e=window.themeCore.CartNotificationError;e.addNotification(m.error,window.themeCore.translations.get("products.compare_products.quantity_error_heading")),e.open()})}async function E(){const e=i();n.disabled=!0,w({namespace:"compare-products-preloader"}).open(!0);let t=(await j()).map(c=>c.value);t.forEach((c,r)=>!c&&C(e[r])),t=t.filter(Boolean),u=q(t),u.style=`--compare-products-count: ${t.length}`,document.body.append(u);const o={toggleSelector:a.modal,previouslySelectedElement:n};l=h(o),l.init({once:!0}),l.open(u),setTimeout(()=>u.focus(),50),n.disabled=!1}async function j(){const e=i();try{return await Promise.allSettled(e.map(t=>$(t)))}catch(t){console.log(t)}}async function $(e){const o=`${window.Shopify.routes.root}products/${e}?view=compare`;return await k(o,a.compareProductCard)}async function k(e,t){try{const c=await(await fetch(e)).text();let r=new DOMParser().parseFromString(c,"text/html");return t&&(r=r.querySelector(t)),r}catch(o){console.log(o)}}function q(e){const t=document.createElement("html");t.innerHTML=e.map(r=>r.outerHTML).join(" ");let o=Array.from(Array(11)).map((r,s)=>[...t.querySelectorAll(`${a.compareProductRow}[data-index="${s+1}"]`)]);o=o.filter(r=>!r.every(s=>s.hasAttribute(d.empty)));const c=document.createElement("html");return c.innerHTML=`
2			<div
3			class="modal compare-products js-compare-products"
4			id="compare-products"
5			data-modal-once="true"
6			tabindex="-1"
7			aria-modal="true"
8			role="dialog"
9			>
10				<header class="modal__header compare-products__header">
11					${window.themeCore.compareProductsTitle&&`<h2 class="compare-products__heading">
12							${window.themeCore.compareProductsTitle}
13						</h2>`}
14
15					<button
16						class="popup-close-icon-button focus-visible-outline"
17						data-target="compare-products"
18						aria-label="${window.themeCore.translations.get("general.accessibility.close")}"
19						data-js-toggle="compare-products"
20					>
21						<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
22							<path d="M14 1.41L12.59 0L7 5.59L1.41 0L0 1.41L5.59 7L0 12.59L1.41 14L7 8.41L12.59 14L14 12.59L8.41 7L14 1.41Z"></path>
23						</svg>
24					</button>
25				</header>
26
27				<div class="modal__body compare-products__body">
28					<div class="modal__body compare-product-card">
29						 ${o.map(r=>`<div class="compare-products__row">${r.map(s=>s.outerHTML).join("")}</div>`).join("")}
30					</div>

31				</div>
32			</div>
33		`,c.querySelector(a.compareProducts)}return Object.freeze({init:L})},y=()=>{window.themeCore.CompareProducts=window.themeCore.CompareProducts||x(),window.themeCore.utils.register(window.themeCore.CompareProducts,"compare-products")};window.themeCore&&window.themeCore.loaded?y():document.addEventListener("theme:all:loaded",y,{once:!0});