Integrate the "Job status" and "All jobs" tabs

The job status tabs now has a toggle to show inactive jobs, rendering
the "All jobs" tab redundant.
This commit is contained in:
Eelco Dolstra
2013-08-28 12:22:16 +00:00
parent 9002b69c2d
commit d886ff9973
4 changed files with 71 additions and 102 deletions

View File

@ -1,59 +0,0 @@
[% PROCESS common.tt; USE Math %]
<form class="form-search" id="filter-jobs">
<input name="filter" type="text" class="input-large search-query" placeholder="Search jobs by name" [% HTML.attributes(value => filter) %]></input>
<img src="/static/images/ajax-loader.gif" alt="Loading..." style="display: none;" id="filter-loading" />
</form>
<script>
function setFilter(filter) {
$('#filter-loading').show().focus();
$('#tabs-job-status').load("[% c.uri_for('/jobset' project.name jobset.name "job-status-tab") %]", filter, function(response, status, xhr) {
if (status == "error") {
$('#[% tabName %]').html("<div class='alert alert-error'>Error loading tab: " + xhr.status + " " + xhr.statusText + "</div>");
}
});
};
$('#filter-jobs').submit(function() {
setFilter($('#filter-jobs').serialize());
return false;
});
</script>
[% IF jobs.size == 0 %]
<div class="alert">There are no matching jobs.</div>
[% ELSE %]
[% IF nrJobs > jobs.size %]
<div class="alert">Showing the first [% jobs.size %] jobs only. <a href="javascript:setFilter('filter=%')">Show all [% nrJobs %] jobs...</a></div>
[% END %]
[% evalIds = evals.keys.nsort.reverse %]
<table class="table table-striped table-condensed table-header-rotated">
<thead>
<tr>
<th style="width: 1em;">Job</th>
[% FOREACH eval IN evalIds %]
<th class="rotate-45">
<div><span>
<a href="[% c.uri_for('/eval' eval) %]">[% eval %]</a>
</span></div></th>
[% END %]
</tr>
</thead>
<tbody>
[% FOREACH j IN jobs-%]
<tr>
<th>[% INCLUDE renderJobName project=project.name jobset=jobset.name job=j %]</th>
[% FOREACH eval IN evalIds %]
<td>[% r = evals.$eval.$j; IF r.id %]<a href="[% c.uri_for('/build' r.id) %]">[% INCLUDE renderBuildStatusIcon size=16 build=r %]</a>[% END %]</td>
[% END %]
</tr>
[% END %]
</tbody>
</table>
[% END %]

View File

@ -1,19 +1,69 @@
[% PROCESS common.tt %]
[% PROCESS common.tt; USE Math %]
<form class="form-search" id="filter-jobs">
<div class="input-append">
<input name="filter" type="text" class="input-large search-query" placeholder="Search jobs by name..." [% HTML.attributes(value => filter) %]></input>
<button type="button" class="btn btn-info [% IF showInactive %]active[% END %]" id="active-toggle">Show inactive jobs</button>
</div>
&nbsp;
<img src="/static/images/ajax-loader.gif" alt="Loading..." style="display: none;" id="filter-loading" />
</form>
<script>
function setFilter(filter) {
$('#filter-loading').show();
if ($('#active-toggle').hasClass('active')) filter += '&amp;showInactive=1';
$('#tabs-jobs').load("[% c.uri_for('/jobset' project.name jobset.name "jobs-tab") %]", filter, function(response, status, xhr) {
if (status == "error") {
$('#[% tabName %]').html("<div class='alert alert-error'>Error loading tab: " + xhr.status + " " + xhr.statusText + "</div>");
}
});
};
$('#filter-jobs').submit(function() {
setFilter($('#filter-jobs').serialize());
return false;
});
$('#active-toggle').click(function() {
$(this).toggleClass('active');
$('#filter-jobs').submit();
});
</script>
[% IF jobs.size == 0 %]
<div class="alert">This jobset has no jobs yet.</div>
[% ELSE %]
<div class="well well-small">Below is the list of all [% jobs.size
%] jobs that have ever existed in this jobset. Jobs that are no
longer part of the jobset (i.e., that don't appear in the latest
evaluation of the jobset) are <span class="muted">grayed out</span>.</div>
<table class="table table-striped table-condensed">
<div class="alert">There are no matching jobs.</div>
[% ELSE %]
[% IF nrJobs > jobs.size %]
<div class="alert">Showing the first [% jobs.size %] jobs. <a href="javascript:setFilter('filter=%')">Show all [% nrJobs %] jobs...</a></div>
[% END %]
[% evalIds = evals.keys.nsort.reverse %]
<table class="table table-striped table-condensed table-header-rotated">
<thead>
<tr><th>Job name</th></tr>
<tr>
<th style="width: 1em;">Job</th>
[% FOREACH eval IN evalIds %]
<th class="rotate-45">
<div><span>
<a href="[% c.uri_for('/eval' eval) %]">[% eval %]</a>
</span></div></th>
[% END %]
</tr>
</thead>
<tbody>
[% FOREACH j IN jobs %]<tr><td><span class="[% IF !activeJobs.$j %]muted override-link[% END %]">[% INCLUDE renderJobName project=project.name jobset=jobset.name job=j %]</span></td></tr>[% END %]
[% FOREACH j IN jobs-%]
<tr>
<th><span [% IF inactiveJobs.$j %]class="muted override-link"[% END %]>[% INCLUDE renderJobName project=project.name jobset=jobset.name job=j %]</span></th>
[% FOREACH eval IN evalIds %]
<td>[% r = evals.$eval.$j; IF r.id %]<a href="[% c.uri_for('/build' r.id) %]">[% INCLUDE renderBuildStatusIcon size=16 build=r %]</a>[% END %]</td>
[% END %]
</tr>
[% END %]
</tbody>
</table>
[% END %]

View File

@ -45,8 +45,7 @@
[% IF jobset.errormsg %]
<li><a href="#tabs-errors" data-toggle="tab"><span class="text-warning">Evaluation errors</span></a></li>
[% END %]
<li><a href="#tabs-job-status" data-toggle="tab">Job status</a></li>
<li><a href="#tabs-jobs" data-toggle="tab">All jobs</a></li>
<li><a href="#tabs-jobs" data-toggle="tab">Jobs</a></li>
<li><a href="#tabs-configuration" data-toggle="tab">Configuration</a></li>
</ul>
@ -141,8 +140,6 @@
[% INCLUDE makeLazyTab tabName="tabs-jobs" uri=c.uri_for('/jobset' project.name jobset.name "jobs-tab") %]
[% INCLUDE makeLazyTab tabName="tabs-job-status" uri=c.uri_for('/jobset' project.name jobset.name "job-status-tab") %]
</div>
[% END %]