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

Add a libe break function

Browse Source
This commit is contained in:
Yuma Matsuura 2019-07-26 11:36:22 +09:00
parent 6ab520984c
commit a42d7d867e
1 changed files with 69 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1805,7 +1805,15 @@ RED.view = (function() {
}
function calculateTextWidth(str, className, offset) {
return calculateTextDimensions(str,className,offset,0)[0];
var result=convertLineBreakCharacter(str);
var width = 0;
for (var i=0;i<result.length;i++) {
var calculateTextW=calculateTextDimensions(result[i],className,offset,0)[0];
if (width<calculateTextW) {
width=calculateTextW;
}
}
return width;
}
var textDimensionPlaceholder = {};
@ -1823,6 +1831,29 @@ RED.view = (function() {
return [offsetW+w,offsetH+h];
}
function convertLineBreakCharacter(str) {
var result = [];
var temp = str.split('\\n');
var result_temp = null;
for (var i = 0;i < temp.length;i++) {
if (result_temp == null || result_temp == '') {
result_temp = temp[i];
}
var chr = temp[i].charAt(temp[i].length-1);
if (i < temp.length - 1) {
if (chr == '\\') {
result_temp += 'n' + temp[i+1];
} else {
result.push(result_temp);
result_temp = null;
}
} else {
result.push(result_temp);
}
}
return result;
}
function resetMouseVars() {
mousedown_node = null;
mouseup_node = null;
@ -2680,11 +2711,16 @@ RED.view = (function() {
var l = RED.utils.getNodeLabel(d);
if (d.resize || d.w === undefined) {
if (hideLabel) {
d.w = node_height;
d.w = 30;
} 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)) );
}
}
if (hideLabel) {
node_height = 30;
} else {
node_height = 6 + 24 * convertLineBreakCharacter(l).length;
}
d.h = Math.max(node_height,(d.outputs||0) * 15);
// if (d._def.badge) {
@ -2706,7 +2742,7 @@ RED.view = (function() {
.attr("rx",5)
.attr("ry",5)
.attr("width",32)
.attr("height",node_height-4);
.attr("height",26);
nodeButtonGroup.append("rect")
.attr("class","red-ui-flow-node-button-button")
.attr("x",function(d) { return d._def.align == "right"? 11:5})
@ -2714,7 +2750,7 @@ RED.view = (function() {
.attr("rx",4)
.attr("ry",4)
.attr("width",16)
.attr("height",node_height-12)
.attr("height",18)
.attr("fill",function(d) { return RED.utils.getNodeColor(d.type,d._def); /*d._def.color;*/})
.attr("cursor","pointer")
.on("mousedown",function(d) {if (!lasso && isButtonEnabled(d)) {focusView();d3.select(this).attr("fill-opacity",0.2);d3.event.preventDefault(); d3.event.stopPropagation();}})
@ -2925,19 +2961,25 @@ RED.view = (function() {
var hideLabel = d.hasOwnProperty('l')?!d.l : isLink;
dirtyNodes[d.id] = d;
//if (d.x < -50) deleteSelection(); // Delete nodes if dragged back to palette
if (d.resize) {
var l = RED.utils.getNodeLabel(d);
if (d.resize) {
var ow = d.w;
if (hideLabel) {
d.w = node_height;
d.w = 30;
} 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.w = Math.max(node_width,20*(Math.ceil((calculateTextWidth(l, "red-ui-flow-node-label", 50)+(d._def.inputs>0?7:0))/20)) );
d.h = Math.max(node_height,(d.outputs||0) * 15);
d.x += (d.w-ow)/2;
d.resize = false;
}
if (hideLabel) {
node_height = 30;
} else {
node_height = 6 + 24 * convertLineBreakCharacter(l).length;
}
d.h = Math.max(node_height,(d.outputs || 0) * 15);
var thisNode = d3.select(this);
thisNode.classed("red-ui-flow-node-disabled", function(d) { return d.d === true});
thisNode.classed("red-ui-flow-subflow",function(d) { return activeSubflow != null; })
@ -2958,10 +3000,11 @@ RED.view = (function() {
thisNode.selectAll(".red-ui-flow-node-icon-group").classed("red-ui-flow-node-icon-group-right", false);
thisNode.selectAll(".red-ui-flow-node-label").classed("red-ui-flow-node-label-right", false).attr("text-anchor", "start");
}
var gx;
thisNode.selectAll(".red-ui-flow-node-icon-group").attr("transform", function (d) { return "translate(0, 0)"; });
thisNode.selectAll(".red-ui-flow-node-label").attr("x", function (d) { return 38; });
thisNode.selectAll(".red-ui-flow-node-label").attr("x", function (d) { gx=38; return 38; });
thisNode.selectAll(".red-ui-flow-node-icon-group-right").attr("transform", function(d){return "translate("+(d.w-30)+",0)"});
thisNode.selectAll(".red-ui-flow-node-label-right").attr("x", function(d){return d.w-38});
thisNode.selectAll(".red-ui-flow-node-label-right").attr("x", function(d){ gx=d.w-38; return d.w-38});
//thisNode.selectAll(".red-ui-flow-node-icon-right").attr("x",function(d){return d.w-d3.select(this).attr("width")-1-(d.outputs>0?5:0);});
//thisNode.selectAll(".red-ui-flow-node-icon-shade-right").attr("x",function(d){return d.w-30;});
//thisNode.selectAll(".red-ui-flow-node-icon-shade-border-right").attr("d",function(d){return "M "+(d.w-30)+" 1 l 0 "+(d.h-2)});
@ -3035,7 +3078,7 @@ RED.view = (function() {
port.attr("transform", function(d) { return "translate("+x+","+((y+13*i)-5)+")";});
});
}
thisNode.selectAll("text.red-ui-flow-node-label").text(function(d,i){
thisNode.selectAll("text.red-ui-flow-node-label").html(function(d,i){
var l = "";
if (d._def.label) {
l = d._def.label;
@ -3047,7 +3090,22 @@ RED.view = (function() {
l = d.type;
}
}
return l;
var sa = convertLineBreakCharacter(l);
var sn = sa.length;
var ic = 0;
var st = "";
var yp = d.h/2-(sn/2)*24+16
var yn = 0;
var dy = ".3px";
for (ic=0; ic<sn; ic++) {
yn = yp+ic*24;
st += "<tspan x="+gx+" y="+yn+" dy="+dy+">"+sa[ic]+"</tspan>";
}
if (sn!=1) {
return st;
} else {
return sa[0]!=null ? sa[0]:l;
}
})
.attr("y", function(d){return (d.h/2)-1;})
.attr("class",function(d){