1
0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00

fix code indentation

This commit is contained in:
Hiroyasu Nishiyama 2020-06-13 23:33:45 +09:00
parent 5c5bebd689
commit 1c30584153

View File

@ -3505,464 +3505,464 @@ RED.view = (function() {
nodeEnter.each(function(d,i) {
this.__outputs__ = [];
this.__inputs__ = [];
var node = d3.select(this);
var nodeContents = document.createDocumentFragment();
this.__outputs__ = [];
this.__inputs__ = [];
var node = d3.select(this);
var nodeContents = document.createDocumentFragment();
var isLink = (d.type === "link in" || d.type === "link out")
var hideLabel = d.hasOwnProperty('l')?!d.l : isLink;
node.attr("id",d.id);
var labelWidth = calculateTextWidth(RED.utils.getNodeLabel(d), "red-ui-flow-node-label") + 50;
if (d.resize || d.w === undefined) {
if (hideLabel) {
d.w = node_height;
} else {
d.w = Math.max(node_width,20*(Math.ceil((labelWidth+(d._def.inputs>0?7:0))/20)) );
}
}
if (hideLabel) {
d.h = Math.max(node_height,(d.outputs || 0) * 15);
} else {
d.h = Math.max(6+24*separateTextByLineBreak.length, (d.outputs || 0) * 15, 30);
}
// if (d._def.badge) {
// var badge = node.append("svg:g").attr("class","node_badge_group");
// var badgeRect = badge.append("rect").attr("class","node_badge").attr("rx",5).attr("ry",5).attr("width",40).attr("height",15);
// badge.append("svg:text").attr("class","node_badge_label").attr("x",35).attr("y",11).attr("text-anchor","end").text(d._def.badge());
// if (d._def.onbadgeclick) {
// badgeRect.attr("cursor","pointer")
// .on("click",function(d) { d._def.onbadgeclick.call(d);d3.event.preventDefault();});
// }
// }
if (d._def.button) {
var buttonGroup = document.createElementNS("http://www.w3.org/2000/svg","g");
buttonGroup.__data__ = d;
buttonGroup.setAttribute("transform", "translate("+((d._def.align == "right") ? 94 : -25)+",2)");
buttonGroup.setAttribute("class","red-ui-flow-node-button");
node[0][0].__buttonGroup__ = buttonGroup;
var bgBackground = document.createElementNS("http://www.w3.org/2000/svg","rect");
bgBackground.__data__ = d;
bgBackground.setAttribute("class","red-ui-flow-node-button-background");
bgBackground.setAttribute("rx",5);
bgBackground.setAttribute("ry",5);
bgBackground.setAttribute("width",32);
bgBackground.setAttribute("height",node_height-4);
buttonGroup.appendChild(bgBackground);
node[0][0].__buttonGroupBackground__ = bgBackground;
var bgButton = document.createElementNS("http://www.w3.org/2000/svg","rect");
bgButton.__data__ = d;
bgButton.setAttribute("class","red-ui-flow-node-button-button");
bgButton.setAttribute("x", d._def.align == "right"? 11:5);
bgButton.setAttribute("y",4);
bgButton.setAttribute("rx",4);
bgButton.setAttribute("ry",4);
bgButton.setAttribute("width",16);
bgButton.setAttribute("height",node_height-12);
bgButton.setAttribute("fill", RED.utils.getNodeColor(d.type,d._def));
bgButton.setAttribute("cursor","pointer");
d3.select(bgButton)
.on("mousedown",function(d) {if (!lasso && isButtonEnabled(d)) {focusView();d3.select(this).attr("fill-opacity",0.2);d3.event.preventDefault(); d3.event.stopPropagation();}})
.on("mouseup",function(d) {if (!lasso && isButtonEnabled(d)) { d3.select(this).attr("fill-opacity",0.4);d3.event.preventDefault();d3.event.stopPropagation();}})
.on("mouseover",function(d) {if (!lasso && isButtonEnabled(d)) { d3.select(this).attr("fill-opacity",0.4);}})
.on("mouseout",function(d) {if (!lasso && isButtonEnabled(d)) {
var op = 1;
if (d._def.button.toggle) {
op = d[d._def.button.toggle]?1:0.2;
}
d3.select(this).attr("fill-opacity",op);
}})
.on("click",nodeButtonClicked)
.on("touchstart",function(d) { nodeButtonClicked.call(this,d); d3.event.preventDefault();})
buttonGroup.appendChild(bgButton);
node[0][0].__buttonGroupButton__ = bgButton;
nodeContents.appendChild(buttonGroup);
}
var mainRect = document.createElementNS("http://www.w3.org/2000/svg","rect");
mainRect.__data__ = d;
mainRect.setAttribute("class", "red-ui-flow-node "+(d.type == "unknown"?"red-ui-flow-node-unknown":""));
mainRect.setAttribute("rx", 5);
mainRect.setAttribute("ry", 5);
mainRect.setAttribute("fill", RED.utils.getNodeColor(d.type,d._def));
node[0][0].__mainRect__ = mainRect;
d3.select(mainRect)
.on("mouseup",nodeMouseUp)
.on("mousedown",nodeMouseDown)
.on("touchstart",nodeTouchStart)
.on("touchend",nodeTouchEnd)
.on("mouseover",nodeMouseOver)
.on("mouseout",nodeMouseOut);
nodeContents.appendChild(mainRect);
//node.append("rect").attr("class", "node-gradient-top").attr("rx", 6).attr("ry", 6).attr("height",30).attr("stroke","none").attr("fill","url(#gradient-top)").style("pointer-events","none");
//node.append("rect").attr("class", "node-gradient-bottom").attr("rx", 6).attr("ry", 6).attr("height",30).attr("stroke","none").attr("fill","url(#gradient-bottom)").style("pointer-events","none");
if (d._def.icon) {
var icon_url = RED.utils.getNodeIcon(d._def,d);
var icon_groupEl = document.createElementNS("http://www.w3.org/2000/svg","g");
icon_groupEl.__data__ = d;
icon_groupEl.setAttribute("class","red-ui-flow-node-icon-group"+("right" == d._def.align?" red-ui-flow-node-icon-group-right":""));
icon_groupEl.setAttribute("x",0);
icon_groupEl.setAttribute("y",0);
icon_groupEl.style["pointer-events"] = "none";
node[0][0].__iconGroup__ = icon_groupEl;
var icon_shade = document.createElementNS("http://www.w3.org/2000/svg","rect");
icon_shade.setAttribute("x",0);
icon_shade.setAttribute("y",0);
icon_shade.setAttribute("class","red-ui-flow-node-icon-shade")
icon_shade.setAttribute("width",30);
icon_shade.setAttribute("height",Math.min(50,d.h-4));
icon_groupEl.appendChild(icon_shade);
node[0][0].__iconShade__ = icon_shade;
var icon_group = d3.select(icon_groupEl)
createIconAttributes(icon_url, icon_group, d);
var icon_shade_border = document.createElementNS("http://www.w3.org/2000/svg","path");
icon_shade_border.setAttribute("d","right" != d._def.align ? "M 30 1 l 0 "+(d.h-2) : "M 0 1 l 0 "+(d.h-2) )
icon_shade_border.setAttribute("class", "red-ui-flow-node-icon-shade-border")
icon_groupEl.appendChild(icon_shade_border);
node[0][0].__iconShadeBorder__ = icon_shade_border;
nodeContents.appendChild(icon_groupEl);
}
var text = document.createElementNS("http://www.w3.org/2000/svg","text");
text.setAttribute("class","red-ui-flow-node-label"+(hideLabel?" hide":"")+(d._def.align?" red-ui-flow-node-label-"+d._def.align:""));
text.setAttribute("x", 38);
text.setAttribute("dy", ".3px");
text.setAttribute("text-anchor",d._def.align !== "right" ? "start":"end");
nodeContents.appendChild(text);
var statusEl = document.createElementNS("http://www.w3.org/2000/svg","g");
// statusEl.__data__ = d;
statusEl.setAttribute("class","red-ui-flow-node-status-group");
statusEl.style.display = "none";
node[0][0].__statusGroup__ = statusEl;
var statusRect = document.createElementNS("http://www.w3.org/2000/svg","rect");
statusRect.setAttribute("class","red-ui-flow-node-status");
statusRect.setAttribute("x",6);
statusRect.setAttribute("y",1);
statusRect.setAttribute("width",9);
statusRect.setAttribute("height",9);
statusRect.setAttribute("rx",2);
statusRect.setAttribute("ry",2);
statusRect.setAttribute("stroke-width","3");
statusEl.appendChild(statusRect);
node[0][0].__statusShape__ = statusRect;
var statusLabel = document.createElementNS("http://www.w3.org/2000/svg","text");
statusLabel.setAttribute("class","red-ui-flow-node-status-label");
statusLabel.setAttribute("x",20);
statusLabel.setAttribute("y",10);
statusEl.appendChild(statusLabel);
node[0][0].__statusLabel__ = statusLabel;
nodeContents.appendChild(statusEl);
var changeBadgeG = document.createElementNS("http://www.w3.org/2000/svg","g");
changeBadgeG.setAttribute("class","red-ui-flow-node-changed hide");
changeBadgeG.setAttribute("transform","translate(20, -2)");
node[0][0].__changeBadge__ = changeBadgeG;
var changeBadge = document.createElementNS("http://www.w3.org/2000/svg","circle");
changeBadge.setAttribute("r",5);
changeBadgeG.appendChild(changeBadge);
nodeContents.appendChild(changeBadgeG);
var errorBadgeG = document.createElementNS("http://www.w3.org/2000/svg","g");
errorBadgeG.setAttribute("class","red-ui-flow-node-error hide");
errorBadgeG.setAttribute("transform","translate(0, -2)");
node[0][0].__errorBadge__ = errorBadgeG;
var errorBadge = document.createElementNS("http://www.w3.org/2000/svg","path");
errorBadge.setAttribute("d","M -5,4 l 10,0 -5,-8 z");
errorBadgeG.appendChild(errorBadge);
errorBadge.__data__ = d;
errorBadge.addEventListener("mouseenter", errorBadgeMouseEnter);
errorBadge.addEventListener("mouseleave", errorBadgeMouseLeave);
nodeContents.appendChild(errorBadgeG);
node[0][0].appendChild(nodeContents);
});
node.each(function(d,i) {
if (d.dirty) {
var isLink = (d.type === "link in" || d.type === "link out")
var hideLabel = d.hasOwnProperty('l')?!d.l : isLink;
node.attr("id",d.id);
var labelWidth = calculateTextWidth(RED.utils.getNodeLabel(d), "red-ui-flow-node-label") + 50;
if (d.resize || d.w === undefined) {
dirtyNodes[d.id] = d;
//if (d.x < -50) deleteSelection(); // Delete nodes if dragged back to palette
var label = RED.utils.getNodeLabel(d, d.type);
var labelWidth = calculateTextWidth(label, "red-ui-flow-node-label") + 50;
if (d.resize) {
var ow = d.w;
if (hideLabel) {
d.w = node_height;
} else {
d.w = Math.max(node_width,20*(Math.ceil((labelWidth+(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.x += (d.w-ow)/2;
d.resize = false;
}
if (hideLabel) {
d.h = Math.max(node_height,(d.outputs || 0) * 15);
} else {
d.h = Math.max(6+24*separateTextByLineBreak.length, (d.outputs || 0) * 15, 30);
}
// if (d._def.badge) {
// var badge = node.append("svg:g").attr("class","node_badge_group");
// var badgeRect = badge.append("rect").attr("class","node_badge").attr("rx",5).attr("ry",5).attr("width",40).attr("height",15);
// badge.append("svg:text").attr("class","node_badge_label").attr("x",35).attr("y",11).attr("text-anchor","end").text(d._def.badge());
// if (d._def.onbadgeclick) {
// badgeRect.attr("cursor","pointer")
// .on("click",function(d) { d._def.onbadgeclick.call(d);d3.event.preventDefault();});
// }
// }
if (d._def.button) {
var buttonGroup = document.createElementNS("http://www.w3.org/2000/svg","g");
buttonGroup.__data__ = d;
buttonGroup.setAttribute("transform", "translate("+((d._def.align == "right") ? 94 : -25)+",2)");
buttonGroup.setAttribute("class","red-ui-flow-node-button");
node[0][0].__buttonGroup__ = buttonGroup;
var bgBackground = document.createElementNS("http://www.w3.org/2000/svg","rect");
bgBackground.__data__ = d;
bgBackground.setAttribute("class","red-ui-flow-node-button-background");
bgBackground.setAttribute("rx",5);
bgBackground.setAttribute("ry",5);
bgBackground.setAttribute("width",32);
bgBackground.setAttribute("height",node_height-4);
buttonGroup.appendChild(bgBackground);
node[0][0].__buttonGroupBackground__ = bgBackground;
var bgButton = document.createElementNS("http://www.w3.org/2000/svg","rect");
bgButton.__data__ = d;
bgButton.setAttribute("class","red-ui-flow-node-button-button");
bgButton.setAttribute("x", d._def.align == "right"? 11:5);
bgButton.setAttribute("y",4);
bgButton.setAttribute("rx",4);
bgButton.setAttribute("ry",4);
bgButton.setAttribute("width",16);
bgButton.setAttribute("height",node_height-12);
bgButton.setAttribute("fill", RED.utils.getNodeColor(d.type,d._def));
bgButton.setAttribute("cursor","pointer");
d3.select(bgButton)
.on("mousedown",function(d) {if (!lasso && isButtonEnabled(d)) {focusView();d3.select(this).attr("fill-opacity",0.2);d3.event.preventDefault(); d3.event.stopPropagation();}})
.on("mouseup",function(d) {if (!lasso && isButtonEnabled(d)) { d3.select(this).attr("fill-opacity",0.4);d3.event.preventDefault();d3.event.stopPropagation();}})
.on("mouseover",function(d) {if (!lasso && isButtonEnabled(d)) { d3.select(this).attr("fill-opacity",0.4);}})
.on("mouseout",function(d) {if (!lasso && isButtonEnabled(d)) {
var op = 1;
if (d._def.button.toggle) {
op = d[d._def.button.toggle]?1:0.2;
}
d3.select(this).attr("fill-opacity",op);
}})
.on("click",nodeButtonClicked)
.on("touchstart",function(d) { nodeButtonClicked.call(this,d); d3.event.preventDefault();})
buttonGroup.appendChild(bgButton);
node[0][0].__buttonGroupButton__ = bgButton;
nodeContents.appendChild(buttonGroup);
d.h = Math.max(6+24*separateTextByLineBreak.length,(d.outputs || 0) * 15, 30);
}
var mainRect = document.createElementNS("http://www.w3.org/2000/svg","rect");
mainRect.__data__ = d;
mainRect.setAttribute("class", "red-ui-flow-node "+(d.type == "unknown"?"red-ui-flow-node-unknown":""));
mainRect.setAttribute("rx", 5);
mainRect.setAttribute("ry", 5);
mainRect.setAttribute("fill", RED.utils.getNodeColor(d.type,d._def));
node[0][0].__mainRect__ = mainRect;
d3.select(mainRect)
.on("mouseup",nodeMouseUp)
.on("mousedown",nodeMouseDown)
.on("touchstart",nodeTouchStart)
.on("touchend",nodeTouchEnd)
.on("mouseover",nodeMouseOver)
.on("mouseout",nodeMouseOut);
nodeContents.appendChild(mainRect);
//node.append("rect").attr("class", "node-gradient-top").attr("rx", 6).attr("ry", 6).attr("height",30).attr("stroke","none").attr("fill","url(#gradient-top)").style("pointer-events","none");
//node.append("rect").attr("class", "node-gradient-bottom").attr("rx", 6).attr("ry", 6).attr("height",30).attr("stroke","none").attr("fill","url(#gradient-bottom)").style("pointer-events","none");
var thisNode = d3.select(this);
//thisNode.selectAll(".centerDot").attr({"cx":function(d) { return d.w/2;},"cy":function(d){return d.h/2}});
this.setAttribute("transform", "translate(" + (d.x-d.w/2) + "," + (d.y-d.h/2) + ")");
if (mouse_mode != RED.state.MOVING_ACTIVE) {
this.classList.toggle("red-ui-flow-node-disabled", d.d === true);
this.classList.toggle("red-ui-flow-subflow", activeSubflow != null)
this.classList.toggle("red-ui-flow-node-selected", !!d.selected )
this.__mainRect__.setAttribute("width", d.w)
this.__mainRect__.setAttribute("height", d.h)
this.__mainRect__.classList.toggle("red-ui-flow-node-highlighted",!!d.highlighted );
if (d._def.icon) {
var icon_url = RED.utils.getNodeIcon(d._def,d);
var icon_groupEl = document.createElementNS("http://www.w3.org/2000/svg","g");
icon_groupEl.__data__ = d;
icon_groupEl.setAttribute("class","red-ui-flow-node-icon-group"+("right" == d._def.align?" red-ui-flow-node-icon-group-right":""));
icon_groupEl.setAttribute("x",0);
icon_groupEl.setAttribute("y",0);
icon_groupEl.style["pointer-events"] = "none";
node[0][0].__iconGroup__ = icon_groupEl;
var icon_shade = document.createElementNS("http://www.w3.org/2000/svg","rect");
icon_shade.setAttribute("x",0);
icon_shade.setAttribute("y",0);
icon_shade.setAttribute("class","red-ui-flow-node-icon-shade")
icon_shade.setAttribute("width",30);
icon_shade.setAttribute("height",Math.min(50,d.h-4));
icon_groupEl.appendChild(icon_shade);
node[0][0].__iconShade__ = icon_shade;
var text = thisNode.selectAll(".red-ui-flow-node-label");
thisNode.selectAll(".red-ui-flow-node-label-text").remove();
var sa = convertLineBreakCharacter(label);
var sn = sa.length;
var yp = d.h / 2 - (sn / 2) * 24 + 16
sa.forEach(function (line) {
text.append("tspan")
.classed("red-ui-flow-node-label-text", true)
.text(line)
.attr("x", 38)
.attr("y", yp);
yp += 24;
});
var icon_group = d3.select(icon_groupEl)
createIconAttributes(icon_url, icon_group, d);
var icon_shade_border = document.createElementNS("http://www.w3.org/2000/svg","path");
icon_shade_border.setAttribute("d","right" != d._def.align ? "M 30 1 l 0 "+(d.h-2) : "M 0 1 l 0 "+(d.h-2) )
icon_shade_border.setAttribute("class", "red-ui-flow-node-icon-shade-border")
icon_groupEl.appendChild(icon_shade_border);
node[0][0].__iconShadeBorder__ = icon_shade_border;
nodeContents.appendChild(icon_groupEl);
}
var text = document.createElementNS("http://www.w3.org/2000/svg","text");
text.setAttribute("class","red-ui-flow-node-label"+(hideLabel?" hide":"")+(d._def.align?" red-ui-flow-node-label-"+d._def.align:""));
text.setAttribute("x", 38);
text.setAttribute("dy", ".3px");
text.setAttribute("text-anchor",d._def.align !== "right" ? "start":"end");
nodeContents.appendChild(text);
var statusEl = document.createElementNS("http://www.w3.org/2000/svg","g");
// statusEl.__data__ = d;
statusEl.setAttribute("class","red-ui-flow-node-status-group");
statusEl.style.display = "none";
node[0][0].__statusGroup__ = statusEl;
var statusRect = document.createElementNS("http://www.w3.org/2000/svg","rect");
statusRect.setAttribute("class","red-ui-flow-node-status");
statusRect.setAttribute("x",6);
statusRect.setAttribute("y",1);
statusRect.setAttribute("width",9);
statusRect.setAttribute("height",9);
statusRect.setAttribute("rx",2);
statusRect.setAttribute("ry",2);
statusRect.setAttribute("stroke-width","3");
statusEl.appendChild(statusRect);
node[0][0].__statusShape__ = statusRect;
var statusLabel = document.createElementNS("http://www.w3.org/2000/svg","text");
statusLabel.setAttribute("class","red-ui-flow-node-status-label");
statusLabel.setAttribute("x",20);
statusLabel.setAttribute("y",10);
statusEl.appendChild(statusLabel);
node[0][0].__statusLabel__ = statusLabel;
nodeContents.appendChild(statusEl);
var changeBadgeG = document.createElementNS("http://www.w3.org/2000/svg","g");
changeBadgeG.setAttribute("class","red-ui-flow-node-changed hide");
changeBadgeG.setAttribute("transform","translate(20, -2)");
node[0][0].__changeBadge__ = changeBadgeG;
var changeBadge = document.createElementNS("http://www.w3.org/2000/svg","circle");
changeBadge.setAttribute("r",5);
changeBadgeG.appendChild(changeBadge);
nodeContents.appendChild(changeBadgeG);
var errorBadgeG = document.createElementNS("http://www.w3.org/2000/svg","g");
errorBadgeG.setAttribute("class","red-ui-flow-node-error hide");
errorBadgeG.setAttribute("transform","translate(0, -2)");
node[0][0].__errorBadge__ = errorBadgeG;
var errorBadge = document.createElementNS("http://www.w3.org/2000/svg","path");
errorBadge.setAttribute("d","M -5,4 l 10,0 -5,-8 z");
errorBadgeG.appendChild(errorBadge);
errorBadge.__data__ = d;
errorBadge.addEventListener("mouseenter", errorBadgeMouseEnter);
errorBadge.addEventListener("mouseleave", errorBadgeMouseLeave);
nodeContents.appendChild(errorBadgeG);
node[0][0].appendChild(nodeContents);
});
node.each(function(d,i) {
if (d.dirty) {
var isLink = (d.type === "link in" || d.type === "link out")
var hideLabel = d.hasOwnProperty('l')?!d.l : isLink;
dirtyNodes[d.id] = d;
//if (d.x < -50) deleteSelection(); // Delete nodes if dragged back to palette
var label = RED.utils.getNodeLabel(d, d.type);
var labelWidth = calculateTextWidth(label, "red-ui-flow-node-label") + 50;
if (d.resize) {
var ow = d.w;
if (hideLabel) {
d.w = node_height;
} else {
d.w = Math.max(node_width,20*(Math.ceil((labelWidth+(d._def.inputs>0?7:0))/20)) );
var textClass = "";
if (d._def.labelStyle) {
textClass = d._def.labelStyle;
try {
textClass = (typeof textClass === "function" ? textClass.call(d) : textClass)||"";
} catch(err) {
console.log("Definition error: "+d.type+".labelStyle",err);
textClass = "";
}
// 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.x += (d.w-ow)/2;
d.resize = false;
textClass = " "+textClass;
}
if (hideLabel) {
d.h = Math.max(node_height,(d.outputs || 0) * 15);
textClass = "red-ui-flow-node-label"+(d._def.align?" red-ui-flow-node-label-"+d._def.align:"")+textClass+(hideLabel?" hide":"");
text.attr("class", textClass);
if ((!d._def.align && d.inputs !== 0 && d.outputs === 0) || "right" === d._def.align) {
this.__iconGroup__.classList.toggle("red-ui-flow-node-icon-group-right", true);
thisNode.selectAll(".red-ui-flow-node-label").classed("red-ui-flow-node-label-right", true).attr("text-anchor", "end");
} else {
d.h = Math.max(6+24*separateTextByLineBreak.length,(d.outputs || 0) * 15, 30);
if (this.__iconGroup__) {// is null for uknown nodes
this.__iconGroup__.classList.toggle("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 alignX;
// thisNode.selectAll(".red-ui-flow-node-icon-group").attr("transform", "translate(0, 0)" );
thisNode.selectAll(".red-ui-flow-node-label").attr("x", function () { alignX=38; return 38; });
thisNode.selectAll(".red-ui-flow-node-icon-group-right").attr("transform", "translate("+(d.w-30)+",0)");
thisNode.selectAll(".red-ui-flow-node-label-right").attr("x", function(){ alignX=d.w-38; return d.w-38});
var thisNode = d3.select(this);
//thisNode.selectAll(".centerDot").attr({"cx":function(d) { return d.w/2;},"cy":function(d){return d.h/2}});
this.setAttribute("transform", "translate(" + (d.x-d.w/2) + "," + (d.y-d.h/2) + ")");
if (mouse_mode != RED.state.MOVING_ACTIVE) {
this.classList.toggle("red-ui-flow-node-disabled", d.d === true);
this.classList.toggle("red-ui-flow-subflow", activeSubflow != null)
this.classList.toggle("red-ui-flow-node-selected", !!d.selected )
this.__mainRect__.setAttribute("width", d.w)
this.__mainRect__.setAttribute("height", d.h)
this.__mainRect__.classList.toggle("red-ui-flow-node-highlighted",!!d.highlighted );
thisNode.selectAll(".red-ui-flow-node-label-text").attr("x", function () { return 38; });
thisNode.selectAll(".red-ui-flow-node-label-right").selectAll("tspan").attr("x", function(){ 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)});
var inputPorts = thisNode.selectAll(".red-ui-flow-port-input");
if ((!isLink || (showAllLinkPorts === -1 && !activeLinkNodes[d.id])) && d.inputs === 0 && !inputPorts.empty()) {
inputPorts.remove();
} else if (((isLink && (showAllLinkPorts===PORT_TYPE_INPUT||activeLinkNodes[d.id]))|| d.inputs === 1) && inputPorts.empty()) {
var inputGroup = thisNode.append("g").attr("class","red-ui-flow-port-input");
var inputGroupPorts;
var text = thisNode.selectAll(".red-ui-flow-node-label");
thisNode.selectAll(".red-ui-flow-node-label-text").remove();
var sa = convertLineBreakCharacter(label);
var sn = sa.length;
var yp = d.h / 2 - (sn / 2) * 24 + 16
sa.forEach(function (line) {
text.append("tspan")
.classed("red-ui-flow-node-label-text", true)
.text(line)
.attr("x", 38)
.attr("y", yp);
yp += 24;
});
var textClass = "";
if (d._def.labelStyle) {
textClass = d._def.labelStyle;
try {
textClass = (typeof textClass === "function" ? textClass.call(d) : textClass)||"";
} catch(err) {
console.log("Definition error: "+d.type+".labelStyle",err);
textClass = "";
}
textClass = " "+textClass;
}
textClass = "red-ui-flow-node-label"+(d._def.align?" red-ui-flow-node-label-"+d._def.align:"")+textClass+(hideLabel?" hide":"");
text.attr("class", textClass);
if ((!d._def.align && d.inputs !== 0 && d.outputs === 0) || "right" === d._def.align) {
this.__iconGroup__.classList.toggle("red-ui-flow-node-icon-group-right", true);
thisNode.selectAll(".red-ui-flow-node-label").classed("red-ui-flow-node-label-right", true).attr("text-anchor", "end");
if (d.type === "link in") {
inputGroupPorts = inputGroup.append("circle")
.attr("cx",-1).attr("cy",5)
.attr("r",5)
.attr("class","red-ui-flow-port red-ui-flow-link-port")
} else {
if (this.__iconGroup__) {// is null for uknown nodes
this.__iconGroup__.classList.toggle("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");
inputGroupPorts = inputGroup.append("rect").attr("class","red-ui-flow-port").attr("rx",3).attr("ry",3).attr("width",10).attr("height",10)
}
var alignX;
// thisNode.selectAll(".red-ui-flow-node-icon-group").attr("transform", "translate(0, 0)" );
thisNode.selectAll(".red-ui-flow-node-label").attr("x", function () { alignX=38; return 38; });
thisNode.selectAll(".red-ui-flow-node-icon-group-right").attr("transform", "translate("+(d.w-30)+",0)");
thisNode.selectAll(".red-ui-flow-node-label-right").attr("x", function(){ alignX=d.w-38; return d.w-38});
inputGroupPorts.on("mousedown",function(d){portMouseDown(d,PORT_TYPE_INPUT,0);})
.on("touchstart",function(d){portMouseDown(d,PORT_TYPE_INPUT,0);d3.event.preventDefault();})
.on("mouseup",function(d){portMouseUp(d,PORT_TYPE_INPUT,0);} )
.on("touchend",function(d){portMouseUp(d,PORT_TYPE_INPUT,0);d3.event.preventDefault();} )
.on("mouseover",function(d){portMouseOver(d3.select(this),d,PORT_TYPE_INPUT,0);})
.on("mouseout",function(d) {portMouseOut(d3.select(this),d,PORT_TYPE_INPUT,0);});
}
var numOutputs = d.outputs;
if (isLink && d.type === "link out") {
if (showAllLinkPorts===PORT_TYPE_OUTPUT || activeLinkNodes[d.id]) {
numOutputs = 1;
} else {
numOutputs = 0;
}
}
var y = (d.h/2)-((numOutputs-1)/2)*13;
thisNode.selectAll(".red-ui-flow-node-label-text").attr("x", function () { return 38; });
thisNode.selectAll(".red-ui-flow-node-label-right").selectAll("tspan").attr("x", function(){ 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)});
var inputPorts = thisNode.selectAll(".red-ui-flow-port-input");
if ((!isLink || (showAllLinkPorts === -1 && !activeLinkNodes[d.id])) && d.inputs === 0 && !inputPorts.empty()) {
inputPorts.remove();
} else if (((isLink && (showAllLinkPorts===PORT_TYPE_INPUT||activeLinkNodes[d.id]))|| d.inputs === 1) && inputPorts.empty()) {
var inputGroup = thisNode.append("g").attr("class","red-ui-flow-port-input");
var inputGroupPorts;
// Remove extra ports
while (this.__outputs__.length > numOutputs) {
var port = this.__outputs__.pop();
port.remove();
}
for(var portIndex = 0; portIndex < numOutputs; portIndex++ ) {
var portGroup;
if (portIndex === this.__outputs__.length) {
portGroup = document.createElementNS("http://www.w3.org/2000/svg","g");
portGroup.setAttribute("class","red-ui-flow-port-output");
var portPort;
if (d.type === "link out") {
portPort = document.createElementNS("http://www.w3.org/2000/svg","circle");
portPort.setAttribute("cx",11);
portPort.setAttribute("cy",5);
portPort.setAttribute("r",5);
portPort.setAttribute("class","red-ui-flow-port red-ui-flow-link-port");
} else {
portPort = document.createElementNS("http://www.w3.org/2000/svg","rect");
portPort.setAttribute("rx",3);
portPort.setAttribute("ry",3);
portPort.setAttribute("width",10);
portPort.setAttribute("height",10);
portPort.setAttribute("class","red-ui-flow-port");
}
portGroup.appendChild(portPort);
portPort.__data__ = this.__data__;
portPort.__portType__ = PORT_TYPE_OUTPUT;
portPort.__portIndex__ = portIndex;
portPort.addEventListener("mousedown", portMouseDownProxy);
portPort.addEventListener("touchstart", portTouchStartProxy);
portPort.addEventListener("mouseup", portMouseUpProxy);
portPort.addEventListener("touchstart", portTouchEndProxy);
portPort.addEventListener("mouseover", portMouseOverProxy);
portPort.addEventListener("mouseout", portMouseOutProxy);
if (d.type === "link in") {
inputGroupPorts = inputGroup.append("circle")
.attr("cx",-1).attr("cy",5)
.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)
}
inputGroupPorts.on("mousedown",function(d){portMouseDown(d,PORT_TYPE_INPUT,0);})
.on("touchstart",function(d){portMouseDown(d,PORT_TYPE_INPUT,0);d3.event.preventDefault();})
.on("mouseup",function(d){portMouseUp(d,PORT_TYPE_INPUT,0);} )
.on("touchend",function(d){portMouseUp(d,PORT_TYPE_INPUT,0);d3.event.preventDefault();} )
.on("mouseover",function(d){portMouseOver(d3.select(this),d,PORT_TYPE_INPUT,0);})
.on("mouseout",function(d) {portMouseOut(d3.select(this),d,PORT_TYPE_INPUT,0);});
}
var numOutputs = d.outputs;
if (isLink && d.type === "link out") {
if (showAllLinkPorts===PORT_TYPE_OUTPUT || activeLinkNodes[d.id]) {
numOutputs = 1;
} else {
numOutputs = 0;
}
this.appendChild(portGroup);
this.__outputs__.push(portGroup);
} else {
portGroup = this.__outputs__[portIndex];
}
var x = d.w - 5;
var y = (d.h/2)-((numOutputs-1)/2)*13;
// Remove extra ports
while (this.__outputs__.length > numOutputs) {
var port = this.__outputs__.pop();
port.remove();
}
for(var portIndex = 0; portIndex < numOutputs; portIndex++ ) {
var portGroup;
if (portIndex === this.__outputs__.length) {
portGroup = document.createElementNS("http://www.w3.org/2000/svg","g");
portGroup.setAttribute("class","red-ui-flow-port-output");
var portPort;
if (d.type === "link out") {
portPort = document.createElementNS("http://www.w3.org/2000/svg","circle");
portPort.setAttribute("cx",11);
portPort.setAttribute("cy",5);
portPort.setAttribute("r",5);
portPort.setAttribute("class","red-ui-flow-port red-ui-flow-link-port");
} else {
portPort = document.createElementNS("http://www.w3.org/2000/svg","rect");
portPort.setAttribute("rx",3);
portPort.setAttribute("ry",3);
portPort.setAttribute("width",10);
portPort.setAttribute("height",10);
portPort.setAttribute("class","red-ui-flow-port");
}
portGroup.appendChild(portPort);
portPort.__data__ = this.__data__;
portPort.__portType__ = PORT_TYPE_OUTPUT;
portPort.__portIndex__ = portIndex;
portPort.addEventListener("mousedown", portMouseDownProxy);
portPort.addEventListener("touchstart", portTouchStartProxy);
portPort.addEventListener("mouseup", portMouseUpProxy);
portPort.addEventListener("touchstart", portTouchEndProxy);
portPort.addEventListener("mouseover", portMouseOverProxy);
portPort.addEventListener("mouseout", portMouseOutProxy);
this.appendChild(portGroup);
this.__outputs__.push(portGroup);
} else {
portGroup = this.__outputs__[portIndex];
}
var x = d.w - 5;
var y = (d.h/2)-((numOutputs-1)/2)*13;
portGroup.setAttribute("transform","translate("+x+","+((y+13*portIndex)-5)+")")
}
if (d._def.icon) {
var icon = thisNode.select(".red-ui-flow-node-icon");
var faIcon = thisNode.select(".fa-lg");
var current_url;
if (!icon.empty()) {
current_url = icon.attr("xlink:href");
} else {
current_url = faIcon.attr("xlink:href");
}
var new_url = RED.utils.getNodeIcon(d._def,d);
if (new_url !== current_url) {
if (!icon.empty()) {
icon.remove();
} else {
faIcon.remove();
}
var iconGroup = thisNode.select(".red-ui-flow-node-icon-group");
createIconAttributes(new_url, iconGroup, d);
icon = thisNode.select(".red-ui-flow-node-icon");
faIcon = thisNode.select(".fa-lg");
}
icon.attr("y",function(){return (d.h-d3.select(this).attr("height"))/2;});
this.__iconShade__.setAttribute("height", d.h );
this.__iconShadeBorder__.setAttribute("d",
"M " + (((!d._def.align && d.inputs !== 0 && d.outputs === 0) || "right" === d._def.align) ? 0 : 30) + " 1 l 0 " + (d.h - 2)
);
faIcon.attr("y",(d.h+13)/2);
}
this.__changeBadge__.setAttribute("transform", "translate("+(d.w-10)+", -2)");
this.__changeBadge__.classList.toggle("hide", !(d.changed||d.moved));
this.__errorBadge__.setAttribute("transform", "translate("+(d.w-10-((d.changed||d.moved)?14:0))+", -2)");
this.__errorBadge__.classList.toggle("hide", d.valid);
thisNode.selectAll(".red-ui-flow-port-input").each(function(d,i) {
var port = d3.select(this);
port.attr("transform",function(d){return "translate(-5,"+((d.h/2)-5)+")";})
});
if (d._def.button) {
var buttonEnabled = isButtonEnabled(d);
this.__buttonGroup__.setAttribute("opacity", !buttonEnabled?0.4:1 );
this.__buttonGroupButton__.setAttribute("cursor",buttonEnabled?"":"pointer");
var x = d._def.align == "right"?d.w-6:-25;
if (d._def.button.toggle && !d[d._def.button.toggle]) {
x = x - (d._def.align == "right"?8:-8);
}
this.__buttonGroup__.setAttribute("transform", "translate("+x+",2)");
this.__buttonGroupBackground__.setAttribute("fill-opacity",d._def.button.toggle?(d[d._def.button.toggle]?1:0.2):1)
if (typeof d._def.button.visible === "function") { // is defined and a function...
if (d._def.button.visible.call(d) === false) {
this.__buttonGroup__.style.display = "none";
}
else {
this.__buttonGroup__.style.display = "inherit";
}
}
}
// thisNode.selectAll(".node_badge_group").attr("transform",function(d){return "translate("+(d.w-40)+","+(d.h+3)+")";});
// thisNode.selectAll("text.node_badge_label").text(function(d,i) {
// if (d._def.badge) {
// if (typeof d._def.badge == "function") {
// try {
// return d._def.badge.call(d);
// } catch(err) {
// console.log("Definition error: "+d.type+".badge",err);
// return "";
// }
// } else {
// return d._def.badge;
// }
// }
// return "";
// });
portGroup.setAttribute("transform","translate("+x+","+((y+13*portIndex)-5)+")")
}
if (d.dirtyStatus) {
if (!showStatus || !d.status) {
this.__statusGroup__.style.display = "none";
if (d._def.icon) {
var icon = thisNode.select(".red-ui-flow-node-icon");
var faIcon = thisNode.select(".fa-lg");
var current_url;
if (!icon.empty()) {
current_url = icon.attr("xlink:href");
} else {
this.__statusGroup__.style.display = "inline";
var fill = status_colours[d.status.fill]; // Only allow our colours for now
if (d.status.shape == null && fill == null) {
this.__statusShape__.style.display = "none";
this.__statusGroup__.setAttribute("transform","translate(-14,"+(d.h+3)+")");
current_url = faIcon.attr("xlink:href");
}
var new_url = RED.utils.getNodeIcon(d._def,d);
if (new_url !== current_url) {
if (!icon.empty()) {
icon.remove();
} else {
this.__statusGroup__.setAttribute("transform","translate(3,"+(d.h+3)+")");
var statusClass = "red-ui-flow-node-status-"+(d.status.shape||"dot")+"-"+d.status.fill;
this.__statusShape__.style.display = "inline";
this.__statusShape__.setAttribute("class","red-ui-flow-node-status "+statusClass);
faIcon.remove();
}
if (d.status.hasOwnProperty('text')) {
this.__statusLabel__.textContent = d.status.text;
} else {
this.__statusLabel__.textContent = "";
var iconGroup = thisNode.select(".red-ui-flow-node-icon-group");
createIconAttributes(new_url, iconGroup, d);
icon = thisNode.select(".red-ui-flow-node-icon");
faIcon = thisNode.select(".fa-lg");
}
icon.attr("y",function(){return (d.h-d3.select(this).attr("height"))/2;});
this.__iconShade__.setAttribute("height", d.h );
this.__iconShadeBorder__.setAttribute("d",
"M " + (((!d._def.align && d.inputs !== 0 && d.outputs === 0) || "right" === d._def.align) ? 0 : 30) + " 1 l 0 " + (d.h - 2)
);
faIcon.attr("y",(d.h+13)/2);
}
this.__changeBadge__.setAttribute("transform", "translate("+(d.w-10)+", -2)");
this.__changeBadge__.classList.toggle("hide", !(d.changed||d.moved));
this.__errorBadge__.setAttribute("transform", "translate("+(d.w-10-((d.changed||d.moved)?14:0))+", -2)");
this.__errorBadge__.classList.toggle("hide", d.valid);
thisNode.selectAll(".red-ui-flow-port-input").each(function(d,i) {
var port = d3.select(this);
port.attr("transform",function(d){return "translate(-5,"+((d.h/2)-5)+")";})
});
if (d._def.button) {
var buttonEnabled = isButtonEnabled(d);
this.__buttonGroup__.setAttribute("opacity", !buttonEnabled?0.4:1 );
this.__buttonGroupButton__.setAttribute("cursor",buttonEnabled?"":"pointer");
var x = d._def.align == "right"?d.w-6:-25;
if (d._def.button.toggle && !d[d._def.button.toggle]) {
x = x - (d._def.align == "right"?8:-8);
}
this.__buttonGroup__.setAttribute("transform", "translate("+x+",2)");
this.__buttonGroupBackground__.setAttribute("fill-opacity",d._def.button.toggle?(d[d._def.button.toggle]?1:0.2):1)
if (typeof d._def.button.visible === "function") { // is defined and a function...
if (d._def.button.visible.call(d) === false) {
this.__buttonGroup__.style.display = "none";
}
else {
this.__buttonGroup__.style.display = "inherit";
}
}
delete d.dirtyStatus;
}
d.dirty = false;
if (d.g) {
if (!dirtyGroups[d.g]) {
var gg = d.g;
while (gg && !dirtyGroups[gg]) {
dirtyGroups[gg] = RED.nodes.group(gg);
gg = dirtyGroups[gg].g;
}
// thisNode.selectAll(".node_badge_group").attr("transform",function(d){return "translate("+(d.w-40)+","+(d.h+3)+")";});
// thisNode.selectAll("text.node_badge_label").text(function(d,i) {
// if (d._def.badge) {
// if (typeof d._def.badge == "function") {
// try {
// return d._def.badge.call(d);
// } catch(err) {
// console.log("Definition error: "+d.type+".badge",err);
// return "";
// }
// } else {
// return d._def.badge;
// }
// }
// return "";
// });
}
if (d.dirtyStatus) {
if (!showStatus || !d.status) {
this.__statusGroup__.style.display = "none";
} else {
this.__statusGroup__.style.display = "inline";
var fill = status_colours[d.status.fill]; // Only allow our colours for now
if (d.status.shape == null && fill == null) {
this.__statusShape__.style.display = "none";
this.__statusGroup__.setAttribute("transform","translate(-14,"+(d.h+3)+")");
} else {
this.__statusGroup__.setAttribute("transform","translate(3,"+(d.h+3)+")");
var statusClass = "red-ui-flow-node-status-"+(d.status.shape||"dot")+"-"+d.status.fill;
this.__statusShape__.style.display = "inline";
this.__statusShape__.setAttribute("class","red-ui-flow-node-status "+statusClass);
}
if (d.status.hasOwnProperty('text')) {
this.__statusLabel__.textContent = d.status.text;
} else {
this.__statusLabel__.textContent = "";
}
}
delete d.dirtyStatus;
}
d.dirty = false;
if (d.g) {
if (!dirtyGroups[d.g]) {
var gg = d.g;
while (gg && !dirtyGroups[gg]) {
dirtyGroups[gg] = RED.nodes.group(gg);
gg = dirtyGroups[gg].g;
}
}
}
}
});
var link = linkLayer.selectAll(".red-ui-flow-link").data(
activeLinks,
@ -4064,24 +4064,24 @@ RED.view = (function() {
var y = -(flows.length-1)*h/2;
var linkGroups = g.selectAll(".red-ui-flow-link-group").data(flows);
var enterLinkGroups = linkGroups.enter().append("g").attr("class","red-ui-flow-link-group")
.on('mouseover', function() { if (mouse_mode !== 0) { return } d3.select(this).classed('red-ui-flow-link-group-active',true)})
.on('mouseout', function() {if (mouse_mode !== 0) { return } d3.select(this).classed('red-ui-flow-link-group-active',false)})
.on('mousedown', function() { d3.event.preventDefault(); d3.event.stopPropagation(); })
.on('mouseup', function(f) {
if (mouse_mode !== 0) {
return
}
d3.event.stopPropagation();
var targets = d.links[f];
RED.workspaces.show(f);
targets.forEach(function(n) {
n.selected = true;
n.dirty = true;
moving_set.push({n:n});
});
updateSelection();
redraw();
.on('mouseover', function() { if (mouse_mode !== 0) { return } d3.select(this).classed('red-ui-flow-link-group-active',true)})
.on('mouseout', function() {if (mouse_mode !== 0) { return } d3.select(this).classed('red-ui-flow-link-group-active',false)})
.on('mousedown', function() { d3.event.preventDefault(); d3.event.stopPropagation(); })
.on('mouseup', function(f) {
if (mouse_mode !== 0) {
return
}
d3.event.stopPropagation();
var targets = d.links[f];
RED.workspaces.show(f);
targets.forEach(function(n) {
n.selected = true;
n.dirty = true;
moving_set.push({n:n});
});
updateSelection();
redraw();
});
enterLinkGroups.each(function(f) {
var linkG = d3.select(this);
linkG.append("svg:path")