;(function(){ try { (function(){ var PLUGIN_ID = "studio.alphazero.reviews"; var API_BASE = '/api/plugins/' + PLUGIN_ID; var STYLE_TAG_ID = 'az-r-styles'; function injectStyles(){ if (document.getElementById(STYLE_TAG_ID)) return; var s = document.createElement('style'); s.id = STYLE_TAG_ID; s.textContent = "\n .az-r-wrap { width: 100%; display: flex; justify-content: center; }\n .az-r-wrap.az-r-framed .az-r-root {\n background: rgba(12, 20, 36, 0.55);\n backdrop-filter: blur(10px) saturate(140%);\n -webkit-backdrop-filter: blur(10px) saturate(140%);\n border: 1px solid var(--az-r-border-strong);\n border-radius: 14px;\n padding: 2rem 2.25rem;\n box-shadow:\n inset 0 1px 0 rgba(255,255,255,0.04),\n 0 0 0 1px rgba(126,184,212,0.04),\n 0 20px 60px rgba(0,0,0,0.35);\n position: relative;\n }\n .az-r-wrap.az-r-framed .az-r-root::before,\n .az-r-wrap.az-r-framed .az-r-root::after {\n content: ''; position: absolute; width: 18px; height: 18px; pointer-events: none;\n border-color: var(--az-r-accent-soft); border-style: solid; border-width: 0;\n }\n .az-r-wrap.az-r-framed .az-r-root::before {\n top: 10px; left: 10px; border-top-width: 1px; border-left-width: 1px; border-top-left-radius: 6px;\n }\n .az-r-wrap.az-r-framed .az-r-root::after {\n bottom: 10px; right: 10px; border-bottom-width: 1px; border-right-width: 1px; border-bottom-right-radius: 6px;\n }\n .az-r-root {\n --az-r-muted: rgba(180,190,210,.68);\n --az-r-border: rgba(126,184,212,.18);\n --az-r-border-strong: rgba(126,184,212,.22);\n --az-r-star: var(--az-r-star-override, #ffb800);\n --az-r-star-dim: rgba(180,190,210,.25);\n --az-r-accent: var(--az-r-accent-override, #7eb8d4);\n --az-r-accent-soft: rgba(126,184,212,.5);\n --az-r-card-bg: var(--az-r-card-bg-override, rgba(126,184,212,.04));\n font-family: inherit; color: inherit; margin: 0 auto; width: 100%;\n padding: .5rem 1rem; font-size: 16px; line-height: 1.55;\n scroll-margin-top: 80px;\n }\n .az-r-root * { box-sizing: border-box; }\n .az-r-heading { font-size: 1.75rem; font-weight: 700; margin: 0 0 1.25rem; letter-spacing: .04em; text-transform: uppercase; text-align: center; }\n .az-r-top { display: flex; align-items: center; justify-content: center; gap: .7rem; flex-wrap: wrap; padding: 0 0 1rem; border-bottom: 1px solid var(--az-r-border); margin-bottom: 1.25rem; }\n .az-r-top .stars { color: var(--az-r-star); font-size: 1.3rem; letter-spacing: 1.5px; }\n .az-r-top .avg { font-weight: 700; font-size: 1.3rem; }\n .az-r-top .count, .az-r-top .sep { color: var(--az-r-muted); font-size: 1rem; }\n .az-r-top .toggle { background: transparent; border: 0; color: var(--az-r-muted); font-size: .95rem; cursor: pointer; padding: 0; text-decoration: underline; text-underline-offset: 3px; font-family: inherit; }\n .az-r-top .toggle:hover { color: var(--az-r-accent); }\n .az-r-top .write-btn { background: transparent; border: 1px solid var(--az-r-border-strong); color: inherit; padding: .35rem .85rem; border-radius: 6px; cursor: pointer; font-family: inherit; font-size: .9rem; letter-spacing: .02em; }\n .az-r-top .write-btn:hover { color: var(--az-r-accent); border-color: var(--az-r-accent); }\n .az-r-dist { display: none; max-width: 420px; margin: 0 auto 1.25rem; padding: .85rem 0 .95rem; grid-template-columns: auto 1fr auto; gap: .25rem .7rem; align-items: center; font-size: .9rem; color: var(--az-r-muted); }\n .az-r-dist.on { display: grid; }\n .az-r-dist .bar { background: var(--az-r-star-dim); height: 5px; border-radius: 3px; overflow: hidden; }\n .az-r-dist .fill { background: var(--az-r-star); height: 100%; }\n .az-r-search { margin: 0 auto 1rem; max-width: 520px; display: flex; gap: .5rem; }\n .az-r-search input { flex: 1; border: 1px solid var(--az-r-border); border-radius: 6px; background: rgba(126,184,212,.05); color: inherit; padding: .55rem .65rem; font: inherit; }\n .az-r-search button { border: 1px solid var(--az-r-border); border-radius: 6px; background: transparent; color: inherit; cursor: pointer; font: inherit; padding: .55rem .75rem; }\n .az-r-grid { display: grid; gap: 1rem; grid-template-columns: 1fr; }\n @media (min-width: 640px) { .az-r-grid.cols-2, .az-r-grid.cols-3 { grid-template-columns: repeat(2, 1fr); } }\n @media (min-width: 1000px) { .az-r-grid.cols-3 { grid-template-columns: repeat(3, 1fr); } }\n .az-r-root.az-r-layout-compact { max-width: 760px; }\n .az-r-root.az-r-layout-compact .az-r-grid { grid-template-columns: 1fr; }\n .az-r-root.az-r-layout-summary .az-r-grid,\n .az-r-root.az-r-layout-summary .az-r-pager { display: none; }\n .az-r-root.az-r-layout-carousel .az-r-grid {\n display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .4rem;\n }\n .az-r-root.az-r-layout-carousel .az-r-card {\n min-width: min(340px, 82vw); scroll-snap-align: start;\n }\n .az-r-root.az-r-layout-testimonials .az-r-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }\n .az-r-root.az-r-layout-testimonials .az-r-card .head { justify-content: space-between; }\n .az-r-root.az-r-layout-testimonials .az-r-helpful,\n .az-r-root.az-r-layout-testimonials .az-r-tags,\n .az-r-root.az-r-layout-testimonials .az-r-insights,\n .az-r-root.az-r-layout-testimonials .az-r-media { display: none; }\n .az-r-root.az-r-layout-floating-badge { position: fixed; right: 1rem; bottom: 1rem; z-index: 9998; width: min(420px, calc(100vw - 2rem)); max-width: none; padding: 0; }\n .az-r-root.az-r-layout-floating-badge .az-r-floating-btn { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: .75rem; border: 1px solid var(--az-r-border-strong); border-radius: 999px; background: rgba(12,20,36,.92); color: inherit; box-shadow: 0 14px 36px rgba(0,0,0,.35); padding: .72rem .95rem; cursor: pointer; font: inherit; }\n .az-r-floating-btn .stars { color: var(--az-r-star); letter-spacing: 1px; white-space: nowrap; }\n .az-r-floating-btn .meta { color: var(--az-r-muted); font-size: .85rem; }\n .az-r-floating-panel { max-height: min(76vh, 720px); overflow: auto; border: 1px solid var(--az-r-border-strong); border-radius: 10px; background: rgba(12,20,36,.96); box-shadow: 0 18px 60px rgba(0,0,0,.45); padding: 1rem; }\n .az-r-floating-close { float: right; border: 0; background: transparent; color: var(--az-r-muted); cursor: pointer; font: inherit; font-size: 1.25rem; line-height: 1; }\n @media (max-width: 640px) { .az-r-root.az-r-layout-floating-badge { right: .75rem; bottom: .75rem; width: calc(100vw - 1.5rem); } }\n .az-r-card { background: var(--az-r-card-bg); border: 1px solid var(--az-r-border); border-radius: 8px; padding: 1rem 1.1rem; display: flex; flex-direction: column; gap: .4rem; transition: border-color .15s ease, background .15s ease; }\n .az-r-card:hover { border-color: rgba(126,184,212,.32); background: rgba(126,184,212,.06); }\n .az-r-card .head { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; font-size: .85rem; color: var(--az-r-muted); }\n .az-r-card .head .s { color: var(--az-r-star); font-size: 1rem; letter-spacing: 1px; }\n .az-r-card .head .n { color: inherit; font-weight: 600; font-size: .95rem; }\n .az-r-card .head .verified { color: var(--az-r-accent); border: 1px solid var(--az-r-border-strong); border-radius: 999px; padding: .05rem .45rem; font-size: .72rem; font-weight: 700; letter-spacing: .02em; }\n .az-r-card .body-row { display: flex; align-items: flex-start; gap: .85rem; }\n .az-r-card .body-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .65rem; }\n .az-r-card .body { margin: 0; font-size: .98rem; line-height: 1.55; white-space: pre-wrap; opacity: .95; }\n .az-r-insights { display: grid; gap: .45rem; margin: .05rem 0; }\n .az-r-insight { display: flex; align-items: flex-start; gap: .5rem; flex-wrap: wrap; }\n .az-r-insight-label { color: var(--az-r-muted); font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding-top: .22rem; min-width: 3.7rem; }\n .az-r-insight-pills { display: inline-flex; flex-wrap: wrap; gap: .35rem; flex: 1; min-width: 180px; }\n .az-r-insight-pill { background: rgba(126,184,212,.08); border: 1px solid rgba(126,184,212,.22); border-radius: 999px; color: inherit; font-size: .78rem; line-height: 1.25; padding: .18rem .58rem; }\n .az-r-tags { display: inline-flex; flex-wrap: wrap; gap: .35rem; }\n .az-r-tag { background: rgba(126,184,212,.1); color: inherit; border: 1px solid rgba(126,184,212,.18); border-radius: 4px; padding: .1rem .5rem; font-size: .75rem; opacity: .9; }\n .az-r-helpful { display: inline-flex; align-items: center; gap: .35rem; margin-top: .35rem; }\n .az-r-up { background: transparent; border: 1px solid var(--az-r-border); color: var(--az-r-muted); padding: .2rem .55rem; border-radius: 999px; font: inherit; font-size: .75rem; cursor: pointer; }\n .az-r-up:hover { color: var(--az-r-accent); border-color: var(--az-r-accent); }\n .az-r-up.voted { color: var(--az-r-accent); border-color: var(--az-r-accent); }\n .az-r-up-count { color: var(--az-r-muted); font-size: .75rem; }\n .az-r-report { background: transparent; border: 0; color: var(--az-r-muted); padding: .2rem .35rem; font: inherit; font-size: .75rem; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }\n .az-r-report:hover { color: var(--az-r-accent); }\n .az-r-report-box { margin-top: .5rem; padding: .65rem; border: 1px solid var(--az-r-border); border-radius: 6px; background: rgba(126,184,212,.06); display: grid; gap: .45rem; }\n .az-r-report-box label { display: grid; gap: .25rem; color: var(--az-r-muted); font-size: .75rem; }\n .az-r-report-box select, .az-r-report-box textarea { background: rgba(126,184,212,.05); border: 1px solid var(--az-r-border); border-radius: 5px; color: inherit; font: inherit; padding: .45rem .5rem; }\n .az-r-report-box textarea { min-height: 64px; resize: vertical; }\n .az-r-report-actions { display: flex; align-items: center; gap: .5rem; }\n .az-r-report-actions button { border: 1px solid var(--az-r-border); border-radius: 5px; background: transparent; color: inherit; cursor: pointer; font: inherit; font-size: .78rem; padding: .35rem .65rem; }\n .az-r-report-actions button:first-child { background: var(--az-r-accent); color: #00121a; border-color: var(--az-r-accent); }\n .az-r-reply { margin-top: .35rem; padding: .55rem .7rem; border-left: 2px solid var(--az-r-accent); background: rgba(126,184,212,.06); border-radius: 0 6px 6px 0; font-size: .9rem; }\n .az-r-reply .reply-label { display: block; font-size: .65rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--az-r-muted); margin-bottom: .2rem; }\n .az-r-media { display: flex; flex-wrap: wrap; gap: .35rem; flex-shrink: 0; max-width: 140px; }\n .az-r-m { width: 64px; height: 64px; border-radius: 5px; overflow: hidden; background: rgba(126,184,212,.08); cursor: pointer; border: 1px solid rgba(126,184,212,.18); }\n .az-r-m img, .az-r-m video { width: 100%; height: 100%; object-fit: cover; display: block; }\n @media (max-width: 520px) { .az-r-card .body-row { flex-direction: column; } .az-r-media { max-width: 100%; } }\n .az-r-empty { color: var(--az-r-muted); font-size: 1rem; padding: 1.5rem 0; text-align: center; }\n .az-r-pager { display: flex; align-items: center; justify-content: center; gap: 1rem; margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--az-r-border); }\n .az-r-pager .btn { background: transparent; border: 1px solid var(--az-r-border); color: inherit; font-size: .9rem; cursor: pointer; padding: .5rem 1.1rem; border-radius: 6px; font-family: inherit; letter-spacing: .02em; transition: all .15s ease; display: inline-flex; align-items: center; gap: .4rem; }\n .az-r-pager .btn:hover:not(:disabled) { color: var(--az-r-accent); border-color: var(--az-r-accent); }\n .az-r-pager .btn:disabled { opacity: .35; cursor: not-allowed; }\n .az-r-pager .page { color: var(--az-r-muted); font-size: .9rem; letter-spacing: .03em; }\n .az-r-lb { position: fixed; inset: 0; background: rgba(0,0,0,.92); display: none; align-items: center; justify-content: center; z-index: 99999; padding: 1.5rem; }\n .az-r-lb.on { display: flex; }\n .az-r-lb .x { position: absolute; top: 1rem; right: 1.25rem; background: transparent; color: #fff; border: 0; font-size: 1.75rem; cursor: pointer; line-height: 1; }\n .az-r-lb img, .az-r-lb video { max-width: 90vw; max-height: 85vh; border-radius: 6px; }\n .az-r-form { display: none; flex-direction: column; gap: .75rem; padding: 1rem 0 .25rem; }\n .az-r-form.on { display: flex; }\n .az-r-form label { font-size: .8rem; color: var(--az-r-muted); display: flex; flex-direction: column; gap: .25rem; }\n .az-r-form input, .az-r-form textarea, .az-r-form select { background: rgba(126,184,212,.05); border: 1px solid var(--az-r-border); border-radius: 6px; padding: .55rem .65rem; color: inherit; font: inherit; }\n .az-r-form textarea { min-height: 110px; resize: vertical; }\n .az-r-form .row { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; }\n .az-r-form .stars-input { display: flex; gap: .25rem; font-size: 1.4rem; color: var(--az-r-star-dim); cursor: pointer; user-select: none; }\n .az-r-form .stars-input .s { transition: color .1s ease; }\n .az-r-form .stars-input .s.on, .az-r-form .stars-input.hover .s.h { color: var(--az-r-star); }\n .az-r-form .actions { display: flex; gap: .75rem; align-items: center; }\n .az-r-form .submit { background: var(--az-r-accent); color: #00121a; border: 0; border-radius: 6px; padding: .55rem 1.1rem; font: inherit; cursor: pointer; letter-spacing: .02em; }\n .az-r-form .submit:disabled { opacity: .4; cursor: not-allowed; }\n .az-r-form .cancel { background: transparent; border: 1px solid var(--az-r-border); color: var(--az-r-muted); padding: .55rem 1.1rem; border-radius: 6px; cursor: pointer; }\n .az-r-form .note { font-size: .8rem; color: var(--az-r-muted); }\n .az-r-toast { margin: .75rem 0; padding: .65rem .85rem; border-radius: 6px; background: rgba(126,184,212,.1); border: 1px solid var(--az-r-border-strong); font-size: .9rem; }\n .az-r-coupon { margin: .75rem 0; padding: 1rem 1.1rem; border-radius: 10px; background: linear-gradient(135deg, rgba(126,184,212,.16), rgba(126,184,212,.06)); border: 1px solid var(--az-r-accent-soft); }\n .az-r-coupon-msg { margin: 0 0 .35rem; font-weight: 600; font-size: 1rem; color: inherit; }\n .az-r-coupon-sub { margin: 0 0 .65rem; font-size: .85rem; color: var(--az-r-muted); }\n .az-r-coupon-row { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; }\n .az-r-coupon-code { font-family: ui-monospace, SFMono-Regular, monospace; font-size: 1.1rem; letter-spacing: .04em; background: rgba(0,0,0,.18); border: 1px dashed var(--az-r-accent-soft); padding: .35rem .75rem; border-radius: 6px; color: inherit; }\n .az-r-coupon-copy { background: var(--az-r-accent); color: #00121a; border: 0; border-radius: 6px; padding: .4rem .85rem; font: inherit; font-size: .85rem; cursor: pointer; }\n .az-r-toast.err { background: rgba(255,80,80,.08); border-color: rgba(255,80,80,.35); }\n .az-r-qa { margin-top: 1.4rem; border-top: 1px solid var(--az-r-border); padding-top: 1rem; }\n .az-r-qa-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; margin-bottom: .75rem; }\n .az-r-qa h3 { margin: 0; font-size: 1rem; }\n .az-r-qa-head .write-btn { background: transparent; border: 1px solid var(--az-r-border-strong); color: inherit; padding: .35rem .85rem; border-radius: 6px; cursor: pointer; font-family: inherit; font-size: .9rem; }\n .az-r-q-list { display: grid; gap: .75rem; }\n .az-r-q { border: 1px solid var(--az-r-border); border-radius: 8px; padding: .85rem .95rem; background: rgba(255,255,255,.025); }\n .az-r-q .q { font-weight: 700; color: inherit; margin-bottom: .45rem; }\n .az-r-q .meta { color: var(--az-r-muted); font-size: .78rem; margin-bottom: .4rem; }\n .az-r-a { border-left: 2px solid var(--az-r-accent); padding-left: .65rem; margin-top: .55rem; color: inherit; }\n .az-r-q-form { display: none; margin-top: .75rem; border: 1px solid var(--az-r-border); border-radius: 8px; padding: .85rem; background: rgba(255,255,255,.025); }\n .az-r-q-form.on { display: grid; gap: .55rem; }\n .az-r-q-form input, .az-r-q-form textarea { width: 100%; border: 1px solid var(--az-r-border); border-radius: 6px; background: rgba(12,20,36,.72); color: inherit; padding: .6rem .7rem; font: inherit; }\n .az-r-q-form textarea { min-height: 5.5rem; resize: vertical; }\n .az-r-q-form .submit { background: var(--az-r-accent); color: #00121a; border: 0; border-radius: 6px; padding: .55rem 1.1rem; font: inherit; cursor: pointer; width: max-content; }\n .az-r-q-msg { color: var(--az-r-muted); font-size: .82rem; }\n @media (max-width: 640px) {\n .az-r-wrap.az-r-framed .az-r-root { padding: 1.25rem 1.25rem; border-radius: 10px; }\n .az-r-root { font-size: 15px; }\n .az-r-heading { font-size: 1.35rem; }\n .az-r-card .body { font-size: .95rem; }\n }\n"; document.head.appendChild(s); } function esc(v){ return String(v == null ? '' : v).replace(/[&<>"']/g, function(c){ return ({ '&':'&','<':'<','>':'>','"':'"',"'":''' })[c]; }); } function cssEsc(v){ return String(v == null ? '' : v).replace(/[^a-zA-Z0-9_-]/g, '\\$&'); } function stars(n){ var f = Math.round(Number(n)||0); return '★★★★★'.slice(0, f) + '☆☆☆☆☆'.slice(0, 5 - f); } function mediaUrl(key){ var s = String(key || ''); if (/^https?:\/\//i.test(s) || s.indexOf('/api/media/') === 0) return s; return API_BASE + '/media?key=' + encodeURIComponent(s); } function fitLabel(size, length){ var b = []; if (size === 'too_small') b.push('Runs small'); else if (size === 'true_to_size') b.push('True to size'); else if (size === 'too_large') b.push('Runs large'); if (length === 'too_short') b.push('Too short'); else if (length === 'just_right') b.push('Length fits'); else if (length === 'too_long') b.push('Too long'); return b; } function splitText(comments){ var raw = String(comments || '').replace(/\r\n/g, '\n').trim(); var meta = { body: raw, felt: [], wears: [] }; if (!raw) return meta; var lines = raw.split('\n'); var bodyStart = 0; for (var idx = 0; idx < lines.length; idx++){ var line = lines[idx]; if (!line.trim()){ bodyStart = idx + 1; continue; } var m = line.match(/^\s*(Felt|Wears):\s*(.+?)\s*$/i); if (!m) break; var k = m[1].toLowerCase(); var vals = m[2].split(',').map(function(v){ return v.trim(); }).filter(Boolean); if (k === 'felt') meta.felt = vals; if (k === 'wears') meta.wears = vals; bodyStart = idx + 1; } while (bodyStart < lines.length && !lines[bodyStart].trim()) bodyStart++; meta.body = lines.slice(bodyStart).join('\n').trim(); return meta; } function renderInsight(label, values){ if (!values || !values.length) return ''; var pills = values.map(function(v){ return '' + esc(v) + ''; }).join(''); return '

' + esc(label) + '

' + pills + '

'; } function renderTop(s, root){ var count = (s && s.count) || 0; var avg = (s && s.avg_rating) ? parseFloat(s.avg_rating).toFixed(1) : '0.0'; root.__total = count; var toggle = count > 0 ? '' : ''; var writeCta = root.dataset.azWriteCta || 'Write a review'; return '

' + '' + stars(avg) + '' + '' + esc(avg) + '' + '·' + '' + count + (count === 1 ? ' review' : ' reviews') + '' + (toggle ? '·' + toggle : '') + '' + '

'; } function renderDist(s, showOn){ var count = (s && s.count) || 0; if (!count) return ''; var rows = ''; for (var i = 5; i >= 1; i--){ var c = (s && s['count_' + i]) || 0; var pct = Math.round(c / count * 100); rows += '

' + i + '★

' + c + '

'; } return '

' + rows + '

'; } function renderCard(r, showVerified, mode){ var rating = r.item_rating || r.overall_rating || 0; var parsed = splitText(r.display_comments || r.comments); var felt = parsed.felt.length ? parsed.felt : (Array.isArray(r.benefits) ? r.benefits : []); var wears = parsed.wears.length ? parsed.wears : (Array.isArray(r.contexts) ? r.contexts : []); var verified = showVerified && r.verified ? 'Verified purchase' : ''; var head = '

' + stars(rating) + '' + (r.reviewer_name ? '' + esc(r.reviewer_name) + '' : '') + verified + '

'; var body = parsed.body ? '

' + esc(parsed.body) + '

' : ''; var insights = renderInsight('Felt', felt) + renderInsight('Wears', wears); var insightsHtml = insights ? '

' + insights + '

' : ''; var tags = []; if (r.purchased_size) tags.push('Bought: ' + esc(r.purchased_size) + ''); fitLabel(r.fit_size, r.fit_length).forEach(function(f){ tags.push('' + esc(f) + ''); }); if (r.customer_height) tags.push('' + esc(r.customer_height) + ''); if (r.customer_weight_lbs) tags.push('' + r.customer_weight_lbs + ' lbs'); var tagsHtml = tags.length ? '

' + tags.join('') + '

' : ''; var reply = r.merchant_reply ? '

From the shop' + esc(r.merchant_reply) + '

' : ''; var mediaHtml = ''; if (r.media && r.media.length){ mediaHtml = '

' + r.media.map(function(mi){ var isVideo = (mi.content_type || '').indexOf('video/') === 0; var src = mediaUrl(mi.s3_key); return '

' + (isVideo ? '

' : '

') + '

'; }).join('') + '

'; } var helpful = mode === 'testimonial' ? '' : '

' + (r.upvotes ? r.upvotes : 0) + '

'; return '

' + head + '

' + body + insightsHtml + tagsHtml + reply + helpful + '

' + mediaHtml + '

'; } function renderFloatingBadge(s, heading){ var count = (s && s.count) || 0; var avg = (s && s.avg_rating) ? parseFloat(s.avg_rating).toFixed(1) : '0.0'; return ''; } function renderPager(currentPage, total, limit){ var totalPages = Math.max(1, Math.ceil(total / limit)); if (totalPages <= 1) return ''; var canPrev = currentPage > 0; var canNext = currentPage < totalPages - 1; return ''; } function renderSearch(query){ return ''; } function renderQuestions(questions){ var list = questions && questions.length ? questions.map(function(q){ var answers = (q.answers || []).map(function(a){ return '

' + esc(a.author_name || 'Merchant') + ' answered ' + esc(dateFmt(a.created_at)) + '

' + esc(a.body || '') + '

'; }).join(''); return '

Q: ' + esc(q.question || '') + '

' + esc(q.asker_name || 'Shopper') + ' asked ' + esc(dateFmt(q.created_at)) + '

' + answers + '

'; }).join('') : '

No questions yet.

'; return '

' + '

Questions & answers

' + '

' + list + '

' + '

'; } function renderForm(showFit){ return '' + ''; } function openLB(type, src){ var lb = document.createElement('div'); lb.className = 'az-r-lb on'; lb.innerHTML = ''; var el = type === 'video' ? Object.assign(document.createElement('video'), { src: src, controls: true, autoplay: true }) : Object.assign(document.createElement('img'), { src: src }); lb.appendChild(el); lb.addEventListener('click', function(e){ if (e.target === lb || e.target.classList.contains('x')) lb.remove(); }); document.body.appendChild(lb); } function showToast(host, message, isError){ var t = document.createElement('div'); t.className = 'az-r-toast' + (isError ? ' err' : ''); t.textContent = message; host.insertBefore(t, host.firstChild); setTimeout(function(){ t.parentNode && t.parentNode.removeChild(t); }, 6000); } function hydrate(root){ if (root.__azHydrated) return; root.__azHydrated = true; injectStyles(); var handle = root.dataset.azHandle || ''; var cols = parseInt(root.dataset.azColumns, 10) || 3; var limit = parseInt(root.dataset.azPerPage, 10) || 6; var layout = root.dataset.azLayout || 'grid'; var reviewIds = root.dataset.azReviewIds || ''; var qaOn = root.dataset.azEnableQuestions === '1'; var framed = root.dataset.azFramed === '1'; var distOn = root.dataset.azShowBreakdown === '1'; var maxWidth = parseInt(root.dataset.azMaxWidth, 10) || 1800; var heading = root.dataset.azHeading || 'Customer Reviews'; var emptyMsg = root.dataset.azEmpty || 'No reviews yet.'; var showFit = root.dataset.azShowFit !== '0'; var showVerified = root.dataset.azShowVerified !== '0'; var accent = root.dataset.azAccent || ''; var starColor = root.dataset.azStarColor || ''; var cardBg = root.dataset.azCardBg || ''; if (!/^(grid|carousel|compact|summary|testimonials|floating-badge)$/.test(layout)) layout = 'grid'; root.innerHTML = ''; root.classList.add('az-r-wrap', 'az-r-layout-' + layout); if (framed) root.classList.add('az-r-framed'); var inner = document.createElement('div'); inner.className = 'az-r-root az-r-layout-' + layout; inner.style.maxWidth = maxWidth + 'px'; if (accent) inner.style.setProperty('--az-r-accent-override', accent); if (starColor) inner.style.setProperty('--az-r-star-override', starColor); if (cardBg) inner.style.setProperty('--az-r-card-bg-override', cardBg); root.appendChild(inner); inner.innerHTML = '

' + esc(heading) + '

Loading reviews…

'; var state = { page: 0, total: 0, summary: null, expanded: false, questions: null, query: '' }; function fetchPage(){ var url = API_BASE + '/product?handle=' + encodeURIComponent(handle) + '&limit=' + limit + '&offset=' + (state.page * limit); if (reviewIds) url += '&ids=' + encodeURIComponent(reviewIds); if (state.query) url += '&q=' + encodeURIComponent(state.query); return fetch(url, { credentials: 'same-origin' }) .then(function(r){ return r.json(); }); } function fetchQuestions(){ if (!qaOn) return Promise.resolve({ ok: true, questions: [], total: 0 }); return fetch(API_BASE + '/questions?handle=' + encodeURIComponent(handle), { credentials: 'same-origin' }) .then(function(r){ return r.json(); }) .catch(function(){ return { ok: false, questions: [] }; }); } function paint(firstLoad){ Promise.all([fetchPage(), firstLoad ? fetchQuestions() : Promise.resolve(null)]).then(function(results){ var res = results[0]; var qres = results[1]; if (!res || !res.ok) throw new Error((res && res.error) || 'failed'); if (qres && qres.ok) state.questions = qres.questions || []; state.summary = res.summary; state.total = (res.summary && res.summary.count) || 0; if (layout === 'floating-badge' && !state.expanded){ inner.innerHTML = renderFloatingBadge(state.summary, heading); wireEvents(); return; } var topHtml = renderTop(state.summary, root); var distHtml = renderDist(state.summary, distOn); var gridHtml = '

' + (res.reviews.length ? res.reviews.map(function(r){ return renderCard(r, showVerified, layout === 'testimonials' ? 'testimonial' : 'review'); }).join('') : '

' + esc(emptyMsg) + '

') + '

'; var pagerHtml = renderPager(state.page, state.total, limit); var close = layout === 'floating-badge' ? '' : ''; var qaHtml = qaOn ? renderQuestions(state.questions || []) : ''; var content = '

' + esc(heading) + '

' + topHtml + distHtml + renderSearch(state.query) + gridHtml + pagerHtml + qaHtml + renderForm(showFit); inner.innerHTML = layout === 'floating-badge' ? '

' + close + content + '

' : content; wireEvents(); }).catch(function(err){ inner.innerHTML = '

' + esc(heading) + '

Unable to load reviews.

'; console.error('[az-reviews] load failed:', err); }); } function wireEvents(){ inner.querySelectorAll('.az-r-m').forEach(function(el){ el.addEventListener('click', function(){ openLB(el.dataset.type, el.dataset.src); }); }); inner.querySelectorAll('[data-upvote]').forEach(function(btn){ btn.addEventListener('click', function(){ var reviewId = btn.getAttribute('data-upvote'); var countEl = inner.querySelector('[data-upvote-count="' + cssEsc(reviewId) + '"]'); btn.disabled = true; fetch(API_BASE + '/upvote', { method: 'POST', credentials: 'same-origin', headers: { 'content-type': 'application/json' }, body: JSON.stringify({ reviewId: reviewId }) }) .then(function(r){ return r.json(); }) .then(function(j){ if (j && j.ok && countEl) countEl.textContent = String(j.count); if (j && j.alreadyVoted) btn.classList.add('voted'); }) .catch(function(){ /* swallow */ }) .then(function(){ btn.disabled = false; }); }); }); inner.querySelectorAll('[data-report]').forEach(function(btn){ btn.addEventListener('click', function(){ openReportBox(btn.getAttribute('data-report'), btn.closest('.az-r-helpful')); }); }); // Auto-reveal the form when the customer arrives via the review-request // magic link. They expect a one-tap path; pre-opening removes friction. var paramsForOpen = new URLSearchParams(window.location.search); if (paramsForOpen.get('az_review_token')) { var fOpen = inner.querySelector('[data-az-form]'); if (fOpen) fOpen.classList.add('on'); } var actions = inner.querySelectorAll('[data-action]'); actions.forEach(function(el){ el.addEventListener('click', function(){ var a = el.dataset.action; if (a === 'toggle-dist'){ var d = inner.querySelector('[data-az-dist]'); if (d) d.classList.toggle('on'); } if (a === 'toggle-question-form'){ var qf = inner.querySelector('[data-az-question-form]'); if (qf) qf.classList.toggle('on'); } if (a === 'open-floating'){ state.expanded = true; paint(false); } if (a === 'close-floating'){ state.expanded = false; paint(false); } if (a === 'prev'){ if (state.page > 0){ state.page--; paint(false); scrollSelfIntoView(root); } } if (a === 'next'){ var tp = Math.ceil(state.total / limit); if (state.page < tp - 1){ state.page++; paint(false); scrollSelfIntoView(root); } } if (a === 'toggle-form'){ var f = inner.querySelector('[data-az-form]'); if (f) f.classList.toggle('on'); } }); }); wireSearch(); wireQuestionForm(); wireForm(); } function wireSearch(){ var form = inner.querySelector('[data-az-search]'); if (!form) return; form.addEventListener('submit', function(e){ e.preventDefault(); state.query = String(form.q && form.q.value || '').trim(); state.page = 0; paint(false); }); } function wireQuestionForm(){ var form = inner.querySelector('[data-az-question-form]'); if (!form) return; form.addEventListener('submit', function(e){ e.preventDefault(); var msg = form.querySelector('[data-az-question-msg]'); var submit = form.querySelector('.submit'); if (submit) submit.disabled = true; var payload = { productHandle: handle, askerName: trimOrUndef(form.askerName && form.askerName.value), askerEmail: trimOrUndef(form.askerEmail && form.askerEmail.value), question: String(form.question && form.question.value || '') }; if (!payload.question.trim()){ if (msg) msg.textContent = 'Please enter a question.'; if (submit) submit.disabled = false; return; } fetch(API_BASE + '/questions', { method: 'POST', credentials: 'same-origin', headers: { 'content-type': 'application/json' }, body: JSON.stringify(payload) }).then(function(r){ return r.json().then(function(j){ return { ok: r.ok && j.ok, body: j }; }); }).then(function(out){ if (!out.ok) throw new Error(out.body && out.body.error || 'Question failed'); if (msg) msg.textContent = out.body.message || 'Thanks for asking.'; form.reset(); return fetchQuestions(); }).then(function(qres){ if (qres && qres.ok) state.questions = qres.questions || []; paint(false); }).catch(function(err){ if (msg) msg.textContent = err.message || 'Unable to submit question.'; if (submit) submit.disabled = false; }); }); } function openReportBox(reviewId, host){ if (!reviewId || !host) return; var existing = inner.querySelector('[data-report-box="' + cssEsc(reviewId) + '"]'); if (existing){ existing.parentNode.removeChild(existing); return; } inner.querySelectorAll('.az-r-report-box').forEach(function(x){ if (x.parentNode) x.parentNode.removeChild(x); }); var box = document.createElement('div'); box.className = 'az-r-report-box'; box.setAttribute('data-report-box', reviewId); box.innerHTML = '' + 'Reason' + 'Details (optional)' + '

'; host.insertAdjacentElement('afterend', box); var submit = box.querySelector('[data-report-submit]'); var cancel = box.querySelector('[data-report-cancel]'); cancel && cancel.addEventListener('click', function(){ if (box.parentNode) box.parentNode.removeChild(box); }); submit && submit.addEventListener('click', function(){ submit.disabled = true; var reason = box.querySelector('[data-report-reason]').value; var details = box.querySelector('[data-report-details]').value || ''; fetch(API_BASE + '/report', { method: 'POST', credentials: 'same-origin', headers: { 'content-type': 'application/json' }, body: JSON.stringify({ reviewId: reviewId, reason: reason, details: details }), }).then(function(r){ return r.json(); }).then(function(j){ if (j && j.ok){ if (box.parentNode) box.parentNode.removeChild(box); showToast(inner, 'Thanks. Our team will review it.', false); } else { showToast(inner, j && (j.error === 'login-required') ? 'Please sign in to report a review.' : 'We could not record that report. Please try again later.', true); submit.disabled = false; } }).catch(function(){ showToast(inner, 'Network error - please try again.', true); submit.disabled = false; }); }); } function wireForm(){ var form = inner.querySelector('[data-az-form]'); if (!form) return; var stars = form.querySelector('[data-stars-input]'); var ratingInput = form.querySelector('input[name="itemRating"]'); var submit = form.querySelector('.submit'); var spans = stars.querySelectorAll('.s'); var current = 0; function paintStars(){ spans.forEach(function(s, i){ s.classList.toggle('on', i < current); }); ratingInput.value = String(current); submit.disabled = current < 1; } spans.forEach(function(s, i){ s.addEventListener('mouseenter', function(){ stars.classList.add('hover'); spans.forEach(function(x, j){ x.classList.toggle('h', j <= i); }); }); s.addEventListener('mouseleave', function(){ stars.classList.remove('hover'); spans.forEach(function(x){ x.classList.remove('h'); }); }); s.addEventListener('click', function(){ current = i + 1; paintStars(); }); }); form.addEventListener('submit', function(e){ e.preventDefault(); submit.disabled = true; submitForm(form).then(function(res){ if (res.ok){ form.classList.remove('on'); if (res.coupon && res.coupon.code){ showCoupon(inner, res.coupon, res.message || 'Thanks for sharing!'); } else { showToast(inner, res.message || 'Thanks for sharing!', false); } state.page = 0; paint(true); } else { showToast(inner, friendlyError(res.error) || 'Something went wrong.', true); submit.disabled = false; } }).catch(function(err){ console.error('[az-reviews] submit failed:', err); showToast(inner, 'Network error — please try again.', true); submit.disabled = false; }); }); } function showCoupon(host, coupon, message){ var box = document.createElement('div'); box.className = 'az-r-coupon'; var expiry = ''; try { expiry = new Date(coupon.expiresAt).toLocaleDateString(undefined, { year: 'numeric', month: 'short', day: 'numeric' }); } catch(_) {} box.innerHTML = '' + '

' + esc(message) + '

' + '

Use this code at checkout for ' + esc(String(coupon.percentOff)) + '% off your next order' + (expiry ? ' (expires ' + esc(expiry) + ')' : '') + ':

' + '

' + '' + esc(coupon.code) + '' + '' + '

'; host.insertBefore(box, host.firstChild); var btn = box.querySelector('.az-r-coupon-copy'); btn && btn.addEventListener('click', function(){ if (navigator.clipboard && navigator.clipboard.writeText) navigator.clipboard.writeText(coupon.code); btn.textContent = 'Copied'; }); } function submitForm(form){ var data = new FormData(form); var files = data.getAll('media').filter(function(f){ return f && f.size > 0; }); data.delete('media'); var params = new URLSearchParams(window.location.search); var magicToken = params.get('az_review_token') || ''; return Promise.all(files.map(uploadOne)).then(function(uploaded){ var payload = { productHandle: handle, itemRating: parseInt(String(data.get('itemRating')), 10) || 0, comments: String(data.get('comments') || ''), reviewerName: trimOrUndef(data.get('reviewerName')), reviewerEmail: trimOrUndef(data.get('reviewerEmail')), purchasedSize: trimOrUndef(data.get('purchasedSize')), fitSize: trimOrUndef(data.get('fitSize')), mediaKeys: uploaded.filter(Boolean), magicLinkToken: magicToken || undefined, }; Object.keys(payload).forEach(function(k){ if (payload[k] === undefined) delete payload[k]; }); return fetch(API_BASE + '/submit', { method: 'POST', credentials: 'same-origin', headers: { 'content-type': 'application/json' }, body: JSON.stringify(payload) }).then(function(r){ return r.json(); }); }); } function uploadOne(file){ var fd = new FormData(); fd.append('file', file); return fetch(API_BASE + '/media', { method: 'POST', credentials: 'same-origin', body: fd }) .then(function(r){ return r.json(); }) .then(function(j){ return j && j.ok ? { s3Key: j.key, contentType: j.contentType, sizeBytes: j.sizeBytes } : null; }) .catch(function(){ return null; }); } function trimOrUndef(v){ var s = (v == null ? '' : String(v)).trim(); return s ? s : undefined; } function friendlyError(code){ switch (code){ case 'login-required': return 'Please sign in to leave a review.'; case 'body-too-short': return 'Please add a few more words to your review.'; case 'body-too-long': return 'Your review is too long. Please shorten it.'; case 'too-many-media': return 'Too many photos/videos attached.'; case 'photos-disabled': return 'Photo uploads are disabled.'; case 'videos-disabled': return 'Video uploads are disabled.'; case 'verified-purchase-required': return 'Only verified buyers can review this product.'; default: return null; } } function scrollSelfIntoView(el){ var rect = el.getBoundingClientRect(); if (rect.top < 0 || rect.top > window.innerHeight / 2){ var reduce = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches; el.scrollIntoView({ behavior: reduce ? 'auto' : 'smooth', block: 'start' }); } } paint(true); } function discoverAndHydrate(){ var mounts = document.querySelectorAll('[data-az-reviews]'); mounts.forEach(hydrate); } if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', discoverAndHydrate); else discoverAndHydrate(); if (typeof MutationObserver !== 'undefined'){ new MutationObserver(function(muts){ for (var i = 0; i < muts.length; i++){ var m = muts[i]; for (var j = 0; j < m.addedNodes.length; j++){ var n = m.addedNodes[j]; if (n && n.nodeType === 1){ if (n.hasAttribute && n.hasAttribute('data-az-reviews')) hydrate(n); var inner = n.querySelectorAll ? n.querySelectorAll('[data-az-reviews]') : null; if (inner) inner.forEach(hydrate); } } } }).observe(document.documentElement, { childList: true, subtree: true }); } })(); } catch (err) { try { console.error('[az-reviews]', err); } catch (_) {} } })();