node-red-contrib-short-circuit 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Robert W. (Robert0)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,51 @@
+An Node-RED editor plugin that replaces long wires with short, interactive endpoints to reduce clutter in large flows.
+
+## Behaviour
+
+When the direct distance between a wire's two endpoints exceeds the configured threshold:
+
+- The normal wire is hidden
+- A short stub and endpoints are shown at both connected nodes
+<img width="538" height="174" alt="image" src="https://github.com/user-attachments/assets/ab0ecfd8-17bd-4afd-8c01-400149c2217b" />
+
+- Hovering an endpoint shows Node-RED's native ghost-link preview (the inter-link-node) with the node name at the other end
+<img width="258" height="146" alt="image" src="https://github.com/user-attachments/assets/5289f7c0-7070-460b-b797-9e69843b639f" />
+
+- Clicking the ghosted preview pans to and highlights that node
+- Clicking the circular endpoint reveals the true wire
+<img width="487" height="230" alt="image" src="https://github.com/user-attachments/assets/72a8453f-5ea0-4d50-a160-cfcc037efa2f" />
+
+- Selecting either connected node reveals all shortened wires attached to that node
+
+## Distance configuration
+
+The distance is configured in a file in your node-red directory after installing:
+
+```text
+.nmode-red/short-circuit.json
+```
+
+```json
+{
+    "maxDistance": 1000
+}
+```
+
+After editing the JSON file, refresh the Node-RED editor. The runtime reads the file again whenever the editor loads, so a Node-RED restart is not required.
+
+If the file contains invalid JSON or an invalid distance, the plugin uses the default value of `1000` and writes a warning to the Node-RED log.
+
+## Compatibility
+
+- Node-RED 4.0 or newer
+- Node.js 18 or newer
+
+This plugin also works great with the quick-link plugin:
+
+```text
+[node-red-contrib-quick-link](https://flows.nodered.org/node/node-red-contrib-quick-link)
+```
+
+## License
+
+MIT

package/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "node-red-contrib-short-circuit",
+  "version": "0.1.0",
+  "description": "A Node-RED editor plugin that replaces long wires with clickable short-circuit endpoints.",
+  "keywords": [
+    "node-red",
+    "node-red-plugin",
+    "editor",
+    "wire",
+    "flow"
+  ],
+  "homepage": "https://github.com/Roberto0o/node-red-contrib-short-circuit#readme",
+  "bugs": {
+    "url": "https://github.com/Roberto0o/node-red-contrib-short-circuit/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Roberto0o/node-red-contrib-short-circuit.git"
+  },
+  "license": "MIT",
+  "author": {
+    "name": "Robert W. (Robert0)",
+    "url": "https://github.com/Roberto0o"
+  },
+  "engines": {
+    "node": ">=18"
+  },
+  "node-red": {
+    "version": ">=4.0.0",
+    "plugins": {
+      "short-circuit": "short-circuit.js"
+    }
+  },
+  "files": [
+    "short-circuit.js",
+    "short-circuit.html",
+    "README.md",
+    "LICENSE",
+    "examples/test-flow.json"
+  ]
+}

package/short-circuit.html

@@ -0,0 +1,796 @@
+<style>
+    g.red-ui-flow-link.nr-short-circuit-hidden > .red-ui-flow-link-path {
+        visibility: hidden;
+        pointer-events: none;
+    }
+
+    g.red-ui-flow-link.nr-short-circuit-hidden.nr-short-circuit-revealed
+        > .red-ui-flow-link-background {
+        visibility: visible;
+        pointer-events: stroke;
+    }
+
+    g.red-ui-flow-link.nr-short-circuit-hidden.nr-short-circuit-revealed
+        > .red-ui-flow-link-outline {
+        visibility: visible;
+    }
+
+    g.red-ui-flow-link.nr-short-circuit-hidden.nr-short-circuit-revealed
+        > .red-ui-flow-link-line {
+        visibility: visible;
+    }
+
+    .nr-short-circuit-overlay {
+        pointer-events: none;
+    }
+
+    .nr-short-circuit-end {
+        pointer-events: none;
+    }
+
+    .nr-short-circuit-stub {
+        fill: none;
+        stroke: var(--red-ui-link-color);
+        stroke-width: 3;
+        stroke-linecap: round;
+        pointer-events: none;
+    }
+
+    .nr-short-circuit-dot {
+        fill: var(--red-ui-link-color);
+        stroke: var(--red-ui-view-background);
+        stroke-width: 1.5;
+        pointer-events: none;
+        transition: r 80ms ease;
+    }
+
+    .nr-short-circuit-hit {
+        fill: transparent;
+        stroke: transparent;
+        stroke-width: 1;
+        cursor: pointer;
+        pointer-events: all;
+    }
+
+    .nr-short-circuit-end:hover .nr-short-circuit-dot,
+    .nr-short-circuit-end.nr-short-circuit-active .nr-short-circuit-dot {
+        r: 5.5px;
+    }
+
+    .nr-short-circuit-end:hover .nr-short-circuit-stub,
+    .nr-short-circuit-end.nr-short-circuit-active .nr-short-circuit-stub {
+        stroke-width: 4;
+    }
+
+    .nr-short-circuit-preview {
+        opacity: 0;
+        pointer-events: none;
+        transition: opacity 100ms ease;
+    }
+
+    .nr-short-circuit-end:hover .nr-short-circuit-preview,
+    .nr-short-circuit-end:focus-within .nr-short-circuit-preview {
+        opacity: 1;
+        pointer-events: all;
+    }
+
+    .nr-short-circuit-preview .red-ui-flow-link-group {
+        cursor: pointer;
+        opacity: 0.72;
+        transition: opacity 100ms ease;
+    }
+
+    .nr-short-circuit-preview:hover .red-ui-flow-link-group,
+    .nr-short-circuit-preview:focus-within .red-ui-flow-link-group {
+        opacity: 1;
+    }
+
+    .nr-short-circuit-preview .red-ui-flow-link-group > * {
+        pointer-events: none;
+    }
+
+    .nr-short-circuit-preview-bridge {
+        fill: none;
+        stroke: transparent;
+        stroke-width: 24;
+        pointer-events: stroke !important;
+    }
+
+    .nr-short-circuit-preview-hit {
+        fill: transparent;
+        stroke: none;
+        cursor: pointer;
+        pointer-events: all !important;
+    }
+
+    .nr-short-circuit-preview-label {
+        user-select: none;
+        pointer-events: none;
+    }
+
+</style>
+
+<script type="text/javascript">
+(function() {
+    "use strict";
+
+    const PLUGIN_ID = "node-red-contrib-short-circuit";
+    const SVG_NS = "http://www.w3.org/2000/svg";
+
+    const defaults = {
+        maxDistance: 1000,
+        stubLength: 24,
+        dotRadius: 4,
+        hitRadius: 12,
+        previewSpacing: 40
+    };
+
+    const settings = Object.assign({}, defaults);
+
+    const activeLinkKeys = new Set();
+    let refreshTimer = null;
+    let refreshFrame = null;
+    let initialised = false;
+
+    function createSvgElement(name, className) {
+        const element = document.createElementNS(SVG_NS, name);
+        if (className) {
+            element.setAttribute("class", className);
+        }
+        return element;
+    }
+
+    function clampDistance(value) {
+        const parsed = Number(value);
+        if (!Number.isFinite(parsed)) {
+            return defaults.maxDistance;
+        }
+        return Math.min(5000, Math.max(50, Math.round(parsed)));
+    }
+
+    function loadConfiguration() {
+        return $.ajax({
+            url: "short-circuit/config",
+            type: "GET",
+            dataType: "json",
+            cache: false
+        }).done(function(config) {
+            settings.maxDistance = clampDistance(config && config.maxDistance);
+        }).fail(function(jqXHR, textStatus, errorThrown) {
+            settings.maxDistance = defaults.maxDistance;
+            console.warn(
+                "Short circuit could not load short-circuit.json; using the default distance.",
+                textStatus,
+                errorThrown
+            );
+        });
+    }
+
+    function getLinkKey(link) {
+        const targetPort = Number.isFinite(link.targetPort) ? link.targetPort : (link.target.i || 0);
+        return [
+            link.source.id,
+            link.sourcePort || 0,
+            link.target.id,
+            targetPort
+        ].join(":");
+    }
+
+    function getLinkCoordinates(link) {
+        if (
+            Number.isFinite(link.x1) &&
+            Number.isFinite(link.y1) &&
+            Number.isFinite(link.x2) &&
+            Number.isFinite(link.y2)
+        ) {
+            return {
+                x1: link.x1,
+                y1: link.y1,
+                x2: link.x2,
+                y2: link.y2
+            };
+        }
+
+        if (!link.source || !link.target) {
+            return null;
+        }
+
+        const outputCount = link.source.outputs || 1;
+        const sourcePort = link.sourcePort || 0;
+        const sourcePortOffset = -((outputCount - 1) / 2) * 13 + (13 * sourcePort);
+
+        return {
+            x1: link.source.x + ((link.source.w || 100) / 2),
+            y1: link.source.y + sourcePortOffset,
+            x2: link.target.x - ((link.target.w || 100) / 2),
+            y2: link.target.y
+        };
+    }
+
+    function shouldShortenLink(link, coordinates) {
+        if (!link || !coordinates || link.__ghost || link.link) {
+            return false;
+        }
+
+        // Normal Node-RED wires remain inside one flow or subflow
+        if (!link.source || !link.target || link.source.z !== link.target.z) {
+            return false;
+        }
+
+        const deltaX = coordinates.x2 - coordinates.x1;
+        const deltaY = coordinates.y2 - coordinates.y1;
+        return Math.hypot(deltaX, deltaY) > settings.maxDistance;
+    }
+
+    function restoreNativeLink(group) {
+        group.classList.remove("nr-short-circuit-hidden", "nr-short-circuit-revealed");
+
+        group.querySelectorAll(".red-ui-flow-link-path").forEach(function(path) {
+            const originalPath = path.getAttribute("data-nr-short-circuit-original-d");
+            const adjustedPath = path.getAttribute("data-nr-short-circuit-adjusted-d");
+
+            if (originalPath !== null) {
+                // Do not overwrite a fresh path if Node-RED redrew it while it was revealed
+                if (adjustedPath === null || path.getAttribute("d") === adjustedPath) {
+                    path.setAttribute("d", originalPath);
+                }
+                path.removeAttribute("data-nr-short-circuit-original-d");
+                path.removeAttribute("data-nr-short-circuit-adjusted-d");
+            }
+
+            if (path.getAttribute("data-nr-short-circuit-link-class") === "added") {
+                path.classList.remove("red-ui-flow-link-link");
+                path.removeAttribute("data-nr-short-circuit-link-class");
+            }
+        });
+    }
+
+    function getWireColour(group) {
+        const line = group.querySelector(".red-ui-flow-link-line");
+        if (!line) {
+            return null;
+        }
+
+        return window.getComputedStyle(line).stroke || null;
+    }
+
+    function formatCoordinate(value) {
+        return Number(value.toFixed(3));
+    }
+
+    function adjustCubicPathEndpoints(pathData, startX, startY, endX, endY) {
+        const cubicPattern = /^\s*M\s*(-?\d*\.?\d+)\s*[, ]\s*(-?\d*\.?\d+)\s*C\s*(-?\d*\.?\d+)\s*[, ]\s*(-?\d*\.?\d+)\s*[, ]\s*(-?\d*\.?\d+)\s*[, ]\s*(-?\d*\.?\d+)\s*[, ]\s*(-?\d*\.?\d+)\s*[, ]\s*(-?\d*\.?\d+)\s*$/i;
+        const match = cubicPattern.exec(pathData || "");
+
+        if (match) {
+            const originalStartX = Number(match[1]);
+            const originalStartY = Number(match[2]);
+            const firstControlX = Number(match[3]);
+            const firstControlY = Number(match[4]);
+            const secondControlX = Number(match[5]);
+            const secondControlY = Number(match[6]);
+            const originalEndX = Number(match[7]);
+            const originalEndY = Number(match[8]);
+
+            const sourceShiftX = startX - originalStartX;
+            const sourceShiftY = startY - originalStartY;
+            const targetShiftX = endX - originalEndX;
+            const targetShiftY = endY - originalEndY;
+
+            return [
+                "M", formatCoordinate(startX), formatCoordinate(startY),
+                "C",
+                formatCoordinate(firstControlX + sourceShiftX),
+                formatCoordinate(firstControlY + sourceShiftY),
+                formatCoordinate(secondControlX + targetShiftX),
+                formatCoordinate(secondControlY + targetShiftY),
+                formatCoordinate(endX), formatCoordinate(endY)
+            ].join(" ");
+        }
+
+        const curve = Math.max(30, Math.min(75, Math.abs(endX - startX) / 2));
+        return [
+            "M", formatCoordinate(startX), formatCoordinate(startY),
+            "C",
+            formatCoordinate(startX + curve), formatCoordinate(startY),
+            formatCoordinate(endX - curve), formatCoordinate(endY),
+            formatCoordinate(endX), formatCoordinate(endY)
+        ].join(" ");
+    }
+
+    function applyNativeLinkReveal(group, coordinates) {
+        const sourceTipX = coordinates.x1 + settings.stubLength + settings.dotRadius;
+        const targetTipX = coordinates.x2 - settings.stubLength - settings.dotRadius;
+
+        group.querySelectorAll(".red-ui-flow-link-path").forEach(function(path) {
+            const originalPath = path.getAttribute("d");
+            if (originalPath) {
+                const adjustedPath = adjustCubicPathEndpoints(
+                    originalPath,
+                    sourceTipX,
+                    coordinates.y1,
+                    targetTipX,
+                    coordinates.y2
+                );
+
+                path.setAttribute("data-nr-short-circuit-original-d", originalPath);
+                path.setAttribute("data-nr-short-circuit-adjusted-d", adjustedPath);
+                path.setAttribute("d", adjustedPath);
+            }
+        });
+
+        [
+            group.querySelector(".red-ui-flow-link-background"),
+            group.querySelector(".red-ui-flow-link-line")
+        ].forEach(function(path) {
+            if (path && !path.classList.contains("red-ui-flow-link-link")) {
+                path.classList.add("red-ui-flow-link-link");
+                path.setAttribute("data-nr-short-circuit-link-class", "added");
+            }
+        });
+    }
+
+    function getNodeLabel(node) {
+        if (!node) {
+            return "Unknown node";
+        }
+
+        if (typeof node.name === "string" && node.name.trim()) {
+            return node.name.trim();
+        }
+
+        if (node._def && node._def.label) {
+            try {
+                const label = typeof node._def.label === "function"
+                    ? node._def.label.call(node)
+                    : node._def.label;
+
+                if (typeof label === "string" && label.trim()) {
+                    return label.trim();
+                }
+            } catch (error) {
+                // A node label function should not be able to break the overlay
+            }
+        }
+
+        return node.type || "Node";
+    }
+
+    function shortenLabel(label, maxLength) {
+        if (label.length <= maxLength) {
+            return label;
+        }
+        return label.slice(0, Math.max(1, maxLength - 1)) + "…";
+    }
+
+    function stopWorkspaceAction(event) {
+        event.preventDefault();
+        event.stopPropagation();
+    }
+
+    function revealNode(node, event) {
+        stopWorkspaceAction(event);
+        activeLinkKeys.clear();
+        scheduleRefresh();
+
+        if (node && RED.view && typeof RED.view.reveal === "function") {
+            RED.view.reveal(node.id);
+        }
+    }
+
+    function addNodePreview(endGroup, dotX, y, direction, endpoint, verticalOffset) {
+        const preview = createSvgElement("g", "nr-short-circuit-preview");
+        const nativeGroup = createSvgElement("g", "red-ui-flow-link-group");
+        const offset = settings.dotRadius - 30;
+        const previewY = y + verticalOffset;
+        const label = getNodeLabel(endpoint.otherNode);
+        const connectorStartX = 30 + offset;
+        const connectorEndX = 60 + offset;
+        const connectorStartY = -verticalOffset;
+        const connectorPath = [
+            "M", connectorStartX, connectorStartY,
+            "C",
+            connectorStartX + 18, connectorStartY,
+            connectorEndX - 18, 0,
+            connectorEndX, 0
+        ].join(" ");
+
+        nativeGroup.setAttribute(
+            "transform",
+            "translate(" + dotX + " " + previewY + ") scale(" + direction + " 1)"
+        );
+
+        const connector = createSvgElement("path", "red-ui-flow-link-link");
+        connector.setAttribute("d", connectorPath);
+
+        // This invisible wide path keeps the preview open while the pointer
+        // moves along the curved connector from the endpoint to the label
+        const bridge = createSvgElement("path", "nr-short-circuit-preview-bridge");
+        bridge.setAttribute("d", connectorPath);
+
+        const portOutline = createSvgElement("path", "red-ui-flow-link-port");
+        portOutline.setAttribute(
+            "d",
+            "M " + (77 + offset) + " -12 h -10 a 3 3 45 0 0 -3 3 " +
+            "v 18 a 3 3 45 0 0 3 3 h 10"
+        );
+
+        const continuation = createSvgElement("path", "red-ui-flow-link-port");
+        continuation.setAttribute(
+            "d",
+            "M " + (80 + offset) + " -12 h 30 M " +
+            (80 + offset) + " 12 h 30"
+        );
+        continuation.style.strokeDasharray = "12, 3, 8, 4, 3";
+
+        const port = createSvgElement("rect", "red-ui-flow-port red-ui-flow-link-port");
+        port.setAttribute("x", 60 + offset);
+        port.setAttribute("y", -4);
+        port.setAttribute("rx", 2);
+        port.setAttribute("ry", 2);
+        port.setAttribute("width", 8);
+        port.setAttribute("height", 8);
+
+        const hit = createSvgElement("rect", "nr-short-circuit-preview-hit");
+        hit.setAttribute("x", 60 + offset);
+        hit.setAttribute("y", -12);
+        hit.setAttribute("width", 100);
+        hit.setAttribute("height", 24);
+        hit.setAttribute("role", "button");
+        hit.setAttribute("tabindex", "0");
+        hit.setAttribute("aria-label", "Go to " + label);
+
+        const title = createSvgElement("title");
+        title.textContent = "Go to " + label;
+        hit.appendChild(title);
+
+        const text = createSvgElement(
+            "text",
+            "red-ui-flow-port-label nr-short-circuit-preview-label"
+        );
+        text.setAttribute("x", dotX + (direction * (75 + offset)));
+        text.setAttribute("y", previewY + 1);
+        text.setAttribute(
+            "style",
+            "font-size: 10px; text-anchor: " + (direction === 1 ? "start" : "end") + ";"
+        );
+        text.textContent = shortenLabel(label, 18);
+
+        function goToNode(event) {
+            revealNode(endpoint.otherNode, event);
+        }
+
+        hit.addEventListener("mousedown", stopWorkspaceAction);
+        hit.addEventListener("mouseup", stopWorkspaceAction);
+        hit.addEventListener("touchstart", stopWorkspaceAction, { passive: false });
+        hit.addEventListener("touchend", goToNode, { passive: false });
+        hit.addEventListener("click", goToNode);
+        hit.addEventListener("keydown", function(event) {
+            if (event.key === "Enter" || event.key === " ") {
+                goToNode(event);
+            }
+        });
+
+        nativeGroup.appendChild(connector);
+        nativeGroup.appendChild(bridge);
+        nativeGroup.appendChild(portOutline);
+        nativeGroup.appendChild(continuation);
+        nativeGroup.appendChild(port);
+        nativeGroup.appendChild(hit);
+        preview.appendChild(nativeGroup);
+        preview.appendChild(text);
+        endGroup.appendChild(preview);
+    }
+
+    function addEndpointGroup(overlay, options) {
+        const linkKeys = options.entries.map(function(entry) {
+            return entry.linkKey;
+        });
+        const isActive = options.entries.some(function(entry) {
+            return entry.isActive;
+        });
+        const allExplicitlyActive = linkKeys.length > 0 && linkKeys.every(function(linkKey) {
+            return activeLinkKeys.has(linkKey);
+        });
+        const endGroup = createSvgElement(
+            "g",
+            "nr-short-circuit-end" + (isActive ? " nr-short-circuit-active" : "")
+        );
+
+        const dotX = options.x + (options.direction * settings.stubLength);
+        const lineEndX = dotX - (options.direction * settings.dotRadius);
+        const firstColour = options.entries.find(function(entry) {
+            return entry.colour;
+        });
+
+        const stub = createSvgElement("path", "nr-short-circuit-stub");
+        stub.setAttribute("d", "M " + options.x + " " + options.y + " H " + lineEndX);
+
+        const dot = createSvgElement("circle", "nr-short-circuit-dot");
+        dot.setAttribute("cx", dotX);
+        dot.setAttribute("cy", options.y);
+        dot.setAttribute("r", settings.dotRadius);
+
+        const hit = createSvgElement("circle", "nr-short-circuit-hit");
+        hit.setAttribute("cx", dotX);
+        hit.setAttribute("cy", options.y);
+        hit.setAttribute("r", settings.hitRadius);
+        hit.setAttribute("role", "button");
+        hit.setAttribute("tabindex", "0");
+
+        const wireWord = options.entries.length === 1 ? "wire" : "wires";
+        hit.setAttribute(
+            "aria-label",
+            (allExplicitlyActive ? "Hide " : "Show ") +
+            options.entries.length + " full " + wireWord
+        );
+
+        if (firstColour) {
+            stub.style.stroke = firstColour.colour;
+            dot.style.fill = firstColour.colour;
+        }
+
+        function toggleWires(event) {
+            stopWorkspaceAction(event);
+
+            const shouldHide = linkKeys.every(function(linkKey) {
+                return activeLinkKeys.has(linkKey);
+            });
+
+            activeLinkKeys.clear();
+            if (!shouldHide) {
+                linkKeys.forEach(function(linkKey) {
+                    activeLinkKeys.add(linkKey);
+                });
+            }
+            refreshNow();
+        }
+
+        hit.addEventListener("mousedown", stopWorkspaceAction);
+        hit.addEventListener("mouseup", stopWorkspaceAction);
+        hit.addEventListener("touchstart", stopWorkspaceAction, { passive: false });
+        hit.addEventListener("touchend", toggleWires, { passive: false });
+        hit.addEventListener("click", toggleWires);
+        hit.addEventListener("keydown", function(event) {
+            if (event.key === "Enter" || event.key === " ") {
+                toggleWires(event);
+            }
+        });
+
+        endGroup.appendChild(stub);
+        endGroup.appendChild(dot);
+        endGroup.appendChild(hit);
+
+        const orderedEntries = options.entries.slice().sort(function(a, b) {
+            const aY = a.otherNode && Number.isFinite(a.otherNode.y) ? a.otherNode.y : 0;
+            const bY = b.otherNode && Number.isFinite(b.otherNode.y) ? b.otherNode.y : 0;
+            if (aY !== bY) {
+                return aY - bY;
+            }
+            return getNodeLabel(a.otherNode).localeCompare(getNodeLabel(b.otherNode));
+        });
+
+        orderedEntries.forEach(function(entry, index) {
+            const verticalOffset =
+                (index - ((orderedEntries.length - 1) / 2)) * settings.previewSpacing;
+
+            addNodePreview(
+                endGroup,
+                dotX,
+                options.y,
+                options.direction,
+                entry,
+                verticalOffset
+            );
+        });
+
+        overlay.appendChild(endGroup);
+    }
+
+    function isLinkRevealed(link, linkKey) {
+        return (
+            activeLinkKeys.has(linkKey) ||
+            link.selected === true ||
+            link.source.selected === true ||
+            link.target.selected === true
+        );
+    }
+
+    function refreshNow() {
+        const oldOverlay = document.querySelector(
+            "#red-ui-workspace-chart svg .nr-short-circuit-overlay"
+        );
+        if (oldOverlay) {
+            oldOverlay.remove();
+        }
+
+        const firstLink = document.querySelector(
+            "#red-ui-workspace-chart svg g.red-ui-flow-link"
+        );
+
+        if (!firstLink || !firstLink.parentNode) {
+            return;
+        }
+
+        const linkLayer = firstLink.parentNode;
+        const overlay = createSvgElement("g", "nr-short-circuit-overlay");
+        const linkGroups = Array.from(linkLayer.querySelectorAll("g.red-ui-flow-link"));
+        const activeKeys = new Set();
+        const endpointGroups = new Map();
+
+        function addEndpointToGroup(groupKey, endpoint) {
+            let endpointGroup = endpointGroups.get(groupKey);
+            if (!endpointGroup) {
+                endpointGroup = {
+                    x: endpoint.x,
+                    y: endpoint.y,
+                    direction: endpoint.direction,
+                    entries: []
+                };
+                endpointGroups.set(groupKey, endpointGroup);
+            }
+            endpointGroup.entries.push(endpoint.entry);
+        }
+
+        linkGroups.forEach(function(group) {
+            const link = group.__data__;
+            restoreNativeLink(group);
+
+            if (!link) {
+                return;
+            }
+
+            const coordinates = getLinkCoordinates(link);
+            if (!shouldShortenLink(link, coordinates)) {
+                return;
+            }
+
+            const linkKey = getLinkKey(link);
+            const isRevealed = isLinkRevealed(link, linkKey);
+            const colour = getWireColour(group);
+            const sourcePort = Number.isFinite(link.sourcePort) ? link.sourcePort : 0;
+            const targetPort = Number.isFinite(link.targetPort)
+                ? link.targetPort
+                : (link.target.i || 0);
+
+            activeKeys.add(linkKey);
+            group.classList.add("nr-short-circuit-hidden");
+            group.classList.toggle("nr-short-circuit-revealed", isRevealed);
+
+            if (isRevealed) {
+                applyNativeLinkReveal(group, coordinates);
+            }
+
+            addEndpointToGroup(
+                "source:" + link.source.id + ":" + sourcePort,
+                {
+                    x: coordinates.x1,
+                    y: coordinates.y1,
+                    direction: 1,
+                    entry: {
+                        linkKey: linkKey,
+                        colour: colour,
+                        isActive: isRevealed,
+                        otherNode: link.target
+                    }
+                }
+            );
+
+            addEndpointToGroup(
+                "target:" + link.target.id + ":" + targetPort,
+                {
+                    x: coordinates.x2,
+                    y: coordinates.y2,
+                    direction: -1,
+                    entry: {
+                        linkKey: linkKey,
+                        colour: colour,
+                        isActive: isRevealed,
+                        otherNode: link.source
+                    }
+                }
+            );
+        });
+
+        Array.from(activeLinkKeys).forEach(function(linkKey) {
+            if (!activeKeys.has(linkKey)) {
+                activeLinkKeys.delete(linkKey);
+            }
+        });
+
+        endpointGroups.forEach(function(endpointGroup) {
+            addEndpointGroup(overlay, endpointGroup);
+        });
+
+        if (overlay.childNodes.length > 0) {
+            linkLayer.appendChild(overlay);
+        }
+    }
+
+    function scheduleRefresh() {
+        if (refreshTimer !== null) {
+            window.clearTimeout(refreshTimer);
+        }
+        if (refreshFrame !== null) {
+            window.cancelAnimationFrame(refreshFrame);
+            refreshFrame = null;
+        }
+
+        refreshTimer = window.setTimeout(function() {
+            refreshTimer = null;
+            refreshFrame = window.requestAnimationFrame(function() {
+                refreshFrame = null;
+                refreshNow();
+            });
+        }, 0);
+    }
+
+    function clearEndpointReveal(event) {
+        if (activeLinkKeys.size === 0) {
+            return;
+        }
+
+        if (event && event.target && event.target.closest) {
+            if (
+                event.target.closest(".nr-short-circuit-end") ||
+                event.target.closest("g.red-ui-flow-link.nr-short-circuit-revealed")
+            ) {
+                return;
+            }
+        }
+
+        activeLinkKeys.clear();
+        scheduleRefresh();
+    }
+
+    function handleKeyDown(event) {
+        if (event.key === "Escape" && activeLinkKeys.size > 0) {
+            activeLinkKeys.clear();
+            scheduleRefresh();
+        }
+    }
+
+    function registerEditorEvents() {
+        [
+            "flows:loaded",
+            "workspace:change",
+            "links:add",
+            "links:remove",
+            "nodes:add",
+            "nodes:remove",
+            "nodes:change",
+            "view:selection-changed",
+            "editor:save"
+        ].forEach(function(eventName) {
+            RED.events.on(eventName, scheduleRefresh);
+        });
+
+        if (RED.hooks && RED.hooks.add) {
+            RED.hooks.add("viewAddNode." + PLUGIN_ID, scheduleRefresh);
+            RED.hooks.add("viewRedrawNode." + PLUGIN_ID, scheduleRefresh);
+            RED.hooks.add("viewRemoveNode." + PLUGIN_ID, scheduleRefresh);
+        }
+
+        document.addEventListener("mousedown", clearEndpointReveal, true);
+        document.addEventListener("keydown", handleKeyDown, true);
+    }
+
+    function initialise() {
+        if (initialised) {
+            return;
+        }
+
+        initialised = true;
+
+        loadConfiguration().always(function() {
+            registerEditorEvents();
+            scheduleRefresh();
+        });
+    }
+
+    RED.plugins.registerPlugin(PLUGIN_ID, {
+        type: "editor",
+        onadd: initialise
+    });
+}());
+</script>

package/short-circuit.js

@@ -0,0 +1,77 @@
+"use strict";
+
+const fs = require("fs");
+const path = require("path");
+
+module.exports = function(RED) {
+    const PLUGIN_ID = "node-red-contrib-short-circuit";
+    const DEFAULT_CONFIG = {
+        maxDistance: 400
+    };
+
+    const userDir = RED.settings.userDir || process.cwd();
+    const configPath = path.join(userDir, "short-circuit.json");
+
+    function clampDistance(value) {
+        const parsed = Number(value);
+        if (!Number.isFinite(parsed)) {
+            return DEFAULT_CONFIG.maxDistance;
+        }
+        return Math.min(5000, Math.max(50, Math.round(parsed)));
+    }
+
+    function createConfigFile() {
+        try {
+            fs.mkdirSync(userDir, { recursive: true });
+            fs.writeFileSync(
+                configPath,
+                JSON.stringify(DEFAULT_CONFIG, null, 4) + "\n",
+                { encoding: "utf8", flag: "wx" }
+            );
+            RED.log.info("Short circuit created " + configPath);
+        } catch (error) {
+            if (error.code !== "EEXIST") {
+                throw error;
+            }
+        }
+    }
+
+    function readConfig() {
+        try {
+            createConfigFile();
+
+            const fileContent = fs.readFileSync(configPath, "utf8");
+            const parsed = JSON.parse(fileContent);
+
+            return {
+                maxDistance: clampDistance(parsed.maxDistance)
+            };
+        } catch (error) {
+            RED.log.warn(
+                "Short circuit could not read " + configPath +
+                ". Using maxDistance " + DEFAULT_CONFIG.maxDistance +
+                ". " + error.message
+            );
+
+            return Object.assign({}, DEFAULT_CONFIG);
+        }
+    }
+
+    RED.plugins.registerPlugin(PLUGIN_ID, {
+        onadd: function() {
+            const needsPermission = RED.auth.needsPermission("flows.read");
+
+            // Read the file for every editor request so a browser refresh picks up changes
+            RED.httpAdmin.get(
+                "/short-circuit/config",
+                needsPermission,
+                function(req, res) {
+                    res.json(readConfig());
+                }
+            );
+
+            // Create the file immediately so the user can find and edit it
+            createConfigFile();
+        }
+    });
+};