@helping-ai-workflow/md2doc 3.12.1 → 3.13.1

package/lib/editor/wave-geometry.js

@@ -2,10 +2,13 @@
 
 /**
  * wave-geometry — where every cycle of a WaveJSON document sits, and which
- * cycle a point lands in. Pure arithmetic: no DOM, no measuring, no mutation.
- * Every size arrives as a parameter, so the layer above can hand in whatever
- * the rendered SVG actually measures and this file stays testable in
- * milliseconds.
+ * cycle a point lands in. Arithmetic, no mutation, and no globals: every size
+ * arrives as a parameter, so the layer above can hand in whatever the
+ * rendered SVG actually measures and this file stays testable in
+ * milliseconds. The one function that reads a DOM is `measureEngineSvg`, and
+ * it reads only the engine SVG it is handed (getScreenCTM, text lengths) —
+ * never a page global, which the purity test in wave-geometry.test.js keeps
+ * true.
  *
  * It lives on its own for one reason: the hit test's boundary rule — a cell's
  * LEFT edge belongs to it, its RIGHT edge belongs to the next cell — is the
@@ -315,6 +318,10 @@ function layoutOf(doc, opts) {
   const laneHeight = size(o.laneHeight, DEFAULTS.laneHeight, 'laneHeight', false);
   const cycleWidth = size(o.cycleWidth, DEFAULTS.cycleWidth, 'cycleWidth', false);
   const nameColWidth = size(o.nameColWidth, DEFAULTS.nameColWidth, 'nameColWidth', true);
+  // wave-redesign P1 Task 4: the engine canvas measures where lane 0's row
+  // starts (`measureEngineSvg(...).laneTops[0]`) and passes it here, which
+  // replaces the editor-only band constants below. Absent, nothing changes.
+  const originYOverride = size(o.originY, undefined, 'originY', true);
 
   // `config.hscale` scales every lane's cycle width the same way the engine's
   // own `lane.hscale` does — see `hscaleOf` for the exact rounding/clamping
@@ -328,7 +335,7 @@ function layoutOf(doc, opts) {
   const headTextHeight = (doc !== null && typeof doc === 'object' &&
     doc.head !== null && typeof doc.head === 'object' &&
     doc.head.text !== undefined) ? HEAD_TEXT_HEIGHT : 0;
-  const originY = headTextHeight + RULER_HEIGHT;
+  const originY = originYOverride !== undefined ? originYOverride : headTextHeight + RULER_HEIGHT;
   const footHeight = hasBanner(doc, 'foot') ? FOOT_HEIGHT : 0;
   // v3.6.0 Task 9 fix round 1 (R29): stacked BELOW `footHeight`, mirroring
   // `headTextHeight` stacked ABOVE `RULER_HEIGHT` — `footHeight` alone still
@@ -424,7 +431,8 @@ function layoutOf(doc, opts) {
  * A group title occupies NO ROW — measured in Task 2 against the pinned
  * engine, and `wave-geometry` is built on it. What it occupies is horizontal
  * space in the name column, so that is where this puts it: a label in the
- * lane list's rail, spanning its lanes' rows. Drawing it as a row of its own
+ * name column (the lane list's rail, until the redesign removed it),
+ * spanning its lanes' rows. Drawing it as a row of its own
  * would put the lane list one row out of step with the waveform beside it for
  * every lane below the group, which is exactly the class of silent
  * disagreement this batch keeps producing.
@@ -434,8 +442,10 @@ function layoutOf(doc, opts) {
  * shown here; it is not addressable through the bridge either.
  *
  * v3.6.0 Task 2: moved here from `lib/editor/wave-ui.js` per ruling R9 — both
- * `wave-panels.js` (the lane rail) and `wave-draw.js` (the canvas) need it,
- * and this file is the one place both already depend on. Behaviour
+ * `wave-panels.js` (the lane rail) and `wave-draw.js` (the canvas) needed it,
+ * and this file is the one place both already depended on. Since the wave
+ * redesign its caller is `wave-ui.js` (the name column's group ⠿ and the
+ * group-row hover). Behaviour
  * unchanged; it now reads this file's own `valueAt` instead of a copy that
  * used to live in `wave-ui.js`.
  */
@@ -643,11 +653,21 @@ const EDGE_HANDLE = 12;
  * 一個答案，`cellRect`／`reachOf` 已經是它，錨點只是在那個答案上再加一個
  * 固定比例的偏移。
  */
+/*
+ * wave-redesign P1 Task 4: the offset is `anchorRatio` of the BASE cycle
+ * (`layout.cycleWidth`), not of this lane's own cell width. The engine's
+ * `render-arcs.js` places a letter at `xs * (2*pos*period*hscale - phase) +
+ * xlabel`, and `xlabel` (the skin's `socket.x`, 6 of a 40-unit cycle) is not
+ * multiplied by `period` or `hscale`. With the cell width a `period: 2` lane
+ * put every anchor 6 engine units right of the engine's, which the engine
+ * canvas test (test/wave-canvas.test.js) measures against the drawn
+ * `gmark_` paths. For `period` 1 and `hscale` 1 the two are the same number.
+ */
 function anchorOfCell(layout, laneIndex, cell) {
   const r = cellRect(layout, laneIndex, cell);
   if (r === null) return null;
   return {
-    x: r.x + SKIN_METRICS.anchorRatio * r.width,
+    x: r.x + SKIN_METRICS.anchorRatio * layout.cycleWidth,
     y: r.y + r.height / 2,
   };
 }
@@ -697,7 +717,8 @@ function boundaryAt(layout, x, y) {
   const row = layout.lanes[laneIndex];
   const reach = reachOf(row.originX, row.cycleWidth, layout.width);
   if (reach === 0) return null;
-  const raw = (x - row.originX - SKIN_METRICS.anchorRatio * row.cycleWidth) / row.cycleWidth;
+  // Same anchor offset as `anchorOfCell`: a fraction of the BASE cycle.
+  const raw = (x - row.originX - SKIN_METRICS.anchorRatio * layout.cycleWidth) / row.cycleWidth;
   let cell = Math.round(raw);
   if (cell < 0) cell = 0;
   if (cell > reach - 1) cell = reach - 1;
@@ -823,6 +844,8 @@ function edgeLayoutDetail(doc, layout) {
   for (let i = 0; i < doc.edge.length; i += 1) {
     const edge = codec.parseEdge(doc.edge[i]);
     if (edge === null) {
+      // 單點標註（`<字母> <文字>`）由標註層畫，不算畫不出來的 edge。
+      if (codec.parseNote(doc.edge[i]) !== null) continue;
       skipped.push({ index: i, edge: null, reason: 'unparseable' });
       continue;
     }
@@ -933,6 +956,117 @@ function edgeHandleAt(edges, x, y) {
   return null;
 }
 
+/**
+ * What the WaveDrom engine actually drew, read off its own SVG — the half of
+ * the editor canvas's geometry that `layoutOf` cannot know (wave-redesign
+ * spec §3.1). `layoutOf` stays the source of every lane's horizontal cell
+ * arithmetic (period, phase, hscale); this supplies the three things only the
+ * rendered picture has:
+ *
+ *   - `xg`: the name column, from the `lanes_<i>` group's translate, which the
+ *     engine writes as `lane.xg + 0.5` (insert-svg-template.js). Callers pass
+ *     `xg + 0.5` to `layoutOf` as `nameColWidth`, because that half unit is
+ *     part of where every cell starts.
+ *   - `laneTops[j]`: the top of lane j's 30-unit row band. Each lane is a
+ *     `wavelane_<j>_<i>` group translated by `lane.y0 + j * lane.yo` inside
+ *     `lanes_<i>` (5 + 30j); the 20-unit brick is drawn from that y down, so
+ *     the band that has the brick in its middle starts y0 above the group.
+ *     y0 is measured as wavelane_0's offset from `lanes_<i>`, not pinned.
+ *     With the band so placed, a row's vertical centre is exactly the y the
+ *     engine anchors a `node` letter at (`i * yo + y0 + ys / 2`, render-arcs.js).
+ *   - `labels`: every data label `text` in each lane's `wavelane_draw_` group,
+ *     with its centre `x`, its advance `width` (`getComputedTextLength`, the
+ *     same quantity lib/wave-overflow.js estimates), its box `y` / `height`,
+ *     and — when the document is passed — which `data` slot it belongs to
+ *     and how many cycles that segment spans (`cells`). The pairing is by
+ *     position, never by text (two segments may carry the same label): the
+ *     label belongs to the segment of the same lane whose x range contains
+ *     its centre.
+ *
+ * Every number is in ROOT engine units (the svg's viewBox), converted through
+ * `getScreenCTM`, so the canvas can scale the svg without this changing.
+ * Grid lines and lane contents carry coordinates LOCAL to translated groups;
+ * reading their raw attributes is how a prototype ended up half a cycle off.
+ * `originY` is the `lanes_` group's own y, the fallback when there is no lane.
+ */
+function measureEngineSvg(svg, doc) {
+  const out = { xg: 0, originY: 0, laneTops: [], laneHeight: DEFAULTS.laneHeight, labels: [] };
+  const rootCtm = svg && typeof svg.getScreenCTM === 'function' ? svg.getScreenCTM() : null;
+  if (rootCtm === null) return out;
+  const rootInv = rootCtm.inverse();
+  function toRoot(el) { return rootInv.multiply(el.getScreenCTM()); }
+  const lanesG = svg.querySelector('g[id^="lanes_"]');
+  if (lanesG === null) return out;
+  const lm = toRoot(lanesG);
+  out.xg = lm.e - 0.5;
+  out.originY = lm.f;
+
+  const groups = [];
+  for (let k = 0; k < lanesG.children.length; k++) {
+    const g = lanesG.children[k];
+    const m = /^wavelane_(\d+)_\d+$/.exec(g.id || '');
+    if (m !== null) groups[Number(m[1])] = g;
+  }
+  const tops = [];
+  let y0 = null;
+  for (let j = 0; j < groups.length; j++) {
+    if (groups[j] === undefined) break;
+    const gy = toRoot(groups[j]).f;
+    if (y0 === null) y0 = gy - lm.f;
+    tops.push(gy - y0);
+  }
+  out.laneTops = tops;
+  if (tops.length > 1) out.laneHeight = tops[1] - tops[0];
+
+  const layout = (doc !== null && typeof doc === 'object' && tops.length > 0)
+    ? layoutOf(doc, { laneHeight: out.laneHeight, nameColWidth: out.xg + 0.5, originY: tops[0] })
+    : null;
+
+  for (let j = 0; j < tops.length; j++) {
+    let draw = null;
+    for (let k = 0; k < groups[j].children.length; k++) {
+      if (/^wavelane_draw_/.test(groups[j].children[k].id || '')) { draw = groups[j].children[k]; break; }
+    }
+    if (draw === null) continue;
+    const segs = layout !== null && j < layout.lanes.length ? segmentsOf(layout.lanes[j]) : [];
+    for (let k = 0; k < draw.children.length; k++) {
+      const t = draw.children[k];
+      if (String(t.tagName).toLowerCase() !== 'text') continue;
+      const m = toRoot(t);
+      const box = t.getBBox();
+      const x = m.a * (box.x + box.width / 2) + m.c * (box.y + box.height / 2) + m.e;
+      const top = m.b * box.x + m.d * box.y + m.f;
+      let slot = null;
+      let cells = null;
+      for (const s of segs) {
+        if (x >= s.from && x < s.to) { slot = s.slot; cells = s.cells; break; }
+      }
+      out.labels.push({
+        laneIndex: j, slot: slot, x: x, width: t.getComputedTextLength() * m.a,
+        text: t.textContent, y: top, height: box.height * m.d, cells: cells,
+      });
+    }
+  }
+  return out;
+}
+
+/** Each data segment of one laid-out lane: its slot, cycle count and x range. */
+function segmentsOf(row) {
+  const lane = row.lane;
+  if (lane === null || typeof lane !== 'object' || typeof lane.wave !== 'string') return [];
+  const cells = codec.expandWave(lane.wave);
+  const out = [];
+  for (let i = 0; i < cells.length; i++) {
+    const slot = codec.dataSlotOf(lane, i);
+    if (slot === null) continue;
+    let n = 1;
+    while (i + n < cells.length && cells[i + n].held) n++;
+    out.push({ slot: slot, cells: n, from: row.originX + i * row.cycleWidth,
+      to: row.originX + (i + n) * row.cycleWidth });
+  }
+  return out;
+}
+
 module.exports = {
   layoutOf: layoutOf,
   valueAt: valueAt,
@@ -946,6 +1080,7 @@ module.exports = {
   edgeLayoutDetail: edgeLayoutDetail,
   edgeHandleRect: edgeHandleRect,
   edgeHandleAt: edgeHandleAt,
+  measureEngineSvg: measureEngineSvg,
   EDGE_HANDLE: EDGE_HANDLE,
   DEFAULTS: DEFAULTS,
   MAX_LANES: MAX_LANES,