m: 'I want the size of devices to be customizable. A resize function at
the bottom right corner would be good.'
- 10×10 SVG handle drawn at each device's bottom-right corner with class
.device-resize-handle + cursor: nwse-resize. Subtle grey by default,
darker on hover so m can find it without it dominating the rect.
- startResize captures the pointer, stops propagation so the rect's
pointerdown (= startDrag) doesn't also fire, and updates the local
device.width / .height on every pointermove using svgPoint deltas —
works at any zoom level via the same world-coord conversion the rest
of the canvas uses.
- Clamps to 60×30 minimum during the drag so the rect can't collapse.
- On pointerup: PATCH /devices/:id with the new width + height, then
relayoutAllEdges(deviceID) so ports on every edge redistribute to
their i/(N+1) positions against the new dimensions. Right- and
bottom-edge ports get the visible adjustment; top/left re-space too
but their absolute positions don't change.
mAi
89686d0c1f