@1agh/maude 0.19.1 → 0.21.0

package/plugins/design/dev-server/collab/registry.ts

@@ -0,0 +1,110 @@
+// Per-server registry of active collab rooms.
+//
+// Rooms are lazy: created on first connection for a given slug, retained while
+// any peer is connected, torn down (with a final flush) when the last peer
+// disconnects. The registry is also the surface the git-lifecycle handler will
+// call into (Phase 8 Task 7) to force-snapshot every dirty room before a reload
+// prompt — see DDR-051 §3.
+
+import { Y_TYPES } from './persistence.ts';
+import type { Room, RoomCallbacks } from './room.ts';
+import { createRoom } from './room.ts';
+
+export interface Registry {
+  /** Get-or-create. Reuses an existing room for the same slug. */
+  get(slug: string): Room;
+  /** Existence check — returns the live room if any, else null. NEVER creates. */
+  peek(slug: string): Room | null;
+  /**
+   * Phase 8 Task 3 bridge — inspector-channel writes (REST `/_api/comments*`
+   * or the legacy WS comments-add path) call this so the live Y.Array sees
+   * the change and broadcasts it to collab peers. No-op when no room is
+   * live; the next cold open will seed from the freshly-written JSON anyway.
+   *
+   * `comments` is the post-mutation JSON list (the same shape persistJson
+   * writes back). We replace the Y.Array contents wholesale inside a
+   * transaction tagged `'inspector-write'` so the doc.update broadcaster
+   * downstreams it to peers but skips the in-flight debounce loop.
+   */
+  syncRoomFromComments(slug: string, comments: readonly unknown[]): void;
+  /**
+   * Phase 8 Task 5 bridge — same shape as syncRoomFromComments but for the
+   * `annotations` Y.Map. The PUT /_api/annotations endpoint passes the
+   * post-write SVG; the room replaces `Y.Map.svg` so collab peers see the
+   * updated stroke set without waiting for a cold-open re-seed.
+   */
+  syncRoomFromAnnotations(slug: string, svg: string): void;
+  /** Flush every dirty room synchronously. DDR-051 branch-switch path. */
+  flushAll(): Promise<void>;
+  /** Tear down everything (e.g. on server shutdown). */
+  destroyAll(): Promise<void>;
+  /** Tear down a single room when its last peer leaves. */
+  drop(slug: string): Promise<void>;
+  /** Test/introspection. */
+  size(): number;
+}
+
+export function createRegistry(callbacks: RoomCallbacks): Registry {
+  const rooms = new Map<string, Room>();
+
+  function get(slug: string): Room {
+    let room = rooms.get(slug);
+    if (!room) {
+      room = createRoom(slug, callbacks);
+      rooms.set(slug, room);
+    }
+    return room;
+  }
+
+  function peek(slug: string): Room | null {
+    return rooms.get(slug) ?? null;
+  }
+
+  function syncRoomFromComments(slug: string, comments: readonly unknown[]): void {
+    const room = rooms.get(slug);
+    if (!room) return;
+    room.doc.transact(() => {
+      const arr = room.doc.getArray<unknown>(Y_TYPES.comments);
+      if (arr.length > 0) arr.delete(0, arr.length);
+      if (comments.length > 0) arr.push(comments as unknown[]);
+    }, 'inspector-write');
+  }
+
+  function syncRoomFromAnnotations(slug: string, svg: string): void {
+    const room = rooms.get(slug);
+    if (!room) return;
+    room.doc.transact(() => {
+      const map = room.doc.getMap<string>(Y_TYPES.annotations);
+      map.set('svg', svg);
+    }, 'inspector-write');
+  }
+
+  async function flushAll(): Promise<void> {
+    await Promise.all(Array.from(rooms.values(), (r) => r.flush()));
+  }
+
+  async function drop(slug: string): Promise<void> {
+    const room = rooms.get(slug);
+    if (!room) return;
+    if (room.size() > 0) return; // still active, leave it
+    rooms.delete(slug);
+    await room.destroy();
+  }
+
+  async function destroyAll(): Promise<void> {
+    const all = Array.from(rooms.values());
+    rooms.clear();
+    await Promise.all(all.map((r) => r.destroy()));
+  }
+
+  return {
+    get,
+    peek,
+    syncRoomFromComments,
+    syncRoomFromAnnotations,
+    flushAll,
+    destroyAll,
+    drop,
+    size: () => rooms.size,
+  };
+}

package/plugins/design/dev-server/collab/room.ts

@@ -0,0 +1,215 @@
+// Per-canvas Y.Doc room — registry, connection set, persistence schedule.
+//
+// One Room per canvas slug. Holds the Y.Doc + Awareness + the set of connected
+// peers, broadcasts updates, debounces JSON snapshot writes to disk
+// (DDR-051 — JSON is canonical, `.ydoc.bin` is a cache).
+//
+// The Room is transport-agnostic — it accepts CollabConn objects from the WS
+// layer (ws.ts). Tests construct rooms directly without booting Bun.serve.
+
+import { existsSync, mkdirSync } from 'node:fs';
+import path from 'node:path';
+
+import { Awareness, removeAwarenessStates } from 'y-protocols/awareness';
+import * as Y from 'yjs';
+
+import {
+  type CollabConn,
+  encodeAwarenessFrame,
+  encodeHandshake,
+  encodeSyncUpdate,
+  handleMessage,
+} from './protocol.ts';
+
+export interface RoomConn extends CollabConn {
+  /** Stable id for this connection (UUID from ws.data.id). */
+  id: string;
+}
+
+export interface RoomCallbacks {
+  /**
+   * Persist the JSON projection of `doc` for this slug. Called debounced — the
+   * Room batches Y.Doc updates within 800 ms windows and fires this once at
+   * quiescence. Implementations MUST be idempotent.
+   */
+  persistJson(slug: string, doc: Y.Doc): Promise<void> | void;
+
+  /**
+   * Persist the binary Y.Doc state cache (`.ydoc.bin`). Called on the same
+   * debounce schedule as persistJson. Separate hook so tests can stub one
+   * without the other.
+   */
+  persistBinary(slug: string, state: Uint8Array): Promise<void> | void;
+
+  /**
+   * Seed the Y.Doc from on-disk persistence — `.ydoc.bin` first, JSON
+   * snapshots second. Called once at room construction. MUST be synchronous
+   * with respect to the Y.Doc passed in so the first peer's handshake sees
+   * the seeded state.
+   */
+  seed(slug: string, doc: Y.Doc): Promise<void> | void;
+}
+
+export interface Room {
+  readonly slug: string;
+  readonly doc: Y.Doc;
+  readonly awareness: Awareness;
+  connect(conn: RoomConn): Promise<void>;
+  disconnect(conn: RoomConn): void;
+  receive(conn: RoomConn, payload: Uint8Array): void;
+  /** Force the debounced flush to fire now. DDR-051 §3 (branch-switch). */
+  flush(): Promise<void>;
+  /** Tear down — clears timers + removes awareness. */
+  destroy(): Promise<void>;
+  /** Test/inspection: connection count. */
+  size(): number;
+}
+
+const DEBOUNCE_MS = 800;
+
+export function createRoom(slug: string, callbacks: RoomCallbacks): Room {
+  const doc = new Y.Doc();
+  // Awareness needs a clientID; reuse the Y.Doc's so peers can attribute updates.
+  const awareness = new Awareness(doc);
+
+  const conns = new Map<string, RoomConn>();
+  let dirty = false;
+  let flushTimer: ReturnType<typeof setTimeout> | null = null;
+  let destroyed = false;
+  let seedPromise: Promise<void> | null = null;
+
+  function scheduleFlush() {
+    dirty = true;
+    if (flushTimer) clearTimeout(flushTimer);
+    flushTimer = setTimeout(() => {
+      flushTimer = null;
+      void flush();
+    }, DEBOUNCE_MS);
+  }
+
+  async function flush(): Promise<void> {
+    if (!dirty || destroyed) return;
+    dirty = false;
+    if (flushTimer) {
+      clearTimeout(flushTimer);
+      flushTimer = null;
+    }
+    try {
+      await callbacks.persistJson(slug, doc);
+      await callbacks.persistBinary(slug, Y.encodeStateAsUpdate(doc));
+    } catch (err) {
+      // Re-arm so the next mutation retries. Loud-log; persistence loss is a
+      // user-visible bug if it stays silent.
+      dirty = true;
+      console.error(`[collab/${slug}] flush failed:`, err);
+    }
+  }
+
+  function broadcast(payload: Uint8Array, except?: RoomConn) {
+    for (const c of conns.values()) {
+      if (except && c.id === except.id) continue;
+      try {
+        c.send(payload);
+      } catch {
+        /* close handler will clean up dead sockets */
+      }
+    }
+  }
+
+  // Y.Doc update -> broadcast to all peers + schedule debounced flush.
+  doc.on('update', (update: Uint8Array, origin: unknown) => {
+    if (destroyed) return;
+    // Don't echo back to the origin — they already have it; reduces noise.
+    const except =
+      origin && typeof origin === 'object' && 'id' in origin ? (origin as RoomConn) : undefined;
+    broadcast(encodeSyncUpdate(update), except);
+    scheduleFlush();
+  });
+
+  // Awareness changes -> broadcast (NOT persisted; ephemeral by design).
+  awareness.on(
+    'update',
+    (
+      { added, updated, removed }: { added: number[]; updated: number[]; removed: number[] },
+      origin: unknown
+    ) => {
+      if (destroyed) return;
+      const changed = added.concat(updated, removed);
+      if (changed.length === 0) return;
+      const except =
+        origin && typeof origin === 'object' && 'id' in origin ? (origin as RoomConn) : undefined;
+      broadcast(encodeAwarenessFrame(awareness, changed), except);
+    }
+  );
+
+  function getOrStartSeed(): Promise<void> {
+    if (!seedPromise) {
+      const result = callbacks.seed(slug, doc);
+      seedPromise = Promise.resolve(result).catch((err) => {
+        console.error(`[collab/${slug}] seed failed:`, err);
+      });
+    }
+    return seedPromise;
+  }
+
+  async function connect(conn: RoomConn): Promise<void> {
+    await getOrStartSeed();
+    conns.set(conn.id, conn);
+    const frames = encodeHandshake(doc, awareness);
+    for (const frame of frames) conn.send(frame);
+  }
+
+  function disconnect(conn: RoomConn): void {
+    conns.delete(conn.id);
+    // Awareness states keyed by the conn token; clean them up so other peers'
+    // cursor renderers can drop the avatar.
+    const states = awareness.getStates();
+    const stale: number[] = [];
+    for (const clientId of states.keys()) {
+      // Bridge: our Awareness state setters tag the state with `__connId`
+      // matching conn.id; remove states whose owning conn just left.
+      const state = states.get(clientId) as { __connId?: string } | undefined;
+      if (state && state.__connId === conn.id) stale.push(clientId);
+    }
+    if (stale.length) removeAwarenessStates(awareness, stale, conn);
+  }
+
+  function receive(conn: RoomConn, payload: Uint8Array): void {
+    const reply = handleMessage(payload, doc, awareness, conn);
+    if (reply) conn.send(reply);
+  }
+
+  async function destroy(): Promise<void> {
+    destroyed = true;
+    if (flushTimer) {
+      clearTimeout(flushTimer);
+      flushTimer = null;
+    }
+    if (dirty) await flush();
+    conns.clear();
+    awareness.destroy();
+    doc.destroy();
+  }
+
+  return {
+    slug,
+    doc,
+    awareness,
+    connect,
+    disconnect,
+    receive,
+    flush,
+    destroy,
+    size: () => conns.size,
+  };
+}
+
+/**
+ * Ensure `<designRoot>/_state/` exists. Idempotent; safe to call on every
+ * room construction (mkdir recursive returns the path or noop).
+ */
+export function ensureStateDir(designRoot: string): string {
+  const dir = path.join(designRoot, '_state');
+  if (!existsSync(dir)) mkdirSync(dir, { recursive: true });
+  return dir;
+}

package/plugins/design/dev-server/commands/annotation-strokes-command.ts

@@ -0,0 +1,127 @@
+/**
+ * @file       commands/annotation-strokes-command.ts — undo entry for annotation
+ *             stroke add / erase / batch-translate.
+ * @scope      plugins/design/dev-server/commands/annotation-strokes-command.ts
+ * @purpose    Records a `Stroke[]` pair (before/after) and routes both
+ *             directions through a single `putFn`. The server endpoint is
+ *             `PUT /_api/annotations` which replaces the entire SVG; we
+ *             match that shape rather than diffing.
+ *
+ *             Per DDR-050 rev 2 the runtime command is rebuilt per iframe
+ *             mount from a serializable `CommandRecord` so the stack
+ *             survives canvas switches. The `putFn` here also updates the
+ *             iframe's local React strokes state (see annotations-layer
+ *             `putStrokes`) so undo/redo visibly refresh, not just PUT.
+ *
+ *             Why per-stroke commands (not coalesced into a 300 ms window):
+ *             matches Figma/FigJam — Cmd+Z reverts the most recent tap or
+ *             pen stroke individually. Coalescing into windows led to a
+ *             matoucí "why did Cmd+Z erase two of my last lines?" UX.
+ */
+
+import type { Stroke } from '../annotations-layer.tsx';
+import type { CommandRecord, CommandSinks, EditCommand } from '../undo-stack.ts';
+import { registerCommand } from '../undo-stack.ts';
+
+/**
+ * Push-once callable that submits a full `Stroke[]` to the server (or its
+ * test stub) AND updates the iframe's local strokes state. The
+ * annotations-layer `putStrokes` is the production binding.
+ */
+export type StrokesPutFn = (next: readonly Stroke[]) => void | Promise<void>;
+
+export interface AnnotationStrokesPayload {
+  before: readonly Stroke[];
+  after: readonly Stroke[];
+}
+
+export const ANNOTATION_STROKES_KIND = 'annotation-strokes';
+
+export interface AnnotationStrokesCommandInit {
+  before: readonly Stroke[];
+  after: readonly Stroke[];
+  putFn: StrokesPutFn;
+  /** Optional label override (eraser → "erase 1 stroke"). */
+  label?: string;
+  /** Telemetry kind. */
+  kind?: string;
+}
+
+export function createAnnotationStrokesCommand(init: AnnotationStrokesCommandInit): EditCommand {
+  const { putFn } = init;
+  const before = init.before.map(cloneStroke);
+  const after = init.after.map(cloneStroke);
+  const label = init.label ?? defaultLabel(before, after);
+  const kind = init.kind ?? ANNOTATION_STROKES_KIND;
+
+  return {
+    kind,
+    label,
+    async do() {
+      await putFn(after.map(cloneStroke));
+    },
+    async undo() {
+      await putFn(before.map(cloneStroke));
+    },
+  };
+}
+
+/**
+ * Build a persistable record from the same inputs as `createAnnotationStrokesCommand`.
+ * Used by the consumer alongside the EditCommand so the runtime side-effect
+ * and the stored shape share one snapshot.
+ */
+export function buildAnnotationStrokesRecord(opts: {
+  before: readonly Stroke[];
+  after: readonly Stroke[];
+  label?: string;
+}): CommandRecord<AnnotationStrokesPayload> {
+  const before = opts.before.map(cloneStroke);
+  const after = opts.after.map(cloneStroke);
+  return {
+    kind: ANNOTATION_STROKES_KIND,
+    label: opts.label ?? defaultLabel(before, after),
+    payload: { before, after },
+  };
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Registry
+
+registerCommand<AnnotationStrokesPayload>(ANNOTATION_STROKES_KIND, (record, sinks) => {
+  const putFn = sinks.strokesPutFn as StrokesPutFn | undefined;
+  if (!putFn) return null;
+  return createAnnotationStrokesCommand({
+    before: record.payload.before,
+    after: record.payload.after,
+    putFn,
+    label: record.label,
+  });
+});
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Internals
+
+/**
+ * Structured clone — works for every Stroke variant because they're plain
+ * JSON-shaped (no Date / Map / DOM nodes). The pen `points: WorldPoint[]`
+ * array is nested-cloned too so callers can't poison the snapshot by
+ * mutating the source.
+ */
+function cloneStroke<T extends Stroke>(s: T): T {
+  // structuredClone is available on every runtime we ship to (Bun, modern
+  // browsers, Node 17+). Fall back to JSON for the rare older harness.
+  if (typeof structuredClone === 'function') return structuredClone(s);
+  return JSON.parse(JSON.stringify(s)) as T;
+}
+
+function defaultLabel(before: readonly Stroke[], after: readonly Stroke[]): string {
+  const added = after.length - before.length;
+  if (added > 0) return `add ${added} stroke${added === 1 ? '' : 's'}`;
+  if (added < 0) {
+    const erased = -added;
+    return `erase ${erased} stroke${erased === 1 ? '' : 's'}`;
+  }
+  // Same count — could be translate / edit / fill-change.
+  return `edit ${after.length} stroke${after.length === 1 ? '' : 's'}`;
+}

package/plugins/design/dev-server/commands/equal-spacing-command.ts

@@ -0,0 +1,28 @@
+/**
+ * @file       commands/equal-spacing-command.ts — undo label helpers for
+ *             equal-spacing / align gestures.
+ * @scope      plugins/design/dev-server/commands/equal-spacing-command.ts
+ * @purpose    Distribute + align both call `dragBus.commitPositions(moved)`,
+ *             which wraps the move in a generic MoveArtboardsCommand. Per
+ *             DDR-050 the underlying command type is shared (the inverse
+ *             payload is identical — a layout snapshot pair) and only the
+ *             HUD label differs. These helpers compute the labels.
+ *
+ *             Why not a separate Command class? The wrapping logic would
+ *             duplicate `before`/`after`/`patchFn` + add an indirection.
+ *             A label is a one-line string; a factory is overkill.
+ *             Keeping `MoveArtboardsCommand` as the only artboard-layout
+ *             command keeps the future Yjs swap (Phase 8) one-for-one.
+ */
+
+export type AlignMode = 'left' | 'right' | 'center-x' | 'top' | 'bottom' | 'center-y';
+
+/** "equal-space 3 artboards" — N must be ≥ 3 (distribute requires it). */
+export function equalSpacingLabel(n: number): string {
+  return `equal-space ${n} artboard${n === 1 ? '' : 's'}`;
+}
+
+/** "align left 4 artboards" — N must be ≥ 2 (align requires it). */
+export function alignLabel(mode: AlignMode, n: number): string {
+  return `align ${mode} ${n} artboard${n === 1 ? '' : 's'}`;
+}

package/plugins/design/dev-server/commands/move-artboards-command.ts

@@ -0,0 +1,158 @@
+/**
+ * @file       commands/move-artboards-command.ts — undo entry for artboard moves
+ * @scope      plugins/design/dev-server/commands/move-artboards-command.ts
+ * @purpose    Reversible record of an artboard-layout PATCH. Pairs the full
+ *             `before` and `after` layout snapshots with an injected
+ *             `patchFn` (in production, `applyArtboardLayout`; in tests, a
+ *             spy). The command is rebuilt per iframe mount from a
+ *             `CommandRecord` so the stack survives canvas switches
+ *             (DDR-050 rev 2).
+ *
+ * Why full snapshots, not a sparse diff. The server-side endpoint
+ * (`PATCH /_api/canvas-meta`, see api.ts:523–528) shallow-merges patch.layout
+ * over the existing meta. A sparse `{ artboards: [movedOnly] }` would drop
+ * every unchanged rect on its head. Storing the full array is simpler and
+ * resilient — the external-edit invalidation (DDR-050 rule 6) clears the
+ * stack whenever the file changes outside our PATCH so we never restore a
+ * stale layout.
+ */
+
+import type { CommandRecord, CommandSinks, EditCommand } from '../undo-stack.ts';
+import { registerCommand } from '../undo-stack.ts';
+
+export interface ArtboardLayoutEntry {
+  id: string;
+  x: number;
+  y: number;
+  /** Width — JSX-authoritative; carried through for shape-completeness. */
+  w?: number;
+  h?: number;
+}
+
+/**
+ * Signature compatible with canvas-lib's `applyArtboardLayout(layout)`.
+ * Tests pass a spy; production wiring passes the real React-state-+-PATCH
+ * applier.
+ */
+export type LayoutPatchFn = (layout: ArtboardLayoutEntry[]) => void | Promise<void>;
+
+export interface MoveArtboardsPayload {
+  before: readonly ArtboardLayoutEntry[];
+  after: readonly ArtboardLayoutEntry[];
+}
+
+/** Convenience constant — keeps spelling consistent across files. */
+export const MOVE_ARTBOARDS_KIND = 'move-artboards';
+
+export interface MoveArtboardsCommandInit {
+  before: readonly ArtboardLayoutEntry[];
+  after: readonly ArtboardLayoutEntry[];
+  patchFn: LayoutPatchFn;
+  /** Optional label override (equal-spacing wraps with its own copy). */
+  label?: string;
+  /** Telemetry kind. Defaults to `MOVE_ARTBOARDS_KIND`. */
+  kind?: string;
+}
+
+export function createMoveArtboardsCommand(init: MoveArtboardsCommandInit): EditCommand {
+  const { before, after, patchFn } = init;
+  // Snapshot once — mutating the source arrays later cannot poison the command.
+  const beforeSnapshot = before.map(cloneEntry);
+  const afterSnapshot = after.map(cloneEntry);
+  const movedCount = countMoved(beforeSnapshot, afterSnapshot);
+  const label = init.label ?? `move ${movedCount} artboard${movedCount === 1 ? '' : 's'}`;
+  const kind = init.kind ?? MOVE_ARTBOARDS_KIND;
+
+  return {
+    kind,
+    label,
+    async do() {
+      await patchFn(afterSnapshot.map(cloneEntry));
+    },
+    async undo() {
+      await patchFn(beforeSnapshot.map(cloneEntry));
+    },
+  };
+}
+
+/**
+ * Build a persistable record from the same inputs. Use this together with
+ * the EditCommand so the runtime side-effect AND the persisted shape share
+ * one snapshot.
+ */
+export function buildMoveArtboardsRecord(opts: {
+  before: readonly ArtboardLayoutEntry[];
+  after: readonly ArtboardLayoutEntry[];
+  label?: string;
+}): CommandRecord<MoveArtboardsPayload> {
+  const before = opts.before.map(cloneEntry);
+  const after = opts.after.map(cloneEntry);
+  const moved = countMoved(before, after);
+  const label = opts.label ?? `move ${moved} artboard${moved === 1 ? '' : 's'}`;
+  return { kind: MOVE_ARTBOARDS_KIND, label, payload: { before, after } };
+}
+
+/**
+ * Diff helper — returns `null` when `before` and `after` describe the same
+ * layout (call sites use this to skip pushing a no-op drag onto the stack).
+ * Compares positions only; size diffs are ignored (size is JSX-authoritative
+ * per DDR-027, position is the only mutable channel).
+ */
+export function diffLayoutPositions(
+  before: readonly ArtboardLayoutEntry[],
+  after: readonly ArtboardLayoutEntry[]
+): { changed: number } | null {
+  if (before.length !== after.length) return { changed: Math.max(before.length, after.length) };
+  const byId = new Map<string, ArtboardLayoutEntry>();
+  for (const r of before) byId.set(r.id, r);
+  let changed = 0;
+  for (const r of after) {
+    const prev = byId.get(r.id);
+    if (!prev || prev.x !== r.x || prev.y !== r.y) changed++;
+  }
+  if (changed === 0) return null;
+  return { changed };
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Registry — rebuild EditCommand from a persisted CommandRecord + current
+// iframe's sinks. Runs once on module load (top-level side-effect intentional).
+
+registerCommand<MoveArtboardsPayload>(MOVE_ARTBOARDS_KIND, (record, sinks) => {
+  const patchFn = sinks.layoutPatchFn as LayoutPatchFn | undefined;
+  if (!patchFn) return null;
+  return createMoveArtboardsCommand({
+    before: record.payload.before,
+    after: record.payload.after,
+    patchFn,
+    label: record.label,
+  });
+});
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Internals
+
+function cloneEntry(r: ArtboardLayoutEntry): ArtboardLayoutEntry {
+  const out: ArtboardLayoutEntry = { id: r.id, x: r.x, y: r.y };
+  if (typeof r.w === 'number') out.w = r.w;
+  if (typeof r.h === 'number') out.h = r.h;
+  return out;
+}
+
+function countMoved(
+  before: readonly ArtboardLayoutEntry[],
+  after: readonly ArtboardLayoutEntry[]
+): number {
+  const byId = new Map<string, ArtboardLayoutEntry>();
+  for (const r of before) byId.set(r.id, r);
+  let n = 0;
+  for (const r of after) {
+    const prev = byId.get(r.id);
+    if (!prev) {
+      n++;
+      continue;
+    }
+    if (prev.x !== r.x || prev.y !== r.y) n++;
+  }
+  return n;
+}