azkaban-uncached
Changes
src/web/css/bootstrap-azkaban.css 3(+3 -0)
src/web/js/azkaban.flow.execute.view.js 68(+29 -39)
src/web/js/azkaban.project.view.js 2(+1 -1)
Details
diff --git a/src/java/azkaban/webapp/servlet/velocity/flowexecutionpanel.vm b/src/java/azkaban/webapp/servlet/velocity/flowexecutionpanel.vm
index bc4df20..2935834 100644
--- a/src/java/azkaban/webapp/servlet/velocity/flowexecutionpanel.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/flowexecutionpanel.vm
@@ -21,166 +21,163 @@
<script type="text/javascript" src="${context}/js/azkaban.svg.graph.view.js"></script>
<script type="text/javascript" src="${context}/js/azkaban.flow.execute.view.js"></script>
- <div class="modal fade" id="execute-flow-panel">
+ <div class="modal modal-wide fade" id="execute-flow-panel">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="execute-flow-panel-title"></h4>
</div><!-- /modal-header -->
- <div class="modal-body">
- <div class="row">
- <div class="col-sm-4">
- <ul class="nav nav-stacked" id="graph-options">
- <li id="flow-option" viewpanel="svg-div-custom">
- Flow View
- <small>Right click on the jobs to disable and enable jobs in the flow.</small>
- </li>
- <li viewpanel="notification-panel">
- Notification
- <small>Change the address where success and failure emails will be sent.</small>
- </li>
- <li viewpanel="failure-options">
- Failure Options
- <small>Select flow behavior when a failure is detected.</small>
- </li>
- <li viewpanel="concurrent-panel">
- Concurrent
- <small>Change the behavior of the flow if it is already running.</small>
- </li>
- <li viewpanel="flow-parameters-panel">
- Flow Parameters
- <small>Add temporary flow parameters that are used to override global settings for each job.</p>
- </li>
- </ul>
- </div><!-- /col-sm-4 -->
- <div class="col-sm-8">
- <div id="execution-graph-options-panel">
-
- ## SVG graph panel.
-
- <div id="svg-div-custom">
- <svg class="svgGraph" xmlns="http://www.w3.org/2000/svg" version="1.1" shape-rendering="optimize-speed" text-rendering="optimize-speed">
- </svg>
+ <div class="modal-body row">
+ <div class="col-md-4">
+ <ul class="nav nav-pills nav-stacked" id="graph-options">
+ <li id="flow-option" viewpanel="svg-div-custom">
+ <a href="#">Flow View</a>
+ <small>Right click on the jobs to disable and enable jobs in the flow.</small>
+ </li>
+ <li viewpanel="notification-panel">
+ <a href="#">Notification</a>
+ <small>Change the address where success and failure emails will be sent.</small>
+ </li>
+ <li viewpanel="failure-options">
+ <a href="#">Failure Options</a>
+ <small>Select flow behavior when a failure is detected.</small>
+ </li>
+ <li viewpanel="concurrent-panel">
+ <a href="#">Concurrent</a>
+ <small>Change the behavior of the flow if it is already running.</small>
+ </li>
+ <li viewpanel="flow-parameters-panel">
+ <a href="#">Flow Parameters</a>
+ <small>Add temporary flow parameters that are used to override global settings for each job.</p>
+ </li>
+ </ul>
+ </div><!-- /col-md-4 -->
+ <div class="col-md-8">
+ <div id="execution-graph-options-panel">
+
+## 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>
+ </div>
+
+## Notification panel.
+
+ <div id="notification-panel" class="side-panel">
+ <h4>Notify on failure</h4>
+ <p>On a job failure, notify on either the first failure, and/or when the failed flow finishes.</p>
+ <label class="checkbox-inline">
+ <input id="notify-failure-first" type="checkbox" name="notify" value="first">First failure
+ </label>
+ <label class="checkbox-inline">
+ <input id="notify-failure-last" type="checkbox" name="notify" value="last">Flow finished
+ </label>
+
+ <h4>Failure Emails</h4>
+ <div class="checkbox">
+ <label>
+ <input type="checkbox" id="override-failure-emails" name="overrideFailureEmails" value="overrideFailureEmails">
+ Override flow email settings.
+ </label>
</div>
-
- ## Notification panel.
-
- <div id="notification-panel">
- <h4>Notify on failure</h4>
- <p>On a job failure, notify on either the first failure, and/or when the failed flow finishes.</p>
- <label class="checkbox-inline">
- <input id="notify-failure-first" type="checkbox" name="notify" value="first">First failure
+ <label>Notify these addresses on failure. Comma, space, or semi-colon delimited list.</label>
+ <textarea class="form-control" rows="3" id="failure-emails"></textarea>
+
+ <h4>Success Emails</h4>
+ <div class="checkbox">
+ <label>
+ <input type="checkbox" name="overrideSuccessEmails" value="overrideSuccessEmails">
+ Override flow email settings.
</label>
- <label class="checkbox-inline">
- <input id="notify-failure-last" type="checkbox" name="notify" value="last">Flow finished
+ </div>
+ <label>Notify when the flow finishes successfully. Comma, space, or semi-colon delimited list.</label>
+ <textarea class="form-control" rows="3" id="success-emails"></textarea>
+ </div>
+
+## Failure options panel.
+
+ <div id="failure-options" class="side-panel">
+ <h4>Failure Options</h4>
+ <p>When a failure first occurs in the flow, select the execution behavior.</p>
+ <ul>
+ <li><strong>Finish Current Running</strong> finishes only the currently running job. It will not start any new jobs.</li>
+ <li><strong>Cancel All</strong> immediately kills all jobs and fails the flow.</li>
+ <li><strong>Finish All Possible</strong> will keep executing jobs as long as its dependencies are met.</li>
+ </ul>
+ <select id="failure-action" name="failureAction">
+ <option value="finishCurrent">Finish Current Running</option>
+ <option value="cancelImmediately">Cancel All</option>
+ <option value="finishPossible">Finish All Possible</option>
+ </select>
+ </div>
+
+## Concurrent execution options panel.
+
+ <div id="concurrent-panel" class="side-panel">
+ <h4>Concurrent Execution Options</h4>
+ <p>If the flow is currently running, these are the options that can be set.</p>
+ <div class="radio">
+ <label>
+ <input type="radio" id="skip" name="concurrent" value="skip" checked="checked">
+ Skip Execution
</label>
-
- <h4>Failure Emails</h4>
- <div class="checkbox">
- <label>
- <input type="checkbox" id="override-failure-emails" name="overrideFailureEmails" value="overrideFailureEmails">
- Override flow email settings.
- </label>
- </div>
- <label>Notify these addresses on failure. Comma, space, or semi-colon delimited list.</label>
- <textarea class="form-control" rows="3" id="failure-emails"></textarea>
-
- <h4>Success Emails</h4>
- <div class="checkbox">
- <label>
- <input type="checkbox" name="overrideSuccessEmails" value="overrideSuccessEmails">
- Override flow email settings.
- </label>
- </div>
- <label>Notify when the flow finishes successfully. Comma, space, or semi-colon delimited list.</label>
- <textarea class="form-control" rows="3" id="success-emails"></textarea>
+ <span class="help-block">Do not run flow if it is already running.</span>
</div>
- ## Failure options panel.
-
- <div id="failure-options">
- <h4>Failure Options</h4>
- <p>When a failure first occurs in the flow, select the execution behavior.</p>
- <ul>
- <li><strong>Finish Current Running</strong> finishes only the currently running job. It will not start any new jobs.</li>
- <li><strong>Cancel All</strong> immediately kills all jobs and fails the flow.</li>
- <li><strong>Finish All Possible</strong> will keep executing jobs as long as its dependencies are met.</li>
- </ul>
- <select id="failure-action" name="failureAction">
- <option value="finishCurrent">Finish Current Running</option>
- <option value="cancelImmediately">Cancel All</option>
- <option value="finishPossible">Finish All Possible</option>
- </select>
+ <div class="radio">
+ <label>
+ <input type="radio" id="ignore" name="concurrent" value="ignore">
+ Run Concurrently
+ </label>
+ <span class="help-block">Do not run flow if it is already running.</span>
</div>
- ## Concurrent execution options panel.
-
- <div id="concurrent-panel">
- <h4>Concurrent Execution Options</h4>
- <p>If the flow is currently running, these are the options that can be set.</p>
- <div class="radio">
- <label>
- <input type="radio" id="skip" name="concurrent" value="skip" checked="checked">
- Skip Execution
- </label>
- <span class="help-block">Do not run flow if it is already running.</span>
- </div>
-
- <div class="radio">
- <label>
- <input type="radio" id="ignore" name="concurrent" value="ignore">
- Run Concurrently
- </label>
- <span class="help-block">Do not run flow if it is already running.</span>
- </div>
-
- <div class="radio">
- <label>
- <input type="radio" id="pipeline" name="concurrent" value="pipeline">
- Pipeline
- </label>
- <select id="pipelineLevel" name="pipelineLevel">
- <option value="1">Level 1</option>
- <option value="2">Level 2</option>
- </select>
- <span class="help-block">
- Pipeline the flow, so the current execution will not be overrun.
- <ul>
- <li>Level 1: block job A until the previous flow job A has completed.</li>
- <li>Level 2: block job A until the previous flow job A's children have completed.</li>
- </li>
- </span>
- </div>
+ <div class="radio">
+ <label>
+ <input type="radio" id="pipeline" name="concurrent" value="pipeline">
+ Pipeline
+ </label>
+ <select id="pipelineLevel" name="pipelineLevel">
+ <option value="1">Level 1</option>
+ <option value="2">Level 2</option>
+ </select>
+ <span class="help-block">
+ Pipeline the flow, so the current execution will not be overrun.
+ <ul>
+ <li>Level 1: block job A until the previous flow job A has completed.</li>
+ <li>Level 2: block job A until the previous flow job A's children have completed.</li>
+ </li>
+ </span>
</div>
+ </div>
## Flow parameters panel
- <div id="flow-parameters-panel">
- <h4>Flow Property Override</h4>
- <div id="editTable">
- <table>
- <thead>
- <tr>
- <th>Name</th>
- <th>Value</th>
- </tr>
- </thead>
- <tbody>
- <tr id="addRow" class="addRow">
- <td id="addRow-col" colspan="2">
- <span class="addIcon"></span>
- <a>Add Row</a>
- </td>
- </tr>
- </tbody>
- </table>
- </div>
+ <div id="flow-parameters-panel" class="side-panel">
+ <h4>Flow Property Override</h4>
+ <div id="editTable">
+ <table>
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Value</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr id="addRow" class="addRow">
+ <td id="addRow-col" colspan="2">
+ <button type="button" class="btn btn-success btn-xs">Add Row</button>
+ </td>
+ </tr>
+ </tbody>
+ </table>
</div>
+ </div>
- </div><!-- /execution-graph-options-panel -->
- </div><!-- /col-sm-8 -->
- </div><!-- /row -->
+ </div><!-- /execution-graph-options-panel -->
+ </div><!-- /col-md-8 -->
</div><!-- /modal-body -->
<div class="modal-footer">
diff --git a/src/java/azkaban/webapp/servlet/velocity/projectpage.vm b/src/java/azkaban/webapp/servlet/velocity/projectpage.vm
index 9622744..04262f6 100644
--- a/src/java/azkaban/webapp/servlet/velocity/projectpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/projectpage.vm
@@ -98,7 +98,7 @@
</div>
<div class="panel-footer">
#if (${exec})
- <button type="button" class="btn btn-primary" flowId="${flow.id}">Execute Flow</button>
+ <button type="button" class="btn btn-primary execute-flow" flowId="${flow.id}">Execute Flow</button>
#end
</div>
</div>
@@ -134,7 +134,7 @@
<div class="well well-sm">
<ul class="nav nav-pills nav-stacked">
<li class="active"><a href="${context}/manager?project=${project.name}">Project</a></li>
- <li><a id="project-permission-btn" href="${context}/manager?project=${project.name}&permissions">Permissions</a></li>
+ <li><a id="project-permission-btn" href="${context}/manager?project=${project.name}&permissions">Permissions</a></li>
#if ($admin)
<li><a id="project-logs-btn" href="${context}/manager?project=${project.name}&logs">Project Logs</a></li>
#end
diff --git a/src/java/azkaban/webapp/servlet/velocity/style2.vm b/src/java/azkaban/webapp/servlet/velocity/style2.vm
index 226ea13..9a88bbe 100644
--- a/src/java/azkaban/webapp/servlet/velocity/style2.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/style2.vm
@@ -21,6 +21,7 @@
<!-- Bootstrap core CSS -->
<link href="/css/bootstrap.min.css" rel="stylesheet">
<link href="/css/bootstrap-fileinput.css" rel="stylesheet">
+ <link href="/css/bootstrap-azkaban.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
src/web/css/bootstrap-azkaban.css 3(+3 -0)
diff --git a/src/web/css/bootstrap-azkaban.css b/src/web/css/bootstrap-azkaban.css
new file mode 100644
index 0000000..28c7804
--- /dev/null
+++ b/src/web/css/bootstrap-azkaban.css
@@ -0,0 +1,3 @@
+.modal-wide .modal-dialog {
+ width: 80%; /* or whatever you wish */
+}
src/web/js/azkaban.flow.execute.view.js 68(+29 -39)
diff --git a/src/web/js/azkaban.flow.execute.view.js b/src/web/js/azkaban.flow.execute.view.js
index 6145eee..f8baa7c 100644
--- a/src/web/js/azkaban.flow.execute.view.js
+++ b/src/web/js/azkaban.flow.execute.view.js
@@ -241,7 +241,7 @@ azkaban.FlowExecuteDialogView = Backbone.View.extend({
},
showExecuteJob: function(projectName, flowId, jobId, withDep) {
- sideMenuDialogView.menuSelect($("#flowOption"));
+ sideMenuDialogView.menuSelect($("#flow-option"));
$("#execute-flow-panel-title").text("Execute Flow " + flowId);
var nodes = this.model.get("nodeMap");
@@ -264,9 +264,8 @@ azkaban.FlowExecuteDialogView = Backbone.View.extend({
},
showExecutionOptionPanel: function() {
- sideMenuDialogView.menuSelect($("#flowOption"));
- $('#modalBackground').show();
- $('#execute-flow-panel').show();
+ sideMenuDialogView.menuSelect($("#flow-option"));
+ $('#execute-flow-panel').modal();
},
hideExecutionOptionPanel: function() {
@@ -404,56 +403,41 @@ azkaban.EditTableView = Backbone.View.extend({
var sideMenuDialogView;
azkaban.SideMenuDialogView = Backbone.View.extend({
events: {
- "click .menuHeader": "menuClick"
+ "click .menu-header": "menuClick"
},
+
initialize: function(settings) {
var children = $(this.el).children();
- var currentParent;
- var parents = [];
- var realChildren = [];
for (var i = 0; i < children.length; ++i ) {
var child = children[i];
- if ((i % 2) == 0) {
- currentParent = child;
- $(child).addClass("menuHeader");
- parents.push(child);
- }
- else {
- $(child).addClass("menuContent");
- $(child).hide();
- currentParent.child = child;
- realChildren.push(child);
- }
+ $(child).addClass("menu-header");
+ var caption = $(child).find("small");
+ $(caption).addClass("menu-caption");
+ $(caption).hide();
}
-
- this.menuSelect($("#flowOption"));
-
- this.parents = parents;
- this.children = realChildren;
+ this.menuSelect($("#flow-option"));
},
+
menuClick: function(evt) {
this.menuSelect(evt.currentTarget);
},
+
menuSelect: function(target) {
- if ($(target).hasClass("selected")) {
+ if ($(target).hasClass("active")) {
return;
}
- $(".sidePanel").each(function() {
+ $(".side-panel").each(function() {
$(this).hide();
});
- $(".menuHeader").each(function() {
- $(this.child).slideUp("fast");
- $(this).removeClass("selected");
- });
-
- $(".sidePanel").each(function() {
- $(this).hide();
+ $(".menu-header").each(function() {
+ $(this).find("small").slideUp("fast");
+ $(this).removeClass("active");
});
- $(target).addClass("selected");
- $(target.child).slideDown("fast");
+ $(target).addClass("active");
+ $(target).find("small").slideDown("fast");
var panelName = $(target).attr("viewpanel");
$("#" + panelName).show();
}
@@ -609,7 +593,7 @@ $(function() {
svgGraphView = new azkaban.SvgGraphView({
el: $('#svg-div-custom'),
model: executableGraphModel,
- topGId:"topG",
+ topGId: "topG",
graphMargin: 10,
rightClick: {
"node": nodeClickCallback,
@@ -618,8 +602,14 @@ $(function() {
}
});
- sideMenuDialogView = new azkaban.SideMenuDialogView({el:$('#graphOptions')});
- editTableView = new azkaban.EditTableView({el:$('#editTable')});
+ sideMenuDialogView = new azkaban.SideMenuDialogView({
+ el: $('#graph-options')
+ });
+ editTableView = new azkaban.EditTableView({
+ el: $('#editTable')
+ });
- contextMenuView = new azkaban.ContextMenuView({el:$('#contextMenu')});
+ contextMenuView = new azkaban.ContextMenuView({
+ el: $('#contextMenu')
+ });
});
src/web/js/azkaban.project.view.js 2(+1 -1)
diff --git a/src/web/js/azkaban.project.view.js b/src/web/js/azkaban.project.view.js
index 0adf955..a9ba1ed 100644
--- a/src/web/js/azkaban.project.view.js
+++ b/src/web/js/azkaban.project.view.js
@@ -85,7 +85,7 @@ azkaban.FlowTableView = Backbone.View.extend({
"mouseout .expandedFlow a": "unhighlight",
"click .runJob": "runJob",
"click .runWithDep": "runWithDep",
- "click .executeFlow": "executeFlow",
+ "click .execute-flow": "executeFlow",
"click .viewFlow": "viewFlow",
"click .viewJob": "viewJob"
},