azkaban-developers
Changes
src/less/base.less 22(+21 -1)
src/less/header.less 67(+42 -25)
src/less/project.less 6(+6 -0)
Details
diff --git a/src/java/azkaban/webapp/servlet/velocity/executingflowpage.vm b/src/java/azkaban/webapp/servlet/velocity/executingflowpage.vm
index 5582114..149ca0e 100644
--- a/src/java/azkaban/webapp/servlet/velocity/executingflowpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/executingflowpage.vm
@@ -58,7 +58,7 @@
## Page header
- <div class="az-page-header">
+ <div class="az-page-header page-header-bare">
<div class="container-full" id="flow-status">
<div class="row">
<div class="header-title">
@@ -69,7 +69,7 @@
</h1>
</div>
<div class="header-control">
- <div class="az-exflow-stats">
+ <div class="exflow-stats">
<div class="col-xs-5">
<p><strong>Submit User</strong> <span id="submitUser">-</span></p>
<p><strong>Duration</strong> <span id="duration">-</span></p>
@@ -83,32 +83,33 @@
</div>
</div>
</div>
- </div>
+ </div>
+ <div class="page-breadcrumb">
+ <div class="container-full">
+ <ol class="breadcrumb">
+ <li><a href="${context}/manager?project=${projectName}"><strong>Project</strong> $projectName</a></li>
+ <li><a href="${context}/manager?project=${projectName}&flow=${flowid}"><strong>Flow</strong> $flowid</a></li>
+ <li class="active"><strong>Execution</strong> $execid</li>
+ </ol>
+ </div>
+ </div>
<div class="container-full">
#parse ("azkaban/webapp/servlet/velocity/alerts.vm")
-
- ## Breadcrumb
-
- <ol class="breadcrumb">
- <li><a href="${context}/manager?project=${projectName}"><strong>Project</strong> $projectName</a></li>
- <li><a href="${context}/manager?project=${projectName}&flow=${flowid}"><strong>Flow</strong> $flowid</a></li>
- <li class="active"><strong>Execution</strong> $execid</li>
- </ol>
-
+
## Tabs and buttons.
- <ul class="nav nav-tabs" id="headertabs">
+ <ul class="nav nav-tabs nav-sm" id="headertabs">
<li id="graphViewLink"><a href="#graph">Graph</a></li>
<li id="jobslistViewLink"><a href="#jobslist">Job List</a></li>
<li id="flowLogViewLink"><a href="#log">Flow Log</a></li>
<li id="statsViewLink"><a href="#stats">Stats</a></li>
- <li class="nav-button pull-right"><button type="button" id="pausebtn" class="btn btn-primary">Pause</button></li>
- <li class="nav-button pull-right"><button type="button" id="resumebtn" class="btn btn-primary">Resume</button></li>
- <li class="nav-button pull-right"><button type="button" id="cancelbtn" class="btn btn-danger">Kill</button></li>
- <li class="nav-button pull-right"><button type="button" id="retrybtn" class="btn btn-success">Retry Failed</button></li>
- <li class="nav-button pull-right"><button type="button" id="executebtn" class="btn btn-success">Prepare Execution</button></li>
+ <li class="nav-button pull-right"><button type="button" id="pausebtn" class="btn btn-primary btn-sm">Pause</button></li>
+ <li class="nav-button pull-right"><button type="button" id="resumebtn" class="btn btn-primary btn-sm">Resume</button></li>
+ <li class="nav-button pull-right"><button type="button" id="cancelbtn" class="btn btn-danger btn-sm">Kill</button></li>
+ <li class="nav-button pull-right"><button type="button" id="retrybtn" class="btn btn-success btn-sm">Retry Failed</button></li>
+ <li class="nav-button pull-right"><button type="button" id="executebtn" class="btn btn-success btn-sm">Prepare Execution</button></li>
</ul>
</div>
diff --git a/src/java/azkaban/webapp/servlet/velocity/executionspage.vm b/src/java/azkaban/webapp/servlet/velocity/executionspage.vm
index e089e75..8a6cf52 100644
--- a/src/java/azkaban/webapp/servlet/velocity/executionspage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/executionspage.vm
@@ -49,7 +49,7 @@
## Page Content
- <ul class="nav nav-tabs" id="header-tabs">
+ <ul class="nav nav-tabs nav-sm" 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>
diff --git a/src/java/azkaban/webapp/servlet/velocity/flowpage.vm b/src/java/azkaban/webapp/servlet/velocity/flowpage.vm
index 104d167..48039cd 100644
--- a/src/java/azkaban/webapp/servlet/velocity/flowpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/flowpage.vm
@@ -63,36 +63,36 @@
## Page header.
- <div class="az-page-header">
+ <div class="az-page-header page-header-bare">
<div class="container-full">
<div class="row">
- <div class="col-xs-6">
+ <div class="header-title">
<h1><a href="${context}/manager?project=${project.name}&flow=${flowid}">Flow <small>$flowid</small></a></h1>
</div>
- <div class="col-xs-6">
- <div class="pull-right az-page-header-form">
- <button type="button" class="btn btn-sm btn-success" id="executebtn">Schedule / Execute Flow</button>
- </div>
- <div class="clearfix"></div>
+ <div class="header-control">
+ <div class="pull-right header-form">
+ <button type="button" class="btn btn-sm btn-success" id="executebtn">Schedule / Execute Flow</button>
+ </div>
</div>
</div>
</div>
- </div>
+ </div>
+ <div class="page-breadcrumb">
+ <div class="container-full">
+ <ol class="breadcrumb">
+ <li><a href="${context}/manager?project=${project.name}"><strong>Project</strong> $project.name</a></li>
+ <li class="active"><strong>Flow</strong> $flowid</li>
+ </ol>
+ </div>
+ </div>
<div class="container-full">
#parse ("azkaban/webapp/servlet/velocity/alerts.vm")
- ## Breadcrumbs
-
- <ol class="breadcrumb">
- <li><a href="${context}/manager?project=${project.name}"><strong>Project</strong> $project.name</a></li>
- <li class="active"><strong>Flow</strong> $flowid</li>
- </ol>
-
## Tabs
- <ul class="nav nav-tabs" id="headertabs">
+ <ul class="nav nav-tabs nav-sm" id="headertabs">
<li id="graphViewLink"><a href="#graph">Graph</a></li>
<li id="executionsViewLink"><a href="#executions">Executions</a></li>
<li id="summaryViewLink"><a href="#summary">Summary</a></li>
diff --git a/src/java/azkaban/webapp/servlet/velocity/historypage.vm b/src/java/azkaban/webapp/servlet/velocity/historypage.vm
index 3df93ad..ed0fa38 100644
--- a/src/java/azkaban/webapp/servlet/velocity/historypage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/historypage.vm
@@ -50,7 +50,7 @@
<h1><a href="${context}/history">History</a></h1>
</div>
<div class="header-control">
- <form id="search-form" method="get" class="form-inline az-page-header-form" role="form">
+ <form id="search-form" method="get" class="form-inline header-form" role="form">
<input type="hidden" name="search" value="true">
<div class="form-group">
<div class="input-group">
diff --git a/src/java/azkaban/webapp/servlet/velocity/index.vm b/src/java/azkaban/webapp/servlet/velocity/index.vm
index 3e8eef8..ef42c09 100644
--- a/src/java/azkaban/webapp/servlet/velocity/index.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/index.vm
@@ -45,7 +45,7 @@
<h1><a href="${context}/index">Projects</a></h1>
</div>
<div class="header-control">
- <form id="search-form" method="get" class="form-inline az-page-header-form" role="form">
+ <form id="search-form" method="get" class="form-inline header-form" role="form">
<input type="hidden" name="doaction" value="search">
#if ($viewProjects == 'all')
<input type="hidden" name="all" value="true">
diff --git a/src/java/azkaban/webapp/servlet/velocity/jobdetailsheader.vm b/src/java/azkaban/webapp/servlet/velocity/jobdetailsheader.vm
index 5b172c8..27863ea 100644
--- a/src/java/azkaban/webapp/servlet/velocity/jobdetailsheader.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/jobdetailsheader.vm
@@ -16,38 +16,38 @@
## Page header.
- <div class="az-page-header">
+ <div class="az-page-header page-header-bare">
<div class="container-full">
<div class="row">
- <div class="col-xs-6">
+ <div class="header-title">
<h1><a href="${context}/executor?execid=${execid}&job=${jobid}">Job Execution <small>$jobid</small></a></h1>
</div>
- <div class="col-xs-6">
- <div class="pull-right az-page-header-form">
- <a href="${context}/manager?project=${projectName}&flow=${parentflowid}&job=$jobname" class="btn btn-info">Job Properties</a>
+ <div class="header-control">
+ <div class="pull-right header-form">
+ <a href="${context}/manager?project=${projectName}&flow=${parentflowid}&job=$jobname" class="btn btn-info btn-sm">Job Properties</a>
</div>
</div>
</div>
</div>
- </div>
-
+ </div>
+ <div class="page-breadcrumb">
+ <div class="container-full">
+ <ol class="breadcrumb">
+ <li><a href="${context}/manager?project=${projectName}"><strong>Project</strong> $projectName</a></li>
+ <li><a href="${context}/manager?project=${projectName}&flow=${flowid}"><strong>Flow</strong> $flowid</a></li>
+ <li><a href="${context}/executor?execid=${execid}#jobslist"><strong>Execution</strong> $execid</a></li>
+ <li class="active"><strong>Job</strong> $jobid</li>
+ </ol>
+ </div>
+ </div>
<div class="container-full">
#parse ("azkaban/webapp/servlet/velocity/alerts.vm")
- ## Breadcrumb
-
- <ol class="breadcrumb">
- <li><a href="${context}/manager?project=${projectName}"><strong>Project</strong> $projectName</a></li>
- <li><a href="${context}/manager?project=${projectName}&flow=${flowid}"><strong>Flow</strong> $flowid</a></li>
- <li><a href="${context}/executor?execid=${execid}#jobslist"><strong>Execution</strong> $execid</a></li>
- <li class="active"><strong>Job</strong> $jobid</li>
- </ol>
-
## Tabs
- <ul class="nav nav-tabs" id="headertabs">
+ <ul class="nav nav-tabs nav-sm" id="headertabs">
#if ($current_page == "executing")
<li id="jobLogViewLink"><a href="#logs">Job Logs</a></li>
<li id="jobSummaryViewLink"><a href="#summary">Summary</a></li>
diff --git a/src/java/azkaban/webapp/servlet/velocity/jobhistorypage.vm b/src/java/azkaban/webapp/servlet/velocity/jobhistorypage.vm
index e45e168..b1838bb 100644
--- a/src/java/azkaban/webapp/servlet/velocity/jobhistorypage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/jobhistorypage.vm
@@ -51,23 +51,24 @@
## Page header
- <div class="az-page-header">
+ <div class="az-page-header page-header-bare">
<div class="container-full">
<h1><a href="${context}/manager?project=${projectName}&job=${jobid}&history">Job History <small>$jobid</small></a></h1>
</div>
- </div>
+ </div>
+ <div class="page-breadcrumb">
+ <div class="container-full">
+ <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>
+ </div>
<div class="container-full">
#parse ("azkaban/webapp/servlet/velocity/alerts.vm")
- ## Breadcrumb
-
- <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>
-
## Time graph and job history table.
<div class="row">
diff --git a/src/java/azkaban/webapp/servlet/velocity/jobpage.vm b/src/java/azkaban/webapp/servlet/velocity/jobpage.vm
index 61fd82e..279a61e 100644
--- a/src/java/azkaban/webapp/servlet/velocity/jobpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/jobpage.vm
@@ -44,34 +44,35 @@
## Page header
- <div class="az-page-header">
+ <div class="az-page-header page-header-bare">
<div class="container-full">
<div class="row">
- <div class="col-xs-6">
+ <div class="header-title">
<h1><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}">Job <small>$jobid</small></a></h1>
</div>
- <div class="col-xs-6">
- <div class="pull-right az-page-header-form">
+ <div class="header-control">
+ <div class="pull-right header-form">
<a href="${context}/manager?project=${project.name}&job=$jobid&history" class="btn btn-info btn-sm">History</a>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
- </div>
+ </div>
+ <div class="page-breadcrumb">
+ <div class="container-full">
+ <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 class="active"><strong>Job</strong> $jobid</li>
+ </ol>
+ </div>
+ </div>
<div class="container-full">
#parse ("azkaban/webapp/servlet/velocity/alerts.vm")
- ## 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 class="active"><strong>Job</strong> $jobid</li>
- </ol>
-
<div class="row row-offcanvas row-offcanvas-right">
<div class="col-xs-12 col-sm-9">
diff --git a/src/java/azkaban/webapp/servlet/velocity/projectnav.vm b/src/java/azkaban/webapp/servlet/velocity/projectnav.vm
index c19a6ab..591a2d1 100644
--- a/src/java/azkaban/webapp/servlet/velocity/projectnav.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/projectnav.vm
@@ -14,7 +14,7 @@
* the License.
*#
- <ul class="nav nav-tabs">
+ <ul class="nav nav-tabs nav-sm">
<li#if($project_page == 'flows') class="active"#end><a href="${context}/manager?project=${project.name}">Flows</a></li>
<li#if($project_page == 'permissions') class="active"#end><a id="project-permission-btn" href="${context}/manager?project=${project.name}&permissions">Permissions</a></li>
#if ($admin)
diff --git a/src/java/azkaban/webapp/servlet/velocity/projectpageheader.vm b/src/java/azkaban/webapp/servlet/velocity/projectpageheader.vm
index 6bb0858..80a4a08 100644
--- a/src/java/azkaban/webapp/servlet/velocity/projectpageheader.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/projectpageheader.vm
@@ -19,18 +19,9 @@
<div class="row">
<div class="header-title" id="project-page-header">
<h1><a href="${context}/manager?project=${project.name}">Project <small>$project.name</small></a></h1>
- <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="header-control">
- <div class="pull-right az-page-header-form" id="project-options">
+ <div class="header-form pull-right" id="project-options">
<button id="project-delete-btn" class="btn btn-sm btn-danger">
<span class="glyphicon glyphicon-trash"></span> Delete Project
</button>
diff --git a/src/java/azkaban/webapp/servlet/velocity/projectsidebar.vm b/src/java/azkaban/webapp/servlet/velocity/projectsidebar.vm
index 20bb3bf..5cdff7a 100644
--- a/src/java/azkaban/webapp/servlet/velocity/projectsidebar.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/projectsidebar.vm
@@ -14,8 +14,18 @@
* the License.
*#
- <div class="well">
+ <div class="well" id="project-sidebar">
<h3>$project.name</h3>
+ <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>
+ <hr>
<p><strong>Created on</strong> $utils.formatDate($project.createTimestamp)</p>
<p><strong>Last modified by</strong> $utils.formatDate($project.lastModifiedTimestamp)</p>
<p><strong>Modified by</strong> $project.lastModifiedUser</p>
diff --git a/src/java/azkaban/webapp/servlet/velocity/propertypage.vm b/src/java/azkaban/webapp/servlet/velocity/propertypage.vm
index 9ddfeb5..f7ce6af 100644
--- a/src/java/azkaban/webapp/servlet/velocity/propertypage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/propertypage.vm
@@ -42,11 +42,21 @@
## Page header
- <div class="az-page-header">
+ <div class="az-page-header page-header-bare">
<div class="container-full">
<h1><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}&prop=${property}">Properties <small>$property</small></a></h1>
</div>
- </div>
+ </div>
+ <div class="page-breadcrumb">
+ <div class="container-full">
+ <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>
+ <li class="active"><strong>Properties</strong> $property</li>
+ </ol>
+ </div>
+ </div>
<div class="container-full">
@@ -55,15 +65,6 @@
<div class="row row-offcanvas row-offcanvas-right">
<div class="col-xs-12 col-sm-9">
- ## 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>
- <li class="active"><strong>Properties</strong> $property</li>
- </ol>
-
## Properties
<div class="panel panel-default">
src/less/base.less 22(+21 -1)
diff --git a/src/less/base.less b/src/less/base.less
index cb7a0da..7b8f11e 100644
--- a/src/less/base.less
+++ b/src/less/base.less
@@ -8,7 +8,7 @@
.container-fill {
position: absolute;
- top: 300px;
+ top: 230px;
bottom: 50px;
.row {
@@ -115,3 +115,23 @@
background-position: -64px -80px;
}
}
+
+.editable {
+ margin: 0px;
+ cursor: pointer;
+ &:hover {
+ background-color: #fcfcfc;
+ }
+ &.editable-placeholder {
+ color: #a0a0a0;
+ }
+}
+
+.editable-form {
+ display: none;
+}
+
+.nav.nav-sm > li > a {
+ padding: 8px 12px;
+ font-size: 13px;
+}
src/less/header.less 67(+42 -25)
diff --git a/src/less/header.less b/src/less/header.less
index 9ec9c27..03ff1d2 100644
--- a/src/less/header.less
+++ b/src/less/header.less
@@ -1,39 +1,39 @@
.az-page-header {
- padding: 5px 0 10px;
- margin: 0 0 30px;
+ padding: 5px 0 5px;
+ margin: 0 0 20px;
border-bottom: 1px solid #dddddd;
- background-color: #f4f4f4;
+ background-color: #f0f0f0;
- h1 {
- font-size: 32px;
- margin-bottom: 5px;
- }
-
- .az-page-header-form {
- margin-top: 20px;
+ &.page-header-bare {
+ margin-bottom: 0px;
+ border-bottom: 1px solid #dfdfdf;
}
- .az-exflow-stats {
- margin-top: 10px;
+ h1 {
+ font-size: 22px;
+ margin: 9px 0 7px 0;
+ font-weight: 400;
- p {
- margin-bottom: 5px;
+ small {
+ font-size: 22px;
+ font-weight: 300;
}
- }
- .editable {
- margin: 0px;
- cursor: pointer;
- &:hover {
- background-color: #fcfcfc;
- }
- &.editable-placeholder {
- color: #a0a0a0;
+ a {
+ color: #9a9a9a;
+ &:hover,
+ &:active {
+ text-decoration: none;
+ }
}
}
+
+ .exflow-stats {
+ margin: 0px;
- .editable-form {
- display: none;
+ p {
+ margin: 0px;
+ }
}
.header-title {
@@ -47,8 +47,25 @@
padding-right: 15px;
width: 500px;
+ .header-form {
+ margin: 5px 0 0 0;
+ }
+
.form-group {
padding: 0;
}
}
}
+
+.page-breadcrumb {
+ background-color: #f0f0f0;
+ border-bottom: 1px solid #dddddd;
+ padding: 5px 0 5px 0;
+ margin-bottom: 20px;
+
+ .breadcrumb {
+ margin: 0px;
+ padding: 0px;
+ background: transparent;
+ }
+}
src/less/project.less 6(+6 -0)
diff --git a/src/less/project.less b/src/less/project.less
index 675dc30..0fb63af 100644
--- a/src/less/project.less
+++ b/src/less/project.less
@@ -42,6 +42,12 @@
}
}
+#project-sidebar {
+ h3 {
+ margin-bottom: 5px;
+ }
+}
+
.project-flows {
display: none;
background-color: #f9f9f9;
diff --git a/src/web/js/azkaban/view/project-modals.js b/src/web/js/azkaban/view/project-modals.js
index 4f9b5f4..6309d1c 100644
--- a/src/web/js/azkaban/view/project-modals.js
+++ b/src/web/js/azkaban/view/project-modals.js
@@ -148,6 +148,6 @@ $(function() {
el: $('#delete-project-modal')
});
projectDescription = new azkaban.ProjectDescriptionView({
- el: $('#project-page-header')
+ el: $('#project-sidebar')
});
});