samagotchi 0.93.0 → 0.95.0

data/lib/samagotchi/web/public/app.js

@@ -36,9 +36,8 @@ import { createTurnView, turnHistoryNodes } from "./turn_view.js";
 import { elementOf, emptyAnswerTemplate } from "./turn_html.js";
 import { createBubbles, hintEl, outputBubbleTemplate } from "./bubbles.js";
 import { createCardsPlace } from "./cards_place.js";
-import { createStageView, FOLD_MS } from "./stage_view.js";
+import { createStageView } from "./stage_view.js";
 import { createMarkdownPlace } from "./markdown_place.js";
-import { reducedMotion, STAGE_GAP } from "./stage_frame.js";
 import { openerText, openTitle } from "./chains.js";
 import { createTaskStopper } from "./task_stop.js";
 import { appendQuote } from "./annotations.js";
@@ -55,8 +54,8 @@ import { createCommandList } from "./command_list.js";
 import { createPromptHistory } from "./prompt_history.js";
 import { ALL_SESSIONS_HASH, sessionHash, sessionIdFromHash } from "./route.js";
 import { scopeDir, scopeTemplate } from "./scope.js";
-import { html, nothing, render } from "./vendor/lit-html.js";
-import { easeScrollTo, FOLLOW_MS, shouldFollowScroll } from "./scroll.js";
+import { render } from "./vendor/lit-html.js";
+import { shouldFollowScroll } from "./scroll.js";
 import { SHORT_WINDOW_QUERY, stripAutoHidden } from "./strip.js";
 import { createStripGrip } from "./strip_grip.js";
 import { waitingOn } from "./notify.js";
@@ -81,7 +80,7 @@ import { createDeliveryControl, QUEUE_NEEDS_WORKER } from "./delivery_line.js";
 import { liveSlots } from "./stage_model.js";
 import { currentGen } from "./turn_model.js";
 import { toolName } from "./activity.js";
-import { toastBottom } from "./toast_place.js";
+import { createDockReserve } from "./dock_reserve.js";
 import { createToasts } from "./toasts.js";
 import { createUnqueue } from "./unqueue.js";
 import { createStartPage } from "./start_page.js";
@@ -218,6 +217,17 @@ const turnDom = view === "stage"
     renderMarkdown, linkRefs: linkRefsIn,
   })
   : createTurnView(viewArgs);
+// The history's bottom reserve and the toast's place follow the composer
+// card and the stage floating over the history (dock_reserve.js).
+const { placeToast } = createDockReserve({
+  dockEl: $("#dock"),
+  centerEl: $("#center"),
+  stageEl: view === "stage" ? turnDom.root : null,
+  historyEl,
+  toastEl: $("#toast"),
+  modelPanelEl: $("#modelPanel"),
+  atHistoryEnd,
+});
 // Where a running turn's rows can be: the history, and the stage while it
 // holds a turn (lookups by id, copy, annotate, card actions).
 function turnRoots() {
@@ -1441,55 +1451,6 @@ promptEl.addEventListener("input", fitPrompt);
 window.addEventListener("resize", fitPrompt);
 fitPrompt();
 
-// The card floats over the history: keep the history's bottom padding at the
-// card's height, and stay pinned to the end if the reader was there, since the
-// card grows (text, chips, Cancel, a wrapping footer) under a reader at the end.
-// In the stage view the stage floats above the card, out of the dock's flow
-// (stage_view.js): the reserve counts it too, with its 10 px gap, while it
-// shows.
-const dockEl = $("#dock");
-const centerEl = $("#center");
-// A leaving stage (the hand-off's slide) no longer counts: the reserve eases
-// down over the slide (index.html, #center.reserve-easing).
-const stageEl = view === "stage" ? turnDom.root : null;
-function dockReserve() {
-  const shown = stageEl && !stageEl.hidden && !stageEl.classList.contains("leaving");
-  return dockEl.offsetHeight + (shown ? stageEl.offsetHeight + STAGE_GAP : 0);
-}
-const historyEnd = () => historyEl.scrollHeight - historyEl.clientHeight;
-// A reader at the end stays there when the reserve changes: at once for the
-// composer card, eased for the stage (+fromStage+: it appeared, grew or
-// leaves), so the history glides rather than jumps. An eased follow running
-// counts as at the end.
-function updateReserve({ fromStage = false } = {}) {
-  const follow = atHistoryEnd() || historyEl.dataset.following !== undefined;
-  const leaving = !!stageEl?.classList.contains("leaving");
-  centerEl.classList.toggle("reserve-easing", leaving);
-  const reserve = `${dockReserve()}px`;
-  const changed = centerEl.style.getPropertyValue("--dock-h") !== reserve;
-  if (changed) centerEl.style.setProperty("--dock-h", reserve);
-  if (changed && follow) {
-    if (fromStage) easeScrollTo(historyEl, historyEnd, { ms: leaving ? FOLD_MS : FOLLOW_MS, reduce: reducedMotion() });
-    else if (historyEl.dataset.following === undefined) historyEl.scrollTop = historyEl.scrollHeight;
-  }
-  placeToast();
-}
-const dockObserver = new ResizeObserver((entries) => updateReserve({ fromStage: entries.some((e) => e.target === stageEl) }));
-dockObserver.observe(dockEl);
-if (stageEl) {
-  dockObserver.observe(stageEl);
-  // Only showing, hiding and leaving change the reserve (not the stage's
-  // other classes: waiting, in-use…).
-  let stageShown = "";
-  new MutationObserver(() => {
-    const shown = `${stageEl.hidden}|${stageEl.classList.contains("leaving")}`;
-    if (shown === stageShown) return;
-    stageShown = shown;
-    updateReserve({ fromStage: true });
-  }).observe(stageEl, { attributes: true, attributeFilter: ["class", "hidden"] });
-}
-window.addEventListener("resize", () => placeToast());
-
 promptEl.addEventListener("paste", (e) => {
   const files = imageFiles(e.clipboardData);
   // Text pasted along with an image still lands in the textarea.
@@ -1625,35 +1586,7 @@ function fillOpener(created) {
   promptEl.setSelectionRange(promptEl.value.length, promptEl.value.length);
 }
 
-// The toast sits above the session's composer card (measured: it grows with
-// a wrapping footer or a taller box), so it never covers the card's
-// controls, and above the stage while it shows and a fresh link's open
-// model panel (toast_place.js); with no card in sight (the start page, all
-// sessions) the CSS's 24 px from the bottom.
-function placeToast() {
-  const dock = document.getElementById("dock");
-  const r = dock.getBoundingClientRect();
-  const shownTop = (el) => {
-    const box = el && !el.hidden ? el.getBoundingClientRect() : null;
-    return box && box.height > 0 ? box.top : null;
-  };
-  const px = toastBottom({
-    inSession: document.body.classList.contains("has-session") && r.height > 0,
-    viewportHeight: window.innerHeight,
-    dockTop: r.top,
-    tops: [shownTop(document.getElementById("turnStage")), shownTop(document.getElementById("modelPanel"))],
-    toastHeight: document.getElementById("toast").offsetHeight,
-  });
-  const bottom = px === null ? "" : `${px}px`;
-  const root = document.documentElement.style;
-  if (root.getPropertyValue("--toast-bottom") !== bottom) {
-    if (bottom) root.setProperty("--toast-bottom", bottom);
-    else root.removeProperty("--toast-bottom");
-  }
-}
 const toasts = createToasts({ el: $("#toast"), onChange: placeToast });
-// The model panel opening, closing or changing height (its list filters).
-new ResizeObserver(() => placeToast()).observe(document.getElementById("modelPanel"));
 
 function showToast(text, action = null, options = {}) { toasts.show(text, action, options); }
 

data/lib/samagotchi/web/public/dock_reserve.js

@@ -0,0 +1,103 @@
+import { easeScrollTo, FOLLOW_MS } from "./scroll.js";
+import { FOLD_MS } from "./stage_view.js";
+import { reducedMotion, STAGE_GAP } from "./stage_frame.js";
+import { toastBottom } from "./toast_place.js";
+
+// What floats over the history (used by app.js): the composer card, and in
+// the stage view the stage above it. Two measures follow it.
+//
+// The reserve: the card floats over the history, so the history's bottom
+// padding (--dock-h on #center, index.html) is kept at the card's height,
+// and a reader at the end stays pinned there, since the card grows (text,
+// chips, Cancel, a wrapping footer) under a reader at the end. In the stage
+// view the stage floats above the card, out of the dock's flow
+// (stage_view.js): the reserve counts it too, with its STAGE_GAP, while it
+// shows. A leaving stage (the hand-off's slide) no longer counts: the
+// reserve eases down over the slide (#center.reserve-easing).
+//
+// The toast: it sits above the session's composer card (measured: it grows
+// with a wrapping footer or a taller box), so it never covers the card's
+// controls, and above the stage while it shows and a fresh link's open
+// model panel (toast_place.js); with no card in sight (the start page, all
+// sessions) the CSS's 24 px from the bottom (--toast-bottom unset).
+//
+// +stageEl+: the stage (stage view) or null (turn view). +atHistoryEnd()+:
+// the reader is at the history's end (app.js, scroll.js's threshold).
+// +reduce()+ / +ease+: prefers-reduced-motion and the eased follow
+// (scroll.js), defaults the page's.
+// The observers that call these are installed here: the dock's and the
+// stage's size, the stage showing, hiding or leaving, the window's size and
+// the model panel's. app.js calls placeToast() when the page enters or
+// leaves a session and when a toast shows or goes (toasts.js onChange).
+export function createDockReserve({
+  dockEl, centerEl, stageEl, historyEl, toastEl, modelPanelEl, atHistoryEnd,
+  reduce = reducedMotion, ease = easeScrollTo,
+}) {
+  const doc = dockEl.ownerDocument;
+  const win = doc.defaultView;
+
+  function dockReserve() {
+    const shown = stageEl && !stageEl.hidden && !stageEl.classList.contains("leaving");
+    return dockEl.offsetHeight + (shown ? stageEl.offsetHeight + STAGE_GAP : 0);
+  }
+  const historyEnd = () => historyEl.scrollHeight - historyEl.clientHeight;
+
+  // A reader at the end stays there when the reserve changes: at once for the
+  // composer card, eased for the stage (+fromStage+: it appeared, grew or
+  // leaves), so the history glides rather than jumps. An eased follow running
+  // counts as at the end.
+  function updateReserve({ fromStage = false } = {}) {
+    const follow = atHistoryEnd() || historyEl.dataset.following !== undefined;
+    const leaving = !!stageEl?.classList.contains("leaving");
+    centerEl.classList.toggle("reserve-easing", leaving);
+    const reserve = `${dockReserve()}px`;
+    const changed = centerEl.style.getPropertyValue("--dock-h") !== reserve;
+    if (changed) centerEl.style.setProperty("--dock-h", reserve);
+    if (changed && follow) {
+      if (fromStage) ease(historyEl, historyEnd, { ms: leaving ? FOLD_MS : FOLLOW_MS, reduce: reduce() });
+      else if (historyEl.dataset.following === undefined) historyEl.scrollTop = historyEl.scrollHeight;
+    }
+    placeToast();
+  }
+
+  function placeToast() {
+    const r = dockEl.getBoundingClientRect();
+    const shownTop = (el) => {
+      const box = el && !el.hidden ? el.getBoundingClientRect() : null;
+      return box && box.height > 0 ? box.top : null;
+    };
+    const px = toastBottom({
+      inSession: doc.body.classList.contains("has-session") && r.height > 0,
+      viewportHeight: win.innerHeight,
+      dockTop: r.top,
+      tops: [shownTop(stageEl), shownTop(modelPanelEl)],
+      toastHeight: toastEl.offsetHeight,
+    });
+    const bottom = px === null ? "" : `${px}px`;
+    const root = doc.documentElement.style;
+    if (root.getPropertyValue("--toast-bottom") !== bottom) {
+      if (bottom) root.setProperty("--toast-bottom", bottom);
+      else root.removeProperty("--toast-bottom");
+    }
+  }
+
+  const dockObserver = new win.ResizeObserver((entries) => updateReserve({ fromStage: entries.some((e) => e.target === stageEl) }));
+  dockObserver.observe(dockEl);
+  if (stageEl) {
+    dockObserver.observe(stageEl);
+    // Only showing, hiding and leaving change the reserve (not the stage's
+    // other classes: waiting, in-use…).
+    let stageShown = "";
+    new win.MutationObserver(() => {
+      const shown = `${stageEl.hidden}|${stageEl.classList.contains("leaving")}`;
+      if (shown === stageShown) return;
+      stageShown = shown;
+      updateReserve({ fromStage: true });
+    }).observe(stageEl, { attributes: true, attributeFilter: ["class", "hidden"] });
+  }
+  win.addEventListener("resize", () => placeToast());
+  // The model panel opening, closing or changing height (its list filters).
+  new win.ResizeObserver(() => placeToast()).observe(modelPanelEl);
+
+  return { updateReserve, placeToast };
+}

data/lib/samagotchi/web/public/index.html

@@ -547,7 +547,7 @@ button.task-stop:hover:not(:disabled){background:var(--danger-bg-dim);filter:non
 @media (hover:none){.copy-btn{opacity:.55}}
 /* The dock is the composer card: the text field, a toolbar row, the info bar as its footer. */
 #dock{display:flex;flex-direction:column;flex-shrink:0;margin:0 12px 12px;border-radius:16px;position:relative;transition:border-color .12s ease,box-shadow .12s ease}
-/* In a session the card floats over the history, so the glass blurs it; the history's bottom padding follows the card (--dock-h, set from app.js). */
+/* In a session the card floats over the history, so the glass blurs it; the history's bottom padding follows the card (--dock-h, set from dock_reserve.js). */
 /* The session panel lets the page's glow through (the history's own layers go clear), so the card and its footer read as glass over it, not as a flat box on black. */
 body.has-session #center{background:color-mix(in srgb,var(--bg) 35%,transparent);border-color:var(--glass-border);position:relative}
 body.has-session #stage,body.has-session #history{background:transparent}
@@ -719,7 +719,7 @@ body.stage-view #dock,body.stage-view #dock:focus-within{background:transparent;
 .turn-stage{display:flex;flex-direction:column;min-height:0;max-height:var(--stage-max,60vh);border-left:3px solid var(--accent);border-radius:14px;overflow:hidden}
 /* Out of the dock's flow: it floats 10 px above the composer card, so its rise, growth and leaving never move #dock (a
    bottom-pinned box changing height is a layout shift, animated or not). Painted before .dock-card (no z-index): the command
-   list (z-index 20 inside .dock-card) opens over its lower edge. The history's bottom reserve counts it (app.js, --dock-h). */
+   list (z-index 20 inside .dock-card) opens over its lower edge. The history's bottom reserve counts it (dock_reserve.js, --dock-h). */
 body.stage-view .turn-stage{position:absolute;left:0;right:0;bottom:100%;margin-bottom:10px}
 .turn-stage[hidden]{display:none}
 .turn-stage.ended{border-left-color:var(--border-strong)}
@@ -1183,7 +1183,7 @@ body.all-view #center, body.all-view #topStrip{display:none}
 .card.archived{opacity:.6}
 .card.archived:hover{opacity:.85}
 .card .archived-badge,.family-row .archived-badge{font-size:10px;padding:1px 6px;border-radius:6px;border:1px solid var(--border-strong);color:var(--text-muted)}
-/* bottom: above the session's composer card when one shows (--toast-bottom, app.js placeToast). */
+/* bottom: above the session's composer card when one shows (--toast-bottom, dock_reserve.js placeToast). */
 #toast{position:fixed;left:50%;bottom:var(--toast-bottom,24px);transform:translateX(-50%);width:max-content;max-width:calc(100vw - 32px);box-sizing:border-box;z-index:50;display:flex;flex-direction:column;align-items:center;gap:8px}
 #toast[hidden]{display:none}
 #toast .toast-item{display:flex;gap:12px;align-items:center;width:max-content;max-width:100%;box-sizing:border-box;padding:8px 14px;border-radius:10px;background:var(--bg-raised);color:var(--text);border:1px solid var(--border-strong);box-shadow:var(--toast-shadow);font-size:13px}

data/lib/samagotchi/web/public/toast_place.js

@@ -1,4 +1,4 @@
-// Where the toast sits (app.js placeToast measures, this decides): in a
+// Where the toast sits (dock_reserve.js placeToast measures, this decides): in a
 // session, +gap+ above the highest of the composer card and what opens
 // over it (the stage while it shows, a fresh link's open model panel), so
 // it covers none of them; null elsewhere (the CSS's 24 px from the bottom).

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: samagotchi
 version: !ruby/object:Gem::Version
-  version: 0.93.0
+  version: 0.95.0
 platform: ruby
 authors:
 - Dmitry Dedov
@@ -248,6 +248,9 @@ files:
 - lib/samagotchi/bundles/loop-guard/plugin.rb
 - lib/samagotchi/bundles/mcp/manifest.yml
 - lib/samagotchi/bundles/mcp/plugin.rb
+- lib/samagotchi/bundles/model-notes/manifest.yml
+- lib/samagotchi/bundles/model-notes/model_notes_deepseek.md
+- lib/samagotchi/bundles/model-notes/notes/README.md
 - lib/samagotchi/bundles/ruby/manifest.yml
 - lib/samagotchi/bundles/ruby/plugin.rb
 - lib/samagotchi/bundles/skills/manifest.yml
@@ -675,6 +678,7 @@ files:
 - lib/samagotchi/web/public/data.js
 - lib/samagotchi/web/public/delivery_line.js
 - lib/samagotchi/web/public/diff_view.js
+- lib/samagotchi/web/public/dock_reserve.js
 - lib/samagotchi/web/public/families_view.js
 - lib/samagotchi/web/public/favicon.svg
 - lib/samagotchi/web/public/format.js