/* SOCIALIZE-CLIENT: the site's one door to the socialize API (socialize.nevente.com). ONE file, TWO surfaces. `editorial_board.py::_socialize_client` splices it into the board's page logic between the socialize-client marker comments (the block is rebuilt from this file on every run, so editing here is what ships); the event pages carry the same text as their whole `logic`, written by build_event_pages.py. The mode is chosen at runtime, not build time: - BOARD : one target per card, `.nvb-card[data-ref]`. - PAGE : the event's own page, keyed by `data.uid` (`@`), control placed in the action row next to the CTA buttons. THE RULE THIS IS BUILT AROUND — socialize is the SOCIAL layer, not an event directory: 1. It must NEVER expose a list of events. The feed is scraped from third parties; publishing it back through this API would hand out the whole harvested set and advertise that we hold it. So this client does NOT call /api/v1/events, does not page it, does not index it, and does not match rows against a socialize list. (The API closed that endpoint to anonymous callers in 0.4.0 — 401 — and this client never asked for it anyway.) 2. When socialize is asked about an event it answers with the SOCIAL FACTS ONLY — how many people are interested, whether the viewer is one of them — keyed by an identifier we already hold. No title, date, venue, price, source or provenance comes back, so nothing on the page, in a response or in a log discloses that we know about that event, or how. 3. THE KEY IS OPAQUE. We address an event by `ref`, a hash of its source id and date (szRef, below) — never the uid itself. The uid is the source's own identifier (an Eventbrite ticket number, say); the ref travels to socialize in request paths and sits in our served HTML, so sending it raw would disclose where we scraped the event and let anyone holding it look the source up. HOW THE SESSION WORKS — this is what makes "I'm going" possible at all. The API accepts its `socialize_session` cookie as well as a Bearer token; the cookie is SameSite=Lax; and socialize.nevente.com shares this site's registrable domain, so a request from this page is SAME-SITE and the cookie is sent (Safari's ITP treats it as first-party for the same reason). That is why every request below sets `credentials:'include'` and why the API's CORS answers with the exact origin plus Allow-Credentials. The magic link lands on the API itself (there is no return URL in the contract), so the flow is: click -> sign in by email -> open the link (the cookie is set there) -> come back. The ref of the interrupted click is remembered as `pending` so it completes by itself on return. Page logic runs as `AsyncFunction('data','api','window')` TWICE — server-side for the render, then in the browser. `api.fetch` is the only fetch in both (SSR binds globalThis.fetch, the browser window.fetch); `window` is an SSR SHIM with only `location`, so `document` and `localStorage` are probed with `typeof`. THE SSR RUN NEVER FETCHES FACTS: they are per-event, so a board of 74 cards would be ~74 requests per phone view (155+ desktop) and would stall the render. The server asks only /info; the browser fills counts in lazily, per target, as it comes near the viewport. The API base can be overridden with `data.board.socializeApi`, and the copy with `data.board.socializeText` — set them on the shared block `blocks/nevente-events`' data, because the board's block fetch assigns `data.board` wholesale. */ const SZ_BASE = String((data.board && data.board.socializeApi) || 'https://socialize.nevente.com').replace(/\/+$/, ''); const SZ_API = SZ_BASE + '/api/v1'; const SZ_SESSION_KEY = 'socialize_session'; // a Bearer token, if one was ever stored const SZ_PENDING_KEY = 'socialize_pending'; // ref waiting for a sign-in to complete the click const SZ_FAV_KEY = 'socialize_has_favs'; // '1'/'0': does this viewer have favorites? asked once const SZ_TIMEOUT_MS = 4000; // SSR must not hang the render on a slow API const SZ_IS_DOM = (typeof document !== 'undefined'); /* Copy, overridable from the block data so wording changes need no code change — the board has `board.labels`, but an event page has no board at all. */ const SZ_TXT = Object.assign({ going: 'Do të vij', goingOn: 'Po vij', interested: 'të interesuar', interestedOne: 'i interesuar', signTitle: 'Do të shënosh pjesëmarrjen?', signLead: 'Të dërgojmë një link identifikimi. Pa fjalëkalim.', signEmail: 'Email-i yt', signSend: 'Dërgo linkun', signClose: 'Mbyll', signSent: 'Hap linkun në email: ai të identifikon (hapet faqja e socialize). Pastaj kthehu këtu ' + 'dhe pjesëmarrja shënohet vetë.', signErr: 'Nuk u dërgua. Provo përsëri.', retry: 'Provo përsëri', }, (data.board && data.board.socializeText) || {}); const szDiag = { ok: false, where: SZ_IS_DOM ? 'dom' : 'ssr', version: '', features: '', reason: '', refs: 0, // targets carrying a ref, counted server-side from the page's own data sample: '', // one ref, so the key's shape is verifiable in the served HTML }; /* szRef(ev) — the opaque key for one event: 12 hex chars of it, then `@date`. Pure and deterministic, so the server render, the browser, the board and the event page all compute the same key for the same event, and so does tomorrow's run: nothing to store, nothing to sync. Two 32-bit FNV-1a passes with different offsets give 64 bits, trimmed to 48 — collisions across a few hundred events are not a practical concern. */ function szRef(ev) { const src = String((ev && (ev.uid || ev.id)) || ''); const date = String((ev && ev.date) || ''); if (!src) return ''; let h1 = 0x811c9dc5, h2 = 0x9e3779b1; for (let i = 0; i < src.length; i++) { const c = src.charCodeAt(i); h1 = Math.imul(h1 ^ c, 0x01000193); h2 = Math.imul(h2 ^ (c + i), 0x85ebca6b); } h1 >>>= 0; h2 >>>= 0; const hex = h1.toString(16).padStart(8, '0') + h2.toString(16).padStart(8, '0'); return hex.slice(0, 12) + '@' + date; } function szStore(key, value) { try { if (typeof localStorage === 'undefined') return ''; if (value === undefined) return localStorage.getItem(key) || ''; if (value) localStorage.setItem(key, value); else localStorage.removeItem(key); } catch (e) { /* private mode */ } return ''; } const szToken = () => szStore(SZ_SESSION_KEY); const szRemember = (token) => szStore(SZ_SESSION_KEY, token); /* The click that did not finish is remembered WITH the little the API needs to link the event on that first click (a bare click on an unknown reference is a 404 — see szLinkPayload). Stored as JSON; a bare ref from an earlier version is still understood. */ const szPendingSet = (obj) => szStore(SZ_PENDING_KEY, JSON.stringify(obj)); function szPendingGet() { const raw = szStore(SZ_PENDING_KEY); if (!raw) return null; try { const parsed = JSON.parse(raw); if (parsed && parsed.ref) return parsed; } catch (e) { /* a bare ref, from an older run */ } return { ref: raw, link: null }; } /* The API parses `starts_at` as RFC3339, which REQUIRES an offset; the feed stores a naive local date+time. Ask the browser's own tz database for the offset that applies on that date rather than hard-coding DST rules (a wrong hour in their digest email is a real bug). */ function szOffset(naive) { try { const at = new Date(String(naive) + 'Z'); // read the wall clock as if UTC const parts = new Intl.DateTimeFormat('en-US', { timeZone: 'Europe/Tirane', timeZoneName: 'longOffset' }).formatToParts(at); const tz = parts.find((p) => p.type === 'timeZoneName'); const m = tz && String(tz.value).match(/GMT([+-]\d{2}:\d{2})/); if (m) return m[1]; } catch (e) { /* no Intl timeZone support: fall through */ } return '+01:00'; // CET; the winter offset } function szRfc3339(startsAt) { let s = String(startsAt || '').trim(); if (!s) return ''; if (/Z$|[+-]\d{2}:\d{2}$/.test(s)) return s; // already absolute if (/^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}$/.test(s)) s += ':00'; return s + szOffset(s); } /* What the social layer needs to meet an event for the first time: a title and a start. This is the FIRST-CLICK path — socialize creates the row from it, which is why a bare click is a 404 and why the board sends it on every POST (the API ignores it once the reference is known). */ function szLinkPayload(t) { let title = '', at = '', url = ''; if (t && t.card) { const te = t.card.querySelector('.nvb-card-title'); title = (te && te.textContent || '').trim(); at = t.card.getAttribute('data-at') || ''; const href = t.card.getAttribute('href') || ''; if (href.charAt(0) === '/') url = szOrigin() + href; else if (/^https?:/.test(href)) url = href; } else { const ev = (data && data.event) || {}; title = String(ev.name || '').trim(); at = ev.dateIso && ev.time ? (ev.dateIso + 'T' + ev.time) : ''; url = String((data && data.url) || (window.location && window.location.href) || ''); } const starts = szRfc3339(at); if (!title || !starts) return null; // nothing to link with: send a bare click const out = { title: title.slice(0, 300), starts_at: starts, timezone: 'Europe/Tirane' }; if (url) out.url = String(url); return out; } function szOrigin() { try { return String((window.location && window.location.origin) || '').replace(/\/+$/, ''); } catch (e) { return ''; } } /* The transport: session in (the cookie, plus a Bearer token if one is stored), JSON out, the API's error envelope unwrapped to a code. `credentials:'include'` is what carries the cookie. */ async function szRequest(method, path, body) { const url = SZ_API + path; const headers = { Accept: 'application/json' }; const tok = szToken(); if (tok) headers.Authorization = 'Bearer ' + tok; const init = { method: method || 'GET', headers: headers, credentials: 'include' }; if (body !== undefined) { headers['Content-Type'] = 'application/json'; init.body = JSON.stringify(body); } let ctrl = null; let timer = null; if (typeof AbortController !== 'undefined') { ctrl = new AbortController(); init.signal = ctrl.signal; timer = setTimeout(function () { ctrl.abort(); }, SZ_TIMEOUT_MS); } try { let res; if (api && typeof api.fetch === 'function') res = await api.fetch(url, init); else if (typeof fetch === 'function') res = await fetch(url, init); else throw new Error('no_fetch'); const raw = await res.text(); let json = null; try { json = raw ? JSON.parse(raw) : null; } catch (e) { json = null; } if (!res.ok) { const code = (json && json.error && json.error.code) || ('http_' + res.status); const err = new Error(code); err.status = res.status; err.body = json; throw err; } return json; } finally { if (timer) clearTimeout(timer); } } /* Reachability: /info carries the version and the feature flags and nothing about any event. The SSR run's only request. */ try { const info = await szRequest('GET', '/info'); szDiag.version = String((info && info.version) || ''); const f = (info && info.features) || {}; const on = []; for (const k of Object.keys(f)) { if (f[k]) on.push(k); } szDiag.features = on.join(','); szDiag.ok = true; } catch (e) { szDiag.ok = false; const st = e && e.status ? ('http' + e.status + ':') : ''; szDiag.reason = st + String((e && e.message) || e).slice(0, 60); } /* How many keys the render carries, and what one looks like — read off the page's OWN data, so it is a server-side fact about the render, not a claim about the API, and the cheapest way for curl to check the key's shape without a browser. */ (function () { const groups = (data.view && data.view.groups) || []; for (const g of groups) { const evs = (g && g.events) || []; for (const ev of evs) { const r = ev && ev.ref; if (!r) continue; szDiag.refs += 1; if (!szDiag.sample) szDiag.sample = String(r).slice(0, 40); } } if (!szDiag.refs && data.uid) { // event page: identity lives on the data root const bits = String(data.uid).split('@'); const r = szRef({ uid: data.sourceUid || bits[0], date: bits[1] }); if (r) { szDiag.refs = 1; szDiag.sample = r; } } })(); /* Bound by the invisible .nvb-sz-probe node on the board: the surface a crawler and curl both see. Written by the SERVER run ONLY — letting the browser re-run overwrite it would risk turning a reliable server-side fact into a browser-side error string in the DOM; the browser's own result lives on window.__socialize (where: 'dom'). A probe is public output, so it says nothing about events beyond how many keys the render carries. */ if (!SZ_IS_DOM) { data.socialize = { probe: 'sz:' + szDiag.where + ':' + (szDiag.ok ? 'ok' : 'err') + ' v' + (szDiag.version || '?') + (szDiag.refs ? ' refs:' + szDiag.refs + ' ' + szDiag.sample : ' refs:0') + (szDiag.ok ? '' : ' ' + szDiag.reason), ok: szDiag.ok, }; } window.__socialize = szDiag; /* ---------------------------------------------------------------- the browser layer */ /* Everything below runs in the browser only, and is the only place facts are fetched. */ const szSeen = {}; // ref -> facts, so a re-render does not refetch let szBooted = false; let szObs = null; function szStyle() { if (document.getElementById('nvb-sz-style')) return; const el = document.createElement('style'); el.id = 'nvb-sz-style'; el.textContent = [ '.nvb-card{position:relative}', '.nvb-sz-count{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;', 'border-radius:999px;font-size:.72rem;font-weight:700;line-height:1.5;', 'background:rgba(18,18,18,.06);color:#3d3d3d;white-space:nowrap}', '.nvb-card .nvb-sz-count{align-self:flex-start}', '.nvb-sz-count[hidden]{display:none}', '.nvb-sz-go{display:inline-flex;align-items:center;gap:5px;padding:7px 14px;border:0;', 'border-radius:999px;cursor:pointer;font:inherit;font-size:.78rem;font-weight:800;', 'background:#121212;color:#fff}', '.nvb-card .nvb-sz-go{position:absolute;right:10px;bottom:10px;z-index:3;padding:5px 11px;', 'font-size:.72rem}', '.nvb-sz-go[aria-pressed="true"]{background:#0a7d3f}', '.nvb-sz-go[disabled]{opacity:.55;cursor:default}', /* no margin-top: the mount sits INSIDE the action row now, and the 12px that separated it from the row above pushed the control down out of line with the buttons beside it. */ '.nvb-sz-page{display:flex;align-items:center;gap:10px;flex-wrap:wrap}', /* the sign-in sheet is fixed, so it can never nest inside a card's */ '.nvb-sz-veil{position:fixed;inset:0;z-index:9999;background:rgba(12,12,12,.45);', 'display:flex;align-items:center;justify-content:center;padding:18px}', '.nvb-sz-sheet{width:100%;max-width:380px;background:#fff;border-radius:16px;padding:20px;', 'box-shadow:0 18px 50px rgba(0,0,0,.28);color:#121212}', '.nvb-sz-sheet h3{margin:0 0 6px;font-size:1.05rem}', '.nvb-sz-sheet p{margin:0 0 14px;font-size:.85rem;color:#5a5a5a;line-height:1.45}', '.nvb-sz-sheet input{width:100%;box-sizing:border-box;padding:11px 13px;font:inherit;', 'border:1px solid #d6d6d6;border-radius:10px;margin-bottom:10px}', '.nvb-sz-sheet .nvb-sz-row{display:flex;gap:8px}', '.nvb-sz-sheet button{flex:1;padding:11px 14px;border:0;border-radius:10px;font:inherit;', 'font-weight:800;cursor:pointer;background:#121212;color:#fff}', '.nvb-sz-sheet button.nvb-sz-ghost{background:#eee;color:#121212;flex:0 0 auto}', '.nvb-sz-sheet button[disabled]{opacity:.55;cursor:default}', ].join(''); document.head.appendChild(el); } /* One request about one event. A 404 is the documented answer for a reference nobody has linked yet and is NOT a failure: render nothing and stay quiet — never fall back to fetching the event itself (that is the disclosure we are avoiding). */ async function szFacts(ref) { if (!ref) return null; if (Object.prototype.hasOwnProperty.call(szSeen, ref)) return szSeen[ref]; let out = null; try { const r = await szRequest('GET', '/social/' + encodeURIComponent(ref)); if (r && typeof r === 'object') { out = { count: Number(r.interested_count) || 0, mine: !!r.viewer_interested }; } } catch (e) { out = null; } szSeen[ref] = out; return out; } /* The sign-in sheet, opened from the button when the API answers 401 (no session cookie yet). Its job is only the email: closing it leaves the click un-performed. */ function szSheet(pending) { if (!SZ_IS_DOM || document.querySelector('.nvb-sz-veil')) return; const want = pending || {}; const veil = document.createElement('div'); veil.className = 'nvb-sz-veil'; const sheet = document.createElement('div'); sheet.className = 'nvb-sz-sheet'; veil.appendChild(sheet); veil.addEventListener('click', function (e) { if (e.target === veil) veil.remove(); }); const h = document.createElement('h3'); h.textContent = SZ_TXT.signTitle; const lead = document.createElement('p'); lead.textContent = SZ_TXT.signLead; const input = document.createElement('input'); input.type = 'email'; input.placeholder = SZ_TXT.signEmail; input.autocomplete = 'email'; const row = document.createElement('div'); row.className = 'nvb-sz-row'; const send = document.createElement('button'); send.type = 'button'; send.textContent = SZ_TXT.signSend; const close = document.createElement('button'); close.type = 'button'; close.className = 'nvb-sz-ghost'; close.textContent = SZ_TXT.signClose; row.appendChild(send); row.appendChild(close); const note = document.createElement('p'); note.style.display = 'none'; sheet.appendChild(h); sheet.appendChild(lead); sheet.appendChild(input); sheet.appendChild(row); sheet.appendChild(note); close.addEventListener('click', function () { veil.remove(); }); send.addEventListener('click', async function () { const email = String(input.value || '').trim(); if (!email) { input.focus(); return; } send.disabled = true; try { await szRequest('POST', '/auth/email/start', { email: email }); /* Remember the interrupted click — with the link payload, so it can be completed from any page later, not only from the one that was open. */ if (want.ref) szPendingSet(want); lead.style.display = 'none'; input.style.display = 'none'; row.style.display = 'none'; note.style.display = 'block'; note.textContent = SZ_TXT.signSent; } catch (e) { note.style.display = 'block'; note.textContent = SZ_TXT.signErr; send.disabled = false; } }); document.body.appendChild(veil); input.focus(); } /* A "target" is one thing to show social facts for: a board card, or the event page itself. */ function szTargets() { const out = []; const cards = document.querySelectorAll('.nvb-card[data-ref]'); for (let i = 0; i < cards.length; i++) { const ref = cards[i].getAttribute('data-ref') || ''; /* The day-divider rows carry the same class and the bound attributes, with nothing in them — a target with no ref could only render a button that cannot act. Skip it. */ if (!ref) continue; out.push({ host: cards[i], card: cards[i], ref: ref }); } if (out.length) return out; /* Event page: the identity is in the page data, and the control goes where the page marks a home for it (`data-sz-mount`); the action-row lookup below is only the fallback for a page built before that marker existed. */ const bits = String(data.uid || '').split('@'); const ref = szRef({ uid: data.sourceUid || bits[0], date: bits[1] }); if (!ref) return out; let mount = document.querySelector('[data-sz-mount]'); if (!mount) { const shell = document.querySelector('main section.nv-shell, section.nv-shell'); if (!shell) return out; const divs = shell.querySelectorAll('div'); for (let i = 0; i < divs.length; i++) { if (divs[i].querySelector(':scope > a.nv-btn')) { mount = divs[i]; break; } } } if (!mount) return out; let host = mount.querySelector('.nvb-sz-page'); if (!host) { host = document.createElement('div'); host.className = 'nvb-sz-page'; mount.appendChild(host); } out.push({ host: host, card: null, ref: ref }); return out; } function szCountEl(t) { let el = t.host.querySelector('.nvb-sz-count'); if (el) return el; el = document.createElement('span'); el.className = 'nvb-sz-count'; el.hidden = true; /* The foot is the row the category already sits in, so the count lands on that line and shares it with the "I'm going" button instead of floating mid-card. */ const body = (t.card && (t.card.querySelector('.nvb-card-foot') || t.card.querySelector('.nvb-card-body'))) || t.host; body.appendChild(el); return el; } function szGoEl(t) { /* On a card the control goes INSIDE the card: the card is `` and its parent is the section's whole list (9 cards share it), so appending to the parent would stack every button in one corner and `:scope > button` would find the wrong one. Nested in the anchor it is — the handler stops the navigation, and the card is position:relative so the absolute placement anchors to the card. On an event page it goes in the action row. */ let el = t.host.querySelector('.nvb-sz-go'); if (el) return el; el = document.createElement('button'); el.type = 'button'; el.className = 'nvb-sz-go'; el.textContent = SZ_TXT.going; el.setAttribute('aria-pressed', 'false'); el.addEventListener('click', async function (ev) { ev.preventDefault(); ev.stopPropagation(); if (el.disabled || !t.ref) return; el.disabled = true; try { const was = el.getAttribute('aria-pressed') === 'true'; const path = '/social/' + encodeURIComponent(t.ref) + '/interest'; /* Marking interest on an event nobody has linked yet IS the link: without the payload the API answers 404 and the click is lost. Clearing interest never carries it. */ const link = was ? null : szLinkPayload(t); const r = was ? await szRequest('DELETE', path) : await szRequest('POST', path, link ? { event: link } : undefined); szTook(t, r, was); } catch (e) { if (e && e.status === 401) { /* No session yet: ask for the email. The remembered click means it completes by itself after the link has been opened (szCompletePending on the next load / tab return). */ szSheet({ ref: t.ref, link: szLinkPayload(t) }); } else { el.textContent = SZ_TXT.retry; } } finally { el.disabled = false; } }); /* On a card that has a foot, the button belongs IN that row — with the category and the count — rather than absolutely positioned over whatever the foot holds. */ const mount = (t.card && t.card.querySelector('.nvb-card-foot')) || t.host; mount.appendChild(el); return el; } /* POST/DELETE interest answers with the new facts — render those, do not refetch. */ function szTook(t, r, was) { const mine = r && typeof r.viewer_interested !== 'undefined' ? !!r.viewer_interested : !was; const count = r && typeof r.interested_count !== 'undefined' && r.interested_count !== null ? Number(r.interested_count) || 0 : (was ? 0 : 1); szSeen[t.ref] = { count: count, mine: mine }; szPaint(t, szSeen[t.ref]); /* A successful mark is proof this viewer has at least one favorite, so the navbar heart must stop hiding NOW. Without this, a visitor who marks their FIRST event in a tab whose cached answer was "nothing to show" sees no heart, and reasonably concludes the favorites feature is broken. */ if (mine) szFavHint(); } function szPaint(t, facts) { const el = szCountEl(t); const go = szGoEl(t); if (go) { go.setAttribute('aria-pressed', facts && facts.mine ? 'true' : 'false'); go.textContent = facts && facts.mine ? SZ_TXT.goingOn : SZ_TXT.going; } const n = facts ? facts.count : 0; /* Nothing social has happened yet: say nothing. A "0" on every card is noise, and the API's own guidance is to hide the counter rather than treat 404 as a failure. */ if (!n) { el.hidden = true; el.textContent = ''; el.removeAttribute('aria-label'); el.title = ''; return; } el.hidden = false; /* A numeral with an icon, not a sentence: "how many" is the entire message, and "1 i interesuar" repeated what the number already said. The sentence survives as the accessible name (and as the hover title), so a screen reader and a long-press still get it in full. */ const words = n + ' ' + (n === 1 ? SZ_TXT.interestedOne : SZ_TXT.interested); el.textContent = String(n); el.setAttribute('aria-label', words); el.title = words; } async function szFill(t) { szPaint(t, await szFacts(t.ref)); } /* Observed element -> its target. The event page observes a host it created, which carries no data-ref, so fall back to matching on the target list. */ function szFillHost(host) { const ref = (host.getAttribute && host.getAttribute('data-ref')) || ''; if (ref) { const isCard = !!(host.classList && host.classList.contains('nvb-card')); szFill({ host: host, card: isCard ? host : null, ref: ref }); return; } const ts = szTargets(); for (let i = 0; i < ts.length; i++) { if (ts[i].host === host) { szFill(ts[i]); return; } } } function szScan() { szStyle(); const ts = szTargets(); for (let i = 0; i < ts.length; i++) { const t = ts[i]; if (t.host.dataset && t.host.dataset.sz != null) continue; if (t.host.dataset) t.host.dataset.sz = '1'; szGoEl(t); // shown now; acts on 401 by asking to sign in if (szObs) szObs.observe(t.host); else szFill(t); } } /* A click interrupted by sign-in: the ref was remembered, so once the session cookie exists (after opening the emailed link) the next page load finishes the job. The POST is idempotent. */ async function szCompletePending() { const p = szPendingGet(); if (!p || !p.ref) return; try { const r = await szRequest('POST', '/social/' + encodeURIComponent(p.ref) + '/interest', p.link ? { event: p.link } : undefined); szSeen[p.ref] = { count: r && r.interested_count !== undefined ? Number(r.interested_count) || 0 : 1, mine: r && typeof r.viewer_interested !== 'undefined' ? !!r.viewer_interested : true, }; szStore(SZ_PENDING_KEY, ''); // done: never replay it const ts = szTargets(); for (let i = 0; i < ts.length; i++) { if (ts[i].ref === p.ref) szPaint(ts[i], szSeen[p.ref]); } } catch (e) { /* 404: the reference is unknown and there is nothing to link it with — drop it instead of retrying for ever. 401: simply not signed in yet, so keep it for the next visit. */ if (e && e.status === 404) szStore(SZ_PENDING_KEY, ''); } } function szBoot() { if (!SZ_IS_DOM || szBooted) return; szBooted = true; szStyle(); if (typeof IntersectionObserver !== 'undefined') { szObs = new IntersectionObserver(function (entries) { for (let i = 0; i < entries.length; i++) { const e = entries[i]; if (!e.isIntersecting) continue; szObs.unobserve(e.target); szFillHost(e.target); } }, { rootMargin: '400px 0px' }); // start before it is on screen: no visible pop-in } szScan(); szCompletePending(); szWatchReturn(); /* A board re-renders when a filter or a day chip is clicked, replacing the card nodes. Watch for that instead of assuming the first render is the only one. */ if (typeof MutationObserver !== 'undefined' && document.body) { let timer = null; new MutationObserver(function () { if (timer) clearTimeout(timer); timer = setTimeout(szScan, 120); }).observe(document.body, { childList: true, subtree: true }); } } /* The magic link lands on the API (its verify URL), so the visitor leaves the site and comes back in the SAME tab. The session cookie is already set by then — this just notices the return, so the interrupted click completes without a reload: open the link, switch back, the button flips by itself. (A `return_to` on the API's verify URL would avoid the JSON stop-over entirely; until it exists, this is the whole of what can be done from this side.) */ function szWatchReturn() { const settle = function () { if (document.visibilityState && document.visibilityState !== 'visible') return; if (szStore(SZ_PENDING_KEY)) szCompletePending(); }; document.addEventListener('visibilitychange', settle); window.addEventListener('focus', settle); window.addEventListener('pageshow', settle); } /* The favorites heart in the navbar, hidden by default (it ships with an inline display:none). The session cookie is HttpOnly, so there is no way to ask "is this viewer signed in?" without asking the API — and that is a request, so it is made ONCE per tab and remembered, because the board is a page you move around in and every navigation is a fresh document. Anonymous callers get a 401 and are simply left with a hidden heart: nothing to show, nothing to remember. */ function szFavHint() { /* Show the heart and remember it for the rest of the tab: called when the API confirms this viewer has something marked, either from the boot check or from a mark that just succeeded. */ try { sessionStorage.setItem(SZ_FAV_KEY, '1'); } catch (e) { /* private mode */ } const el = document.querySelector('.nv-fav-heart'); if (el) el.style.display = 'inline-flex'; } function szHeart() { const el = document.querySelector('.nv-fav-heart'); if (!el) return; let known = ''; try { known = sessionStorage.getItem(SZ_FAV_KEY) || ''; } catch (e) { /* private mode */ } if (known === '1') { szFavHint(); return; } /* A "no" is deliberately NOT remembered. Caching it hid the heart from the very person who had just marked something, in the tab they were already in — the answer to "do I have favorites?" changes the moment they use the button that creates favorites. Only the positive answer is worth keeping, so a page load with no session costs one small request and no lies. */ szRequest('GET', '/me/interests?limit=1&include_past=true').then(function (r) { const n = (r && Array.isArray(r.events)) ? r.events.length : 0; if (n) szFavHint(); }).catch(function () { /* no session: leave it hidden */ }); } if (SZ_IS_DOM) { if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', szBoot); else szBoot(); szHeart(); } window.Socialize = { base: SZ_BASE, diag: szDiag, ref: szRef, token: szToken, remember: szRemember, pending: szPendingSet, pendingGet: szPendingGet, link: szLinkPayload, rfc3339: szRfc3339, request: szRequest, facts: szFacts, targets: szTargets, /* Marking interest ("I'm going") for one ref. Needs the session cookie: szSheet obtains it (open the emailed link, come back) and szCompletePending finishes a remembered click. Callable directly as well, once a session exists. */ interest: function (ref, on) { const path = '/social/' + encodeURIComponent(String(ref || '')) + '/interest'; return szRequest(on ? 'POST' : 'DELETE', path); }, /* Email sign-in. The API always answers 202, whether or not the address has an account. */ signIn: function (email) { return szRequest('POST', '/auth/email/start', { email: String(email || '') }); }, verify: async function (token) { const r = await szRequest('GET', '/auth/email/verify?token=' + encodeURIComponent(String(token || ''))); if (r && r.session_token) szRemember(r.session_token); return r; }, me: function () { return szRequest('GET', '/me'); }, signOut: async function () { try { await szRequest('POST', '/auth/logout'); } catch (e) { /* already gone */ } szRemember(''); }, }; /* --- Favorites (the /preferuaret page) -------------------------------------- This page is PERSONAL, so nothing about it can be server-rendered: the server has no idea who is asking. The list comes from `GET /api/v1/me/interests`, which returns the events this viewer marked, `viewer_interested: true` on each. It reuses the shared client above instead of re-implementing the API: the same base URL, the same cookie/Bearer transport (`szRequest`), the same sign-in sheet (`szSheet`), the same copy table (`SZ_TXT`) — one place that knows how to talk to socialize. The page's own `data.board.socializeText` overrides the wording, exactly as it does on the board. Three states, and the page always says which one it is in: signed out, signed in with nothing marked yet, and the list. */ (function () { if (typeof document === 'undefined') return; // browser only: the states depend on a session const favHost = document.querySelector('[data-fav-list]'); const favNote = document.querySelector('[data-fav-note]'); if (!favHost || !favNote) return; const FAV_TXT = { lead: 'Eventet që ke shënuar me + shfaqen këtu.', signedOut: 'Për t\u2019i parë preferuaret duhet të hysh me email.', signedOutBtn: 'Hyr me email', empty: 'Nuk ke shënuar evente ende.', past: 'Kaluar', emptyBtn: 'Shiko eventet', failed: 'Nuk u ngarkua. Provo përsëri.', retry: 'Provo përsëri', see: 'Shiko eventin', ics: 'Kalendar', interested: 'të interesuar', interestedOne: 'i interesuar', }; function favEl(tag, cls, text) { const el = document.createElement(tag); if (cls) el.className = cls; if (text != null) el.textContent = text; return el; } /* The API sends RFC3339 with an offset; render it in the event's own timezone rather than the viewer's, so someone reading from abroad sees the hour they would actually show up. */ function favWhen(item) { const iso = item && item.starts_at; if (!iso) return ''; const tz = (item && item.timezone) || 'Europe/Tirane'; try { return new Intl.DateTimeFormat('sq-AL', { day: 'numeric', month: 'long', hour: '2-digit', minute: '2-digit', timeZone: tz, }).format(new Date(iso)); } catch (e) { return String(iso).slice(0, 16).replace('T', ' \u00b7 '); } } function favClear() { while (favHost.firstChild) favHost.removeChild(favHost.firstChild); while (favNote.firstChild) favNote.removeChild(favNote.firstChild); } function favMessage(text, btnLabel, onClick) { const p = favEl('p', 'nve-fav-note-line', text); favNote.appendChild(p); if (btnLabel) { const b = favEl('button', 'nv-btn nv-btn-lime nve-fav-btn', btnLabel); b.type = 'button'; b.addEventListener('click', onClick); favNote.appendChild(b); } } function favCard(item) { const card = favEl('div', 'nve-fav-card'); const body = favEl('div', 'nve-fav-body'); /* Favorites are what YOU chose, so a list that silently drops everything that has already started is lying about it — the first version asked the API for upcoming only and showed 1 of 7 marks. Past ones are marked instead of hidden. */ const past = !!(item.starts_at && new Date(item.starts_at).getTime() < Date.now()); body.appendChild(favEl('span', 'nve-fav-when', favWhen(item))); body.appendChild(favEl('h3', 'nve-fav-title', String(item.title || ''))); const place = (item.location && item.location.name) || ''; if (place) body.appendChild(favEl('span', 'nve-fav-where', place)); if (past) { card.className += ' nve-fav-card--past'; body.appendChild(favEl('span', 'nve-fav-tag', FAV_TXT.past)); } card.appendChild(body); const foot = favEl('div', 'nve-fav-foot'); const n = Number(item.interest_count) || 0; if (n > 0) { const chip = favEl('span', 'nvb-sz-count nve-fav-count'); chip.textContent = String(n); const words = n + ' ' + (n === 1 ? FAV_TXT.interestedOne : FAV_TXT.interested); chip.setAttribute('aria-label', words); chip.title = words; foot.appendChild(chip); } const url = String(item.url || ''); if (/^https?:\/\//.test(url)) { const a = favEl('a', 'nve-fav-link', FAV_TXT.see); a.href = url; foot.appendChild(a); } const ics = item.calendar && item.calendar.ics; if (ics && /^https?:\/\//.test(String(ics))) { const a = favEl('a', 'nve-fav-link nve-fav-link--quiet', FAV_TXT.ics); a.href = String(ics); a.rel = 'noopener'; foot.appendChild(a); } card.appendChild(foot); return card; } async function favLoad() { favClear(); try { const res = await szRequest('GET', '/me/interests?include_past=true&limit=100'); const items = (res && Array.isArray(res.events)) ? res.events : []; if (!items.length) { favMessage(FAV_TXT.empty, FAV_TXT.emptyBtn, function () { window.location.href = '/'; }); return; } for (let i = 0; i < items.length; i++) favHost.appendChild(favCard(items[i])); } catch (e) { const status = (e && (e.status || e.code)) || ''; if (status === 401 || status === 'unauthorized' || /401|unauthor/i.test(String(e && e.message))) { favMessage(FAV_TXT.signedOut, FAV_TXT.signedOutBtn, function () { szSheet(null); /* The sheet sends the link and returns; the session cookie appears when that link is opened, so the list is loaded again on the way back rather than by polling. */ window.addEventListener('focus', function () { setTimeout(favLoad, 700); }, { once: true }); }); return; } favMessage(FAV_TXT.failed, FAV_TXT.retry, favLoad); } } favLoad(); })();

Preferuaret