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

Move vertical ports off the node to prevent crowding

Browse Source
This commit is contained in:
Nick O'Leary 2019-12-04 16:06:53 +00:00
parent e2b7377ab7
commit 81387396c0
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
2 changed files with 34 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -140,9 +140,9 @@ RED.palette = (function() {
labelElement.html(lines).attr('dir', RED.text.bidi.resolveBaseTextDir(lines));
if (RED.view.vertical()) {
el.find(".red-ui-palette-port").css({top:(multiLineNodeHeight/2-5)+"px", left: "55px"});
el.find(".red-ui-palette-port-output").css({top:(multiLineNodeHeight-5)+"px", right: "55px"});
el.find(".red-ui-palette-port-input").css({top: "-5px"});
// el.find(".red-ui-palette-port").css({top:(multiLineNodeHeight/2-5)+"px", left: "55px"});
// el.find(".red-ui-palette-port-output").css({top:(multiLineNodeHeight-5)+"px", right: "55px"});
// el.find(".red-ui-palette-port-input").css({top: "-5px"});
}else{
el.find(".red-ui-palette-port").css({top:(multiLineNodeHeight/2-5)+"px"});
// el.find(".palette_port_output").css({top:(multiLineNodeHeight/2-5)+"px", right: "-6px", left: "auto"});
@ -235,6 +235,8 @@ RED.palette = (function() {
d.css("backgroundColor", RED.utils.getNodeColor(nt,def));
if (!RED.view.vertical()) {
if (def.outputs > 0) {
var portOut = document.createElement("div");
portOut.className = "red-ui-palette-port red-ui-palette-port-output";
@ -246,6 +248,7 @@ RED.palette = (function() {
portIn.className = "red-ui-palette-port red-ui-palette-port-input";
d.append(portIn);
}
}
createCategory(nodeCategory,rootCategory,category,(coreCategories.indexOf(rootCategory) !== -1)?"node-red":def.set.id);

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

@ -2868,7 +2868,7 @@ RED.view = (function() {
d.w = node_height;
} else {
if (vertical) {
d.w = Math.max(node_width,20*(Math.ceil((calculateTextWidth(l, "red-ui-flow-node-label", 50)+(d._def.inputs>0?7:0))/20)),(d.outputs||0) * 15 );
d.w = Math.max(node_width,20*(Math.ceil((calculateTextWidth(l, "red-ui-flow-node-label", 50)+(d._def.inputs>0?7:0))/20)),(d.outputs||0) * 16 );
}else{
d.w = Math.max(node_width,20*(Math.ceil((calculateTextWidth(l, "red-ui-flow-node-label", 50)+(d._def.inputs>0?7:0))/20)) );
}
@ -3125,7 +3125,7 @@ RED.view = (function() {
if (hideLabel) {
d.w = node_height
} else {
d.w = Math.max(node_width,20*(Math.ceil((calculateTextWidth(l, "red-ui-flow-node-label", 50)+(d._def.inputs>0?7:0))/20)),(d.outputs||0) * 15 );
d.w = Math.max(node_width,20*(Math.ceil((calculateTextWidth(l, "red-ui-flow-node-label", 50)+(d._def.inputs>0?7:0))/20)),(d.outputs||0) * 16 );
}
d.h = node_height;
}else{
@ -3180,7 +3180,14 @@ RED.view = (function() {
.attr("r",5)
.attr("class","red-ui-flow-port red-ui-flow-link-port")
} else {
inputGroupPorts = inputGroup.append("rect").attr("class","red-ui-flow-port").attr("rx",3).attr("ry",3).attr("width",10).attr("height",10).attr("y",vertical?-3:0)
if (vertical) {
inputGroupPorts = inputGroup.append("path").attr("class","red-ui-flow-port").attr("d","M 0 4.5 v -6 q 0 -3 3 -3 h 4 q 3 0 3 3 v6");
} else {
inputGroupPorts = inputGroup.append("rect").attr("class","red-ui-flow-port").attr("rx",3).attr("ry",3).attr("width",10).attr("height",10);
}
//.attr("rx",3).attr("ry",3).attr("width",10).attr("height",10).attr("y",vertical?-4:0)
}
inputGroupPorts.on("mousedown",function(d){portMouseDown(d,PORT_TYPE_INPUT,0);})
.on("touchstart",function(d){portMouseDown(d,PORT_TYPE_INPUT,0);})
@ -3215,6 +3222,9 @@ RED.view = (function() {
.attr("cx",vertical ? 6 : 11).attr("cy", vertical ? 8 : 6)
.attr("r",5)
.attr("class","red-ui-flow-port red-ui-flow-link-port")
} else {
if (vertical) {
output_group_ports = output_group.append("path").attr("class","red-ui-flow-port").attr("d","M0 2.5 v 6 q 0 3 3 3 h 4 q 3 0 3 -3 v-6");
} else {
output_group_ports = output_group.append("rect")
.attr("class","red-ui-flow-port")
@ -3222,6 +3232,7 @@ RED.view = (function() {
.attr("width",10)
.attr("height",10)
}
}
output_group_ports.on("mousedown",(function(){var node = d; return function(d,i){portMouseDown(node,PORT_TYPE_OUTPUT,i);}})() )
.on("touchstart",(function(){var node = d; return function(d,i){portMouseDown(node,PORT_TYPE_OUTPUT,i);}})() )