External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-05-06 08:57:35 -02:30
Code Issues Packages Projects Releases Wiki Activity

Format workflow-chart directive code

Browse Source
This commit is contained in:
Marliana Lara
2018-10-06 17:28:34 -04:00
parent c2d4887043
commit f6cc351f7f
1 changed files with 1036 additions and 918 deletions
Download Patch File Download Diff File Expand all files Collapse all files

338
awx/ui/client/src/templates/workflows/workflow-chart/workflow-chart.directive.js
View File

@@ -64,8 +64,12 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
}); });
line = d3.svg.line() line = d3.svg.line()
.x(function(d){return d.x;}) .x(function (d) {
.y(function(d){return d.y;}); return d.x;
})
.y(function (d) {
return d.y;
});
zoomObj = d3.behavior.zoom().scaleExtent([0.5, 2]); zoomObj = d3.behavior.zoom().scaleExtent([0.5, 2]);
@@ -87,8 +91,7 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
// This is the workflow editor // This is the workflow editor
dimensions.height = $('.WorkflowMaker-contentLeft').outerHeight() - $('.WorkflowLegend-maker').outerHeight(); dimensions.height = $('.WorkflowMaker-contentLeft').outerHeight() - $('.WorkflowLegend-maker').outerHeight();
dimensions.width = $('#workflow-modal-dialog').width() - $('.WorkflowMaker-contentRight').outerWidth(); dimensions.width = $('#workflow-modal-dialog').width() - $('.WorkflowMaker-contentRight').outerWidth();
} } else {
else {
// This is the workflow details view // This is the workflow details view
let panel = $('.WorkflowResults-rightSide').children('.Panel')[0]; let panel = $('.WorkflowResults-rightSide').children('.Panel')[0];
let panelWidth = $(panel).width(); let panelWidth = $(panel).width();
@@ -111,8 +114,7 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
let targetX = d.target.y; let targetX = d.target.y;
let targetY = d.target.x + nodeH / 2; let targetY = d.target.x + nodeH / 2;
let points = [ let points = [{
{
x: sourceX, x: sourceX,
y: sourceY y: sourceY
}, },
@@ -130,8 +132,7 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
function wrap(text) { function wrap(text) {
if (text && text.length > maxNodeTextLength) { if (text && text.length > maxNodeTextLength) {
return text.substring(0, maxNodeTextLength) + '...'; return text.substring(0, maxNodeTextLength) + '...';
} } else {
else {
return text; return text;
} }
} }
@@ -140,17 +141,33 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
var retval; var retval;
retval = "M" + (x + r) + "," + y; retval = "M" + (x + r) + "," + y;
retval += "h" + (w - 2 * r); retval += "h" + (w - 2 * r);
if (tr) { retval += "a" + r + "," + r + " 0 0 1 " + r + "," + r; } if (tr) {
else { retval += "h" + r; retval += "v" + r; } retval += "a" + r + "," + r + " 0 0 1 " + r + "," + r;
} else {
retval += "h" + r;
retval += "v" + r;
}
retval += "v" + (h - 2 * r); retval += "v" + (h - 2 * r);
if (br) { retval += "a" + r + "," + r + " 0 0 1 " + -r + "," + r; } if (br) {
else { retval += "v" + r; retval += "h" + -r; } retval += "a" + r + "," + r + " 0 0 1 " + -r + "," + r;
} else {
retval += "v" + r;
retval += "h" + -r;
}
retval += "h" + (2 * r - w); retval += "h" + (2 * r - w);
if (bl) { retval += "a" + r + "," + r + " 0 0 1 " + -r + "," + -r; } if (bl) {
else { retval += "h" + -r; retval += "v" + -r; } retval += "a" + r + "," + r + " 0 0 1 " + -r + "," + -r;
} else {
retval += "h" + -r;
retval += "v" + -r;
}
retval += "v" + (2 * r - h); retval += "v" + (2 * r - h);
if (tl) { retval += "a" + r + "," + r + " 0 0 1 " + r + "," + -r; } if (tl) {
else { retval += "v" + -r; retval += "h" + r; } retval += "a" + r + "," + r + " 0 0 1 " + r + "," + -r;
} else {
retval += "v" + -r;
retval += "h" + r;
}
retval += "z"; retval += "z";
return retval; return retval;
} }
@@ -246,9 +263,15 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
let nodeEnter = node.enter().append("g") let nodeEnter = node.enter().append("g")
.attr("class", "node") .attr("class", "node")
.attr("id", function(d){return "node-" + d.id;}) .attr("id", function (d) {
.attr("parent", function(d){return d.parent ? d.parent.id : null;}) return "node-" + d.id;
.attr("transform", function(d) { return "translate(" + d.y + "," + d.x + ")"; }); })
.attr("parent", function (d) {
return d.parent ? d.parent.id : null;
})
.attr("transform", function (d) {
return "translate(" + d.y + "," + d.x + ")";
});
nodeEnter.each(function (d) { nodeEnter.each(function (d) {
let thisNode = d3.select(this); let thisNode = d3.select(this);
@@ -264,8 +287,7 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
.attr("ry", 5) .attr("ry", 5)
.attr("fill", "#337ab7") .attr("fill", "#337ab7")
.attr("class", "WorkflowChart-rootNode"); .attr("class", "WorkflowChart-rootNode");
} } else if (d.isStartNode && scope.mode !== 'details') {
else if(d.isStartNode && scope.mode !== 'details') {
thisNode.append("rect") thisNode.append("rect")
.attr("width", rootW) .attr("width", rootW)
.attr("height", rootH) .attr("height", rootH)
@@ -280,10 +302,11 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
.attr("y", 30) .attr("y", 30)
.attr("dy", ".35em") .attr("dy", ".35em")
.attr("class", "WorkflowChart-startText") .attr("class", "WorkflowChart-startText")
.text(function () { return TemplatesStrings.get('workflow_maker.START'); }) .text(function () {
return TemplatesStrings.get('workflow_maker.START');
})
.call(add_node); .call(add_node);
} } else {
else {
thisNode.append("rect") thisNode.append("rect")
.attr("width", nodeW) .attr("width", nodeW)
.attr("height", nodeH) .attr("height", nodeH)
@@ -293,15 +316,12 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
if (d.job && d.job.status) { if (d.job && d.job.status) {
if (d.job.status === "successful") { if (d.job.status === "successful") {
return "#5cb85c"; return "#5cb85c";
} } else if (d.job.status === "failed" || d.job.status === "error" || d.job.status === "cancelled") {
else if (d.job.status === "failed" || d.job.status === "error" || d.job.status === "cancelled") {
return "#d9534f"; return "#d9534f";
} } else {
else {
return "#D7D7D7"; return "#D7D7D7";
} }
} } else {
else {
return "#D7D7D7"; return "#D7D7D7";
} }
}) })
@@ -315,18 +335,38 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
thisNode.append("path") thisNode.append("path")
.attr("d", rounded_rect(1, 0, 5, nodeH, 5, 1, 0, 1, 0)) .attr("d", rounded_rect(1, 0, 5, nodeH, 5, 1, 0, 1, 0))
.attr("class", "WorkflowChart-activeNode") .attr("class", "WorkflowChart-activeNode")
.style("display", function(d) { return d.isActiveEdit ? null : "none"; }); .style("display", function (d) {
return d.isActiveEdit ? null : "none";
});
thisNode.append("text") thisNode.append("text")
.attr("x", function(d){ return (scope.mode === 'details' && d.job && d.job.status) ? 20 : nodeW / 2; }) .attr("x", function (d) {
.attr("y", function(d){ return (scope.mode === 'details' && d.job && d.job.status) ? 10 : nodeH / 2; }) return (scope.mode === 'details' && d.job && d.job.status) ? 20 : nodeW / 2;
})
.attr("y", function (d) {
return (scope.mode === 'details' && d.job && d.job.status) ? 10 : nodeH / 2;
})
.attr("dy", ".35em") .attr("dy", ".35em")
.attr("text-anchor", function(d){ return (scope.mode === 'details' && d.job && d.job.status) ? "inherit" : "middle"; }) .attr("text-anchor", function (d) {
return (scope.mode === 'details' && d.job && d.job.status) ? "inherit" : "middle";
})
.attr("class", "WorkflowChart-defaultText WorkflowChart-nameText") .attr("class", "WorkflowChart-defaultText WorkflowChart-nameText")
.text(function (d) { .text(function (d) {
return (d.unifiedJobTemplate && d.unifiedJobTemplate.name) ? d.unifiedJobTemplate.name : ""; return (d.unifiedJobTemplate && d.unifiedJobTemplate.name) ? d.unifiedJobTemplate.name : "";
}).each(wrap); }).each(wrap);
thisNode.append("foreignObject")
.attr("x", 54)
.attr("y", 45)
.style("font-size", "0.7em")
.attr("class", "WorkflowChart-conflictText")
.html(function () {
return `<span class=\"WorkflowChart-conflictIcon\">\uf06a</span><span> ${TemplatesStrings.get('workflow_maker.EDGE_CONFLICT')}</span>`;
})
.style("display", function (d) {
return (d.edgeConflict && !d.placeholder) ? null : "none";
});
thisNode.append("foreignObject") thisNode.append("foreignObject")
.attr("x", 62) .attr("x", 62)
.attr("y", 22) .attr("y", 22)
@@ -336,13 +376,17 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
.html(function () { .html(function () {
return `<span>${TemplatesStrings.get('workflow_maker.DELETED')}</span>`; return `<span>${TemplatesStrings.get('workflow_maker.DELETED')}</span>`;
}) })
.style("display", function(d) { return d.unifiedJobTemplate || d.placeholder ? "none" : null; }); .style("display", function (d) {
return d.unifiedJobTemplate || d.placeholder ? "none" : null;
});
thisNode.append("circle") thisNode.append("circle")
.attr("cy", nodeH) .attr("cy", nodeH)
.attr("r", 10) .attr("r", 10)
.attr("class", "WorkflowChart-nodeTypeCircle") .attr("class", "WorkflowChart-nodeTypeCircle")
.style("display", function(d) { return d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "project" || d.unifiedJobTemplate.unified_job_type === "project_update" || d.unifiedJobTemplate.type === "inventory_source" || d.unifiedJobTemplate.unified_job_type === "inventory_update") ? null : "none"; }); .style("display", function (d) {
return d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "project" || d.unifiedJobTemplate.unified_job_type === "project_update" || d.unifiedJobTemplate.type === "inventory_source" || d.unifiedJobTemplate.unified_job_type === "inventory_update") ? null : "none";
});
thisNode.append("text") thisNode.append("text")
.attr("y", nodeH) .attr("y", nodeH)
@@ -352,7 +396,9 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
.text(function (d) { .text(function (d) {
return (d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "project" || d.unifiedJobTemplate.unified_job_type === "project_update")) ? "P" : (d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "inventory_source" || d.unifiedJobTemplate.unified_job_type === "inventory_update") ? "I" : ""); return (d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "project" || d.unifiedJobTemplate.unified_job_type === "project_update")) ? "P" : (d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "inventory_source" || d.unifiedJobTemplate.unified_job_type === "inventory_update") ? "I" : "");
}) })
.style("display", function(d) { return d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "project" || d.unifiedJobTemplate.unified_job_type === "project_update" || d.unifiedJobTemplate.type === "inventory_source" || d.unifiedJobTemplate.unified_job_type === "inventory_update") ? null : "none"; }); .style("display", function (d) {
return d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "project" || d.unifiedJobTemplate.unified_job_type === "project_update" || d.unifiedJobTemplate.type === "inventory_source" || d.unifiedJobTemplate.unified_job_type === "inventory_update") ? null : "none";
});
thisNode.append("rect") thisNode.append("rect")
.attr("width", nodeW) .attr("width", nodeW)
@@ -411,17 +457,23 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
.attr("y", nodeH - 10) .attr("y", nodeH - 10)
.attr("dy", ".35em") .attr("dy", ".35em")
.attr("class", "WorkflowChart-detailsLink") .attr("class", "WorkflowChart-detailsLink")
.style("display", function(d){ return d.job && d.job.status && d.job.id ? null : "none"; }) .style("display", function (d) {
return d.job && d.job.status && d.job.id ? null : "none";
})
.text(function () { .text(function () {
return TemplatesStrings.get('workflow_maker.DETAILS'); return TemplatesStrings.get('workflow_maker.DETAILS');
}) })
.call(details); .call(details);
thisNode.append("circle") thisNode.append("circle")
.attr("id", function(d){return "node-" + d.id + "-add";}) .attr("id", function (d) {
return "node-" + d.id + "-add";
})
.attr("cx", nodeW) .attr("cx", nodeW)
.attr("r", 10) .attr("r", 10)
.attr("class", "addCircle nodeCircle") .attr("class", "addCircle nodeCircle")
.style("display", function(d) { return d.placeholder || !(userCanAddEdit) ? "none" : null; }) .style("display", function (d) {
return d.placeholder || !(userCanAddEdit) ? "none" : null;
})
.call(add_node) .call(add_node)
.on("mouseover", function (d) { .on("mouseover", function (d) {
d3.select("#node-" + d.id) d3.select("#node-" + d.id)
@@ -438,12 +490,16 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
thisNode.append("path") thisNode.append("path")
.attr("class", "nodeAddCross WorkflowChart-hoverPath") .attr("class", "nodeAddCross WorkflowChart-hoverPath")
.style("fill", "white") .style("fill", "white")
.attr("transform", function() { return "translate(" + nodeW + "," + 0 + ")"; }) .attr("transform", function () {
return "translate(" + nodeW + "," + 0 + ")";
})
.attr("d", d3.svg.symbol() .attr("d", d3.svg.symbol()
.size(60) .size(60)
.type("cross") .type("cross")
) )
.style("display", function(d) { return d.placeholder || !(userCanAddEdit) ? "none" : null; }) .style("display", function (d) {
return d.placeholder || !(userCanAddEdit) ? "none" : null;
})
.call(add_node) .call(add_node)
.on("mouseover", function (d) { .on("mouseover", function (d) {
d3.select("#node-" + d.id) d3.select("#node-" + d.id)
@@ -458,12 +514,16 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
.classed("addHovering", false); .classed("addHovering", false);
}); });
thisNode.append("circle") thisNode.append("circle")
.attr("id", function(d){return "node-" + d.id + "-remove";}) .attr("id", function (d) {
return "node-" + d.id + "-remove";
})
.attr("cx", nodeW) .attr("cx", nodeW)
.attr("cy", nodeH) .attr("cy", nodeH)
.attr("r", 10) .attr("r", 10)
.attr("class", "removeCircle") .attr("class", "removeCircle")
.style("display", function(d) { return (d.canDelete === false || d.placeholder || !(userCanAddEdit)) ? "none" : null; }) .style("display", function (d) {
return (d.canDelete === false || d.placeholder || !(userCanAddEdit)) ? "none" : null;
})
.call(remove_node) .call(remove_node)
.on("mouseover", function (d) { .on("mouseover", function (d) {
d3.select("#node-" + d.id) d3.select("#node-" + d.id)
@@ -480,12 +540,16 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
thisNode.append("path") thisNode.append("path")
.attr("class", "nodeRemoveCross WorkflowChart-hoverPath") .attr("class", "nodeRemoveCross WorkflowChart-hoverPath")
.style("fill", "white") .style("fill", "white")
.attr("transform", function() { return "translate(" + nodeW + "," + nodeH + ") rotate(-45)"; }) .attr("transform", function () {
return "translate(" + nodeW + "," + nodeH + ") rotate(-45)";
})
.attr("d", d3.svg.symbol() .attr("d", d3.svg.symbol()
.size(60) .size(60)
.type("cross") .type("cross")
) )
.style("display", function(d) { return (d.canDelete === false || d.placeholder || !(userCanAddEdit)) ? "none" : null; }) .style("display", function (d) {
return (d.canDelete === false || d.placeholder || !(userCanAddEdit)) ? "none" : null;
})
.call(remove_node) .call(remove_node)
.on("mouseover", function (d) { .on("mouseover", function (d) {
d3.select("#node-" + d.id) d3.select("#node-" + d.id)
@@ -533,7 +597,9 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
return statusClass; return statusClass;
}) })
.style("display", function(d) { return d.job && d.job.status ? null : "none"; }) .style("display", function (d) {
return d.job && d.job.status ? null : "none";
})
.attr("cy", 10) .attr("cy", 10)
.attr("cx", 10) .attr("cx", 10)
.attr("r", 6); .attr("r", 6);
@@ -550,12 +616,13 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
let paddedElapsedMoment = Math.floor(elapsedMoment.asHours()) < 10 ? "0" + Math.floor(elapsedMoment.asHours()) : Math.floor(elapsedMoment.asHours()); let paddedElapsedMoment = Math.floor(elapsedMoment.asHours()) < 10 ? "0" + Math.floor(elapsedMoment.asHours()) : Math.floor(elapsedMoment.asHours());
let elapsedString = paddedElapsedMoment + moment.utc(elapsedMs).format(":mm:ss"); let elapsedString = paddedElapsedMoment + moment.utc(elapsedMs).format(":mm:ss");
return "<div class=\"WorkflowChart-elapsedHolder\"><span>" + elapsedString + "</span></div>"; return "<div class=\"WorkflowChart-elapsedHolder\"><span>" + elapsedString + "</span></div>";
} } else {
else {
return ""; return "";
} }
}) })
.style("display", function(d) { return (d.job && d.job.elapsed) ? null : "none"; }); .style("display", function (d) {
return (d.job && d.job.elapsed) ? null : "none";
});
} }
}); });
@@ -574,7 +641,9 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
let linkEnter = link.enter().append("g") let linkEnter = link.enter().append("g")
.attr("class", "link") .attr("class", "link")
.attr("id", function(d){return "link-" + d.source.id + "-" + d.target.id;}); .attr("id", function (d) {
return "link-" + d.source.id + "-" + d.target.id;
});
// Add entering links in the parent’s old position. // Add entering links in the parent’s old position.
linkEnter.insert("path", "g") linkEnter.insert("path", "g")
@@ -586,21 +655,20 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
if (d.target.edgeType) { if (d.target.edgeType) {
if (d.target.edgeType === "failure") { if (d.target.edgeType === "failure") {
return "#d9534f"; return "#d9534f";
} } else if (d.target.edgeType === "success") {
else if(d.target.edgeType === "success") {
return "#5cb85c"; return "#5cb85c";
} } else if (d.target.edgeType === "always") {
else if(d.target.edgeType === "always"){
return "#337ab7"; return "#337ab7";
} }
} } else {
else {
return "#D7D7D7"; return "#D7D7D7";
} }
}); });
linkEnter.append("circle") linkEnter.append("circle")
.attr("id", function(d){return "link-" + d.source.id + "-" + d.target.id + "-add";}) .attr("id", function (d) {
return "link-" + d.source.id + "-" + d.target.id + "-add";
})
.attr("cx", function (d) { .attr("cx", function (d) {
return (d.source.isStartNode) ? (d.target.y + d.source.y + rootW) / 2 : (d.target.y + d.source.y + nodeW) / 2; return (d.source.isStartNode) ? (d.target.y + d.source.y + rootW) / 2 : (d.target.y + d.source.y + nodeW) / 2;
}) })
@@ -609,7 +677,9 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
}) })
.attr("r", 10) .attr("r", 10)
.attr("class", "addCircle linkCircle") .attr("class", "addCircle linkCircle")
.style("display", function(d) { return (d.source.placeholder || d.target.placeholder || !(userCanAddEdit)) ? "none" : null; }) .style("display", function (d) {
return (d.source.placeholder || d.target.placeholder || !(userCanAddEdit)) ? "none" : null;
})
.call(add_node_between) .call(add_node_between)
.on("mouseover", function (d) { .on("mouseover", function (d) {
d3.select("#link-" + d.source.id + "-" + d.target.id) d3.select("#link-" + d.source.id + "-" + d.target.id)
@@ -631,8 +701,7 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
let translate; let translate;
if (d.source.isStartNode) { if (d.source.isStartNode) {
translate = "translate(" + (d.target.y + d.source.y + rootW) / 2 + "," + ((d.target.x + startNodeOffsetY + rootH / 2) + (d.source.x + nodeH / 2)) / 2 + ")"; translate = "translate(" + (d.target.y + d.source.y + rootW) / 2 + "," + ((d.target.x + startNodeOffsetY + rootH / 2) + (d.source.x + nodeH / 2)) / 2 + ")";
} } else {
else {
translate = "translate(" + (d.target.y + d.source.y + nodeW) / 2 + "," + (d.target.x + d.source.x + nodeH) / 2 + ")"; translate = "translate(" + (d.target.y + d.source.y + nodeW) / 2 + "," + (d.target.x + d.source.x + nodeH) / 2 + ")";
} }
return translate; return translate;
@@ -641,7 +710,9 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
.size(60) .size(60)
.type("cross") .type("cross")
) )
.style("display", function(d) { return (d.source.placeholder || d.target.placeholder || !(userCanAddEdit)) ? "none" : null; }) .style("display", function (d) {
return (d.source.placeholder || d.target.placeholder || !(userCanAddEdit)) ? "none" : null;
})
.call(add_node_between) .call(add_node_between)
.on("mouseover", function (d) { .on("mouseover", function (d) {
d3.select("#link-" + d.source.id + "-" + d.target.id) d3.select("#link-" + d.source.id + "-" + d.target.id)
@@ -662,16 +733,24 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
let t = baseSvg.transition(); let t = baseSvg.transition();
t.selectAll(".nodeCircle") t.selectAll(".nodeCircle")
.style("display", function(d) { return d.placeholder || !(userCanAddEdit) ? "none" : null; }); .style("display", function (d) {
return d.placeholder || !(userCanAddEdit) ? "none" : null;
});
t.selectAll(".nodeAddCross") t.selectAll(".nodeAddCross")
.style("display", function(d) { return d.placeholder || !(userCanAddEdit) ? "none" : null; }); .style("display", function (d) {
return d.placeholder || !(userCanAddEdit) ? "none" : null;
});
t.selectAll(".removeCircle") t.selectAll(".removeCircle")
.style("display", function(d) { return (d.canDelete === false || d.placeholder || !(userCanAddEdit)) ? "none" : null; }); .style("display", function (d) {
return (d.canDelete === false || d.placeholder || !(userCanAddEdit)) ? "none" : null;
});
t.selectAll(".nodeRemoveCross") t.selectAll(".nodeRemoveCross")
.style("display", function(d) { return (d.canDelete === false || d.placeholder || !(userCanAddEdit)) ? "none" : null; }); .style("display", function (d) {
return (d.canDelete === false || d.placeholder || !(userCanAddEdit)) ? "none" : null;
});
t.selectAll(".linkPath") t.selectAll(".linkPath")
.attr("class", function (d) { .attr("class", function (d) {
@@ -682,21 +761,20 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
if (d.target.edgeType) { if (d.target.edgeType) {
if (d.target.edgeType === "failure") { if (d.target.edgeType === "failure") {
return "#d9534f"; return "#d9534f";
} } else if (d.target.edgeType === "success") {
else if(d.target.edgeType === "success") {
return "#5cb85c"; return "#5cb85c";
} } else if (d.target.edgeType === "always") {
else if(d.target.edgeType === "always"){
return "#337ab7"; return "#337ab7";
} }
} } else {
else {
return "#D7D7D7"; return "#D7D7D7";
} }
}); });
t.selectAll(".linkCircle") t.selectAll(".linkCircle")
.style("display", function(d) { return (d.source.placeholder || d.target.placeholder || !(userCanAddEdit)) ? "none" : null; }) .style("display", function (d) {
return (d.source.placeholder || d.target.placeholder || !(userCanAddEdit)) ? "none" : null;
})
.attr("cx", function (d) { .attr("cx", function (d) {
return (d.source.isStartNode) ? (d.target.y + d.source.y + rootW) / 2 : (d.target.y + d.source.y + nodeW) / 2; return (d.source.isStartNode) ? (d.target.y + d.source.y + rootW) / 2 : (d.target.y + d.source.y + nodeW) / 2;
}) })
@@ -705,13 +783,14 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
}); });
t.selectAll(".linkCross") t.selectAll(".linkCross")
.style("display", function(d) { return (d.source.placeholder || d.target.placeholder || !(userCanAddEdit)) ? "none" : null; }) .style("display", function (d) {
return (d.source.placeholder || d.target.placeholder || !(userCanAddEdit)) ? "none" : null;
})
.attr("transform", function (d) { .attr("transform", function (d) {
let translate; let translate;
if (d.source.isStartNode) { if (d.source.isStartNode) {
translate = "translate(" + (d.target.y + d.source.y + rootW) / 2 + "," + ((d.target.x + startNodeOffsetY + rootH / 2) + (d.source.x + nodeH / 2)) / 2 + ")"; translate = "translate(" + (d.target.y + d.source.y + rootW) / 2 + "," + ((d.target.x + startNodeOffsetY + rootH / 2) + (d.source.x + nodeH / 2)) / 2 + ")";
} } else {
else {
translate = "translate(" + (d.target.y + d.source.y + nodeW) / 2 + "," + (d.target.x + d.source.x + nodeH) / 2 + ")"; translate = "translate(" + (d.target.y + d.source.y + nodeW) / 2 + "," + (d.target.x + d.source.x + nodeH) / 2 + ")";
} }
return translate; return translate;
@@ -722,15 +801,12 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
if (d.job && d.job.status) { if (d.job && d.job.status) {
if (d.job.status === "successful") { if (d.job.status === "successful") {
return "#5cb85c"; return "#5cb85c";
} } else if (d.job.status === "failed" || d.job.status === "error" || d.job.status === "cancelled") {
else if (d.job.status === "failed" || d.job.status === "error" || d.job.status === "cancelled") {
return "#d9534f"; return "#d9534f";
} } else {
else {
return "#D7D7D7"; return "#D7D7D7";
} }
} } else {
else {
return "#D7D7D7"; return "#D7D7D7";
} }
}) })
@@ -741,17 +817,27 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
}); });
t.selectAll(".node") t.selectAll(".node")
.attr("parent", function(d){return d.parent ? d.parent.id : null;}) .attr("parent", function (d) {
.attr("transform", function(d) {d.px = d.x; d.py = d.y; return "translate(" + d.y + "," + d.x + ")"; }); return d.parent ? d.parent.id : null;
})
.attr("transform", function (d) {
d.px = d.x;
d.py = d.y;
return "translate(" + d.y + "," + d.x + ")";
});
t.selectAll(".WorkflowChart-nodeTypeCircle") t.selectAll(".WorkflowChart-nodeTypeCircle")
.style("display", function(d) { return d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "project" || d.unifiedJobTemplate.unified_job_type === "project_update" || d.unifiedJobTemplate.type === "inventory_source" || d.unifiedJobTemplate.unified_job_type === "inventory_update" ) ? null : "none"; }); .style("display", function (d) {
return d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "project" || d.unifiedJobTemplate.unified_job_type === "project_update" || d.unifiedJobTemplate.type === "inventory_source" || d.unifiedJobTemplate.unified_job_type === "inventory_update") ? null : "none";
});
t.selectAll(".WorkflowChart-nodeTypeLetter") t.selectAll(".WorkflowChart-nodeTypeLetter")
.text(function (d) { .text(function (d) {
return (d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "project" || d.unifiedJobTemplate.unified_job_type === "project_update")) ? "P" : (d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "inventory_source" || d.unifiedJobTemplate.unified_job_type === "inventory_update") ? "I" : ""); return (d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "project" || d.unifiedJobTemplate.unified_job_type === "project_update")) ? "P" : (d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "inventory_source" || d.unifiedJobTemplate.unified_job_type === "inventory_update") ? "I" : "");
}) })
.style("display", function(d) { return d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "project" || d.unifiedJobTemplate.unified_job_type === "project_update" || d.unifiedJobTemplate.type === "inventory_source" || d.unifiedJobTemplate.unified_job_type === "inventory_update") ? null : "none"; }); .style("display", function (d) {
return d.unifiedJobTemplate && (d.unifiedJobTemplate.type === "project" || d.unifiedJobTemplate.unified_job_type === "project_update" || d.unifiedJobTemplate.type === "inventory_source" || d.unifiedJobTemplate.unified_job_type === "inventory_update") ? null : "none";
});
t.selectAll(".WorkflowChart-nodeStatus") t.selectAll(".WorkflowChart-nodeStatus")
.attr("class", function (d) { .attr("class", function (d) {
@@ -786,7 +872,9 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
return statusClass; return statusClass;
}) })
.style("display", function(d) { return d.job && d.job.status ? null : "none"; }) .style("display", function (d) {
return d.job && d.job.status ? null : "none";
})
.transition() .transition()
.duration(0) .duration(0)
.attr("r", 6) .attr("r", 6)
@@ -808,26 +896,44 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
}); });
t.selectAll(".WorkflowChart-nameText") t.selectAll(".WorkflowChart-nameText")
.attr("x", function(d){ return (scope.mode === 'details' && d.job && d.job.status) ? 20 : nodeW / 2; }) .attr("x", function (d) {
.attr("y", function(d){ return (scope.mode === 'details' && d.job && d.job.status) ? 10 : nodeH / 2; }) return (scope.mode === 'details' && d.job && d.job.status) ? 20 : nodeW / 2;
.attr("text-anchor", function(d){ return (scope.mode === 'details' && d.job && d.job.status) ? "inherit" : "middle"; }) })
.attr("y", function (d) {
return (scope.mode === 'details' && d.job && d.job.status) ? 10 : nodeH / 2;
})
.attr("text-anchor", function (d) {
return (scope.mode === 'details' && d.job && d.job.status) ? "inherit" : "middle";
})
.text(function (d) { .text(function (d) {
return (d.unifiedJobTemplate && d.unifiedJobTemplate.name) ? wrap(d.unifiedJobTemplate.name) : ""; return (d.unifiedJobTemplate && d.unifiedJobTemplate.name) ? wrap(d.unifiedJobTemplate.name) : "";
}); });
t.selectAll(".WorkflowChart-detailsLink") t.selectAll(".WorkflowChart-detailsLink")
.style("display", function(d){ return d.job && d.job.status && d.job.id ? null : "none"; }); .style("display", function (d) {
return d.job && d.job.status && d.job.id ? null : "none";
});
t.selectAll(".WorkflowChart-deletedText") t.selectAll(".WorkflowChart-deletedText")
.style("display", function(d){ return d.unifiedJobTemplate || d.placeholder ? "none" : null; }); .style("display", function (d) {
return d.unifiedJobTemplate || d.placeholder ? "none" : null;
});
t.selectAll(".WorkflowChart-conflictText")
.style("display", function (d) {
return (d.edgeConflict && !d.placeholder) ? null : "none";
});
t.selectAll(".WorkflowChart-activeNode") t.selectAll(".WorkflowChart-activeNode")
.style("display", function(d) { return d.isActiveEdit ? null : "none"; }); .style("display", function (d) {
return d.isActiveEdit ? null : "none";
});
t.selectAll(".WorkflowChart-elapsed") t.selectAll(".WorkflowChart-elapsed")
.style("display", function(d) { return (d.job && d.job.elapsed) ? null : "none"; }); .style("display", function (d) {
} return (d.job && d.job.elapsed) ? null : "none";
else if(!scope.watchDimensionsSet){ });
} else if (!scope.watchDimensionsSet) {
scope.watchDimensionsSet = scope.$watch('dimensionsSet', function () { scope.watchDimensionsSet = scope.$watch('dimensionsSet', function () {
if (scope.dimensionsSet) { if (scope.dimensionsSet) {
scope.watchDimensionsSet(); scope.watchDimensionsSet();
@@ -891,21 +997,27 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
let goToJobResults = function (job_type) { let goToJobResults = function (job_type) {
if (job_type === 'job') { if (job_type === 'job') {
$state.go('output', {id: d.job.id, type: 'playbook'}); $state.go('output', {
} id: d.job.id,
else if(job_type === 'inventory_update') { type: 'playbook'
$state.go('output', {id: d.job.id, type: 'inventory'}); });
} } else if (job_type === 'inventory_update') {
else if(job_type === 'project_update') { $state.go('output', {
$state.go('output', {id: d.job.id, type: 'project'}); id: d.job.id,
type: 'inventory'
});
} else if (job_type === 'project_update') {
$state.go('output', {
id: d.job.id,
type: 'project'
});
} }
}; };
if (d.job.id) { if (d.job.id) {
if (d.unifiedJobTemplate) { if (d.unifiedJobTemplate) {
goToJobResults(d.unifiedJobTemplate.unified_job_type); goToJobResults(d.unifiedJobTemplate.unified_job_type);
} } else {
else {
// We don't have access to the unified resource and have to make // We don't have access to the unified resource and have to make
// a GET request in order to find out what type job this was // a GET request in order to find out what type job this was
// so that we can route the user to the correct stdout view // so that we can route the user to the correct stdout view
@@ -917,8 +1029,14 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
goToJobResults(res.data.results[0].type); goToJobResults(res.data.results[0].type);
} }
}) })
.catch(({data, status}) => { .catch(({
ProcessErrors(scope, data, status, null, { hdr: 'Error!', msg: 'Unable to get job: ' + status }); data,
status
}) => {
ProcessErrors(scope, data, status, null, {
hdr: 'Error!',
msg: 'Unable to get job: ' + status
});
}); });
} }
} }
@@ -983,8 +1101,7 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
$('.WorkflowMaker-chart').show(); $('.WorkflowMaker-chart').show();
}); });
}); });
} } else {
else {
scope.$on('workflowMakerModalResized', function () { scope.$on('workflowMakerModalResized', function () {
let dimensions = calcAvailableScreenSpace(); let dimensions = calcAvailableScreenSpace();
@@ -994,4 +1111,5 @@ export default ['$state','moment', '$timeout', '$window', '$filter', 'Rest', 'Ge
} }
} }
}; };
}]; }
];