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 #3289 from node-red/snap-grid

Browse Source 
Snap nodes on grid using either edge as reference
This commit is contained in:
Nick O'Leary 2022-01-12 17:57:26 +00:00 committed by GitHub
commit cb96fb735e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 46 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -456,26 +456,56 @@ RED.view = (function() {
var historyEvent = result.historyEvent; var historyEvent = result.historyEvent;
var nn = result.node; var nn = result.node;
RED.nodes.add(nn);
var showLabel = RED.utils.getMessageProperty(RED.settings.get('editor'),"view.view-node-show-label"); var showLabel = RED.utils.getMessageProperty(RED.settings.get('editor'),"view.view-node-show-label");
if (showLabel !== undefined && (nn._def.hasOwnProperty("showLabel")?nn._def.showLabel:true) && !nn._def.defaults.hasOwnProperty("l")) { if (showLabel !== undefined && (nn._def.hasOwnProperty("showLabel")?nn._def.showLabel:true) && !nn._def.defaults.hasOwnProperty("l")) {
nn.l = showLabel; nn.l = showLabel;
} }
var helperOffset = d3.touches(ui.helper.get(0))[0]||d3.mouse(ui.helper.get(0)); var helperOffset = d3.touches(ui.helper.get(0))[0]||d3.mouse(ui.helper.get(0));
var helperWidth = ui.helper.width();
var helperHeight = ui.helper.height();
var mousePos = d3.touches(this)[0]||d3.mouse(this); var mousePos = d3.touches(this)[0]||d3.mouse(this);
mousePos[1] += this.scrollTop + ((nn.h/2)-helperOffset[1]); try {
mousePos[0] += this.scrollLeft + ((nn.w/2)-helperOffset[0]); var isLink = (nn.type === "link in" || nn.type === "link out")
var hideLabel = nn.hasOwnProperty('l')?!nn.l : isLink;
var label = RED.utils.getNodeLabel(nn, nn.type);
var labelParts = getLabelParts(label, "red-ui-flow-node-label");
if (hideLabel) {
nn.w = node_height;
nn.h = Math.max(node_height,(nn.outputs || 0) * 15);
} else {
nn.w = Math.max(node_width,20*(Math.ceil((labelParts.width+50+(nn._def.inputs>0?7:0))/20)) );
nn.h = Math.max(6+24*labelParts.lines.length,(nn.outputs || 0) * 15, 30);
}
} catch(err) {
}
mousePos[1] += this.scrollTop + ((helperHeight/2)-helperOffset[1]);
mousePos[0] += this.scrollLeft + ((helperWidth/2)-helperOffset[0]);
mousePos[1] /= scaleFactor; mousePos[1] /= scaleFactor;
mousePos[0] /= scaleFactor; mousePos[0] /= scaleFactor;
if (snapGrid) {
mousePos[0] = gridSize*(Math.ceil(mousePos[0]/gridSize));
mousePos[1] = gridSize*(Math.ceil(mousePos[1]/gridSize));
}
nn.x = mousePos[0]; nn.x = mousePos[0];
nn.y = mousePos[1]; nn.y = mousePos[1];
if (snapGrid) {
var gridOffset = [0,0];
var offsetLeft = nn.x-(gridSize*Math.round((nn.x-nn.w/2)/gridSize)+nn.w/2);
var offsetRight = nn.x-(gridSize*Math.round((nn.x+nn.w/2)/gridSize)-nn.w/2);
if (Math.abs(offsetLeft) < Math.abs(offsetRight)) {
gridOffset[0] = offsetLeft
} else {
gridOffset[0] = offsetRight
}
gridOffset[1] = nn.y-(gridSize*Math.round(nn.y/gridSize));
nn.x -= gridOffset[0];
nn.y -= gridOffset[1];
}
var spliceLink = $(ui.helper).data("splice"); var spliceLink = $(ui.helper).data("splice");
if (spliceLink) { if (spliceLink) {
// TODO: DRY - droppable/nodeMouseDown/canvasMouseUp/showQuickAddDialog // TODO: DRY - droppable/nodeMouseDown/canvasMouseUp/showQuickAddDialog
@ -496,7 +526,6 @@ RED.view = (function() {
historyEvent.removedLinks = [spliceLink]; historyEvent.removedLinks = [spliceLink];
} }
RED.nodes.add(nn);
var group = $(ui.helper).data("group"); var group = $(ui.helper).data("group");
if (group) { if (group) {
@ -1581,8 +1610,16 @@ RED.view = (function() {
gridOffset[0] = node.n.x-(gridSize*Math.floor(node.n.x/gridSize))-gridSize/2; gridOffset[0] = node.n.x-(gridSize*Math.floor(node.n.x/gridSize))-gridSize/2;
gridOffset[1] = node.n.y-(gridSize*Math.floor(node.n.y/gridSize))-gridSize/2; gridOffset[1] = node.n.y-(gridSize*Math.floor(node.n.y/gridSize))-gridSize/2;
} else { } else {
gridOffset[0] = node.n.x-(gridSize*Math.floor((node.n.x-node.n.w/2)/gridSize)+node.n.w/2); var offsetLeft = node.n.x-(gridSize*Math.round((node.n.x-node.n.w/2)/gridSize)+node.n.w/2);
gridOffset[1] = node.n.y-(gridSize*Math.floor(node.n.y/gridSize)); var offsetRight = node.n.x-(gridSize*Math.round((node.n.x+node.n.w/2)/gridSize)-node.n.w/2);
// gridOffset[0] = node.n.x-(gridSize*Math.floor((node.n.x-node.n.w/2)/gridSize)+node.n.w/2);
if (Math.abs(offsetLeft) < Math.abs(offsetRight)) {
gridOffset[0] = offsetLeft
} else {
gridOffset[0] = offsetRight
}
gridOffset[1] = node.n.y-(gridSize*Math.round(node.n.y/gridSize));
// console.log(offsetLeft, offsetRight);
} }
if (gridOffset[0] !== 0 || gridOffset[1] !== 0) { if (gridOffset[0] !== 0 || gridOffset[1] !== 0) {
for (i = 0; i<movingSet.length(); i++) { for (i = 0; i<movingSet.length(); i++) {