azkaban-uncached
Changes
src/web/js/azkaban.executions.view.js 62(+62 -0)
Details
diff --git a/src/java/azkaban/webapp/servlet/velocity/executionspage.vm b/src/java/azkaban/webapp/servlet/velocity/executionspage.vm
index 883344b..8755b86 100644
--- a/src/java/azkaban/webapp/servlet/velocity/executionspage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/executionspage.vm
@@ -21,6 +21,7 @@
#parse("azkaban/webapp/servlet/velocity/style.vm")
#parse("azkaban/webapp/servlet/velocity/javascript.vm")
+ <script type="text/javascript" src="${context}/js/azkaban.executions.view.js"></script>
<script type="text/javascript">
var contextURL = "${context}";
var currentTime = ${currentTime};
@@ -55,104 +56,102 @@
## Page Content
<div class="container">
- <div class="row">
+ <ul class="nav nav-pills" id="header-tabs">
+ <li id="currently-running-view-link"><a href="#currently-running">Currently Running</a></li>
+ <li id="recently-finished-view-link"><a href="#recently-finished">Recently Finished</a></li>
+ </ul>
+
+ <div class="row" id="currently-running-view">
<div class="col-lg-12">
- <div class="panel panel-default">
- <div class="panel-heading">Currently Running Jobs</div>
- <table id="executingJobs" class="table table-striped table-bordered table-hover table-condensed executions-table">
- <thead>
- <tr>
- <th class="execid">Execution Id</th>
- <th>Flow</th>
- <th>Project</th>
- <th class="user">User</th>
- <th class="user">Proxy User</th>
- <th class="date">Start Time</th>
- <th class="date">End Time</th>
- <th class="elapse">Elapsed</th>
- <th class="status">Status</th>
- <th class="action">Action</th>
- </tr>
- </thead>
- <tbody>
+ <table id="executingJobs" class="table table-striped table-bordered table-hover table-condensed executions-table">
+ <thead>
+ <tr>
+ <th class="execid">Execution Id</th>
+ <th>Flow</th>
+ <th>Project</th>
+ <th class="user">User</th>
+ <th class="user">Proxy User</th>
+ <th class="date">Start Time</th>
+ <th class="date">End Time</th>
+ <th class="elapse">Elapsed</th>
+ <th class="status">Status</th>
+ <th class="action">Action</th>
+ </tr>
+ </thead>
+ <tbody>
#if ($runningFlows)
#foreach ($flow in $runningFlows)
- <tr class="row" >
- <td class="tb-name">
- <a href="${context}/executor?execid=${flow.executionId}">${flow.executionId}</a>
- </td>
- <td><a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})&flow=${flow.flowId}">${flow.flowId}</a></td>
- <td>
- <a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})">$vmutils.getProjectName(${flow.projectId})</a>
- </td>
- <td>${flow.submitUser}</td>
- <td>${flow.proxyUsers}</td>
- <td>$utils.formatDate(${flow.startTime})</td>
- <td>$utils.formatDate(${flow.endTime})</td>
- <td>$utils.formatDuration(${flow.startTime}, ${flow.endTime})</td>
- <td><div class="status ${flow.status}">$utils.formatStatus(${flow.status})</div></td>
- <td></td>
- </tr>
+ <tr class="row" >
+ <td class="tb-name">
+ <a href="${context}/executor?execid=${flow.executionId}">${flow.executionId}</a>
+ </td>
+ <td><a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})&flow=${flow.flowId}">${flow.flowId}</a></td>
+ <td>
+ <a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})">$vmutils.getProjectName(${flow.projectId})</a>
+ </td>
+ <td>${flow.submitUser}</td>
+ <td>${flow.proxyUsers}</td>
+ <td>$utils.formatDate(${flow.startTime})</td>
+ <td>$utils.formatDate(${flow.endTime})</td>
+ <td>$utils.formatDuration(${flow.startTime}, ${flow.endTime})</td>
+ <td><div class="status ${flow.status}">$utils.formatStatus(${flow.status})</div></td>
+ <td></td>
+ </tr>
#end
#else
- <tr>
- <td colspan="10">No Executing Flows</td>
- </tr>
+ <tr>
+ <td colspan="10">No Executing Flows</td>
+ </tr>
#end
- </tbody>
- </table>
- </div><!-- /panel -->
+ </tbody>
+ </table>
</div><!-- /col-lg-12 -->
</div><!-- /row -->
- <div class="row">
+ <div class="row" id="recently-finished-view">
<div class="col-lg-12">
- <div class="panel panel-default">
- <div class="panel-heading">Recently Finished Jobs</div>
- <table id="recentlyFinished" class="table table-striped table-bordered table-hover table-condensed executions-table">
- <thead>
- <tr>
- <th class="execid">Execution Id</th>
- <th>Flow</th>
- <th>Project</th>
- <th class="user">User</th>
- <th class="user">Proxy User</th>
- <th class="date">Start Time</th>
- <th class="date">End Time</th>
- <th class="elapse">Elapsed</th>
- <th class="status">Status</th>
- <th class="action">Action</th>
- </tr>
- </thead>
- <tbody>
+ <table id="recentlyFinished" class="table table-striped table-bordered table-hover table-condensed executions-table">
+ <thead>
+ <tr>
+ <th class="execid">Execution Id</th>
+ <th>Flow</th>
+ <th>Project</th>
+ <th class="user">User</th>
+ <th class="user">Proxy User</th>
+ <th class="date">Start Time</th>
+ <th class="date">End Time</th>
+ <th class="elapse">Elapsed</th>
+ <th class="status">Status</th>
+ <th class="action">Action</th>
+ </tr>
+ </thead>
+ <tbody>
#if ($recentlyFinished.isEmpty())
#foreach ($flow in $recentlyFinished)
- <tr class="row" >
- <td class="tb-name execId">
- <a href="${context}/executor?execid=${flow.executionId}">${flow.executionId}</a>
- </td>
- <td><a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})&flow=${flow.flowId}">${flow.flowId}</a></td>
- <td>
- <a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})">$vmutils.getProjectName(${flow.projectId})</a>
- </td>
- <td>${flow.submitUser}</td>
- <td>${flow.proxyUsers}</td>
- <td>$utils.formatDate(${flow.startTime})</td>
- <td>$utils.formatDate(${flow.endTime})</td>
- <td>$utils.formatDuration(${flow.startTime}, ${flow.endTime})</td>
- <td><div class="status ${flow.status}">$utils.formatStatus(${flow.status})</div></td>
- <td></td>
- </tr>
+ <tr class="row" >
+ <td class="tb-name execId">
+ <a href="${context}/executor?execid=${flow.executionId}">${flow.executionId}</a>
+ </td>
+ <td><a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})&flow=${flow.flowId}">${flow.flowId}</a></td>
+ <td>
+ <a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})">$vmutils.getProjectName(${flow.projectId})</a>
+ </td>
+ <td>${flow.submitUser}</td>
+ <td>${flow.proxyUsers}</td>
+ <td>$utils.formatDate(${flow.startTime})</td>
+ <td>$utils.formatDate(${flow.endTime})</td>
+ <td>$utils.formatDuration(${flow.startTime}, ${flow.endTime})</td>
+ <td><div class="status ${flow.status}">$utils.formatStatus(${flow.status})</div></td>
+ <td></td>
+ </tr>
#end
#else
- <tr>
- <td colspan="10">No Recently Finished</td>
- </tr>
+ <tr>
+ <td colspan="10">No Recently Finished</td>
+ </tr>
#end
- </tbody>
- </table>
- </div><!-- /panel -->
-
+ </tbody>
+ </table>
</div><!-- /col-lg-12 -->
</div><!-- /row -->
diff --git a/src/java/azkaban/webapp/servlet/velocity/index.vm b/src/java/azkaban/webapp/servlet/velocity/index.vm
index acbeab0..8d69e34 100644
--- a/src/java/azkaban/webapp/servlet/velocity/index.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/index.vm
@@ -102,7 +102,7 @@
<div class="container">
<div class="row">
<div class="col-lg-12">
- <table class="table table-striped table-bordered table-hover" id="all-jobs">
+ <table class="table table-condensed table-striped table-bordered table-hover" id="all-jobs">
<thead>
<tr>
<th class="tb-name">Name</th>
diff --git a/src/java/azkaban/webapp/servlet/velocity/jobdetailspage.vm b/src/java/azkaban/webapp/servlet/velocity/jobdetailspage.vm
index 639a70e..c6399f4 100644
--- a/src/java/azkaban/webapp/servlet/velocity/jobdetailspage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/jobdetailspage.vm
@@ -115,6 +115,7 @@
</div>
## Job Summary
+
<div id="jobSummaryView" class="row">
<div class="col-lg-12">
<table id="commandTable" class="table table-striped table-bordered table-hover">
diff --git a/src/java/azkaban/webapp/servlet/velocity/scheduledflowpage.vm b/src/java/azkaban/webapp/servlet/velocity/scheduledflowpage.vm
index 361da87..d8b8f2a 100644
--- a/src/java/azkaban/webapp/servlet/velocity/scheduledflowpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/scheduledflowpage.vm
@@ -80,52 +80,48 @@
<div class="container">
<div class="row">
<div class="col-lg-12">
- <div class="panel panel-default">
- <div class="panel-heading">Scheduled Flows</div>
- <table id="scheduledFlowsTbl" class="table table-striped">
- <thead>
- <tr>
- <!--th class="execid">Execution Id</th-->
- <th>ID</th>
- <th>Flow</th>
- <th>Project</th>
- <th>Submitted By</th>
- <th class="date">First Scheduled to Run</th>
- <th class="date">Next Execution Time</th>
- <th class="date">Repeats Every</th>
- <th>Has SLA</th>
- <th colspan="2" class="action ignoresort">Action</th>
- </tr>
- </thead>
- <tbody>
+ <table id="scheduledFlowsTbl" class="table table-striped table-condensed table-bordered table-hover">
+ <thead>
+ <tr>
+ <!--th class="execid">Execution Id</th-->
+ <th>ID</th>
+ <th>Flow</th>
+ <th>Project</th>
+ <th>Submitted By</th>
+ <th class="date">First Scheduled to Run</th>
+ <th class="date">Next Execution Time</th>
+ <th class="date">Repeats Every</th>
+ <th>Has SLA</th>
+ <th colspan="2" class="action ignoresort">Action</th>
+ </tr>
+ </thead>
+ <tbody>
#if(!$schedules.isEmpty())
#foreach($sched in $schedules)
- <tr>
- <td>${sched.scheduleId}</td>
- <td class="tb-name">
- <a href="${context}/manager?project=${sched.projectName}&flow=${sched.flowName}">${sched.flowName}</a>
- </td>
- <td>
- <a href="${context}/manager?project=${sched.projectName}">${sched.projectName}</a>
- </td>
- <td>${sched.submitUser}</td>
- <td>$utils.formatDateTime(${sched.firstSchedTime})</td>
- <td>$utils.formatDateTime(${sched.nextExecTime})</td>
- <td>$utils.formatPeriod(${sched.period})</td>
- <td>#if(${sched.slaOptions}) true #else false #end</td>
- <td><button type="button" id="removeSchedBtn" class="btn btn-sm btn-danger" onclick="removeSched(${sched.scheduleId})" >Remove Schedule</button></td>
- <td><button type="button" id="addSlaBtn" class="btn btn-sm btn-primary" onclick="slaView.initFromSched(${sched.scheduleId}, '${sched.flowName}')" >Set SLA</button></td>
- </tr>
-
+ <tr>
+ <td>${sched.scheduleId}</td>
+ <td class="tb-name">
+ <a href="${context}/manager?project=${sched.projectName}&flow=${sched.flowName}">${sched.flowName}</a>
+ </td>
+ <td>
+ <a href="${context}/manager?project=${sched.projectName}">${sched.projectName}</a>
+ </td>
+ <td>${sched.submitUser}</td>
+ <td>$utils.formatDateTime(${sched.firstSchedTime})</td>
+ <td>$utils.formatDateTime(${sched.nextExecTime})</td>
+ <td>$utils.formatPeriod(${sched.period})</td>
+ <td>#if(${sched.slaOptions}) true #else false #end</td>
+ <td><button type="button" id="removeSchedBtn" class="btn btn-sm btn-danger" onclick="removeSched(${sched.scheduleId})" >Remove Schedule</button></td>
+ <td><button type="button" id="addSlaBtn" class="btn btn-sm btn-primary" onclick="slaView.initFromSched(${sched.scheduleId}, '${sched.flowName}')" >Set SLA</button></td>
+ </tr>
#end
#else
- <tr>
- <td colspan="10">No scheduled flow found.</td>
- </tr>
+ <tr>
+ <td colspan="10">No scheduled flow found.</td>
+ </tr>
#end
- </tbody>
- </table>
- </div><!-- /panel -->
+ </tbody>
+ </table>
</div><!-- /col-lg-12 -->
</div><!-- /row -->
src/web/js/azkaban.executions.view.js 62(+62 -0)
diff --git a/src/web/js/azkaban.executions.view.js b/src/web/js/azkaban.executions.view.js
new file mode 100644
index 0000000..58b75c4
--- /dev/null
+++ b/src/web/js/azkaban.executions.view.js
@@ -0,0 +1,62 @@
+/*
+ * Copyright 2012 LinkedIn Corp.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+ */
+
+$.namespace('azkaban');
+
+var executionsTabView;
+azkaban.ExecutionsTabView = Backbone.View.extend({
+ events: {
+ 'click #currently-running-view-link': 'handleCurrentlyRunningViewLinkClick',
+ 'click #recently-finished-view-link': 'handleRecentlyFinishedViewLinkClick'
+ },
+
+ initialize: function(settings) {
+ var selectedView = settings.selectedView;
+ if (selectedView == 'recently-finished') {
+ this.handleRecentlyFinishedViewLinkClick();
+ }
+ else {
+ this.handleCurrentlyRunningViewLinkClick();
+ }
+ },
+
+ render: function() {
+ },
+
+ handleCurrentlyRunningViewLinkClick: function() {
+ $('#recently-finished-view-link').removeClass('active');
+ $('#recently-finished-view').hide();
+ $('#currently-running-view-link').addClass('active');
+ $('#currently-running-view').show();
+ },
+
+ handleRecentlyFinishedViewLinkClick: function() {
+ $('#currently-running-view-link').removeClass('active');
+ $('#currently-running-view').hide();
+ $('#recently-finished-view-link').addClass('active');
+ $('#recently-finished-view').show();
+ }
+});
+
+$(function() {
+ executionsTabView = new azkaban.ExecutionsTabView({el: $('#header-tabs')});
+ if (window.location.hash) {
+ var hash = window.location.hash;
+ if (hash == '#recently-finished') {
+ executionsTabView.handleRecentlyFinishedLinkClick();
+ }
+ }
+});