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...
1 parent 0cc2c41 commit 58fdbf5a87196cf0230b7206e765e116540791a2 @fofr fofr committed Feb 28, 2014
@@ -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
Member
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.