azkaban-uncached
Details
src/less/bootstrap-azkaban.less 104(+102 -2)
diff --git a/src/less/bootstrap-azkaban.less b/src/less/bootstrap-azkaban.less
index 4c4f380..f7a1fe1 100644
--- a/src/less/bootstrap-azkaban.less
+++ b/src/less/bootstrap-azkaban.less
@@ -142,7 +142,6 @@ table .worksheet-key {
}
}
-
.navbar-logo {
float: left;
padding: 15px 15px;
@@ -312,7 +311,6 @@ table .worksheet-key {
}
}
-
.well-clear {
background-color: transparent;
}
@@ -326,3 +324,105 @@ table .worksheet-key {
width: 750px;
height: 500px;
}
+
+.flow-progress {
+ width: 280px;
+ margin: 4px;
+ background-color: #f5f5f5;
+ height: 24px;
+ border-radius: 4px;
+ -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
+ box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
+}
+
+.flow-progress-bar {
+ height: 100%;
+ background-color: #ccc;
+ border-radius: 4px;
+ -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
+ box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
+ -webkit-transition: width 0.6s ease;
+ transition: width 0.6s ease;
+
+ &.attempt {
+ opacity: 0.70;
+ &:hover {
+ opacity: 1;
+ }
+ }
+
+ &.SUCCEEDED {
+ background-color: #82b859;
+ }
+
+ &.FAILED {
+ background-color: #c82123;
+ }
+
+ &.RUNNING {
+ background-color: #3398cc;
+ background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
+ background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-size: 40px 40px;
+ -webkit-animation: progress-bar-stripes 2s linear infinite;
+ animation: progress-bar-stripes 2s linear infinite;
+ }
+
+ &.QUEUED {
+ background-color: #009fc9;
+ }
+}
+
+td {
+ .status {
+ -moz-border-radius: 2px;
+ border-radius: 2px;
+
+ padding: 2px 2px;
+ color: #FFF;
+ text-align: center;
+ margin-top: 2px;
+
+ &.SUCCEEDED {
+ background-color: #82b859;
+ }
+
+ &.FAILED {
+ background-color: #c82123;
+ }
+
+ &.PAUSED {
+ background-color: #c82123;
+ }
+
+ &.READY {
+ background-color: #ccc;
+ }
+
+ &.RUNNING {
+ background-color: #3398cc;
+ }
+
+ &.FAILED_FINISHING {
+ background-color: #f19153;
+ }
+
+ &.DISABLED {
+ background-color: #aaa;
+ }
+
+ &.SKIPPED {
+ background-color: #aaa;
+ }
+
+ &.KILLED {
+ background-color: #cc0000;
+ }
+
+ &.UNKNOWN {
+ background-color: #ccc;
+ }
+ }
+}
src/web/js/azkaban.exflow.view.js 129(+65 -64)
diff --git a/src/web/js/azkaban.exflow.view.js b/src/web/js/azkaban.exflow.view.js
index 4672d9c..0209a2c 100644
--- a/src/web/js/azkaban.exflow.view.js
+++ b/src/web/js/azkaban.exflow.view.js
@@ -275,7 +275,7 @@ var mainSvgGraphView;
var executionListView;
azkaban.ExecutionListView = Backbone.View.extend({
events: {
- //"click .progressBox": "handleProgressBoxClick"
+ //"click .flow-progress-bar": "handleProgressBoxClick"
},
initialize: function(settings) {
@@ -323,67 +323,68 @@ azkaban.ExecutionListView = Backbone.View.extend({
for (var i = 0; i < nodes.length; ++i) {
var node = nodes[i];
- if (node.startTime > -1) {
- var nodeId = node.id.replace(".", "\\\\.");
- var row = document.getElementById(nodeId + "-row");
- if (!row) {
- this.addNodeRow(node);
- }
-
- var div = $("#" + nodeId + "-status-div");
- div.text(statusStringMap[node.status]);
- $(div).attr("class", "status " + node.status);
-
- var startdate = new Date(node.startTime);
- $("#" + nodeId + "-start").text(getDateFormat(startdate));
-
- var endTime = node.endTime;
- if (node.endTime == -1) {
- $("#" + nodeId + "-end").text("-");
- endTime = node.startTime + 1;
- }
- else {
- var enddate = new Date(node.endTime);
- $("#" + nodeId + "-end").text(getDateFormat(enddate));
- }
-
- var progressBar = $("#" + nodeId + "-progressbar");
- if (!progressBar.hasClass(node.status)) {
- for (var j = 0; j < statusList.length; ++j) {
- var status = statusList[j];
- progressBar.removeClass(status);
- }
- progressBar.addClass(node.status);
- }
-
- // Create past attempts
- if (node.pastAttempts) {
- for (var a = 0; a < node.pastAttempts.length; ++a) {
- var attemptBarId = nodeId + "-progressbar-" + a;
- var attempt = node.pastAttempts[a];
- if ($("#" + attemptBarId).length == 0) {
- var attemptBox = document.createElement("div");
- $(attemptBox).attr("id", attemptBarId);
- $(attemptBox).addClass("progressBox");
- $(attemptBox).addClass("attempt");
- $(attemptBox).addClass(attempt.status);
- $(attemptBox).css("float","left");
- $(attemptBox).bind("contextmenu", attemptRightClick);
- $(progressBar).before(attemptBox);
- attemptBox.job = nodeId;
- attemptBox.attempt = a;
- }
- }
- }
-
- if (node.endTime == -1) {
- //$("#" + node.id + "-elapse").text("0 sec");
- $("#" + nodeId + "-elapse").text(getDuration(node.startTime, (new Date()).getTime()));
- }
- else {
- $("#" + nodeId + "-elapse").text(getDuration(node.startTime, node.endTime));
- }
- }
+ if (node.startTime < 0) {
+ continue;
+ }
+ var nodeId = node.id.replace(".", "\\\\.");
+ var row = document.getElementById(nodeId + "-row");
+ if (!row) {
+ this.addNodeRow(node);
+ }
+
+ var div = $("#" + nodeId + "-status-div");
+ div.text(statusStringMap[node.status]);
+ $(div).attr("class", "status " + node.status);
+
+ var startdate = new Date(node.startTime);
+ $("#" + nodeId + "-start").text(getDateFormat(startdate));
+
+ var endTime = node.endTime;
+ if (node.endTime == -1) {
+ $("#" + nodeId + "-end").text("-");
+ endTime = node.startTime + 1;
+ }
+ else {
+ var enddate = new Date(node.endTime);
+ $("#" + nodeId + "-end").text(getDateFormat(enddate));
+ }
+
+ var progressBar = $("#" + nodeId + "-progressbar");
+ if (!progressBar.hasClass(node.status)) {
+ for (var j = 0; j < statusList.length; ++j) {
+ var status = statusList[j];
+ progressBar.removeClass(status);
+ }
+ progressBar.addClass(node.status);
+ }
+
+ // Create past attempts
+ if (node.pastAttempts) {
+ for (var a = 0; a < node.pastAttempts.length; ++a) {
+ var attemptBarId = nodeId + "-progressbar-" + a;
+ var attempt = node.pastAttempts[a];
+ if ($("#" + attemptBarId).length == 0) {
+ var attemptBox = document.createElement("div");
+ $(attemptBox).attr("id", attemptBarId);
+ $(attemptBox).addClass("flow-progress-bar");
+ $(attemptBox).addClass("attempt");
+ $(attemptBox).addClass(attempt.status);
+ $(attemptBox).css("float","left");
+ $(attemptBox).bind("contextmenu", attemptRightClick);
+ $(progressBar).before(attemptBox);
+ attemptBox.job = nodeId;
+ attemptBox.attempt = a;
+ }
+ }
+ }
+
+ if (node.endTime == -1) {
+ //$("#" + node.id + "-elapse").text("0 sec");
+ $("#" + nodeId + "-elapse").text(getDuration(node.startTime, (new Date()).getTime()));
+ }
+ else {
+ $("#" + nodeId + "-elapse").text(getDuration(node.startTime, node.endTime));
+ }
}
},
@@ -479,12 +480,12 @@ azkaban.ExecutionListView = Backbone.View.extend({
var outerProgressBar = document.createElement("div");
$(outerProgressBar).attr("id", node.id + "-outerprogressbar");
- $(outerProgressBar).addClass("outerProgress");
+ $(outerProgressBar).addClass("flow-progress");
var progressBox = document.createElement("div");
progressBox.job = node.id;
$(progressBox).attr("id", node.id + "-progressbar");
- $(progressBox).addClass("progressBox");
+ $(progressBox).addClass("flow-progress-bar");
$(outerProgressBar).append(progressBox);
$(tdTimeline).append(outerProgressBar);
$(tdTimeline).addClass("timeline");