Skip to content

Commit

Permalink
Show filter on top and display current filter
Browse files Browse the repository at this point in the history
  • Loading branch information
Martchus committed Sep 14, 2016
1 parent 960c9d2 commit c7f0ba4
Show file tree
Hide file tree
Showing 3 changed files with 82 additions and 48 deletions.
35 changes: 28 additions & 7 deletions assets/javascripts/overview.js
Expand Up @@ -43,19 +43,32 @@ function setupOverview() {
var varPairs = window.location.search.substring(1).split('&');
var results = {};
var states = {};

var currentFilter = [];
var formatFilter = function(filter) {
return filter.replace(/_/g, ' ');
};

for (var j = 0; j < varPairs.length; ++j) {
var pair = varPairs[j].split('=');
if(pair.length > 1) {
var key = pair[0];
var val = pair[1];
if(val.length < 1) {
continue;
}
if (key === 'result') {
results[val] = true;
currentFilter.push(formatFilter(val));
} else if (key === 'state') {
states[val] = true;
currentFilter.push(formatFilter(val));
} else if (key === 'todo') {
$('#filter-todo').prop('checked', val !== '0');
currentFilter.push('TODO');
} else if (key === 'arch') {
$('#filter-arch').prop('value', val);
currentFilter.push(val);
} else {
var input = $('<input/>');
input.attr('value', val);
Expand All @@ -65,13 +78,21 @@ function setupOverview() {
}
}
}

// set enabled/disabled state of checkboxes (according to current filter)
$('#filter-results input').each(function(index, element) {
element.checked = results[element.id.substr(7)];
});
$('#filter-states input').each(function(index, element) {
element.checked = states[element.id.substr(7)];

var filterHeading = $('#filter-panel .panel-heading');
filterHeading.on('click', function() {
$('#filter-panel .panel-body').toggle(200);
});

if(currentFilter.length > 0) {
// set enabled/disabled state of checkboxes (according to current filter)
$('#filter-results input').each(function(index, element) {
element.checked = results[element.id.substr(7)];
});
$('#filter-states input').each(function(index, element) {
element.checked = states[element.id.substr(7)];
});
filterHeading.find('span').text('current: ' + currentFilter.join(', '));
}
}

39 changes: 26 additions & 13 deletions assets/stylesheets/overview.scss
Expand Up @@ -22,22 +22,35 @@
margin-right: 8px;
}

#filter-form {
strong {
display: block;
}
#filter-panel {
.panel-heading {
cursor: pointer;

.form-group {
label {
margin-left: 0px;
padding-left: 0px;
margin-right: 20px;
font-weight: normal;
span {
float: right;
color: #555;
font-weight: 500;
}
}
.panel-body {
display: none;
}

input {
margin-right: 2px;
padding-right: 0px;
#filter-form {
strong {
display: block;
}
.form-group {
label {
margin-left: 0px;
padding-left: 0px;
margin-right: 20px;
font-weight: normal;
}
input {
margin-right: 2px;
padding-right: 0px;
}
}
}
}
56 changes: 28 additions & 28 deletions templates/test/overview.html.ep
Expand Up @@ -50,6 +50,34 @@
% }
</div>
</div>
<div class="panel panel-default" id="filter-panel">
<div class="panel-heading"><strong>Filter</strong> <span>no filter present, click to toggle filter form<span></div>
<div class="panel-body">
<form action="#" type="get" id="filter-form">
<div class="form-group" id="filter-results">
<strong>Result</strong>
% for my $result (OpenQA::Schema::Result::Jobs::RESULTS) {
<label><input value="<%= $result %>" name="result" type="checkbox" id="filter-<%= $result %>"> <%= ucfirst $result =~ s/_/ /r %></label>
% }
</div>
<div class="form-group" id="filter-states">
<strong>State</strong>
% for my $state (OpenQA::Schema::Result::Jobs::STATES) {
<label><input value="<%= $state %>" name="state" type="checkbox" id="filter-<%= $state %>"> <%= ucfirst $state =~ s/_/ /r %></label>
% }
</div>
<div class="form-group">
<strong>Architecture</strong>
<input type="text" class="form-control" name="arch" placeholder="any" id="filter-arch">
</div>
<div class="form-group">
<strong>Misc</strong>
<label><input value="1" name="todo" type="checkbox" id="filter-todo"> TODO</label>
</div>
<button type="submit" class="btn btn-default">Apply</button>
</form>
</div>
</div>
% my $failedid;
% for my $type (@$types) {
<h3>Flavor: <%= $type %></h3>
Expand Down Expand Up @@ -84,32 +112,4 @@
</tbody>
</table>
% }
<div class="panel panel-default">
<div class="panel-heading">Filter</div>
<div class="panel-body">
<form action="#" type="get" id="filter-form">
<div class="form-group" id="filter-results">
<strong>Result</strong>
% for my $result (OpenQA::Schema::Result::Jobs::RESULTS) {
<label><input value="<%= $result %>" name="result" type="checkbox" id="filter-<%= $result %>"> <%= ucfirst $result =~ s/_/ /r %></label>
% }
</div>
<div class="form-group" id="filter-states">
<strong>State</strong>
% for my $state (OpenQA::Schema::Result::Jobs::STATES) {
<label><input value="<%= $state %>" name="state" type="checkbox" id="filter-<%= $state %>"> <%= ucfirst $state =~ s/_/ /r %></label>
% }
</div>
<div class="form-group">
<strong>Architecture</strong>
<input type="text" class="form-control" name="arch" placeholder="any" id="filter-arch">
</div>
<div class="form-group">
<strong>Misc</strong>
<label><input value="1" name="todo" type="checkbox" id="filter-todo"> TODO</label>
</div>
<button type="submit" class="btn btn-default">Apply</button>
</form>
</div>
</div>
</div>

0 comments on commit c7f0ba4

Please sign in to comment.