Make an edge drag say where it will land, and offer nodes when it lands nowhere

Dragging an edge now rings the port it would connect to and snaps the line
there. A drop on a node's body takes that node's first free compatible port,
or the last compatible one when none is free, replacing its link. A drop into
empty space opens the palette filtered to the node types the edge could reach
at all, and the picked node arrives wired - node and link as one undo step,
so a single undo takes back the whole gesture.

The decision of what fits what lives in core/graph/dropTarget.ts as pure
functions, tested directly; the canvas only draws the answer. The palette
takes an optional filter rather than knowing about drags.

Verified remote on the Windows box (GPU): ALL PASSED, 284 checks.
This commit is contained in:
root committed 2026-09-09 12:29:57 +02:00
1 parent 633f01cc46
commit ebad3fd530
12 files changed
+453 -28

No files matched your search

+8 -1
View File
@@ -90,6 +90,13 @@ shown on the node and editable in the inspector.
(types are checked; a data input holds one link and is replaced), drag nodes, right-click a
node or port to delete/disconnect, `Delete` removes the selected node, wheel zooms, dragging
the empty canvas pans. Everything is undoable.
- **Dragging an edge tells you where it would land** before you let go: the port it would connect
to wears a white ring and the line snaps to it. Dropping on a node's *body* rather than a port
takes that node's first free compatible port – or, when none is free, the last compatible one,
whose link is then replaced. A drop into empty space opens the palette filtered to the node
types this edge could reach at all, and the picked node arrives already wired; node and link go
in as **one** undo step (`core/graph/dropTarget.ts` decides all of this, the canvas only draws
it).
- **Header bar** (the same one the Texture and Container tabs have): the behavior picker,
**Add node…** (the palette, dropping the node in the middle of the view – the right-click nobody
finds), **Fit**, and the size of the graph as "N nodes · M links".
@@ -408,7 +415,7 @@ npm run format # Prettier over src, tests and tools
npm run check # typecheck + lint + format:check + tests, what CI would run
npm run build # writes dist/ and regenerates index.html
export GM_REMOTE=user@host # where the browser runs; see below
node tools/seed-e2e.mjs && node tools/e2e.mjs # 275 editor checks, screenshots in /tmp/gm-e2e-*.png
node tools/seed-e2e.mjs && node tools/e2e.mjs # 284 editor checks, screenshots in /tmp/gm-e2e-*.png
node tools/seed-jumprun.mjs && node tools/smoke-jumprun.mjs # 24 checks: the example game, played end to end
```