azkaban-uncached
Changes
src/less/bootstrap-azkaban.less 7(+6 -1)
src/web/js/azkaban.context.menu.js 105(+55 -50)
src/web/js/azkaban.svg.graph.view.js 42(+28 -14)
Details
diff --git a/src/java/azkaban/webapp/servlet/velocity/flowexecutionpanel.vm b/src/java/azkaban/webapp/servlet/velocity/flowexecutionpanel.vm
index b752a56..1b0fd31 100644
--- a/src/java/azkaban/webapp/servlet/velocity/flowexecutionpanel.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/flowexecutionpanel.vm
@@ -59,7 +59,7 @@
## SVG graph panel.
<div id="svg-div-custom" class="side-panel">
- <svg class="svgGraph" xmlns="http://www.w3.org/2000/svg" version="1.1" shape-rendering="optimize-speed" text-rendering="optimize-speed">
+ <svg id="flow-executing-graph" xmlns="http://www.w3.org/2000/svg" version="1.1" shape-rendering="optimize-speed" text-rendering="optimize-speed">
</svg>
</div>
src/less/bootstrap-azkaban.less 7(+6 -1)
diff --git a/src/less/bootstrap-azkaban.less b/src/less/bootstrap-azkaban.less
index 3b8b0ed..4c4f380 100644
--- a/src/less/bootstrap-azkaban.less
+++ b/src/less/bootstrap-azkaban.less
@@ -275,6 +275,7 @@ table .worksheet-key {
-moz-box-shadow: 2px 2px 5px #888;
-webkit-box-shadow: 2px 2px 5px #888;
box-shadow: 2px 2px 5px #888;
+ z-index: 2010;
ul {
list-style: none;
@@ -319,5 +320,9 @@ table .worksheet-key {
#flow-graph {
width: 750px;
height: 500px;
- left: 0px;
+}
+
+#flow-executing-graph {
+ width: 750px;
+ height: 500px;
}
src/web/js/azkaban.context.menu.js 105(+55 -50)
diff --git a/src/web/js/azkaban.context.menu.js b/src/web/js/azkaban.context.menu.js
index 0654c2b..0e92dd2 100644
--- a/src/web/js/azkaban.context.menu.js
+++ b/src/web/js/azkaban.context.menu.js
@@ -17,16 +17,18 @@
$.namespace('azkaban');
azkaban.ContextMenuView = Backbone.View.extend({
- events : {
+ events: {
},
- initialize : function(settings) {
+
+ initialize: function(settings) {
var div = this.el;
$('body').click(function(e) {
$(".contextMenu").remove();
});
$('body').bind("contextmenu", function(e) {$(".contextMenu").remove()});
},
- show : function(evt, menu) {
+
+ show: function(evt, menu) {
console.log("Show context menu");
$(".contextMenu").remove();
var x = evt.pageX;
@@ -36,14 +38,17 @@ azkaban.ContextMenuView = Backbone.View.extend({
$(contextMenu).css({top: y, left: x});
$(this.el).after(contextMenu);
},
- hide : function(evt) {
+
+ hide: function(evt) {
console.log("Hide context menu");
$(".contextMenu").remove();
},
- handleClick: function(evt) {
+
+ handleClick: function(evt) {
console.log("handling click");
},
- setupMenu: function(menu) {
+
+ setupMenu: function(menu) {
var contextMenu = document.createElement("div");
$(contextMenu).addClass("contextMenu");
var ul = document.createElement("ul");
@@ -53,51 +58,51 @@ azkaban.ContextMenuView = Backbone.View.extend({
var menuItem = document.createElement("li");
if (menu[i].break) {
$(menuItem).addClass("break");
+ $(ul).append(menuItem);
+ continue;
}
- else {
- var title = menu[i].title;
- var callback = menu[i].callback;
- $(menuItem).addClass("menuitem");
- $(menuItem).text(title);
- menuItem.callback = callback;
- $(menuItem).click(function() {
- $(contextMenu).hide();
- this.callback.call();});
-
- if (menu[i].submenu) {
- var expandSymbol = document.createElement("div");
- $(expandSymbol).addClass("expandSymbol");
- $(menuItem).append(expandSymbol);
-
- var subMenu = this.setupMenu(menu[i].submenu);
- $(subMenu).addClass("subMenu");
- subMenu.parent = contextMenu;
- menuItem.subMenu = subMenu;
- $(subMenu).hide();
- $(this.el).after(subMenu);
-
- $(menuItem).mouseenter(function() {
- $(".subMenu").hide();
- var menuItem = this;
- menuItem.selected = true;
- setTimeout(function() {
- if (menuItem.selected) {
- var offset = $(menuItem).offset();
- var left = offset.left;
- var top = offset.top;
- var width = $(menuItem).width();
- var subMenu = menuItem.subMenu;
-
- var newLeft = left + width - 5;
- $(subMenu).css({left: newLeft, top: top});
- $(subMenu).show();
- }
- }, 500);
- });
- $(menuItem).mouseleave(function() {this.selected = false;});
- }
- }
-
+ var title = menu[i].title;
+ var callback = menu[i].callback;
+ $(menuItem).addClass("menuitem");
+ $(menuItem).text(title);
+ menuItem.callback = callback;
+ $(menuItem).click(function() {
+ $(contextMenu).hide();
+ this.callback.call();
+ });
+
+ if (menu[i].submenu) {
+ var expandSymbol = document.createElement("div");
+ $(expandSymbol).addClass("expandSymbol");
+ $(menuItem).append(expandSymbol);
+
+ var subMenu = this.setupMenu(menu[i].submenu);
+ $(subMenu).addClass("subMenu");
+ subMenu.parent = contextMenu;
+ menuItem.subMenu = subMenu;
+ $(subMenu).hide();
+ $(this.el).after(subMenu);
+
+ $(menuItem).mouseenter(function() {
+ $(".subMenu").hide();
+ var menuItem = this;
+ menuItem.selected = true;
+ setTimeout(function() {
+ if (menuItem.selected) {
+ var offset = $(menuItem).offset();
+ var left = offset.left;
+ var top = offset.top;
+ var width = $(menuItem).width();
+ var subMenu = menuItem.subMenu;
+
+ var newLeft = left + width - 5;
+ $(subMenu).css({left: newLeft, top: top});
+ $(subMenu).show();
+ }
+ }, 500);
+ });
+ $(menuItem).mouseleave(function() {this.selected = false;});
+ }
$(ul).append(menuItem);
}
diff --git a/src/web/js/azkaban.flow.execute.view.js b/src/web/js/azkaban.flow.execute.view.js
index a74f473..d2940e3 100644
--- a/src/web/js/azkaban.flow.execute.view.js
+++ b/src/web/js/azkaban.flow.execute.view.js
@@ -452,7 +452,7 @@ azkaban.SideMenuDialogView = Backbone.View.extend({
var handleJobMenuClick = function(action, el, pos) {
var jobid = el[0].jobid;
- var requestURL = contextURL + "/manager?project=" + projectName + "&flow=" + flowName + "&job=" + jobid;
+ var requesgURL = contextURL + "/manager?project=" + projectName + "&flow=" + flowName + "&job=" + jobid;
if (action == "open") {
window.location.href = requestURL;
}
src/web/js/azkaban.svg.graph.view.js 42(+28 -14)
diff --git a/src/web/js/azkaban.svg.graph.view.js b/src/web/js/azkaban.svg.graph.view.js
index 66f914f..67d2530 100644
--- a/src/web/js/azkaban.svg.graph.view.js
+++ b/src/web/js/azkaban.svg.graph.view.js
@@ -21,7 +21,8 @@ azkaban.SvgGraphView = Backbone.View.extend({
"contextmenu g" : "handleRightClick",
"contextmenu polyline": "handleRightClick"
},
- initialize: function(settings) {
+
+ initialize: function(settings) {
this.model.bind('change:selected', this.changeSelected, this);
this.model.bind('change:graph', this.render, this);
this.model.bind('resetPanZoom', this.resetPanZoom, this);
@@ -46,7 +47,8 @@ azkaban.SvgGraphView = Backbone.View.extend({
$(svg).svgNavigate();
},
- initializeDefs: function(self) {
+
+ initializeDefs: function(self) {
var def = document.createElementNS(svgns, 'defs');
def.setAttributeNS(null, "id", "buttonDefs");
@@ -68,7 +70,8 @@ azkaban.SvgGraphView = Backbone.View.extend({
this.svgGraph.appendChild(def);
},
- render: function(self) {
+
+ render: function(self) {
console.log("graph render");
// Clean everything
@@ -131,7 +134,8 @@ azkaban.SvgGraphView = Backbone.View.extend({
this.graphBounds = bounds;
this.resetPanZoom(0);
},
- handleDisabledChange: function(evt) {
+
+ handleDisabledChange: function(evt) {
var disabledMap = this.model.get("disabled");
for(var id in this.nodes) {
@@ -146,7 +150,8 @@ azkaban.SvgGraphView = Backbone.View.extend({
}
}
},
- assignInitialStatus: function(evt) {
+
+ assignInitialStatus: function(evt) {
var data = this.model.get("data");
for (var i = 0; i < data.nodes.length; ++i) {
var updateNode = data.nodes[i];
@@ -154,7 +159,8 @@ azkaban.SvgGraphView = Backbone.View.extend({
addClass(g, updateNode.status);
}
},
- changeSelected: function(self) {
+
+ changeSelected: function(self) {
console.log("change selected");
var selected = this.model.get("selected");
var previous = this.model.previous("selected");
@@ -184,7 +190,8 @@ azkaban.SvgGraphView = Backbone.View.extend({
});
}
},
- handleStatusUpdate: function(evt) {
+
+ handleStatusUpdate: function(evt) {
var updateData = this.model.get("update");
if (updateData.nodes) {
for (var i = 0; i < updateData.nodes.length; ++i) {
@@ -197,19 +204,22 @@ azkaban.SvgGraphView = Backbone.View.extend({
}
}
},
- handleRemoveAllStatus: function(gNode) {
+
+ handleRemoveAllStatus: function(gNode) {
for (var j = 0; j < statusList.length; ++j) {
var status = statusList[j];
removeClass(gNode, status);
}
},
- clickGraph: function(self) {
+
+ clickGraph: function(self) {
console.log("click");
if (self.currentTarget.jobid) {
this.model.set({"selected": self.currentTarget.jobid});
}
},
- handleRightClick: function(self) {
+
+ handleRightClick: function(self) {
if (this.rightClick) {
var callbacks = this.rightClick;
var currentTarget = self.currentTarget;
@@ -229,7 +239,8 @@ azkaban.SvgGraphView = Backbone.View.extend({
return true;
},
- drawEdge: function(self, edge) {
+
+ drawEdge: function(self, edge) {
var svg = self.svgGraph;
var svgns = self.svgns;
@@ -262,7 +273,8 @@ azkaban.SvgGraphView = Backbone.View.extend({
self.mainG.appendChild(line);
}
},
- drawNode: function(self, node, bounds) {
+
+ drawNode: function(self, node, bounds) {
var svg = self.svgGraph;
var svgns = self.svgns;
@@ -323,7 +335,8 @@ azkaban.SvgGraphView = Backbone.View.extend({
nodeG.setAttributeNS(null, "class", "node");
nodeG.jobid=node.id;
},
- addBounds: function(toBounds, addBounds) {
+
+ addBounds: function(toBounds, addBounds) {
toBounds.minX = toBounds.minX
? Math.min(toBounds.minX, addBounds.minX) : addBounds.minX;
toBounds.minY = toBounds.minY
@@ -333,7 +346,8 @@ azkaban.SvgGraphView = Backbone.View.extend({
toBounds.maxY = toBounds.maxY
? Math.max(toBounds.maxY, addBounds.maxY) : addBounds.maxY;
},
- resetPanZoom : function(duration) {
+
+ resetPanZoom: function(duration) {
var bounds = this.graphBounds;
var param = {
x: bounds.minX,