// Fix for Fast Simon price update issue on search results and PDP recommendation widget (() => { const fmt = new Intl.NumberFormat(undefined, { style: 'currency', currency: window.Shopify?.currency?.active || 'USD', currencyDisplay: 'narrowSymbol' }); const money = (c) => fmt.format((Number(c) || 0) / 100); const handleFromUrl = (u) => ((u || '').split('/products/')[1] || '').split(/[?#]/)[0]; const MARKERS = ['data-abra-block', 'data-abra-selector', 'data-abra-rendered']; const SEL = MARKERS.map((a) => `[${a}]`).join(','); const abraRendered = (item) => !!item.querySelector(SEL); const clearMarkers = (item) => [item, ...item.querySelectorAll(SEL)].forEach((el) => MARKERS.forEach((a) => el.removeAttribute(a))); const abraRender = () => { if (window.Abra?.render) try { window.Abra.render(); } catch (e) {} }; const cache = new Map(), resolved = new Map(); const fetchPrice = (handle) => { if (!cache.has(handle)) { cache.set(handle, fetch(`/products/${handle}.js`, { headers: { Accept: 'application/json' } }) .then((r) => (r.ok ? r.json() : Promise.reject())) .then((d) => { const data = { price: d.price, compare: d.compare_at_price }; resolved.set(handle, data); return data; }) .catch(() => (cache.delete(handle), null))); } return cache.get(handle); }; function handleAutocomplete() { let timer, retries = 0, dirty = false; const items = () => document.querySelectorAll('.fast-simon-autocomplete .fs-product'); const itemHandle = (item) => handleFromUrl(item.getAttribute('href') || item.getAttribute('data-uw-original-href') || ''); const renderPrice = (el, price, compare) => { const has = compare && Number(compare) > Number(price); el.innerHTML = `${money(price)}` + (has ? `${money(compare)}` : ''); el.classList.toggle('compareExist', !!has); }; const syncItem = (item, handle) => { const price = item?.querySelector('.price'); if (handle && price && price.getAttribute('data-product-handle') !== handle) { price.setAttribute('data-product-handle', handle); clearMarkers(item); dirty = true; } }; const sync = () => { items().forEach((item) => syncItem(item, itemHandle(item))); const changed = dirty; dirty = false; return changed; }; const fallback = () => items().forEach((item) => { const handle = itemHandle(item), priceEl = item.querySelector('.price'); if (abraRendered(item) || !handle || !priceEl) return; fetchPrice(handle).then((data) => { if (data && document.contains(priceEl) && itemHandle(item) === handle && !abraRendered(item)) renderPrice(priceEl, data.price, data.compare); }); }); const hasFailure = () => [...items()].some((item) => { const handle = itemHandle(item), priceEl = item.querySelector('.price'); if (!handle || !priceEl) return false; if (priceEl.getAttribute('data-product-handle') !== handle) return true; const data = resolved.get(handle); return !abraRendered(item) && data && !priceEl.textContent.includes(money(data.price)); }); const render = () => { if (sync()) abraRender(); setTimeout(fallback, 150); setTimeout(() => { if (hasFailure() && retries++ < 2) render(); }, 800); }; const schedule = () => { clearTimeout(timer); timer = setTimeout(() => { retries = 0; render(); }, 50); }; const onItem = (payload) => { if (payload?.element) syncItem(payload.element, handleFromUrl(payload.product?.u)); schedule(); }; window.FastAutocomplete ? window.FastAutocomplete.registerHook?.('render-autocomplete-product-item', onItem) : addEventListener('fast-autocomplete-ready', () => window.FastAutocomplete?.registerHook?.('render-autocomplete-product-item', onItem)); window.SerpOptions ? window.SerpOptions.registerHook?.('serp-product-grid', schedule) : addEventListener('fast-serp-ready', () => window.SerpOptions?.registerHook?.('serp-product-grid', schedule)); } function handleRecommendationWidget() { let timer; const WIDGET_SEL = '.carousel-container .product-container'; const handleByTitle = new Map(); const resolveHandle = (title) => { const key = title.toLowerCase(); if (!handleByTitle.has(key)) { handleByTitle.set(key, fetch(`/search/suggest.json?q=${encodeURIComponent(title)}&resources[type]=product&resources[limit]=5`) .then((r) => (r.ok ? r.json() : Promise.reject())) .then((d) => { const list = d.resources?.results?.products || []; const hit = list.find((p) => (p.title || '').toLowerCase() === key) || list[0]; return (hit && (hit.handle || handleFromUrl(hit.url))) || ''; }) .catch(() => (handleByTitle.delete(key), ''))); } return handleByTitle.get(key); }; const renderPrice = (el, price, compare) => { const has = compare && Number(compare) > Number(price); el.innerHTML = `` + (has ? `` : ''); }; const fallback = () => document.querySelectorAll(WIDGET_SEL).forEach((item) => { const priceEl = item.querySelector('.price'); const handle = priceEl?.getAttribute('data-product-handle'); if (!handle || abraRendered(item)) return; fetchPrice(handle).then((data) => { if (!data || !document.contains(priceEl) || abraRendered(item)) return; if (priceEl.textContent.includes(money(data.price))) return; renderPrice(priceEl, data.price, data.compare); }); }); const sync = () => { const nodes = [...document.querySelectorAll(WIDGET_SEL)]; if (!nodes.length) return; Promise.all(nodes.map((item) => { const title = (item.querySelector('.product-block__title')?.textContent || '').trim(); const priceEl = item.querySelector('.price'); if (!title || !priceEl) return false; return resolveHandle(title).then((handle) => { if (!handle || priceEl.getAttribute('data-product-handle') === handle) return false; priceEl.setAttribute('data-product-handle', handle); clearMarkers(item); return true; }); })).then((changed) => { if (changed.some(Boolean)) abraRender(); setTimeout(fallback, 150); setTimeout(fallback, 600); }); }; const schedule = () => { clearTimeout(timer); timer = setTimeout(sync, 50); }; const start = () => { new MutationObserver(schedule).observe(document.body, { childList: true, subtree: true }); schedule(); }; document.body ? start() : addEventListener('DOMContentLoaded', start); } handleAutocomplete(); handleRecommendationWidget(); })();

Land/Region

Sprache

Imagine Magazin

Land/Region

Sprache