@polycode-projects/the-mechanical-code-talker 2.10.3 → 2.11.0

package/src/services/ledger-viz.mjs

@@ -16,6 +16,7 @@
 
 import { loadMemory, readFactRows, findContradictions, normFactTerm } from "../adapters/memory/core.mjs";
 import { THEME_TOKENS_CSS, SERIF_STACK, MONO_STACK, escapeHtml, embedJson } from "./viz-theme.mjs";
+import { createTicker, prefersReducedMotion } from "./viz-ticker.mjs";
 import { readFile } from "node:fs/promises";
 import { fileURLToPath } from "node:url";
 import { dirname, join } from "node:path";
@@ -524,6 +525,34 @@ export function renderLedgerHtml({ rows, terms, edges, focus, contradictions, wo
   const placeholder = termSet.has("ishmael")
     ? "who is the grandfather of ishmael"
     : (exampleTerm ? `ask the graph… e.g. what is ${exampleTerm.term}` : "ask the graph…");
+  // The paste-and-drop ingest panel plus the JSONL export ride the LIVE
+  // engine (window.tmctLedger): both teach into and read the dock's own
+  // session store, so they appear only where that bundle is offered — the
+  // demo site, never the CLI's self-contained tmct viz page.
+  const ingestHtml = ledgerBundleAvailable
+    ? `<div class="docktools">
+          <button type="button" id="ingestToggle" class="dockbtn">ingest text&hellip;</button>
+          <button type="button" id="exportFacts" class="dockbtn">export facts</button>
+        </div>
+        <div class="researchrow" title="Fetches the topic from Simple English Wikipedia into this graph, then queues the topics its lead section links to — each queued topic runs as its own dock turn, paced politely. Asking is the network consent for these fetches.">
+          <label for="researchTopic" class="mono">research:</label>
+          <input id="researchTopic" type="text" autocomplete="off" spellcheck="false"
+            placeholder="a topic, e.g. owls" aria-label="Topic to research on Simple English Wikipedia">
+          <button type="button" class="dockbtn" id="researchGo">go</button>
+          <button type="button" class="dockbtn" id="researchPlay" aria-pressed="false" hidden>play</button>
+          <span class="ingeststatus mono" id="researchStatus" aria-live="polite"></span>
+        </div>
+        <div class="ingestpanel" id="ingestPanel" hidden>
+          <textarea id="ingestText" spellcheck="false" aria-label="Text to ingest into the graph"
+            placeholder="Paste text or drop a .txt/.md file. Each sentence it recognizes as a fact is added to the graph; the rest are skipped honestly."></textarea>
+          <div class="ingestrow">
+            <button type="button" class="dockbtn" id="ingestBrowse">browse&hellip;</button>
+            <input type="file" id="ingestFile" accept=".txt,.md,text/plain,text/markdown" hidden>
+            <button type="button" class="dockbtn primary" id="ingestRun">ingest</button>
+            <span class="ingeststatus mono" id="ingestStatus" aria-live="polite"></span>
+          </div>
+        </div>`
+    : "";
   const dockHtml = hasMemChat
     ? `<div class="chat">
         <div class="chatlog" id="chatlog" aria-live="polite"></div>
@@ -531,6 +560,7 @@ export function renderLedgerHtml({ rows, terms, edges, focus, contradictions, wo
           <span class="prompt mono">tmct&gt;</span>
           <input id="chatq" type="text" placeholder="${escapeHtml(placeholder)}" aria-label="Ask the graph">
         </form>
+        ${ingestHtml}
       </div>`
     : `<div class="chat chat-off"><p class="chatnote">chat unavailable — run <span class="mono">npm run build:ask-bundle</span> to enable the in-page ask engine.</p></div>`;
 
@@ -655,6 +685,20 @@ ${THEME_TOKENS_CSS}
   .chatask input { flex: 1; font-family: ${MONO_STACK}; font-size: .78rem; background: var(--bg); color: var(--ink); border: 1px solid var(--line); border-radius: 6px; padding: .32rem .6rem; min-width: 0; }
   .chatask input:disabled { opacity: .6; }
   .chatnote { font-family: ${MONO_STACK}; font-size: .72rem; color: var(--muted); margin: 0; }
+  .docktools { display: flex; gap: .5rem; margin-top: .55rem; }
+  .dockbtn { font-family: ${MONO_STACK}; font-size: .68rem; color: var(--muted); border: 1px solid var(--line); border-radius: 6px; padding: .22rem .6rem; background: var(--bg); cursor: pointer; }
+  .dockbtn:hover { color: var(--ink); border-color: var(--ink); }
+  .dockbtn.primary { background: var(--ink); color: var(--bg); border-color: var(--ink); }
+  .dockbtn[aria-pressed="true"] { background: var(--ink); color: var(--bg); border-color: var(--ink); }
+  .researchrow { display: flex; align-items: center; gap: .5rem; margin-top: .45rem; font-size: .72rem; color: var(--muted); flex-wrap: wrap; }
+  .researchrow input { flex: 1 1 8rem; min-width: 6rem; font-family: ${MONO_STACK}; font-size: .72rem; background: var(--card); color: var(--ink); border: 1px solid var(--line); border-radius: 6px; padding: .25rem .55rem; }
+  .researchrow input::placeholder { color: var(--muted); }
+  .ingestpanel { margin-top: .55rem; display: flex; flex-direction: column; gap: .45rem; }
+  .ingestpanel[hidden] { display: none; }
+  .ingestpanel textarea { width: 100%; box-sizing: border-box; min-height: 96px; resize: vertical; font-family: ${MONO_STACK}; font-size: .76rem; line-height: 1.45; background: var(--bg); color: var(--ink); border: 1px solid var(--line); border-radius: 6px; padding: .5rem .6rem; }
+  .ingestpanel textarea.drag { outline: 2px dashed var(--corpus); outline-offset: -4px; }
+  .ingestrow { display: flex; align-items: center; gap: .5rem; }
+  .ingeststatus { font-size: .68rem; color: var(--muted); }
   @media (prefers-reduced-motion: no-preference) {
     .seg, .chip, .look { transition: border-color .12s ease, background-color .12s ease; }
     /* A live teach re-render swaps the dash section wholesale (dashboardHtml
@@ -975,6 +1019,8 @@ ${ledgerBundleAvailable ? `<script src="./ledger-browser.bundle.js"></script>` :
   // (renderLedgerHtml's own ledgerBundleAvailable defaults false there), so
   // this branch is simply never reachable on a CLI-generated page.
   const resolveAnsweredTerm = ${resolveAnsweredTerm.toString()};
+  const createTicker = ${createTicker.toString()};
+  const prefersReducedMotion = ${prefersReducedMotion.toString()};
   const chatForm = el("chatform");
   if (chatForm && typeof tmctLedger !== "undefined" && typeof tmctLedger.createLedgerSession === "function") {
     const log = el("chatlog");
@@ -1067,6 +1113,169 @@ ${ledgerBundleAvailable ? `<script src="./ledger-browser.bundle.js"></script>` :
         }
       });
     });
+
+    // ---- ingest + export: bring your own text, take the graph away ---------
+    // The ingest panel runs pasted/dropped/browsed text through the SAME dock
+    // session, one sentence at a time (tmctLedger.splitSentences, then
+    // s.turn), keeping only the sentences the recognizer grounds — then
+    // re-derives the whole ledger so the new facts can be examined in place.
+    // Export serializes that same session store to canonical JSONL.
+    const ingestToggle = el("ingestToggle");
+    if (ingestToggle) {
+      const panel = el("ingestPanel");
+      const ta = el("ingestText");
+      const runBtn = el("ingestRun");
+      const statusEl = el("ingestStatus");
+      const fileInput = el("ingestFile");
+      ingestToggle.addEventListener("click", () => {
+        panel.hidden = !panel.hidden;
+        if (!panel.hidden) ta.focus();
+      });
+      el("ingestBrowse").addEventListener("click", () => fileInput.click());
+      fileInput.addEventListener("change", async () => {
+        const f = fileInput.files && fileInput.files[0];
+        if (f) { try { ta.value = await f.text(); } catch { statusEl.textContent = "couldn't read that file"; } }
+        fileInput.value = "";
+      });
+      ["dragenter", "dragover"].forEach((ev) => ta.addEventListener(ev, (e) => { e.preventDefault(); ta.classList.add("drag"); }));
+      ["dragleave", "drop"].forEach((ev) => ta.addEventListener(ev, () => ta.classList.remove("drag")));
+      ta.addEventListener("drop", async (e) => {
+        e.preventDefault();
+        const f = e.dataTransfer && e.dataTransfer.files && e.dataTransfer.files[0];
+        if (f) { try { ta.value = await f.text(); } catch { statusEl.textContent = "couldn't read that file"; } }
+      });
+      runBtn.addEventListener("click", () => {
+        const text = ta.value.trim();
+        if (!text) return;
+        statusEl.textContent = "reading\\u2026";
+        runBtn.disabled = true;
+        withLock(async () => {
+          try {
+            const s = await ensureSession();
+            const sentences = tmctLedger.splitSentences(text);
+            let grounded = 0;
+            for (const sentence of sentences) {
+              const r = await s.turn(sentence);
+              if (r.record && r.record.miss === false && r.record.via === "assert") grounded += 1;
+            }
+            const fresh = tmctLedger.computeLedgerDataFromPayload(s.memoryDir.payload, {});
+            applyLedgerData(fresh);
+            const skipped = sentences.length - grounded;
+            statusEl.textContent = sentences.length + " sentence" + (sentences.length === 1 ? "" : "s")
+              + ", " + grounded + " added" + (skipped ? ", " + skipped + " skipped" : "");
+          } catch {
+            statusEl.textContent = "something went wrong ingesting that";
+          } finally {
+            runBtn.disabled = false;
+          }
+        });
+      });
+    }
+
+    const exportBtn = el("exportFacts");
+    if (exportBtn) {
+      exportBtn.addEventListener("click", () => {
+        withLock(async () => {
+          try {
+            const s = await ensureSession();
+            const jsonl = await tmctLedger.exportFactsJsonl(s.memoryDir);
+            const blob = new Blob([jsonl], { type: "application/x-ndjson" });
+            const url = URL.createObjectURL(blob);
+            const link = document.createElement("a");
+            link.href = url;
+            link.download = "tmct-facts.jsonl";
+            document.body.appendChild(link);
+            link.click();
+            link.remove();
+            setTimeout(() => URL.revokeObjectURL(url), 1000);
+          } catch { /* a failed export leaves the page untouched */ }
+        });
+      });
+    }
+
+    // ---- research: a Simple English Wikipedia queue through the SAME dock
+    // session. The engine owns the queue (each turn's result.research is its
+    // snapshot); this dock decides WHEN "research next" is asked, through
+    // the shared viz-ticker verbs, and re-derives the whole ledger after a
+    // step that grounded facts so the new rows can be examined in place —
+    // the same refresh a successful teach performs.
+    const researchTopicEl = el("researchTopic");
+    if (researchTopicEl) {
+      const researchGoBtn = el("researchGo");
+      const researchPlayBtn = el("researchPlay");
+      const researchStatusEl = el("researchStatus");
+      let researchQueue = null; // the engine's latest snapshot, null when no run stands
+
+      function renderResearchControls(tickState) {
+        const st = tickState || researchTicker.getState();
+        researchPlayBtn.hidden = !(researchQueue && !researchQueue.complete);
+        researchPlayBtn.textContent = st.playing ? "pause" : "play";
+        researchPlayBtn.setAttribute("aria-pressed", String(st.playing));
+        researchStatusEl.textContent = !researchQueue ? ""
+          : researchQueue.complete
+            ? 'research "' + researchQueue.topic + '" complete \\u2014 ' + researchQueue.done.length + " topic" + (researchQueue.done.length === 1 ? "" : "s")
+            : researchQueue.done.length + " done \\u00b7 " + researchQueue.pending.length + " queued";
+      }
+
+      // One research turn through the dock — rendered exactly like a typed
+      // line, so the transcript reads as if the visitor asked each search.
+      function researchLine(q) {
+        addLine("u", esc(q));
+        const pending = addLine("a pending", "researching\\u2026");
+        return withLock(async () => {
+          try {
+            const s = await ensureSession();
+            const result = await s.turn(q);
+            const missed = !result.record || Boolean(result.record.miss);
+            pending.className = "a" + (missed ? " miss" : "");
+            pending.innerHTML = esc(result.answer).replace(/\\n/g, "<br>");
+            if (result.research !== undefined) {
+              researchQueue = result.research;
+              renderResearchControls();
+              if (!missed) {
+                const fresh = tmctLedger.computeLedgerDataFromPayload(s.memoryDir.payload, {});
+                applyLedgerData(fresh);
+              }
+            }
+            return result;
+          } catch {
+            pending.className = "a miss";
+            pending.textContent = "Something went wrong with that research step. Try again, or reload the page.";
+            return null;
+          }
+        });
+      }
+
+      const researchTicker = createTicker({
+        onTick: async () => { await researchLine("research next"); },
+        hasNext: () => Boolean(researchQueue && !researchQueue.complete),
+        onRender: renderResearchControls,
+        waitMs: 2400,
+      });
+
+      researchGoBtn.addEventListener("click", () => {
+        const topic = researchTopicEl.value.trim();
+        if (!topic) return;
+        researchTopicEl.value = "";
+        researchLine("research " + topic).then(() => {
+          // A fresh run with topics queued auto-plays, unless the visitor
+          // asked for reduced motion — the play button covers them too.
+          if (researchQueue && !researchQueue.complete && !prefersReducedMotion() && !researchTicker.getState().playing) {
+            researchTicker.play();
+          }
+        });
+      });
+      researchTopicEl.addEventListener("keydown", (e) => {
+        if (e.key === "Enter") { e.preventDefault(); researchGoBtn.click(); }
+      });
+      // pause() directly, not play()'s own toggle: play() declines while a
+      // step is mid-animation, and a pause pressed exactly then must not be
+      // dropped — the in-flight step still settles, then the loop stops.
+      researchPlayBtn.addEventListener("click", () => {
+        if (researchTicker.getState().playing) researchTicker.pause();
+        else researchTicker.play();
+      });
+    }
   } else if (chatForm && typeof tmctMemoryAsk !== "undefined") {
     const memHandle = tmctMemoryAsk.createInMemoryStore();
     memHandle.payload = PAYLOAD;

package/src/services/memory-panel-viz.mjs

@@ -0,0 +1,159 @@
+// memory-panel-viz.mjs — the docked "this session's memory" panel shared by
+// chat.html and ingest.html: both pages seed from the same chat-seed.json
+// bands and want the identical band-count/taught-list/forget-everything
+// chrome, so the rendering lives once here instead of twice.
+//
+// Every export below is pure and `.toString()`-splice safe (no references
+// outside its own parameters), the same discipline chat-page-viz.mjs's own
+// provenanceChipFor/loadProgressLine hold — a page's inline script splices
+// these in as text, so a closure over this module's top-level scope would
+// silently vanish at splice time. Collaborators a caller may want to vary
+// (the band-label lookup, a forget hook) are passed in as parameters, not
+// imported, mirroring provenanceChipFor's own injected `bucketFor`.
+
+/** The human label for one memoryStats() band key — the same band names
+ *  build-chat-seed.mjs/extensions.mjs seed under, plus the two synthetic
+ *  buckets memoryStats mints for anything outside a seed band
+ *  ("taught this session", "other"). An unrecognized key renders as itself
+ *  rather than disappearing, so a future band never goes unlabeled. */
+export function bandLabelFor(key) {
+  const BAND_LABELS = {
+    human: "human persona",
+    "human-medium": "human persona (medium)",
+    "human-large": "human persona (large)",
+    seon: "seon ontology",
+    conceptnet: "ConceptNet",
+    "tier2-aws": "AWS",
+    "tier2-python": "Python",
+    "tier2-java": "Java",
+    "wordnet-xl": "WordNet",
+  };
+  return BAND_LABELS[key] || key;
+}
+
+/** The boot line's own memory summary — every seed band a session actually
+ *  loaded, named with its real count, left to right in the fixed band order;
+ *  a session with nothing seeded says so plainly instead of naming zero
+ *  facts. `bandLabel` is the label lookup to use for each band key (pass
+ *  bandLabelFor, or a page's own override). */
+export function statsSummaryLine(stats, bandLabel) {
+  const BAND_ORDER = [
+    "human", "human-medium", "human-large", "seon", "conceptnet",
+    "tier2-aws", "tier2-python", "tier2-java", "wordnet-xl",
+    "taught this session", "other",
+  ];
+  if (!stats || !stats.total) return "no starter memory; starting empty";
+  const parts = BAND_ORDER.filter((k) => stats.bandCounts[k]).map((k) => stats.bandCounts[k] + " " + bandLabel(k));
+  return parts.length
+    ? "starter memory: " + parts.join(" + ") + " (" + stats.total + " facts total)"
+    : stats.total + " starter facts loaded";
+}
+
+/** Fetch `url` reading the body as a stream, reporting (loadedBytes,
+ *  totalBytes) after every chunk — total is 0 when the response carries no
+ *  Content-Length. Resolves to a Blob of the whole body. Falls back to a
+ *  single-shot blob() read when the runtime has no streaming body reader. */
+export async function fetchWithProgress(url, onProgress) {
+  const res = await fetch(url);
+  if (!res.ok) throw new Error("HTTP " + res.status);
+  const total = Number(res.headers.get("content-length")) || 0;
+  if (!res.body || !res.body.getReader) {
+    const blob = await res.blob();
+    onProgress(blob.size, total || blob.size);
+    return blob;
+  }
+  const reader = res.body.getReader();
+  const chunks = [];
+  let loaded = 0;
+  for (;;) {
+    const step = await reader.read();
+    if (step.done) break;
+    chunks.push(step.value);
+    loaded += step.value.byteLength;
+    onProgress(loaded, total);
+  }
+  return new Blob(chunks);
+}
+
+/**
+ * (Re)render the docked "this session's memory" panel into `panelEl` from a
+ * memoryStats() result: a total-facts row, one row per seed band the session
+ * actually holds, then the last 8 taught facts (most recent first), most
+ * recently taught last shown first. Clears and rebuilds `panelEl`'s children
+ * every call — cheap at this row count, and it means a stale row can never
+ * survive a re-render.
+ *
+ *   opts.bandLabel     required — the band-key -> label lookup (bandLabelFor,
+ *                      or a page's own override).
+ *   opts.taughtHint    the empty-state copy under "taught this session" when
+ *                      nothing has been taught yet. Defaults to the plain
+ *                      teach-a-fact prompt every page can show verbatim.
+ *   opts.onForget      when set, renders a "forget everything" button wired
+ *                      to this callback; omitted, no button renders (a page
+ *                      with no persistence to forget).
+ *   opts.persistNote   when set (and onForget is set), a short note under the
+ *                      forget button naming where the state lives.
+ */
+export function renderStatsPanelInto(panelEl, stats, opts) {
+  const { bandLabel, taughtHint, onForget = null, persistNote = null } = opts;
+  const BAND_ORDER = [
+    "human", "human-medium", "human-large", "seon", "conceptnet",
+    "tier2-aws", "tier2-python", "tier2-java", "wordnet-xl",
+    "taught this session", "other",
+  ];
+  function bandRow(label, count) {
+    const row = document.createElement("p");
+    row.className = "band-row";
+    const l = document.createElement("span");
+    l.textContent = label;
+    const c = document.createElement("span");
+    c.className = "band-count";
+    c.textContent = String(count);
+    row.appendChild(l);
+    row.appendChild(c);
+    return row;
+  }
+
+  panelEl.textContent = "";
+  panelEl.appendChild(Object.assign(document.createElement("h2"), { textContent: "this session's memory" }));
+  panelEl.appendChild(bandRow("total facts", stats.total));
+  for (const key of BAND_ORDER) {
+    if (stats.bandCounts[key]) panelEl.appendChild(bandRow(bandLabel(key), stats.bandCounts[key]));
+  }
+
+  panelEl.appendChild(Object.assign(document.createElement("h2"), { textContent: "taught this session" }));
+  if (!stats.taught.length) {
+    const empty = document.createElement("p");
+    empty.className = "empty";
+    empty.textContent = taughtHint || 'nothing yet — teach it something ("a dog is a kind of animal") and it lands here, with its source.';
+    panelEl.appendChild(empty);
+  } else {
+    for (const fact of stats.taught.slice(-8).reverse()) {
+      const item = document.createElement("p");
+      item.className = "taught-item";
+      item.appendChild(document.createTextNode(fact.subject + " " + fact.predicate + " " + fact.object));
+      const tag = document.createElement("span");
+      tag.className = "taught-tag";
+      tag.textContent = fact.tag;
+      item.appendChild(tag);
+      panelEl.appendChild(item);
+    }
+  }
+
+  if (onForget) {
+    const forget = document.createElement("button");
+    forget.type = "button";
+    forget.id = "forgetEverything";
+    forget.className = "forget-btn";
+    forget.textContent = "forget everything";
+    forget.title = "clear what this device has saved and restart from the fresh seed";
+    forget.addEventListener("click", onForget);
+    panelEl.appendChild(forget);
+    if (persistNote) {
+      const note = document.createElement("p");
+      note.className = "persist-note";
+      note.textContent = persistNote;
+      panelEl.appendChild(note);
+    }
+  }
+}