azkaban-uncached
Changes
src/less/bootstrap-azkaban.less 30(+23 -7)
src/web/js/azkaban.projectmodals.view.js 104(+59 -45)
Details
diff --git a/src/java/azkaban/webapp/servlet/velocity/flowpage.vm b/src/java/azkaban/webapp/servlet/velocity/flowpage.vm
index 376d30c..a8d86f9 100644
--- a/src/java/azkaban/webapp/servlet/velocity/flowpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/flowpage.vm
@@ -91,7 +91,7 @@
</div>
<div class="col-lg-6">
<div class="pull-right az-page-header-form">
- <button type="button" class="btn btn-success" id="executebtn">Schedule / Execute Flow</button>
+ <button type="button" class="btn btn-sm btn-success" id="executebtn">Schedule / Execute Flow</button>
</div>
<div class="clearfix"></div>
</div>
diff --git a/src/java/azkaban/webapp/servlet/velocity/jobhistorypage.vm b/src/java/azkaban/webapp/servlet/velocity/jobhistorypage.vm
index 7a58cf6..3ca1afb 100644
--- a/src/java/azkaban/webapp/servlet/velocity/jobhistorypage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/jobhistorypage.vm
@@ -88,85 +88,75 @@
<div class="az-page-header">
<div class="container">
- <h1>
- <a href="${context}/manager?project=${project.name}">$project.name</a> /
- <a href="${context}/manager?project=${project.name}&flow=${flowid}">$flowid</a>
- </h1>
+ <h1><a href="${context}/manager?project=${projectName}&job=${jobid}&history">Job History <small>$jobid</small></a></h1>
</div>
</div>
<div class="container">
- <div class="row">
- <div class="col-lg-8">
- ## Breadcrumb
+ ## Breadcrumb
- <ol class="breadcrumb">
- <li><a href="${context}/manager?project=${project.name}"><strong>Project</strong> $project.name</a></li>
- <li><a href="${context}/manager?project=${project.name}&flow=${flowid}"><strong>Flow</strong> $flowid</a></li>
- <li><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}"><strong>Job</strong> $jobid</a></li>
- </ol>
-
- #set ($job_page="history")
- #parse ("azkaban/webapp/servlet/velocity/jobnav.vm")
-
- <div class="panel panel-default">
- <div class="panel-heading">Job History</div>
- <div class="panel-body">
- <div id="timeGraph"></div>
- </div>
-
- <table id="all-jobs" class="table table-striped table-bordered">
- <thead>
- <tr>
- <th class="execid">Execution Id</th>
- <th class="jobid">Job</th>
- <th class="flowid">Flow</th>
- <th class="date">Start Time</th>
- <th class="date">End Time</th>
- <th class="elapse">Elapse</th>
- <th class="status">Status</th>
- <th class="logs">Logs</th>
- </tr>
- </thead>
- <tbody>
+ <ol class="breadcrumb">
+ <li><a href="${context}/manager?project=${projectName}"><strong>Project</strong> $projectName</a></li>
+ <li class="active"><strong>Job History</strong> $jobid</li>
+ </ol>
+
+ <div class="row">
+ <div class="col-lg-12">
+ <div class="well well-clear well-sm">
+ <div id="timeGraph"></div>
+ </div>
+
+ <table id="all-jobs" class="table table-striped table-bordered table-condensed table-hover">
+ <thead>
+ <tr>
+ <th class="execid">Execution Id</th>
+ <th class="jobid">Job</th>
+ <th class="flowid">Flow</th>
+ <th class="date">Start Time</th>
+ <th class="date">End Time</th>
+ <th class="elapse">Elapse</th>
+ <th class="status">Status</th>
+ <th class="logs">Logs</th>
+ </tr>
+ </thead>
+ <tbody>
#if ($history)
#foreach ($job in $history)
- <tr>
- <td class="first">
+ <tr>
+ <td class="first">
#if ($job.attempt > 0)
- <a href="${context}/executor?execid=${job.execId}">${job.execId}.${job.attempt}</a>
+ <a href="${context}/executor?execid=${job.execId}">${job.execId}.${job.attempt}</a>
#else
- <a href="${context}/executor?execid=${job.execId}">${job.execId}</a>
+ <a href="${context}/executor?execid=${job.execId}">${job.execId}</a>
#end
- </td>
- <td>
- <a href="${context}/manager?project=${projectName}&flow=${job.flowId}&job=${jobid}">${jobid}</a>
- </td>
- <td>
- <a href="${context}/manager?project=${projectName}&flow=${job.flowId}">${job.flowId}</a>
- </td>
- <td>$utils.formatDate(${job.startTime})</td>
- <td>$utils.formatDate(${job.endTime})</td>
- <td>$utils.formatDuration(${job.startTime}, ${job.endTime})</td>
- <td>
- <div class="status ${job.status}">
- $utils.formatStatus(${job.status})
- </div>
- </td>
- <td class="logLink">
- <a href="${context}/executor?execid=${job.execId}&job=${jobid}&attempt=${job.attempt}">Logs</a>
- </td>
- </tr>
+ </td>
+ <td>
+ <a href="${context}/manager?project=${projectName}&flow=${job.flowId}&job=${jobid}">${jobid}</a>
+ </td>
+ <td>
+ <a href="${context}/manager?project=${projectName}&flow=${job.flowId}">${job.flowId}</a>
+ </td>
+ <td>$utils.formatDate(${job.startTime})</td>
+ <td>$utils.formatDate(${job.endTime})</td>
+ <td>$utils.formatDuration(${job.startTime}, ${job.endTime})</td>
+ <td>
+ <div class="status ${job.status}">
+ $utils.formatStatus(${job.status})
+ </div>
+ </td>
+ <td class="logLink">
+ <a href="${context}/executor?execid=${job.execId}&job=${jobid}&attempt=${job.attempt}">Logs</a>
+ </td>
+ </tr>
#end
#else
- <tr>
- <td colspan="8">No history</td>
- </tr>
+ <tr>
+ <td colspan="8">No history</td>
+ </tr>
#end
- </tbody>
- </table>
- </div>
+ </tbody>
+ </table>
<ul class="pagination" id="pageSelection">
<li id="previous" class="first"><a href="${context}/manager?project=${projectId}&job=${jobid}&history&page=${previous.page}&size=${previous.size}"><span class="arrow">←</span>Previous</a></li>
@@ -178,11 +168,8 @@
<li id="next"><a href="${context}/manager?project=${projectName}&job=${jobid}&history&page=${next.page}&size=${next.size}">Next<span class="arrow">→</span></a></li>
</ul>
- </div><!-- /col-lg-8 -->
- <div class="col-lg-4">
- #parse ("azkaban/webapp/servlet/velocity/jobsidebar.vm")
- </div><!-- /col-lg-4 -->
- </div><!-- /row -->
+ </div><!-- /.col-lg-12 -->
+ </div><!-- /.row -->
#end
#parse ("azkaban/webapp/servlet/velocity/footer.vm")
diff --git a/src/java/azkaban/webapp/servlet/velocity/jobpage.vm b/src/java/azkaban/webapp/servlet/velocity/jobpage.vm
index 0326037..c1c278a 100644
--- a/src/java/azkaban/webapp/servlet/velocity/jobpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/jobpage.vm
@@ -68,7 +68,17 @@
<div class="az-page-header">
<div class="container">
- <h1><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}">Job <small>$jobid</small></a></h1>
+ <div class="row">
+ <div class="col-lg-6">
+ <h1><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}">Job <small>$jobid</small></a></h1>
+ </div>
+ <div class="col-lg-6">
+ <div class="pull-right az-page-header-form">
+ <a href="${context}/manager?project=${project.name}&job=$jobid&history" class="btn btn-default btn-sm">History</a>
+ </div>
+ <div class="clearfix"></div>
+ </div>
+ </div>
</div>
</div>
@@ -85,9 +95,6 @@
<div class="row">
<div class="col-lg-8">
- #set ($job_page="properties")
- #parse ("azkaban/webapp/servlet/velocity/jobnav.vm")
-
## Job details table
<div class="panel panel-default">
@@ -116,7 +123,60 @@
</div>
</div><!-- /col-lg-8 -->
<div class="col-lg-4">
- #parse ("azkaban/webapp/servlet/velocity/jobsidebar.vm")
+ <div class="well" id="job-summary">
+ <h3>Job <small>$jobid</small></h3>
+ <p><strong>Job Type</strong> $jobtype</p>
+ </div>
+
+ ## Dependencies
+
+ <div class="panel panel-default">
+ <div class="panel-heading">Dependencies</div>
+ <ul class="list-group">
+ #if ($dependencies)
+ #foreach($dependency in $dependencies)
+ <li class="list-group-item">
+ <a href="${context}/manager?project=${project.name}&flow=${flowid}&job=$dependency">$dependency</a>
+ </li>
+ #end
+ #else
+ <li class="list-group-item">No Dependencies</li>
+ #end
+ </ul>
+ </div><!-- /panel -->
+
+ ## Dependents
+
+ <div class="panel panel-default">
+ <div class="panel-heading">Dependents</div>
+ <ul class="list-group">
+ #if ($dependents)
+ #foreach($dependent in $dependents)
+ <li class="list-group-item">
+ <a href="${context}/manager?project=${project.name}&flow=${flowid}&job=$dependent">$dependent</a>
+ </li>
+ #end
+ #else
+ <li class="list-group-item">No Dependencies</li>
+ #end
+
+ </ul>
+ </div><!-- /panel -->
+
+ <div class="panel panel-default">
+ <div class="panel-heading">Properties</div>
+ <ul class="list-group">
+ #if ($properties)
+ #foreach($property in $properties)
+ <li class="list-group-item">
+ <a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}&prop=$property">$property</a>
+ </li>
+ #end
+ #else
+ <li class="list-group-item">No Property Files For This Job</li>
+ #end
+ </ul>
+ </div><!-- /panel -->
</div><!-- /col-lg-4 -->
</div><!-- /row -->
diff --git a/src/java/azkaban/webapp/servlet/velocity/permissionspage.vm b/src/java/azkaban/webapp/servlet/velocity/permissionspage.vm
index edd848d..5493c33 100644
--- a/src/java/azkaban/webapp/servlet/velocity/permissionspage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/permissionspage.vm
@@ -236,7 +236,7 @@
<tr>
<td class="tb-username">#if($proxyUser == $username) ${proxyUser} <span class="sublabel">(you)</span> #else $proxyUser #end</td>
#if ($isAdmin)
- <td><button id="proxy-${proxyUser}" name="${proxyUser}" class="btn btn-xs btn-primary">Remove</button></td>
+ <td><button id="proxy-${proxyUser}" name="${proxyUser}" class="btn btn-xs btn-danger">Remove</button></td>
#end
</tr>
#end
@@ -268,7 +268,7 @@
</div>
<div class="modal-body">
<div class="alert alert-danger" id="remove-proxy-error-msg"></div>
- <p>Removing Proxy User</p>
+ <p><strong>Warning:</strong> Removing Proxy User</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
@@ -325,26 +325,28 @@
</div>
</div>
<div class="form-group">
- <label class="checkbox-inline">
- <input id="admin-change" name="admin" type="checkbox">
- Admin
- </label>
- <label class="checkbox-inline">
- <input id="read-change" name="read" type="checkbox">
- Read
- </label>
- <label class="checkbox-inline">
- <input id="write-change" name="write" type="checkbox">
- Write
- </label>
- <label class="checkbox-inline">
- <input id="execute-change" name="execute" type="checkbox">
- Execute
- </label>
- <label class="checkbox-inline">
- <input id="schedule-change" name="schedule" type="checkbox">
- Schedule
- </label>
+ <div class="col-sm-offset-2 col-sm-10">
+ <label class="checkbox-inline">
+ <input id="admin-change" name="admin" type="checkbox">
+ Admin
+ </label>
+ <label class="checkbox-inline">
+ <input id="read-change" name="read" type="checkbox">
+ Read
+ </label>
+ <label class="checkbox-inline">
+ <input id="write-change" name="write" type="checkbox">
+ Write
+ </label>
+ <label class="checkbox-inline">
+ <input id="execute-change" name="execute" type="checkbox">
+ Execute
+ </label>
+ <label class="checkbox-inline">
+ <input id="schedule-change" name="schedule" type="checkbox">
+ Schedule
+ </label>
+ </div>
</div>
</fieldset>
</div>
diff --git a/src/java/azkaban/webapp/servlet/velocity/projectpageheader.vm b/src/java/azkaban/webapp/servlet/velocity/projectpageheader.vm
index 5fda594..4eddc0f 100644
--- a/src/java/azkaban/webapp/servlet/velocity/projectpageheader.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/projectpageheader.vm
@@ -17,9 +17,17 @@
<div class="az-page-header">
<div class="container">
<div class="row">
- <div class="col-lg-6">
+ <div class="col-lg-6" id="project-page-header">
<h1><a href="${context}/manager?project=${project.name}">Project <small>$project.name</small></a></h1>
- <p>$project.description</p>
+ <p class="editable" id="project-description">$project.description</p>
+ <div id="project-description-form" class="editable-form">
+ <div class="input-group">
+ <input type="text" class="form-control input-sm" id="project-description-edit" placeholder="Project description">
+ <span class="input-group-btn">
+ <button class="btn btn-primary btn-sm" type="button" id="project-description-btn">Save</button>
+ </span>
+ </div>
+ </div>
</div>
<div class="col-lg-6">
<div class="pull-right az-page-header-form" id="project-options">
diff --git a/src/java/azkaban/webapp/servlet/velocity/propertypage.vm b/src/java/azkaban/webapp/servlet/velocity/propertypage.vm
index e9af077..f23f4e7 100644
--- a/src/java/azkaban/webapp/servlet/velocity/propertypage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/propertypage.vm
@@ -59,10 +59,7 @@
<div class="az-page-header">
<div class="container">
- <h1>
- <a href="${context}/manager?project=${project.name}">$project.name</a> /
- <a href="${context}/manager?project=${project.name}&flow=${flowid}">$flowid</a>
- </h1>
+ <h1><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}&prop=${property}">Properties <small>$property</small></a></h1>
</div>
</div>
@@ -76,17 +73,13 @@
<li><a href="${context}/manager?project=${project.name}"><strong>Project</strong> $project.name</a></li>
<li><a href="${context}/manager?project=${project.name}&flow=${flowid}"><strong>Flow</strong> $flowid</a></li>
<li><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}"><strong>Job</strong> $jobid</a></li>
+ <li class="active"><strong>Properties</strong> $property</li>
</ol>
- ## Tabs
-
- <ul class="nav nav-tabs">
- <li class="active"><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}">Properties</a></li>
- <li><a id="jobs-logs-btn" href="${context}/manager?project=${project.name}&job=$jobid&history">History</a></li>
- </ul>
+ ## Properties
<div class="panel panel-default">
- <div class="panel-heading">Property $property</div>
+ <div class="panel-heading">$property</div>
<table class="table table-striped table-bordered properties-table">
<thead>
@@ -109,7 +102,6 @@
<div class="well" id="job-summary">
<h4>Properties <small>$property</small></h4>
<p><strong>Job</strong> $jobid</p>
- <p><strong>Job Type</strong> $jobtype</p>
</div>
<div class="panel panel-default">
src/less/bootstrap-azkaban.less 30(+23 -7)
diff --git a/src/less/bootstrap-azkaban.less b/src/less/bootstrap-azkaban.less
index 2cf664b..2d1bf4d 100644
--- a/src/less/bootstrap-azkaban.less
+++ b/src/less/bootstrap-azkaban.less
@@ -263,22 +263,38 @@ td.flow-summary-value {
}
.az-page-header {
- padding: 5px 0 9px;
+ padding: 5px 0 10px;
margin: 0 0 30px;
border-bottom: 1px solid #dddddd;
background-color: #f4f4f4;
h1 {
font-size: 32px;
+ margin-bottom: 5px;
+ }
+
+ .az-page-header-form {
+ margin-top: 20px;
}
-}
-.az-page-header-form {
- margin-top: 20px;
-}
+ .az-exflow-stats {
+ margin-top: 10px;
+ }
+
+ .editable {
+ margin: 0px;
+ cursor: pointer;
+ &:hover {
+ background-color: #fcfcfc;
+ }
+ &.editable-placeholder {
+ color: #a0a0a0;
+ }
+ }
-.az-exflow-stats {
- margin-top: 10px;
+ .editable-form {
+ display: none;
+ }
}
.contextMenu {
src/web/js/azkaban.projectmodals.view.js 104(+59 -45)
diff --git a/src/web/js/azkaban.projectmodals.view.js b/src/web/js/azkaban.projectmodals.view.js
index 0362b8a..4f9b5f4 100644
--- a/src/web/js/azkaban.projectmodals.view.js
+++ b/src/web/js/azkaban.projectmodals.view.js
@@ -77,63 +77,77 @@ azkaban.DeleteProjectView = Backbone.View.extend({
}
});
-var projectSummary;
-azkaban.ProjectSummaryView = Backbone.View.extend({
+var projectDescription;
+azkaban.ProjectDescriptionView = Backbone.View.extend({
events: {
- "click #edit": "handleDescriptionEdit"
+ "click #project-description": "handleDescriptionEdit",
+ "click #project-description-btn": "handleDescriptionSave"
},
initialize: function(settings) {
+ console.log("project description initialize");
},
handleDescriptionEdit: function(evt) {
console.log("Edit description");
- var editText = $("#edit").text();
- var descriptionTD = $('#pdescription');
-
- if (editText != "Edit Description") {
- var requestURL = contextURL + "/manager";
- var newText = $("#descEdit").val();
-
- $.get(
- requestURL,
- {
- "project": projectName,
- "ajax":"changeDescription",
- "description":newText
- },
- function(data) {
- if (data.error) {
- alert(data.error);
- }
- },
- "json"
- );
-
- $(descriptionTD).remove("#descEdit");
- $(descriptionTD).text(newText);
- $("#edit").text("Edit Description");
- }
- else {
- var text = $(descriptionTD).text();
- var edit = document.createElement("textarea");
-
- $(edit).addClass("editTextArea");
- $(edit).attr("id", "descEdit");
- $(edit).val(text);
- $(descriptionTD).text("");
- $(descriptionTD).append(edit);
-
- $("#edit").text("Commit");
- }
+ var description = null;
+ if ($('#project-description').hasClass('editable-placeholder')) {
+ description = '';
+ $('#project-description').removeClass('editable-placeholder');
+ }
+ else {
+ description = $('#project-description').text();
+ }
+ $('#project-description-edit').attr("value", description);
+ $('#project-description').hide();
+ $('#project-description-form').show();
},
+
+ handleDescriptionSave: function(evt) {
+ var newText = $('#project-description-edit').val();
+ if ($('#project-description-edit').hasClass('has-error')) {
+ $('#project-description-edit').removeClass('has-error');
+ }
+ var requestURL = contextURL + "/manager";
+ var requestData = {
+ "project": projectName,
+ "ajax":"changeDescription",
+ "description": newText
+ };
+ var successHandler = function(data) {
+ if (data.error) {
+ $('#project-description-edit').addClass('has-error');
+ alert(data.error);
+ return;
+ }
+ $('#project-description-form').hide();
+ if (newText != '') {
+ $('#project-description').text(newText);
+ }
+ else {
+ $('#project-description').text('Add project description.');
+ $('#project-description').addClass('editable-placeholder');
+ }
+ $('#project-description').show();
+ };
+ $.get(requestURL, requestData, successHandler, "json");
+ },
+
render: function() {
}
});
$(function() {
- projectView = new azkaban.ProjectView({el:$('#project-options')});
- uploadView = new azkaban.UploadProjectView({el:$('#upload-project-modal')});
- deleteProjectView = new azkaban.DeleteProjectView({el: $('#delete-project-modal')});
- projectSummary = new azkaban.ProjectSummaryView({el:$('#project-summary')});
+ projectView = new azkaban.ProjectView({
+ el: $('#project-options')
+ });
+ uploadView = new azkaban.UploadProjectView({
+ el: $('#upload-project-modal')
+ });
+ deleteProjectView = new azkaban.DeleteProjectView({
+ el: $('#delete-project-modal')
+ });
+ projectDescription = new azkaban.ProjectDescriptionView({
+ el: $('#project-page-header')
+ });
});