Major features:
- Adaptive drag mode with 5 fixed modes (Normal, Freeze+Check, Freeze, Hide, Heavy Deferred)
- Heavy Deferred for lag-free dragging in large workflows (250+ nodes)
- Three drag phases: moving → held → released, with priority-based re-routing during pause
- Node hard-obstacle avoidance — links can never pass through nodes
Performance:
- Progressive routing with frame-budgeted progressive batches
- Fast graph signature for geometry-change detection
- OVG rebuild deferred during large drags
- Collision re-check limited to affected links only
Fixes:
- Hover no longer triggers full-workflow redraw
- Krea2 / Ultimate SD Upscale link disappearance during drag
- Stale sticky paths now validated before reuse
- Drag-endpoint dogleg for straight-line links
New modules: adaptive-policy, drag-policy, draw-policy, profiler, progressive, ui-policy
Tests: 39 automated tests covering routing, adaptive, drag, profiler
Floating bar: Adaptive 🧠 toggle, 5 fixed-mode buttons, debug row, Nodes 2.0 switch
160 lines
4.3 KiB
JavaScript
160 lines
4.3 KiB
JavaScript
// state.js — shared mutable state for LinkRouter.
|
|
//
|
|
// All cross-module variables live in `M`. Other modules import `M` and
|
|
// read/write via `M.xxx` — no ES live-binding reassignment issues.
|
|
// state.js depends only on router.js and app.js (no other local deps).
|
|
|
|
import { OrthoRouter } from "./router.js";
|
|
import { app } from "../../scripts/app.js";
|
|
|
|
export const M = {
|
|
// --- localStorage key ---
|
|
LS_KEY: "linkrouter.state",
|
|
|
|
// --- floating-bar persisted state ---
|
|
barState: (() => {
|
|
try {
|
|
return Object.assign(
|
|
{
|
|
debug: false,
|
|
debugPanel: false,
|
|
lastFlowMode: "animated",
|
|
lastCornerMode: "per-line",
|
|
lastManualDragMode: "freeze-others",
|
|
btnX: null,
|
|
btnY: null,
|
|
},
|
|
JSON.parse(localStorage.getItem("linkrouter.state") || "{}"),
|
|
);
|
|
} catch {
|
|
return {
|
|
debug: false,
|
|
debugPanel: false,
|
|
lastFlowMode: "animated",
|
|
lastCornerMode: "per-line",
|
|
lastManualDragMode: "freeze-others",
|
|
btnX: null,
|
|
btnY: null,
|
|
};
|
|
}
|
|
})(),
|
|
saveBarState() {
|
|
localStorage.setItem("linkrouter.state", JSON.stringify(this.barState));
|
|
},
|
|
|
|
// --- settings cache (filled initially by settings.js) ---
|
|
S: {},
|
|
|
|
ROUTER_KEYS: new Set([
|
|
"margin", "marginL", "marginR", "marginT", "marginB",
|
|
"marginMode", "bendPenalty",
|
|
]),
|
|
|
|
// --- execution state ---
|
|
running: false,
|
|
|
|
// --- routing state ---
|
|
router: null,
|
|
graphSig: "",
|
|
routeFastSig: "",
|
|
routeGraph: null,
|
|
routeResults: null,
|
|
routeBatch: null,
|
|
routeBatchRaf: 0,
|
|
_deferredGraphBuild: false,
|
|
routeCostByLink: new Map(),
|
|
routeCostAverage: NaN,
|
|
prevRects: new Map(),
|
|
pathCache: new Map(), // linkId -> {ends, pts, sticky, segs, total}
|
|
bounding: new Float32Array(4),
|
|
settleTimer: null,
|
|
_dragMovedIds: null,
|
|
_dragAdaptiveMode: null,
|
|
_dragHeavyActive: null,
|
|
_dragLastFastSig: "",
|
|
_dragHiddenLinkIds: new Set(),
|
|
_dragAffectedLinkIds: new Set(),
|
|
_dragPauseActive: false,
|
|
_dragPausePending: false,
|
|
_dragPauseQueue: null,
|
|
_dragPauseCleanupLinkIds: new Set(),
|
|
_dragPauseAttemptedLinkIds: new Set(),
|
|
_dragPauseCompletedLinkIds: new Set(),
|
|
_dragInterruptedBatch: false,
|
|
_lastDragSettle: null,
|
|
_lastDragMode: "none",
|
|
_pointerDown: false,
|
|
_nodeDragActive: false,
|
|
|
|
// --- animation state ---
|
|
animActive: false,
|
|
rafId: 0,
|
|
lastFrame: 0,
|
|
|
|
// --- hover tracking ---
|
|
mouseClient: null, // {x, y} in client space
|
|
|
|
// --- floating bar DOM refs ---
|
|
uiBox: null, // DOM element
|
|
barRefs: null, // floating-bar controls used by refreshBar()
|
|
|
|
// --- pure helpers (depend only on M.S) ---
|
|
|
|
currentMargin() {
|
|
if (this.S.marginMode === "uniform") return +this.S.margin || 16;
|
|
return {
|
|
l: +this.S.marginL || 16,
|
|
r: +this.S.marginR || 16,
|
|
t: +this.S.marginT || 16,
|
|
b: +this.S.marginB || 16,
|
|
};
|
|
},
|
|
|
|
resetRouter() {
|
|
if (this.routeBatchRaf) {
|
|
const cancel = globalThis.cancelAnimationFrame || globalThis.clearTimeout;
|
|
cancel?.(this.routeBatchRaf);
|
|
}
|
|
this.router = new OrthoRouter({
|
|
margin: this.currentMargin(),
|
|
bendPenalty: +this.S.bendPenalty || 40,
|
|
});
|
|
this.graphSig = "";
|
|
this.routeFastSig = "";
|
|
this.routeGraph = null;
|
|
this.routeResults = null;
|
|
this.routeBatch = null;
|
|
this.routeBatchRaf = 0;
|
|
this._deferredGraphBuild = false;
|
|
this.routeCostByLink.clear();
|
|
this.routeCostAverage = NaN;
|
|
this.prevRects = new Map();
|
|
this.pathCache.clear();
|
|
this._dragAdaptiveMode = null;
|
|
this._dragHeavyActive = null;
|
|
this._dragLastFastSig = "";
|
|
this._dragHiddenLinkIds.clear();
|
|
this._dragAffectedLinkIds.clear();
|
|
this._dragPauseActive = false;
|
|
this._dragPausePending = false;
|
|
this._dragPauseQueue = null;
|
|
this._dragPauseCleanupLinkIds.clear();
|
|
this._dragPauseAttemptedLinkIds.clear();
|
|
this._dragPauseCompletedLinkIds.clear();
|
|
this._dragInterruptedBatch = false;
|
|
this._lastDragSettle = null;
|
|
this._nodeDragActive = false;
|
|
app.canvas?.setDirty(true, true);
|
|
},
|
|
|
|
animEnabledNow() {
|
|
if (this.running && this.S.animDuringRun === "off") return false;
|
|
return true;
|
|
},
|
|
|
|
currentFPS() {
|
|
if (this.running && this.S.animDuringRun === "low") return 10;
|
|
return +this.S.animFPS || 30;
|
|
},
|
|
};
|