Skip to content
Permalink
Browse files
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
  • Loading branch information
Paul Hayes committed Feb 28, 2014
1 parent 0cc2c41 commit 58fdbf5a87196cf0230b7206e765e116540791a2
@@ -413,6 +413,17 @@ $tag-padding-left-right: (5em/14);
margin-bottom: $default-vertical-margin / 3;
}

.tag-type {
color: #999 !important;
border-color: #999;
text-transform: none;
}

.tag-type:hover {
background: #999 !important;
color: #fff !important;
}

.tag-active,
a.tag:focus,
a.tag:hover {
@@ -517,3 +528,22 @@ form .field_with_errors label {
width: 600px;
padding: 15px;
}

.filters a.inherit,
a.close-filter {
color: $text-color !important;
}

.active-filter {
position: relative;
margin-bottom: $default-vertical-margin;
}

.active-filter:last-child {
margin-bottom: 0 !important;
}

.selected-filter {
background: #eee;
color: $text-color !important;
}
@@ -40,18 +40,30 @@ def index
@mappings = @site.mappings.order(:path).page(params[:page])

if params[:http_status] == '301'
@filtered = true
@filtered_by_type = true
@mappings = @mappings.redirects
elsif (params[:http_status] == '410')
@filtered = true
@filtered_by_type = true
@mappings = @mappings.archives
end

@mappings = if params[:filter_field] == 'new_url'
@mappings.redirects.filtered_by_new_url(@path_contains)
else
@mappings.filtered_by_path(@path_contains)
if params[:contains].present?
@mappings = if params[:filter_field] == 'new_url'
@filtered_by_new_url = true
@filtered = true
@mappings.redirects.filtered_by_new_url(@path_contains)
else
@filtered_by_path = true
@filtered = true
@mappings.filtered_by_path(@path_contains)
end
end

if params[:tagged].present?
@filtered_by_tag = true
@filtered = true
@mappings = @mappings.tagged_with(params[:tagged])
end
end
@@ -1,64 +1,152 @@
<aside class="filters row">
<%= form_tag(site_mappings_path(@site), method: 'get', role: 'form', class: 'col-md-6') do %>
<ul class="nav nav-pills list-inline">
<li class="nav-pill-text">
<strong>Filter by</strong>
</li>
<li class="dropdown dropdown-with-text-input">
<a href="#filter" class="inherit" data-toggle="dropdown" role="button">
Path <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
<%
filtered = @filtered
filtered_by_new_url = @filtered_by_new_url
filtered_by_path = @filtered_by_path
filtered_by_tag = @filtered_by_tag
filtered_by_type = @filtered_by_type
%>

<aside class="filters row remove-bottom-margin add-top-margin" style="clear: both">

<div class="col-md-8">
<div class="panel panel-default">
<div class="panel-footer" style="background: transparent; border-top: none">
<% if filtered %>
<a href="?" class="pull-right inherit close-filter" style="margin-top: 5px">
<span class="glyphicon glyphicon-remove"></span>
</a>
<div class="dropdown-menu" role="menu">
<%= label_tag :contains, 'Path' %>
<div class="input-group">
<%= text_field_tag :contains, @path_contains, class: 'form-control', placeholder: 'eg /home' %>
<span class="input-group-btn">
<%= button_tag 'Filter', name: nil, class: 'btn btn-default ' %>
</span>
</div>
</div>
</li>
<li class="dropdown dropdown-with-text-input">
<a href="#filter" class="inherit" data-toggle="dropdown" role="button">
New URL <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
</a>
<div class="dropdown-menu" role="menu">
<%= label_tag :contains, 'New URL' %>
<div class="input-group">
<%= text_field_tag :contains, @path_contains, class: 'form-control', placeholder: 'eg https://www.gov.uk' %>
<span class="input-group-btn">
<%= button_tag 'Filter', name: nil, class: 'btn btn-default ' %>
</span>
</div>
</div>
</li>
<li class="dropdown">
<a href="#filter" class="inherit" data-toggle="dropdown" role="button">
Tag <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
</a>
<% tags = most_used_tags_for_site(@site, limit: 10) %>
<ul class="dropdown-menu" role="menu">
<% tags.each do |tag| %>
<li><a href="?tagged=<%= tag %>"><%= tag %></a></li>
<% end %>
</ul>
</li>
<li class="dropdown">
<a href="#filter" class="inherit" data-toggle="dropdown" role="button">
Type <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
</a>
<ul class="dropdown-menu" role="menu">
<% end %>
<ul class="nav nav-pills list-inline">
<li class="nav-pill-text">
<strong>Filter by</strong>
</li>
<% if filtered_by_path %>
<li>
<a href="#filter">Archive (200)</a>
<a href="?" class="inherit bold selected-filter">
<span class="glyphicon glyphicon-remove" style="font-size: 80%"></span> Path
</a>
</li>
<% else %>
<li class="dropdown dropdown-with-text-input">
<a href="#filter" class="inherit <% if filtered_by_path %>bold<% end %>" data-toggle="dropdown" role="button">
Path <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
</a>
<div class="dropdown-menu" role="menu">
<%= form_tag(site_mappings_path(@site), method: 'get', role: 'form', class: 'form') do %>
<%= label_tag :contains, 'Path' %>
<div class="input-group">
<%= text_field_tag :contains, @path_contains, class: 'form-control', placeholder: 'eg /home' %>
<span class="input-group-btn">
<%= button_tag 'Filter', name: nil, class: 'btn btn-default ' %>
</span>
</div>
<% end %>
</div>
</li>
<% end %>
<% if filtered_by_new_url %>
<li>
<a href="#filter">Redirect (1,456)</a>
<a href="?" class="inherit bold selected-filter">
<span class="glyphicon glyphicon-remove" style="font-size: 80%"></span> New URL
</a>
</li>
<% else %>
<li class="dropdown dropdown-with-text-input">
<a href="#filter" class="inherit" data-toggle="dropdown" role="button">
New URL <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
</a>
<div class="dropdown-menu" role="menu">
<%= form_tag(site_mappings_path(@site), method: 'get', role: 'form', class: 'form') do %>
<%= hidden_field_tag 'filter_field', 'new_url' %>
<%= label_tag :contains, 'New URL' %>
<div class="input-group">
<%= text_field_tag :contains, @path_contains, class: 'form-control', placeholder: 'eg https://www.gov.uk' %>
<span class="input-group-btn">
<%= button_tag 'Filter', name: nil, class: 'btn btn-default ' %>
</span>
</div>
<% end %>
</div>
</li>
</ul>
</li>
<li class="nav-pill-text text-muted">Sorted by path</li>
</ul>
<% end %>
<% end %>
<li class="dropdown">
<a href="#filter" class="inherit <% if filtered_by_tag %>bold selected-filter<% end %>" data-toggle="dropdown" role="button">
Tag <span class="glyphicon glyphicon-chevron-down" style="font-size: 80%"></span>
</a>
<% tags = most_used_tags_for_site(@site, limit: 10) %>
<ul class="dropdown-menu" role="menu">
<% tags.each do |tag| %>
<li><a href="?tagged=<%= tag %>"><%= tag %></a></li>
<% end %>
</ul>
</li>
<li class="dropdown">
<a href="#filter" class="inherit <% if filtered_by_type %>bold selected-filter<% end %>" data-toggle="dropdown" role="button">
<% 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>
</a>
<ul class="dropdown-menu" role="menu">
<% if filtered_by_type %>
<li>
<a href="?">All types</a>
</li>
<% end %>
<li>
<a href="?http_status=410">Archive (200)</a>
</li>
<li>
<a href="?http_status=301">Redirect (1,456)</a>
</li>
</ul>
</li>
<li class="nav-pill-text text-muted">Sorted by path</li>
</ul>

<% if filtered %>
</div>
<% if filtered_by_path || filtered_by_new_url || filtered_by_tag %>
<div class="panel-body" style="border-top: 1px solid #ddd">
<% if filtered_by_path %>
<div class="active-filter">
<%= label_tag :contains, 'Path' %>
<div class="input-group">
<%= text_field_tag :contains, @path_contains, class: 'form-control' %>
<span class="input-group-btn">
<%= button_tag 'Update path', name: nil, class: 'btn btn-default ' %>
</span>
</div>
</div>
<% end %>
<% if filtered_by_new_url %>
<div class="active-filter">
<%= label_tag :contains, 'New URL' %>
<div class="input-group">
<%= text_field_tag :contains, @path_contains, class: 'form-control' %>
<span class="input-group-btn">
<%= button_tag 'Update URL', name: nil, class: 'btn btn-default ' %>
</span>
</div>
</div>
<% end %>
<% if filtered_by_tag %>
<div class="active-filter">
<label>Tagged</label>
<ul class="tag-list remove-bottom-margin">
<% filtered_by_tags.each do |tag| %>
<li>
<%= link_to remove_tag_from_filter_path(tag), class: 'tag', title: "Remove “#{tag}” tag filter" do %>
<span class="glyphicon glyphicon-remove"></span> <%= tag %>
<% end %>
</li>
<% end %>
</ul>
</div>
<% end %>
</div>
<% end %>
</div>
<% end %>

</div>
</aside>
<script>
$('.dropdown-with-text-input .dropdown-menu').click(function (e) {
@@ -1,4 +1,4 @@
<% filtered_mappings = true if filtered_by_tags? || @path_contains.present? %>
<% filtered_mappings = true if @filtered %>
<% title = filtered_mappings ? 'Filtered mappings' : 'Mappings' %>
<% content_for(:page_title, "#{title} | #{@site.default_host.hostname}") %>
<% breadcrumb(filtered_mappings ? :filtered_mappings : :mappings, @site) %>

1 comment on commit 58fdbf5

@fofr

This comment has been minimized.

Copy link
Contributor

@fofr fofr commented on 58fdbf5 Feb 28, 2014

screen shot 2014-02-28 at 14 41 58

screen shot 2014-02-28 at 14 31 41

screen shot 2014-02-28 at 14 31 26

screen shot 2014-02-28 at 14 32 43

screen shot 2014-02-28 at 14 41 06

Please sign in to comment.