-
-
-
- Findings
-
- Narration
-
+
+
+
+
+
+
+
+
+
+
+
+
+ Engine narration
+
+
+
+
+
+
diff --git a/web/site/engine.js b/web/site/engine.js
index bcc4817..3c57f88 100644
--- a/web/site/engine.js
+++ b/web/site/engine.js
@@ -1,6 +1,6 @@
// Plain, read-only generic engine view. Loads the generic core of each corpus
-// payload and renders findings with their layers, confidence, seqs, and evidence.
-// It reads only the generic core fields; the lecture section is not used here.
+// payload and renders findings as exhibit cards with convergence traces.
+// Reads only generic core fields — the lecture section is not accessed here.
const $ = (id) => document.getElementById(id);
function escapeHtml(s) {
@@ -14,30 +14,155 @@ async function loadJson(url) {
return r.json();
}
+// Build the convergence trace for an elevated finding card.
+// Positions a vertical rail and layer nodes over signal rows, driven entirely
+// by f.signals — no hardcoded content.
+function buildTrace(card) {
+ const body = card.querySelector(".card-body");
+ if (!body) return;
+ body.querySelectorAll(".trace-rail,.layer-node").forEach((el) => el.remove());
+
+ const rows = [...body.querySelectorAll(".signal-row[data-layer]")];
+ if (rows.length < 2) return;
+
+ const rail = document.createElement("span");
+ rail.className = "trace-rail";
+ rail.setAttribute("aria-hidden", "true");
+ body.appendChild(rail);
+
+ const sorted = rows.slice().sort((a, b) => a.offsetTop - b.offsetTop);
+ const centers = sorted.map((el) => el.offsetTop + el.offsetHeight / 2);
+ const top = centers[0];
+ const bottom = centers[centers.length - 1];
+ rail.style.top = top + "px";
+ rail.style.height = bottom - top + "px";
+
+ sorted.forEach((row, i) => {
+ const node = document.createElement("span");
+ const isAnchor = row.dataset.anchor === "true";
+ node.className = "layer-node" + (isAnchor ? " anchor" : "");
+ node.textContent = isAnchor ? "" : (row.dataset.layer || "");
+ node.style.top = centers[i] - 8 + "px";
+ node.setAttribute("aria-hidden", "true");
+ body.appendChild(node);
+ });
+}
+
+function toggleTrace(card, btn, legend) {
+ const on = btn.getAttribute("aria-pressed") === "true";
+ const next = !on;
+ btn.setAttribute("aria-pressed", String(next));
+ btn.textContent = next ? "▾ hide trace" : "▸ trace convergence";
+ card.classList.toggle("tracing", next);
+ if (legend) legend.classList.toggle("show", next);
+ card.querySelectorAll(".signal-row").forEach((r) => r.classList.toggle("on", next));
+ if (next) buildTrace(card);
+}
+
+// Determine the convergence anchor: the signal anchor seq most cited across signals.
+// Driven entirely by real data — never hardcoded.
+function resolveAnchorSeq(signals) {
+ if (!signals.length) return null;
+ const counts = {};
+ for (const s of signals) {
+ counts[s.anchor] = (counts[s.anchor] || 0) + 1;
+ }
+ return Object.keys(counts).reduce(
+ (a, b) => (counts[b] > counts[a] ? b : a),
+ Object.keys(counts)[0]
+ );
+}
+
+function renderFindingCard(f, idx) {
+ const isElevated = f.confidence === "elevated";
+ const anchorSeq = resolveAnchorSeq(f.signals);
+ const uniqueLayers = [...new Set(f.signals.map((s) => s.layer))];
+
+ // signal rows
+ const sigRows = f.signals
+ .map((s) => {
+ const isAnchorSig = isElevated && String(s.anchor) === String(anchorSeq);
+ return (
+ `` +
+ `${escapeHtml(s.layer)}` +
+ `` +
+ `${escapeHtml(s.kind)}` +
+ (s.detail ? ` — ${escapeHtml(s.detail)}` : "") +
+ `` +
+ `anchor seq ${escapeHtml(String(s.anchor))}` +
+ (s.thread ? ` · ${escapeHtml(s.thread)}` : "") +
+ (s.actor ? ` · ${escapeHtml(s.actor)}` : "") +
+ `
`
+ );
+ })
+ .join("");
+
+ // convergence legend (elevated only): lists the converging layers
+ const legendHtml = isElevated
+ ? `` +
+ uniqueLayers.map((l) => `${escapeHtml(l)}`).join(" + ") +
+ (anchorSeq !== null
+ ? ` converge on anchor seq ${escapeHtml(String(anchorSeq))} —`
+ : " —") +
+ ` ${uniqueLayers.length} distinct layer${uniqueLayers.length !== 1 ? "s" : ""} → elevated` +
+ `
` +
+ `${escapeHtml(f.confidence)}` +
+ `` +
+ f.layers.map((l) => `${escapeHtml(l)}`).join("") +
+ `` +
+ `seqs ${seqStr}` +
+ `
` +
+ `${sigRows}
` +
+ legendHtml +
+ `${escapeHtml(f.summary)}
` +
+ ``;
+
+ if (isElevated) {
+ const btn = li.querySelector(".trace-btn");
+ const legend = li.querySelector(".conv-legend");
+ if (btn) btn.addEventListener("click", () => toggleTrace(li, btn, legend));
+ }
+
+ return li;
+}
+
function renderFindings(data) {
const ol = $("findings");
ol.innerHTML = "";
- for (const f of data.findings) {
- const li = document.createElement("li");
- li.className = `finding ${f.confidence}`;
- const sigs = f.signals
- .map((s) => `${s.layer} ${escapeHtml(s.kind)} — ${escapeHtml(s.detail)} (seq ${s.anchor}, ${escapeHtml(s.thread)})`)
- .join("
");
- li.innerHTML =
- `${f.confidence}` +
- `${f.layers.join(" · ")}` +
- `seqs ${f.seqs.join(", ")}
` +
- `${escapeHtml(f.summary)}
` +
- `${sigs}
`;
- ol.appendChild(li);
+ for (let i = 0; i < data.findings.length; i++) {
+ ol.appendChild(renderFindingCard(data.findings[i], i));
}
}
function renderCorpus(data) {
const c = data.corpus;
- $("corpus-summary").textContent =
- `${c.label} · ${c.message_count} messages · ${c.finding_count} findings ` +
- `(${c.elevated_count} elevated, ${c.low_count} low)`;
+ $("corpus-summary").innerHTML =
+ `${escapeHtml(c.label)}
` +
+ `` +
+ `
${escapeHtml(String(c.message_count))}
` +
+ `
messages
` +
+ `
${escapeHtml(String(c.finding_count))}
` +
+ `
findings
` +
+ `
${escapeHtml(String(c.elevated_count))}
` +
+ `
elevated
` +
+ `
${escapeHtml(String(c.low_count))}
` +
+ `
low
` +
+ `