Skip to content

Commit 58fdbf5

Browse files
author
Paul Hayes
committed
Include filtered states
* Show path and new url fields when selected, for quick editing * Show a list of tags when selected, for quick removal * Highlight selected filters in the filter box * Add a link to quickly remove all filters
1 parent 0cc2c41 commit 58fdbf5

File tree

4 files changed

+191
-61
lines changed

4 files changed

+191
-61
lines changed

app/assets/stylesheets/base.css.scss

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -413,6 +413,17 @@ $tag-padding-left-right: (5em/14);
413413
margin-bottom: $default-vertical-margin / 3;
414414
}
415415

416+
.tag-type {
417+
color: #999 !important;
418+
border-color: #999;
419+
text-transform: none;
420+
}
421+
422+
.tag-type:hover {
423+
background: #999 !important;
424+
color: #fff !important;
425+
}
426+
416427
.tag-active,
417428
a.tag:focus,
418429
a.tag:hover {
@@ -517,3 +528,22 @@ form .field_with_errors label {
517528
width: 600px;
518529
padding: 15px;
519530
}
531+
532+
.filters a.inherit,
533+
a.close-filter {
534+
color: $text-color !important;
535+
}
536+
537+
.active-filter {
538+
position: relative;
539+
margin-bottom: $default-vertical-margin;
540+
}
541+
542+
.active-filter:last-child {
543+
margin-bottom: 0 !important;
544+
}
545+
546+
.selected-filter {
547+
background: #eee;
548+
color: $text-color !important;
549+
}

app/controllers/mappings_controller.rb

Lines changed: 16 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -40,18 +40,30 @@ def index
4040
@mappings = @site.mappings.order(:path).page(params[:page])
4141

4242
if params[:http_status] == '301'
43+
@filtered = true
44+
@filtered_by_type = true
4345
@mappings = @mappings.redirects
4446
elsif (params[:http_status] == '410')
47+
@filtered = true
48+
@filtered_by_type = true
4549
@mappings = @mappings.archives
4650
end
4751

48-
@mappings = if params[:filter_field] == 'new_url'
49-
@mappings.redirects.filtered_by_new_url(@path_contains)
50-
else
51-
@mappings.filtered_by_path(@path_contains)
52+
if params[:contains].present?
53+
@mappings = if params[:filter_field] == 'new_url'
54+
@filtered_by_new_url = true
55+
@filtered = true
56+
@mappings.redirects.filtered_by_new_url(@path_contains)
57+
else
58+
@filtered_by_path = true
59+
@filtered = true
60+
@mappings.filtered_by_path(@path_contains)
61+
end
5262
end
5363

5464
if params[:tagged].present?
65+
@filtered_by_tag = true
66+
@filtered = true
5567
@mappings = @mappings.tagged_with(params[:tagged])
5668
end
5769
end

app/views/mappings/_filters.html.erb

Lines changed: 144 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -1,64 +1,152 @@
1-
<aside class="filters row">
2-
<%= form_tag(site_mappings_path(@site), method: 'get', role: 'form', class: 'col-md-6') do %>
3-
<ul class="nav nav-pills list-inline">
4-
<li class="nav-pill-text">
5-
<strong>Filter by</strong>
6-
</li>
7-
<li class="dropdown dropdown-with-text-input">
8-
<a href="#filter" class="inherit" data-toggle="dropdown" role="button">
9-
Path <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
1+
<%
2+
filtered = @filtered
3+
filtered_by_new_url = @filtered_by_new_url
4+
filtered_by_path = @filtered_by_path
5+
filtered_by_tag = @filtered_by_tag
6+
filtered_by_type = @filtered_by_type
7+
%>
8+
9+
<aside class="filters row remove-bottom-margin add-top-margin" style="clear: both">
10+
11+
<div class="col-md-8">
12+
<div class="panel panel-default">
13+
<div class="panel-footer" style="background: transparent; border-top: none">
14+
<% if filtered %>
15+
<a href="?" class="pull-right inherit close-filter" style="margin-top: 5px">
16+
<span class="glyphicon glyphicon-remove"></span>
1017
</a>
11-
<div class="dropdown-menu" role="menu">
12-
<%= label_tag :contains, 'Path' %>
13-
<div class="input-group">
14-
<%= text_field_tag :contains, @path_contains, class: 'form-control', placeholder: 'eg /home' %>
15-
<span class="input-group-btn">
16-
<%= button_tag 'Filter', name: nil, class: 'btn btn-default ' %>
17-
</span>
18-
</div>
19-
</div>
20-
</li>
21-
<li class="dropdown dropdown-with-text-input">
22-
<a href="#filter" class="inherit" data-toggle="dropdown" role="button">
23-
New URL <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
24-
</a>
25-
<div class="dropdown-menu" role="menu">
26-
<%= label_tag :contains, 'New URL' %>
27-
<div class="input-group">
28-
<%= text_field_tag :contains, @path_contains, class: 'form-control', placeholder: 'eg https://www.gov.uk' %>
29-
<span class="input-group-btn">
30-
<%= button_tag 'Filter', name: nil, class: 'btn btn-default ' %>
31-
</span>
32-
</div>
33-
</div>
34-
</li>
35-
<li class="dropdown">
36-
<a href="#filter" class="inherit" data-toggle="dropdown" role="button">
37-
Tag <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
38-
</a>
39-
<% tags = most_used_tags_for_site(@site, limit: 10) %>
40-
<ul class="dropdown-menu" role="menu">
41-
<% tags.each do |tag| %>
42-
<li><a href="?tagged=<%= tag %>"><%= tag %></a></li>
43-
<% end %>
44-
</ul>
45-
</li>
46-
<li class="dropdown">
47-
<a href="#filter" class="inherit" data-toggle="dropdown" role="button">
48-
Type <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
49-
</a>
50-
<ul class="dropdown-menu" role="menu">
18+
<% end %>
19+
<ul class="nav nav-pills list-inline">
20+
<li class="nav-pill-text">
21+
<strong>Filter by</strong>
22+
</li>
23+
<% if filtered_by_path %>
5124
<li>
52-
<a href="#filter">Archive (200)</a>
25+
<a href="?" class="inherit bold selected-filter">
26+
<span class="glyphicon glyphicon-remove" style="font-size: 80%"></span> Path
27+
</a>
28+
</li>
29+
<% else %>
30+
<li class="dropdown dropdown-with-text-input">
31+
<a href="#filter" class="inherit <% if filtered_by_path %>bold<% end %>" data-toggle="dropdown" role="button">
32+
Path <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
33+
</a>
34+
<div class="dropdown-menu" role="menu">
35+
<%= form_tag(site_mappings_path(@site), method: 'get', role: 'form', class: 'form') do %>
36+
<%= label_tag :contains, 'Path' %>
37+
<div class="input-group">
38+
<%= text_field_tag :contains, @path_contains, class: 'form-control', placeholder: 'eg /home' %>
39+
<span class="input-group-btn">
40+
<%= button_tag 'Filter', name: nil, class: 'btn btn-default ' %>
41+
</span>
42+
</div>
43+
<% end %>
44+
</div>
5345
</li>
46+
<% end %>
47+
<% if filtered_by_new_url %>
5448
<li>
55-
<a href="#filter">Redirect (1,456)</a>
49+
<a href="?" class="inherit bold selected-filter">
50+
<span class="glyphicon glyphicon-remove" style="font-size: 80%"></span> New URL
51+
</a>
52+
</li>
53+
<% else %>
54+
<li class="dropdown dropdown-with-text-input">
55+
<a href="#filter" class="inherit" data-toggle="dropdown" role="button">
56+
New URL <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
57+
</a>
58+
<div class="dropdown-menu" role="menu">
59+
<%= form_tag(site_mappings_path(@site), method: 'get', role: 'form', class: 'form') do %>
60+
<%= hidden_field_tag 'filter_field', 'new_url' %>
61+
<%= label_tag :contains, 'New URL' %>
62+
<div class="input-group">
63+
<%= text_field_tag :contains, @path_contains, class: 'form-control', placeholder: 'eg https://www.gov.uk' %>
64+
<span class="input-group-btn">
65+
<%= button_tag 'Filter', name: nil, class: 'btn btn-default ' %>
66+
</span>
67+
</div>
68+
<% end %>
69+
</div>
5670
</li>
57-
</ul>
58-
</li>
59-
<li class="nav-pill-text text-muted">Sorted by path</li>
60-
</ul>
61-
<% end %>
71+
<% end %>
72+
<li class="dropdown">
73+
<a href="#filter" class="inherit <% if filtered_by_tag %>bold selected-filter<% end %>" data-toggle="dropdown" role="button">
74+
Tag <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
75+
</a>
76+
<% tags = most_used_tags_for_site(@site, limit: 10) %>
77+
<ul class="dropdown-menu" role="menu">
78+
<% tags.each do |tag| %>
79+
<li><a href="?tagged=<%= tag %>"><%= tag %></a></li>
80+
<% end %>
81+
</ul>
82+
</li>
83+
<li class="dropdown">
84+
<a href="#filter" class="inherit <% if filtered_by_type %>bold selected-filter<% end %>" data-toggle="dropdown" role="button">
85+
<% if filtered_by_type %><%= http_status_name(params[:http_status]).pluralize %><% else %>Type<% end %> <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
86+
</a>
87+
<ul class="dropdown-menu" role="menu">
88+
<% if filtered_by_type %>
89+
<li>
90+
<a href="?">All types</a>
91+
</li>
92+
<% end %>
93+
<li>
94+
<a href="?http_status=410">Archive (200)</a>
95+
</li>
96+
<li>
97+
<a href="?http_status=301">Redirect (1,456)</a>
98+
</li>
99+
</ul>
100+
</li>
101+
<li class="nav-pill-text text-muted">Sorted by path</li>
102+
</ul>
103+
104+
<% if filtered %>
105+
</div>
106+
<% if filtered_by_path || filtered_by_new_url || filtered_by_tag %>
107+
<div class="panel-body" style="border-top: 1px solid #ddd">
108+
<% if filtered_by_path %>
109+
<div class="active-filter">
110+
<%= label_tag :contains, 'Path' %>
111+
<div class="input-group">
112+
<%= text_field_tag :contains, @path_contains, class: 'form-control' %>
113+
<span class="input-group-btn">
114+
<%= button_tag 'Update path', name: nil, class: 'btn btn-default ' %>
115+
</span>
116+
</div>
117+
</div>
118+
<% end %>
119+
<% if filtered_by_new_url %>
120+
<div class="active-filter">
121+
<%= label_tag :contains, 'New URL' %>
122+
<div class="input-group">
123+
<%= text_field_tag :contains, @path_contains, class: 'form-control' %>
124+
<span class="input-group-btn">
125+
<%= button_tag 'Update URL', name: nil, class: 'btn btn-default ' %>
126+
</span>
127+
</div>
128+
</div>
129+
<% end %>
130+
<% if filtered_by_tag %>
131+
<div class="active-filter">
132+
<label>Tagged</label>
133+
<ul class="tag-list remove-bottom-margin">
134+
<% filtered_by_tags.each do |tag| %>
135+
<li>
136+
<%= link_to remove_tag_from_filter_path(tag), class: 'tag', title: "Remove “#{tag}” tag filter" do %>
137+
<span class="glyphicon glyphicon-remove"></span> <%= tag %>
138+
<% end %>
139+
</li>
140+
<% end %>
141+
</ul>
142+
</div>
143+
<% end %>
144+
</div>
145+
<% end %>
146+
</div>
147+
<% end %>
148+
149+
</div>
62150
</aside>
63151
<script>
64152
$('.dropdown-with-text-input .dropdown-menu').click(function (e) {

app/views/mappings/index.html.erb

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<% filtered_mappings = true if filtered_by_tags? || @path_contains.present? %>
1+
<% filtered_mappings = true if @filtered %>
22
<% title = filtered_mappings ? 'Filtered mappings' : 'Mappings' %>
33
<% content_for(:page_title, "#{title} | #{@site.default_host.hostname}") %>
44
<% breadcrumb(filtered_mappings ? :filtered_mappings : :mappings, @site) %>

0 commit comments

Comments
 (0)