' + esc(txt) + '' + '

'; } function itemsHtml(items, L, skus){ var html = "", i, it; for (i = 0; i < items.length; i++){ it = items[i]; html += '

' + (it.cover ? '

' : '') + '' + esc(it.name || it.sku) + '' + langCellHtml(it, skus, L) + '' + '' + fmt(it.priceCents) + '' + '' + '

' + // Full width, UNDER the row rather than inside its 1fr cell: it is a // sentence, and the cell is ~150px at 400px viewport. fallbackHtml(it, L); } return html; } function discountHtml(d, L){ if (d.percent <= 0) return ""; return '

' + esc(L("bundleDiscount","Multi-game discount")) + ' (' + d.gameCount + ' ' + esc(L("games","games")) + ' · −' + d.percent + '%)' + '−' + fmt(d.discountCents) + '

'; } function nudgeHtml(items, L){ var txt = nudgeText(items, L); return txt ? '

' + esc(txt) + '

' : ""; } // The resulting total sits UNDER the name rather than inside the pill: at // 400px the drawer is ~324px of usable width and the row is a // 46px / 1fr / auto grid, so a pill carrying both numbers squeezes the game // name to about 110px. Same information, same row, a line that has space. function upsellHtml(items, ups, L){ if (!ups.length) return ""; var html = '

' + esc(L("upsell","You might also like")) + '

', j, u, note; for (j = 0; j < ups.length; j++){ u = ups[j]; note = L("cartBecomes", "Cart becomes {total}").split("{total}").join(fmt(totalWith(items, u))); html += '

' + (u.cover ? '

' : '') + '' + esc(u.name) + '' + '' + esc(note) + '' + '' + '

'; } return html + '

'; } // GA4 + Meta, moved here from the island (2026-09-12) for one reason: in // the island they were unreachable by any test, and they are the numbers // the business reads. No-ops unless the tags loaded (indexable production // build only), and wrapped so they can never break a cart write. // // The shapes MUST match lib/analytics.ts's trackAddToCart, which the React // surfaces call -- otherwise the same purchase funnel arrives at GA4 in two // different shapes depending on which button the customer pressed. A test // asserts the two payloads are identical for the same item. gaItem is // lib/analytics.ts's, transcribed (this file's header). function gaItem(item){ var gi = { item_id: item.sku, item_name: item.name, price: (item.priceCents || 0) / 100, quantity: 1 }; if (item.kind === "license") gi.item_category = "license"; return gi; } function fireAdd(item, listId){ try { var v = (item.priceCents || 0) / 100; var gi = gaItem(item); if (listId) gi.item_list_id = listId; if (window.gtag) window.gtag("event", "add_to_cart", { currency: "USD", value: v, items: [gi] }); var fb = { content_ids: [item.sku], content_type: "product", value: v, currency: "USD" }; if (item.kind === "license") fb.content_category = "license"; if (window.fbq) window.fbq("track", "AddToCart", fb); } catch (e) {} } // Fired when the drawer opens. bundle_tier_pct is what makes it worth // having: it says which tier the cart had EARNED at the moment it was seen, // so the funnel can be read per tier instead of in aggregate. function fireViewCart(items){ try { var d = bundleDisc(items); var v = (subtotalOf(items) - d.discountCents) / 100; if (window.gtag) window.gtag("event", "view_cart", { currency: "USD", value: v, bundle_tier_pct: d.percent, items: items.map(gaItem) }); } catch (e) {} } // Reading order: the lines, then what the tier already takes off them, then // what the next tier would, then the games that would get you there. function drawerBodyHtml(items, all, L, skus){ var d = bundleDisc(items); return itemsHtml(items, L, skus) + discountHtml(d, L) + nudgeHtml(items, L) + upsellHtml(items, upsellsFor(items, all, 4), L); } // The footer states what will actually be charged. The pre-discount sum is // struck through beside it rather than shown as the headline number -- the // drawer used to print the raw sum as "Subtotal" while /cart/ charged less, // which is the one direction a price display must never be wrong in. function drawerFootHtml(items, L){ var sub = subtotalOf(items), d = bundleDisc(items), total = sub - d.discountCents; return '

' + esc(L("subtotal","Subtotal")) + '' + '' + (d.discountCents > 0 ? '~~' + esc(L("was","was")) + ' ' + fmt(sub) + '~~' : "") + '' + fmt(total) + '

' + '' + esc(L("checkout","Checkout")) + ''; } // Omnisend's "added product to cart" (components/omnisend-cart-event.ts). // AFTER the drawer's text, because it prices the cart with the drawer's own // subtotalOf/bundleDisc. // money(), transcribed. cents -> dollars as a NUMBER, pinned to two // decimals so no future arithmetic can serialise 19.990000000000002 into a // money property. function omoney(c){ return Number((((c || 0)) / 100).toFixed(2)); } // One documented lineItems[] entry. The ids and the two urls come from the // server table (window.__ergOmnisend.lines, built by cartAddLinesFor in // lib/events/omnisend-payloads.ts with the SAME helpers the order events // use); the title, price and sku come from the cart line the visitor is // actually holding, so what Omnisend is told matches what the drawer shows. // // productID FALLS BACK TO THE SKU for a line the table has never heard of // -- a cart written before a product existed, or a product added to the // catalogue after this page was built. That is the same third branch the // server's id rule takes (lib/events/omnisend-ids.ts), not a special case. // // productQuantity IS ALWAYS 1: this cart holds one unit per sku (the add // handler refuses a second add of the same line and opens the drawer // instead), so a quantity of 2 would be a claim nothing in the cart // supports. A business license is marked as one (this file's header). function omnisendLine(item, cfg){ var d = (cfg.lines || {})[item.sku] || {}; var o = { productID: d.i || item.sku }; if (d.v) o.productVariantID = d.v; o.productTitle = item.name; o.productPrice = omoney(item.priceCents); o.productQuantity = 1; o.productSKU = item.sku; if (item.kind === "license") o.productCategories = [{ id: "license", title: "Business license" }]; if (d.u) o.productURL = cfg.base + d.u; if (d.m) o.productImageURL = cfg.base + d.m; return o; } // The properties object. Property ORDER mirrors startedCheckoutEvent's so // the two events read the same way in Omnisend's event inspector. // // "value" IS AFTER THE AUTOMATIC BUNDLE DISCOUNT, exactly as "started // checkout" sends the discounted total: it is what the customer is being // asked to pay and what a recovery email quoting a price must say. It is // computed by the drawer's own subtotalOf/bundleDisc (concatenated into // this island ahead of this text), which tests/commerce/cart-drawer.test.mjs // already proves equal to the checkout authority -- so the price in the // email, the price in the drawer and the price charged are one number. // A coupon is deliberately not applied, for the same reason the drawer does // not show one. function omnisendCartProps(item, items, cfg){ var d = bundleDisc(items), lines = [], i; for (i = 0; i < items.length; i++) lines.push(omnisendLine(items[i], cfg)); var p = {}; if (cfg.cart) p.abandonedCheckoutURL = cfg.cart; p.currency = cfg.currency || "USD"; p.value = omoney(subtotalOf(items) - d.discountCents); p.lineItems = lines; p.addedItem = omnisendLine(item, cfg); return p; } // THE GUARD IS ON push, NOT ON Array.isArray. The snippet seeds // window.omnisend as a plain array and the launcher then takes it over; a // strict array test would pass before the launcher loaded and start // silently failing the moment it did, which is precisely the interval this // whole feature exists to stop being silent about. A missing or blocked // snippet leaves the property undefined and this returns having done // nothing at all. function omnisendAddedToCart(item, items){ try { if (typeof window === "undefined") return; var q = window.omnisend; if (!q || typeof q.push !== "function") return; var cfg = window.__ergOmnisend; if (!cfg || typeof cfg !== "object") return; if (!item || !items || !items.length) return; var env = { origin: "api", eventVersion: "", eventTime: new Date().toISOString(), properties: omnisendCartProps(item, items, cfg) }; // The brand, named by the event itself rather than left to the // launcher's settings request -- see this file's header. Absent from // the config means absent here too: never an empty or undefined key. if (typeof cfg.brandID === "string" && cfg.brandID) env.brandID = cfg.brandID; q.push(["track", "added product to cart", env]); } catch (e) {} } // The React /cart view (components/CartView.tsx) adds lines too -- its // cross-sell and its per-line language picker both fire the same GA4 // add_to_cart the island does. It reaches this ONE implementation through // the global rather than carrying a second copy of it into the /cart/ // bundle, which is the same seam window.__ergSkus / window.__ergUpsells // already use in the other direction. window.__ergOmnisendAdd = omnisendAddedToCart; function itemFor(btn){ var single = btn.getAttribute("data-cart-item"); if (single) { try { return JSON.parse(single); } catch(e){ return null; } } var mapAttr = btn.getAttribute("data-cart-items"); if (!mapAttr) return null; var map; try { map = JSON.parse(mapAttr); } catch(e){ return null; } var row = btn.closest("[data-cart-buyrow]"); var sel = row && row.querySelector("[data-locale-select]"); var dflt = btn.getAttribute("data-cart-default"); var sku = (sel && sel.value) || dflt; var item = map[sku] || null; if (!item) return null; // THE FALLBACK NOTE, and the one condition the SERVER cannot decide. // data-cart-fallback says "this page's default is a substitute for the // visitor's language" (lib/cart/item.ts's langFallbackFor works out // whether that is even true). What only the browser knows is whether the // visitor ACCEPTED that default or picked a language for themselves -- // and someone who chose does not need to be told what they chose. var fb = btn.getAttribute("data-cart-fallback"); if (!fb || sku !== dflt) return item; // A COPY, never the map entry itself. The attribute is re-parsed on every // call today, but returning a mutated entry is the kind of thing that // starts sharing state the moment anyone caches that parse -- and // paintButtons() calls this on every repaint. // (No backticks anywhere in this string -- they would end the literal.) var copy = {}, k; for (k in item) if (Object.prototype.hasOwnProperty.call(item, k)) copy[k] = item[k]; copy.langFallback = fb; return copy; } function paintCount(){ var n = read().length; var els = document.querySelectorAll("[data-cart-count]"); for (var i=0;i 0 ? " (" + n + ")" : ""; } function paintButtons(){ var btns = document.querySelectorAll("[data-cart-add]"); for (var i=0;i mid-interaction. Put it back on the replacement, found by // attribute rather than by a built selector so a sku can never be // interpolated into one. refocusLang(to); return; } }); // EVERY cart write re-renders the drawer body from innerHTML, which destroys // whatever the keyboard user was standing on. These two put focus back. // Returns whether it found the line's picker, so the caller can fall back. function refocusLang(sku){ if (!drawer) return false; var els = drawer.querySelectorAll("[data-dw-lang]"), i; for (i = 0; i < els.length; i++) { if (els[i].getAttribute("data-dw-lang") === sku) { try { els[i].focus(); } catch(e){} return true; } } return false; } // Dismissing the fallback note destroys the button that was just pressed. // The line's own picker is the nearest thing to where the user was -- but // the note appears mostly on lines that HAVE no picker (a game with one // active language is exactly when the add falls back), so the drawer's // close button is the realistic landing place. Either beats , which // is what focus fell to before: the drawer stays open, so a keyboard user // was left tabbing from the top of the document behind it. function refocusAfterDismiss(sku){ if (refocusLang(sku)) return; var x = drawer && drawer.querySelector(".erg-dw-x"); if (x) { try { x.focus(); } catch(e){} } } window.addEventListener(EVENT, function(){ paintButtons(); paintCount(); if (drawer) renderDrawer(); }); window.addEventListener("storage", function(){ paintButtons(); paintCount(); }); // --------------------------------------------------------------------- // THE SET BUTTON (the non-EN Halloween landings' "add both", 2026-09-23): // ONE button carrying SEVERAL cart lines, as data-cart-set -- a JSON array // of exactly the items a data-cart-item button carries. It is deliberately // NOT a data-cart-add button, so itemFor, paintButtons and the click // handler above never see it, and this branch never sees them: every // single-item path stays exactly as it was. // click: the lines not already in the cart are pushed in ONE write; each // line actually added then reports exactly as a single add does // (fireAdd with the button's optional data-cart-list, then Omnisend, // with the cart as it now stands); the drawer opens either way. Every // line already there means no event at all, like an in-cart button. // paint: the in-cart label and aria-pressed only when EVERY line is in. function setFor(btn){ var raw = btn.getAttribute("data-cart-set"); if (!raw) return null; var a; try { a = JSON.parse(raw); } catch(e){ return null; } if (!Array.isArray(a) || !a.length) return null; for (var i = 0; i < a.length; i++) if (!a[i] || typeof a[i].sku !== "string" || !a[i].sku) return null; return a; } function paintSets(){ var btns = document.querySelectorAll("[data-cart-set]"), items = read(), i, j, set, all; for (i = 0; i < btns.length; i++){ set = setFor(btns[i]); if (!set) continue; all = true; for (j = 0; j < set.length; j++) if (!has(items, set[j].sku)) { all = false; break; } btns[i].setAttribute("aria-pressed", all ? "true" : "false"); btns[i].textContent = all ? btns[i].getAttribute("data-label-in") : btns[i].getAttribute("data-label-add"); } } document.addEventListener("click", function(e){ var btn = e.target && e.target.closest ? e.target.closest("[data-cart-set]") : null; if (!btn) return; var set = setFor(btn); if (!set) return; var items = read(), added = [], i; for (i = 0; i < set.length; i++) if (!has(items, set[i].sku) && !has(added, set[i].sku)) added.push(set[i]); // The same optional list attribution as a single add (read exactly as // the handler above reads it): absent or empty means no item_list_id. var list = btn.getAttribute("data-cart-list") || undefined; if (added.length) { for (i = 0; i < added.length; i++) items.push(added[i]); write(items); for (i = 0; i < added.length; i++) { fireAdd(added[i], list); omnisendAddedToCart(added[i], items); } } openDrawer(); }); window.addEventListener(EVENT, paintSets); window.addEventListener("storage", paintSets); // --------------------------------------------------------------------- // SIDE CART DRAWER (Ivan, 2026-09-11). Lives entirely in this island so it // never reaches the byte-frozen flag-off pages (they have no island). Its // markup + CSS are injected on first open; upsell products and localized // labels come from SiteHeader as window.__ergUpsells / window.__ergCartI18n // (English fallbacks in cart-drawer-render.ts). The upsells are single // GAMES, not bundles (Ivan, 2026-09-12): the drawer now states the // build-your-own-bundle tier the cart has earned and the one it is one game // short of, so the thing it offers has to be the thing that moves the tier // -- a bundle earns nothing toward it. var I18N = window.__ergCartI18n || {}; function L(k, d){ return (I18N && I18N[k]) || d; } var UPSELLS = Array.isArray(window.__ergUpsells) ? window.__ergUpsells : []; // The client-safe slice of the pricing snapshot (lib/cart/sku-map.ts), // serialised by SiteHeader alongside the upsells. It is what lets a cart // line restored from a MONTHS-OLD localStorage cart -- written before // CartItem carried locale/gameSlug at all -- still name its own language // and still offer its language picker, without being re-added and without // the browser importing the snapshot itself. var SKUS = (window.__ergSkus && typeof window.__ergSkus === "object") ? window.__ergSkus : {}; // The lines of a cart this page still SELLS, for the add path's one-license // rule above: exactly /cart/'s load-time prune over the same map // (lib/cart/unavailable.ts unsoldLines, the side it keeps). An OWN key of // SKUS, never "in" -- a line whose sku is "constructor" is not sold -- and // a map that knows no sku at all has lost the ability to judge, so then // every line counts as sold, as before. tests/commerce/license-cart-ui. // test.mjs runs this island against unsoldLines over the same carts. function soldLines(items){ var known = false, out = [], k, i; for (k in SKUS) if (Object.prototype.hasOwnProperty.call(SKUS, k)) { known = true; break; } if (!known) return items; for (i = 0; i < items.length; i++) if (Object.prototype.hasOwnProperty.call(SKUS, items[i].sku)) out.push(items[i]); return out; } var drawer = null; var DRAWER_CSS = ".erg-dw{position:fixed;inset:0;z-index:1200;visibility:hidden;pointer-events:none}" + ".erg-dw[data-open='1']{visibility:visible;pointer-events:auto}" + ".erg-dw-back{position:absolute;inset:0;background:rgba(10,12,14,.5);opacity:0;transition:opacity .25s ease}" + ".erg-dw[data-open='1'] .erg-dw-back{opacity:1}" + ".erg-dw-panel{position:absolute;top:0;right:0;height:100%;width:min(420px,92vw);background:var(--parchment,#faf7f0);color:var(--ink,#1a1712);box-shadow:-20px 0 60px -20px rgba(0,0,0,.5);transform:translateX(100%);transition:transform .28s ease;display:flex;flex-direction:column;font-family:var(--body,system-ui)}" + ".erg-dw[data-open='1'] .erg-dw-panel{transform:translateX(0)}" + "@media (prefers-reduced-motion:reduce){.erg-dw-panel,.erg-dw-back{transition:none}}" + ".erg-dw-head{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;border-bottom:1px solid var(--line,#e6e0d4);font-family:var(--display,Georgia,serif);font-size:20px;font-weight:600}" + ".erg-dw-x{background:none;border:0;cursor:pointer;color:inherit;padding:4px;display:grid;place-items:center}" + ".erg-dw-body{flex:1 1 auto;overflow-y:auto;padding:6px 22px}" + ".erg-dw-item{display:grid;grid-template-columns:52px 1fr auto auto;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--line,#e6e0d4)}" + ".erg-dw-item img{width:52px;height:40px;object-fit:cover;border-radius:6px;display:block}" + ".erg-dw-noimg{width:52px;height:40px;border-radius:6px;background:var(--parchment-2,#efe9dc);display:block}" + ".erg-dw-name{font-weight:600;font-size:14.5px;line-height:1.25}" + ".erg-dw-namecell{display:flex;flex-direction:column;gap:5px;min-width:0}" + ".erg-dw-lang{display:flex;align-items:center;min-height:30px;font-size:12px;color:var(--ink-soft,#6b6b6b)}" + ".erg-dw-langsel{font:inherit;font-size:12.5px;line-height:1.2;color:var(--ink,#1a1712);background:#fff;border:1px solid var(--line,#e6e0d4);border-radius:6px;padding:4px 6px;min-height:30px;max-width:100%}" + ".erg-dw-langsel:focus-visible{outline:2px solid var(--teal-deep,#0a2528);outline-offset:1px}" + ".erg-dw-fb{display:flex;align-items:center;gap:6px;margin:-4px 0 12px;padding:6px 6px 6px 10px;border-radius:8px;background:var(--parchment-2,#efe9dc);color:var(--ink,#1a1712);font-size:12px;line-height:1.35}" + ".erg-dw-fbtxt{flex:1 1 auto;min-width:0}" + ".erg-dw-fbx{flex:0 0 auto;background:none;border:0;color:var(--ink-soft,#6b6b6b);font-size:17px;line-height:1;cursor:pointer;min-width:44px;min-height:44px;display:grid;place-items:center;padding:0}" + ".erg-dw-fbx:hover{color:var(--vermilion-dark,#b23a1e)}" + ".erg-dw-price{font-weight:700;font-size:14px;white-space:nowrap}" + ".erg-dw-rm{background:none;border:0;color:var(--ink-soft,#6b6b6b);font-size:20px;line-height:1;cursor:pointer;min-width:44px;min-height:44px;display:grid;place-items:center;padding:0}" + ".erg-dw-rm:hover{color:var(--vermilion-dark,#b23a1e)}" + ".erg-dw-empty{color:var(--ink-soft,#6b6b6b);padding:36px 0;text-align:center}" + ".erg-dw-ups{margin:18px 0 6px;border-top:1px dashed var(--line,#e6e0d4);padding-top:16px}" + ".erg-dw-ups-h{font-weight:800;letter-spacing:.1em;text-transform:uppercase;font-size:11px;color:var(--ink-soft,#6b6b6b);margin:0 0 12px}" + ".erg-dw-up{display:grid;grid-template-columns:46px 1fr auto;align-items:center;gap:10px;margin-bottom:12px;font-size:13px}" + ".erg-dw-up img{width:46px;height:36px;object-fit:cover;border-radius:6px;display:block}" + ".erg-dw-upbody{display:flex;flex-direction:column;gap:2px;min-width:0}" + ".erg-dw-upnote{font-size:11.5px;color:var(--ink-soft,#6b6b6b)}" + ".erg-dw-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}" + ".erg-dw-upadd{padding:7px 14px;min-height:44px;font-size:12.5px;font-weight:700;background:transparent;border:1.5px solid var(--teal-deep,#0a2528);color:var(--teal-deep,#0a2528);border-radius:100px;cursor:pointer;white-space:nowrap}" + ".erg-dw-upadd:hover{background:color-mix(in srgb,var(--teal-deep,#0a2528) 8%,transparent)}" + ".erg-dw-disc{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:12px 0 0;font-size:13px;color:var(--ink-soft,#6b6b6b)}" + ".erg-dw-discv{font-weight:700;white-space:nowrap;color:var(--vermilion-dark,#b23a1e)}" + ".erg-dw-nudge{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:var(--parchment-2,#efe9dc);color:var(--ink,#1a1712);font-size:13px;font-weight:600;line-height:1.35}" + ".erg-dw-foot{padding:18px 22px;border-top:1px solid var(--line,#e6e0d4)}" + ".erg-dw-sub{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:14px;font-size:15px;color:var(--ink-soft,#6b6b6b)}" + ".erg-dw-sub strong{font-family:var(--display,Georgia,serif);font-size:22px;color:var(--ink,#1a1712)}" + ".erg-dw-subv{display:flex;align-items:baseline;gap:9px}" + ".erg-dw-was{color:var(--ink-soft,#6b6b6b);font-size:14px}" + ".erg-dw-checkout{display:flex;align-items:center;justify-content:center;width:100%;box-sizing:border-box;background:var(--vermilion-dark,#b23a1e);color:#fff;border-radius:100px;padding:14px;font-weight:800;text-decoration:none;font-size:15px}"; function buildDrawer(){ if (drawer) return drawer; var st = document.createElement("style"); st.textContent = DRAWER_CSS; document.head.appendChild(st); var d = document.createElement("div"); d.className = "erg-dw"; d.setAttribute("data-open", "0"); d.innerHTML = '

' + ''; document.body.appendChild(d); drawer = d; return d; } function renderDrawer(){ var d = buildDrawer(); var items = read(); var body = d.querySelector(".erg-dw-body"); var foot = d.querySelector(".erg-dw-foot"); if (!items.length){ body.innerHTML = '

' + esc(L("empty","Your cart is empty.")) + '

'; foot.innerHTML = ""; return; } body.innerHTML = drawerBodyHtml(items, UPSELLS, L, SKUS); foot.innerHTML = drawerFootHtml(items, L); } function openDrawer(){ buildDrawer(); renderDrawer(); drawer.setAttribute("data-open","1"); try { document.documentElement.style.overflow = "hidden"; } catch(e){} fireViewCart(read()); } function closeDrawer(){ if (drawer){ drawer.setAttribute("data-open","0"); try { document.documentElement.style.overflow = ""; } catch(e){} } } // Drawer-scoped delegated clicks: close, remove a line, add an upsell. document.addEventListener("click", function(e){ var t = e.target; if (!t || !t.closest) return; if (t.closest("[data-dw-close]")){ closeDrawer(); return; } var rm = t.closest("[data-dw-remove]"); if (rm){ var sku = rm.getAttribute("data-dw-remove"); write(read().filter(function(x){ return x.sku !== sku; })); return; } var dm = t.closest("[data-dw-dismiss]"); if (dm){ var ds = dm.getAttribute("data-dw-dismiss"), cur = read(), hit = false, n; for (n = 0; n < cur.length; n++){ if (cur[n].sku === ds && cur[n].langFallback){ delete cur[n].langFallback; hit = true; } } // Only write when something actually changed: a write re-renders the // whole drawer, and a no-op re-render would steal focus for nothing. if (hit) { write(cur); refocusAfterDismiss(ds); } return; } var up = t.closest("[data-dw-addup]"); if (up){ var s2 = up.getAttribute("data-dw-addup"), k, u2 = null; for (k = 0; k < UPSELLS.length; k++) if (UPSELLS[k].sku === s2) { u2 = UPSELLS[k]; break; } // locale/gameSlug ride along (2026-09-12) so an upsold line is not the // one line in the cart with no language on it. The upsell entries are // built by cartItemFor(game, PAGE LOCALE) in SiteHeader, so the sku // offered here is already the page's language when that language is // active and English when it is not -- the same defaultSkuFor rule the // product page's own buy button follows. There is no locale decision to // make in the browser, and deliberately so: making one here would be a // second rule to keep in step with the first. if (u2){ var cur = read(); if (!has(cur, u2.sku)){ cur.push({ sku: u2.sku, name: u2.name, cover: u2.cover, priceCents: u2.priceCents, kind: u2.kind, locale: u2.locale, gameSlug: u2.gameSlug }); write(cur); fireAdd(u2, "side_cart_upsell"); omnisendAddedToCart(u2, cur); } } return; } }); document.addEventListener("keydown", function(e){ if (e.key === "Escape") closeDrawer(); }); // Mobile sticky product buy bar: reveal after ~20% scroll (components/ // ProductStickyBar.tsx renders [data-product-sticky] commerce-on; the CSS // only paints it under the mobile media query, so this is a no-op on desktop // and on any page without the bar). var sticky = null, stickyChecked = false; function updateSticky(){ if (!stickyChecked){ sticky = document.querySelector("[data-product-sticky]"); stickyChecked = true; } if (!sticky) return; var doc = document.documentElement; var max = (doc.scrollHeight - window.innerHeight); var pct = max > 0 ? (window.scrollY || doc.scrollTop || 0) / max : 0; sticky.setAttribute("data-visible", pct >= 0.2 ? "1" : "0"); } window.addEventListener("scroll", updateSticky, { passive: true }); window.addEventListener("resize", updateSticky, { passive: true }); // First paint STRICTLY AFTER hydration (see lesson 2). Timing gates do not // work: measured on Next 16 / React 19, the window "load" event fires at // ~77ms but hydration commits at ~117ms -- hydration is concurrent and runs // AFTER load -- so a load- or rAF-gated paint mutates the count/labels while // React is still reconciling and desyncs the tree (#418). React has no // public "hydrated" event, so detect it structurally: React attaches an // internal "__reactFiber$" property to each host DOM node as it // hydrates that node. Poll a target element for it; once present, that node // is hydrated and mutating it can no longer be a hydration mismatch. Falls // back to painting after 3s no matter what, so a detector break degrades to // "paint slightly early" (a repaint on the next cart event heals it), never // "never paint". var painted = false; function hydrated(el){ if (!el) return false; for (var k in el) if (k.indexOf("__reactFiber$") === 0 || k.indexOf("__reactProps$") === 0) return true; return false; } function firstPaint(){ if (painted) return; painted = true; paintButtons(); paintSets(); paintCount(); } var polls = 0; function waitHydrate(){ if (painted) return; var probe = document.querySelector("[data-cart-count]") || document.querySelector("[data-cart-add]"); if (hydrated(probe) || polls++ > 150) { firstPaint(); return; } setTimeout(waitHydrate, 20); } waitHydrate(); })(); 4b:I[27201,["$2"],"IconMark"] 3a:["$","script",null,{"dangerouslySetInnerHTML":{"__html":"$47"}}] 48:T59b, (function(){ if (window.__ergAuth) return; window.__ergAuth = 1; var NAME = "erg_auth"; function signedIn(){ var parts = document.cookie ? document.cookie.split(";") : []; for (var i = 0; i < parts.length; i++) { var p = parts[i].trim(); if (p.slice(0, NAME.length + 1) === NAME + "=") return p.slice(NAME.length + 1) === "1"; } return false; } function forget(){ // Path and SameSite must match what set it, or the browser keeps the // original and this writes a second, narrower cookie beside it. document.cookie = NAME + "=; Path=/; Max-Age=0; SameSite=Lax" + (location.protocol === "https:" ? "; Secure" : ""); } function show(el, visible){ if (el) el.style.visibility = visible ? "visible" : "hidden"; } function paint(){ // Being served the sign-in page proves there is no valid session. if (/^\/account\/sign-in\/?$/.test(location.pathname)) forget(); var on = signedIn(); var links = document.querySelectorAll("[data-auth-link]"); for (var i = 0; i < links.length; i++) { var a = links[i]; var href = a.getAttribute(on ? "data-auth-in-href" : "data-auth-out-href"); if (href) a.setAttribute("href", href); show(a.querySelector("[data-auth-out]"), !on); show(a.querySelector("[data-auth-in]"), on); } } if (document.readyState === "complete") paint(); else window.addEventListener("load", paint); })(); 3b:["$","script",null,{"dangerouslySetInnerHTML":{"__html":"$48"}}] 3d:["$","$L1d","it",{"href":"/it/contact/","aria-current":"$undefined","children":"IT"}] 3e:["$","$L1d","nl",{"href":"/nl/contact/","aria-current":"$undefined","children":"NL"}] 3f:["$","$L1d","se",{"href":"/se/contact/","aria-current":"page","children":"SE"}] 40:["$","h3",null,{"className":"foot-h-gap","children":"Skolor & företagare"}] 41:["$","$L1d",null,{"href":"/se/schools/","children":"Klassrum & upphandling"}] 42:["$","$L1d",null,{"href":"/se/game-license/","children":"Företagslicens"}] 43:["$","div",null,{"className":"foot-bottom","children":[["$","span",null,{"children":"© 2026 Escape Room Geeks LLC. Alla rättigheter förbehållna."}],["$","span",null,{"className":"foot-legal","children":[["$","$L1d",null,{"href":"/se/privacy-policy/","children":"Integritetspolicy"}],["$","$L1d",null,{"href":"/se/terms-and-conditions/","children":"Villkor"}]]}]]}] 19:["$","script",null,{"type":"application/ld+json","dangerouslySetInnerHTML":{"__html":"{\"@context\":\"https://schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https://escaperoomgeeks.com#organization\",\"name\":\"Escape Room Geeks\",\"url\":\"https://escaperoomgeeks.com/\",\"address\":{\"@type\":\"PostalAddress\",\"streetAddress\":\"1309 Coffeen Avenue Ste 1200\",\"addressLocality\":\"Sheridan\",\"addressRegion\":\"Wyoming\",\"postalCode\":\"82801\",\"addressCountry\":\"US\"}},{\"@type\":\"WebSite\",\"@id\":\"https://escaperoomgeeks.com#website\",\"name\":\"Escape Room Geeks\",\"url\":\"https://escaperoomgeeks.com/\"}]}"}}] 49:Tc7f7, (function(){ if (window.__ergCart) return; window.__ergCart = 1; var KEY = "erg_cart_v1", EVENT = "erg-cart-change", HINT = "erg_cart_coupon_hint"; function read(){ try { var a = JSON.parse(localStorage.getItem(KEY) || "[]"); return Array.isArray(a) ? a : []; } catch(e){ return []; } } function write(items){ localStorage.setItem(KEY, JSON.stringify(items)); window.dispatchEvent(new Event(EVENT)); } // fmt / esc / has / subtotalOf / bundleDisc / upsellsFor / nudgeText and the // drawer's HTML builders. Declarations, so they hoist over the uses above // them. They live in their own module (components/cart-drawer-render.ts) // because they are the part a test can run without a DOM -- the money the // drawer shows is asserted equal to what checkout will charge. function fmt(c){ return "$" + ((c || 0) / 100).toFixed(2); } function esc(t){ return String(t == null ? "" : t).replace(/&/g,"&").replace(//g,">").replace(/"/g,"""); } function has(items, sku){ for (var i=0;i= 4) return 50; if (n === 3) return 40; if (n === 2) return 30; return 0; } // Games only, by AMOUNT as well as by count: a bundle in the cart neither // raises the tier nor gets discounted (it is already a discounted basket). function bundleDisc(items){ var count = 0, base = 0, i; for (i = 0; i < items.length; i++){ if (items[i].kind !== "game") continue; count += 1; base += (items[i].priceCents || 0); } var pct = tierPct(count); var raw = pct === 0 ? 0 : Math.floor((base * pct + 50) / 100); return { gameCount: count, percent: pct, discountCents: Math.max(0, Math.min(raw, base)) }; } // ONE BUSINESS LICENSE PER TITLE PER CART (lib/cart/license.ts's // wouldDuplicateLicense, transcribed; tests/commerce/license-cart-ui.test.mjs // proves the two equal). A license SKU for a title another license SKU in the // cart already covers -- a stale per-language one included, since release // #38's license is every language of its game. Same SKU twice is the // ordinary dedup, not this. function wouldDuplicateLicense(items, item){ if (!item || item.kind !== "license") return false; for (var i = 0; i < items.length; i++) { if (items[i].kind === "license" && items[i].gameSlug === item.gameSlug && items[i].sku !== item.sku) return true; } return false; } // Single GAMES the cart does not already hold, in the catalog's own (tier) // order, capped. "Already holds" means ANY language SKU of that game: five // games sell as seven separate SKUs, so a French page's cart can legally // hold project-dino-en while this list offers project-dino-fr. The header // serialises every active variant as .variants for exactly that check. // The site's descent, as a number, so "adjacent tier" is arithmetic. var TIER_RANK = { daylight: 0, dusk: 1, noir: 2 }; function rankOf(t){ var r = TIER_RANK[t]; return r === undefined ? 1 : r; } // Which world the cart is already in: the tier most of its GAMES belong to, // ties going to the earlier tier (catalog order). Cart lines carry no tier // -- localStorage only holds sku/name/cover/price/kind -- so it is looked up // through the "all" list, which the header serialises for EVERY sellable // game, the ones already in the cart included. Null when there are no games. // (No backticks anywhere in this string -- they would end the literal.) function dominantTier(items, all){ var byTier = [0, 0, 0], i, j, u, best = -1, bestN = 0; for (i = 0; i < items.length; i++){ if (items[i].kind !== "game") continue; for (j = 0; j < all.length; j++){ u = all[j]; if (!u) continue; if (u.sku === items[i].sku || (u.variants || []).indexOf(items[i].sku) >= 0){ byTier[rankOf(u.tier)] += 1; break; } } } for (i = 0; i < 3; i++) if (byTier[i] > bestN) { bestN = byTier[i]; best = i; } return bestN === 0 ? null : best; } function heldAlready(items, u){ if (has(items, u.sku)) return true; var vs = u.variants || [], j; for (j = 0; j < vs.length; j++) if (has(items, vs[j])) return true; // ...or a BUNDLE in the cart grants it (release #39 fix round 1): the // candidate's coveredBy, built server-side with the candidates // (lib/cart/upsell-catalog.ts). A transcription of lib/cart/upsells.ts's // heldAlready; tests/commerce/cart-upsells.test.mjs holds the two equal. var bs = u.coveredBy || []; for (j = 0; j < bs.length; j++) if (has(items, bs[j])) return true; return false; } // Single GAMES the cart does not already hold, nearest tier first, then the // catalog's own order; capped. "Already holds" means ANY language SKU of // that game: five games sell as seven SKUs each, so a French page's cart can // legally hold project-dino-en while this list offers project-dino-fr. // With no games in the cart there is no dominant tier and the order is the // catalog's, exactly as before. function upsellsFor(items, all, max){ var dom = dominantTier(items, all), cand = [], i, u; for (i = 0; i < all.length; i++){ u = all[i]; if (!u || u.kind !== "game") continue; if (heldAlready(items, u)) continue; cand.push({ u: u, i: i, d: dom === null ? 0 : Math.abs(rankOf(u.tier) - dom) }); } cand.sort(function(a, b){ return a.d - b.d || a.i - b.i; }); var out = []; for (i = 0; i < cand.length && out.length < max; i++) out.push(cand[i].u); return out; } // What the cart TOTAL becomes if this upsell is added -- the tier it would // earn included, from the same bundleDisc the footer uses. This is the // number the offer is actually worth, and it is derived, never written. function totalWith(items, u){ var next = items.slice(); next.push({ sku: u.sku, priceCents: u.priceCents, kind: u.kind }); return subtotalOf(next) - bundleDisc(next).discountCents; } // The NEXT tier, stated plainly. A TRANSCRIPTION of lib/cart/nudge.ts's // nudgeKeyFor -- see that file for why the mixed case exists at all, and // tests/commerce/cart-drawer.test.mjs for the assertion that the two agree // over every cart shape rather than only in this comment. // // Short version: "save 30% on both" is a lie the moment a bundle shares the // cart, because "both" reads as both LINES and a bundle never discounts. // Any non-game line switches the copy to "...on your single games". function nudgeKey(items){ var games = 0, other = false, i; for (i = 0; i < items.length; i++){ if (items[i].kind === "game") games += 1; else other = true; } if (games === 0) return null; var step = games >= 4 ? "Max" : String(games); return (other ? "nudgeMix" : "nudge") + step; } var NUDGE_EN = { nudge1: "Add 1 more game and save 30% on both", nudge2: "Add 1 more and save 40% on all three", nudge3: "Add 1 more and save 50% on all four", nudgeMax: "You're saving 50% - the maximum", nudgeMix1: "Add 1 more game and save 30% on your single games", nudgeMix2: "Add 1 more game and save 40% on your single games", nudgeMix3: "Add 1 more game and save 50% on your single games", nudgeMixMax: "You're saving 50% on your single games - the maximum" }; function nudgeText(items, L){ var k = nudgeKey(items); return k ? L(k, NUDGE_EN[k]) : ""; } // --------------------------------------------------------------------- // LANGUAGE ON THE LINE (Ivan, 2026-09-12). Five games sell as seven // separate skus, so "which language did I actually buy" is a question the // cart has to answer -- and until now it did not: two lines of the same // game in two languages rendered as two identical rows. // // THE LINE'S OWN FIELDS WIN, THE MAP IS THE FALLBACK. A line added by a // build that carries locale/gameSlug says so itself. A line restored from // a localStorage cart written before those fields existed says nothing, so // it is looked up by sku in the map the header serialises // (window.__ergSkus, from lib/cart/sku-map.ts). Neither path can invent a // language: an unknown sku resolves to null and renders no label at all, // rather than guessing "English". // // A BUSINESS LICENSE IS NEVER LOOKED UP (release #38). A title license is // every language and carries no locale; the map's l for its sku is only the // snapshot export's COALESCE, never a language it covers, so it gets no // label. A stale per-language license line names its own locale, read first. function factsOf(skus, it){ if (it && typeof it.locale === "string") { return { l: it.locale, g: it.gameSlug === undefined ? null : it.gameSlug }; } if (it && it.kind === "license") return null; var f = skus && it ? skus[it.sku] : null; return f ? { l: f.l, g: f.g } : null; } // A transcription of languageOptionsFor() in lib/cart/sku-map.ts -- and, // like bundleDisc above, one a test runs against its original over the same // inputs rather than trusting this comment. [] means "render a label, not a // control": a bundle, the only active language of its game (today's real // data), or a sku the map has never heard of. // // EVERY KEY IN THE MAP IS ALREADY ACTIVE. skusForProduct() filtered it when // the map was built, which is why there is no status test here to forget -- // a drafted language is absent from the data this reads, exactly as it is // absent from the product page's picker. function langOptions(skus, sku){ if (!skus) return []; var f = skus[sku]; if (!f || f.g === null || f.g === undefined) return []; var out = [], k; for (k in skus) if (Object.prototype.hasOwnProperty.call(skus, k) && skus[k].g === f.g) out.push(k); return out.length > 1 ? out : []; } function langLabel(loc, L){ return L("lang." + loc, loc.toUpperCase()); } // A transcription of switchLineLanguage() in lib/cart/switch.ts. See that // file for every refusal and why each one exists; see // tests/commerce/cart-language.test.mjs for the assertion that this copy // and its original return the same cart over the same inputs, which is the // only thing standing between them and drift. // // null means WRITE NOTHING. The caller re-renders from the cart it already // had, which puts the control back on the language the cart really holds. function switchLine(items, fromSku, toSku, skus){ if (fromSku === toSku) return null; var at = -1, i; for (i = 0; i < items.length; i++) if (items[i].sku === fromSku) { at = i; break; } if (at < 0) return null; var target = skus ? skus[toSku] : null; if (!target) return null; var family = items[at].gameSlug; if (family === undefined || family === null) { var f = skus[fromSku]; family = f ? f.g : null; } if (family === null || target.g !== family) return null; var line = items[at], out = []; for (i = 0; i < items.length; i++){ if (i !== at && items[i].sku === toSku) continue; if (i === at) { out.push({ sku: toSku, name: line.name, cover: line.cover, kind: line.kind, priceCents: target.p, locale: target.l, gameSlug: target.g }); } else out.push(items[i]); } return out; } // The language sits UNDER the name inside the existing 1fr cell rather than // as a fifth grid column: the row is 52px/1fr/auto/auto and at 400px the // drawer has ~324px of usable width, so a fourth inline cell would squeeze // the game name to nothing. The static label and the language control are // given the same 30px box, so a cart mixing single- and multi-language // lines has rows of one height. // // NO TAG NAME MAY BE WRITTEN LITERALLY IN THIS STRING, NOT EVEN IN A // COMMENT. Everything in DRAWER_RENDER_JS is emitted verbatim inside the // page's inline script, so a bare "<" + tagname here is a token in the // built HTML -- which is how the first draft of this comment tripped // buy-button.test.mjs's "no picker renders for a single-SKU game" guard on // /product/circus-medrano/ and /product/kiddo-bundle/. The guard was right // and the comment was wrong. // A label when there is nothing to choose, a picker when there is. The // picker is a native control -- focusable, arrow-key operable and screen- // reader announced with no ARIA of its own beyond the label, which names // the LINE as well as the field so a cart of four games does not present // four controls all called "Language". function langCellHtml(it, skus, L){ var f = factsOf(skus, it); if (!f) return ""; var opts = langOptions(skus, it.sku); if (opts.length < 2) return '' + esc(langLabel(f.l, L)) + ''; var html = ''; } // The one-line note under a line that was added in a language the visitor // did not ask for. It exists because the alternative is silence: a French // visitor presses "Ajouter au panier" and an English game lands in the // cart, and until now the only clue was the language label two lines up. // // ONLY ON A LINE THAT CARRIES THE FLAG. Everything about WHETHER to set the // flag was decided before the line was added -- the server ruled on whether // the game is a multilingual title at all and whether the substitute is // English (lib/cart/item.ts), the island ruled on whether the visitor // accepted the default. By the time the drawer sees the line there is // nothing left to judge, which is why there is no condition here beyond // the field's presence. // // DISMISSIBLE, AND THE DISMISSAL STICKS: it clears the field on the line, // so it does not come back on the next open. Changing the line's language // clears it too -- switchLine builds the new line without it, because an // explicit choice has answered the question the note was asking. function fallbackHtml(it, L){ // typeof, not truthiness: langLabel calls toUpperCase() on this, so a // number or an object out of a hand-edited localStorage cart would throw // inside renderDrawer and blank the entire cart. factsOf guards its own // locale field the same way and for the same reason. // (No backticks anywhere in this string -- they would end the literal.) if (typeof it.langFallback !== "string" || !it.langFallback) return ""; var txt = L("langFallback", "Not yet available in {lang}; the English version was added.") .split("{lang}").join(langLabel(it.langFallback, L)); return '

' + esc(txt) + '' + '

'; } function itemsHtml(items, L, skus){ var html = "", i, it; for (i = 0; i < items.length; i++){ it = items[i]; html += '

' + (it.cover ? '

' : '') + '' + esc(it.name || it.sku) + '' + langCellHtml(it, skus, L) + '' + '' + fmt(it.priceCents) + '' + '' + '

' + esc(L("bundleDiscount","Multi-game discount")) + ' (' + d.gameCount + ' ' + esc(L("games","games")) + ' · −' + d.percent + '%)' + '−' + fmt(d.discountCents) + '

'; } function nudgeHtml(items, L){ var txt = nudgeText(items, L); return txt ? '

' + esc(txt) + '

' + esc(L("upsell","You might also like")) + '

', j, u, note; for (j = 0; j < ups.length; j++){ u = ups[j]; note = L("cartBecomes", "Cart becomes {total}").split("{total}").join(fmt(totalWith(items, u))); html += '

' + (u.cover ? '

' : '') + '' + esc(u.name) + '' + '' + esc(note) + '' + '' + '

'; } return html + '

' + esc(L("subtotal","Subtotal")) + '' + '' + (d.discountCents > 0 ? '~~' + esc(L("was","was")) + ' ' + fmt(sub) + '~~' : "") + '' + fmt(total) + '

' + esc(L("empty","Your cart is empty.")) + '

Kontakt

Chatta med oss

Kom till oss

Skicka ett meddelande