frodovdr/node-red
1
0
Fork 0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00
Code Issues Releases Wiki Activity

Merge pull request #3323 from node-red/highlight-links

Browse Source 
Highlight links when selecting nodes
This commit is contained in:
Nick O'Leary 2022-01-12 17:52:03 +00:00 committed by GitHub
commit 0bb3652a63
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 30 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
packages/node_modules/@node-red/editor-client/src/js/nodes.js vendored
View File

@ -2551,7 +2551,17 @@ RED.nodes = (function() {
addLink: addLink, addLink: addLink,
removeLink: removeLink, removeLink: removeLink,
getNodeLinks: function(id, portType) {
if (nodeLinks[id]) {
if (portType === 1) {
// Return cloned arrays so they can be safely modified by caller
return [].concat(nodeLinks[id].in)
} else {
return [].concat(nodeLinks[id].out)
}
}
return [];
},
addWorkspace: addWorkspace, addWorkspace: addWorkspace,
removeWorkspace: removeWorkspace, removeWorkspace: removeWorkspace,
getWorkspaceOrder: function() { return workspacesOrder }, getWorkspaceOrder: function() { return workspacesOrder },

24
packages/node_modules/@node-red/editor-client/src/js/ui/view.js vendored
View File

@ -128,6 +128,14 @@ RED.view = (function() {
if (!setIds.has(node.id)) { if (!setIds.has(node.id)) {
set.push({n:node}); set.push({n:node});
setIds.add(node.id); setIds.add(node.id);
var links = RED.nodes.getNodeLinks(node.id,PORT_TYPE_INPUT).concat(RED.nodes.getNodeLinks(node.id,PORT_TYPE_OUTPUT))
for (var i=0,l=links.length;i<l;i++) {
var link = links[i]
if (link.source === node && setIds.has(link.target.id) ||
link.target === node && setIds.has(link.source.id)) {
selectedLinks.add(link)
}
}
} }
} }
}, },
@ -144,6 +152,10 @@ RED.view = (function() {
} }
} }
} }
var links = RED.nodes.getNodeLinks(node.id,PORT_TYPE_INPUT).concat(RED.nodes.getNodeLinks(node.id,PORT_TYPE_OUTPUT))
for (var i=0,l=links.length;i<l;i++) {
selectedLinks.remove(links[i]);
}
} }
}, },
clear: function() { clear: function() {
@ -1896,6 +1908,7 @@ RED.view = (function() {
if (mouse_mode === RED.state.SELECTING_NODE && selectNodesOptions.single) { if (mouse_mode === RED.state.SELECTING_NODE && selectNodesOptions.single) {
return; return;
} }
selectedLinks.clear();
if (activeGroup) { if (activeGroup) {
var ag = activeGroup; var ag = activeGroup;
@ -1967,7 +1980,6 @@ RED.view = (function() {
} }
} }
} }
selectedLinks.clear();
if (mouse_mode !== RED.state.SELECTING_NODE) { if (mouse_mode !== RED.state.SELECTING_NODE) {
updateSelection(); updateSelection();
} }
@ -3234,7 +3246,9 @@ RED.view = (function() {
// } // }
// } else // } else
if (d3.event.shiftKey) { if (d3.event.shiftKey) {
clearSelection(); if (!(d3.event.ctrlKey||d3.event.metaKey)) {
clearSelection();
}
var clickPosition = (d3.event.offsetX/scaleFactor - mousedown_node.x) var clickPosition = (d3.event.offsetX/scaleFactor - mousedown_node.x)
var edgeDelta = (mousedown_node.w/2) - Math.abs(clickPosition); var edgeDelta = (mousedown_node.w/2) - Math.abs(clickPosition);
var cnodes; var cnodes;
@ -3262,7 +3276,7 @@ RED.view = (function() {
mousedown_node.selected = true; mousedown_node.selected = true;
movingSet.add(mousedown_node); movingSet.add(mousedown_node);
} }
selectedLinks.clear(); // selectedLinks.clear();
if (d3.event.button != 2) { if (d3.event.button != 2) {
mouse_mode = RED.state.MOVING; mouse_mode = RED.state.MOVING;
var mouse = d3.touches(this)[0]||d3.mouse(this); var mouse = d3.touches(this)[0]||d3.mouse(this);
@ -3390,7 +3404,7 @@ RED.view = (function() {
} }
mousedown_link = d; mousedown_link = d;
if (selectedLinks.length() === 0 || !(d3.event.metaKey || d3.event.ctrlKey)) { if (!(d3.event.metaKey || d3.event.ctrlKey)) {
clearSelection(); clearSelection();
} }
if (d3.event.metaKey || d3.event.ctrlKey) { if (d3.event.metaKey || d3.event.ctrlKey) {
@ -3408,7 +3422,7 @@ RED.view = (function() {
redraw(); redraw();
focusView(); focusView();
d3.event.stopPropagation(); d3.event.stopPropagation();
if (!mousedown_link.link && selectedLinks.length() === 1 && selectedLinks.has(mousedown_link) && (d3.event.metaKey || d3.event.ctrlKey)) { if (!mousedown_link.link && movingSet.length() === 0 && selectedLinks.length() === 1 && selectedLinks.has(mousedown_link) && (d3.event.metaKey || d3.event.ctrlKey)) {
d3.select(this).classed("red-ui-flow-link-splice",true); d3.select(this).classed("red-ui-flow-link-splice",true);
var point = d3.mouse(this); var point = d3.mouse(this);
var clickedGroup = getGroupAt(point[0],point[1]); var clickedGroup = getGroupAt(point[0],point[1]);