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:
parent
5c5bebd689
commit
1c30584153
@ -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")
|
||||
|
Loading…
Reference in New Issue
Block a user