Improve pagination in changeset details

app/assets/stylesheets/common.css.scss

@@ -1120,19 +1120,13 @@ a.donate {
 
     h4 {
       padding: 0;
+    }
+
+    .paginate {
+      float: right;
+      padding: 1px 6px;
+      border: 1px solid #eee;
       border-radius: 3px;
-    
-      &.paginate {
-        margin-top: 4px;
-        padding: 1px 6px;
-        border: 1px solid #eee;
-        span {
-          padding: 0 0 0 14px;
-          float: right;
-          border-left: 1px solid #eee;
-          > a { padding-left: 5px; }
-        }
-      }
     }
   }
 

app/helpers/browse_helper.rb

@@ -1,8 +1,4 @@
 module BrowseHelper
-  def link_to_page(page, page_param)
-    return link_to(page, page_param => page)
-  end
-
   def printable_name(object, version=false)
     if object.id.is_a?(Array)
       id = object.id[0]
@@ -61,6 +57,18 @@ module BrowseHelper
     end
   end
 
+  def type_and_paginated_count(type, pages)
+    if pages.page_count == 1
+      t "browse.changeset_details.#{type}",
+        :count => pages.item_count
+    else
+      t "browse.changeset_details.#{type}_paginated",
+        :x => pages.current_page.first_item,
+        :y => pages.current_page.last_item,
+        :count => pages.item_count
+    end
+  end
+
 private
 
   ICON_TAGS = [

app/views/browse/_paging_nav.html.erb

@@ -1,13 +1,5 @@
-<h4 class="paginate">
-<% current_page = pages.current_page %>
 <% if pages.page_count > 1 %>
-    <%= t'browse.paging_nav.showing_page' %>
+  <span class="paginate">
-    <%= current_page.number %> (<%= current_page.first_item %><%
+    <%= raw pagination_links_each(pages, {}) { |n| link_to(n, page_param => n) } %>
-    if (current_page.first_item < current_page.last_item) # if more than 1 trace on page
+  </span>
-      %>-<%= current_page.last_item %><%
-    end %>
-    <%= t'browse.paging_nav.of'%> <%= pages.item_count %>)
-
-<span><%= raw pagination_links_each(pages, {}) { |n| link_to_page(n, page_param) } %></span>
 <% end %>
-</h4>

app/views/browse/changeset.html.erb

@@ -1,52 +1,54 @@
-<h2><%= t 'browse.changeset.changeset', :id => @changeset.id %>
+<h2>
+  <%= t 'browse.changeset.changeset', :id => @changeset.id %>
   <a class="geolink" href="<%= root_path %>"><span class="icon close"></span></a>
 </h2>
+
 <div class="browse-section">
-  <p>
+  <p><%= @changeset.tags['comment'].to_s.presence || t('browse.changeset_details.no_comment') %></p>
-    <%=
-        @changeset.tags['comment'].to_s.presence || t('browse.changeset_details.no_comment')
-    %>
-  </p>
   <span><%= changeset_time_ago(@changeset) %></span>
 </div>
-  
+
-<%=
+<%= render :partial => "tag_details", :object => @changeset.tags.except('comment') %>
-  render :partial => "tag_details", :object => @changeset.tags.except('comment')
-%>
 
 <% unless @nodes.empty? %>
   <div class='browse-section paginate'>
-    <h4><%= t 'browse.changeset_details.has_nodes', :count => @node_pages.item_count %></h4>
+    <h4>
+      <%= type_and_paginated_count('node', @node_pages) %>
+      <%= render :partial => 'paging_nav', :locals => { :pages => @node_pages, :page_param => "node_page"} %>
+    </h4>
     <ul>
       <% @nodes.each do |node| %>
         <li><%= link_to h(printable_name(node, true)), { :action => "node", :id => node.node_id.to_s }, :class => link_class('node', node), :title => link_title(node) %></li>
       <% end %>
     </ul>
-    <%= render :partial => 'paging_nav', :locals => { :pages => @node_pages, :page_param => "node_page"} %>
   </div>
 <% end %>
 
 <% unless @ways.empty? %>
   <div class='browse-section  paginate'>
-    <h4><%= t 'browse.changeset_details.has_ways', :count => @way_pages.item_count %></h4>
+    <h4>
+      <%= type_and_paginated_count('way', @way_pages) %>
+      <%= render :partial => 'paging_nav', :locals => { :pages => @way_pages, :page_param => "way_page" } %>
+    </h4>
     <ul>
       <% @ways.each do |way| %>
         <li><%= link_to h(printable_name(way, true)), { :action => "way", :id => way.way_id.to_s }, :class => link_class('way', way), :title => link_title(way) %></li>
       <% end %>
     </ul>
-    <%= render :partial => 'paging_nav', :locals => { :pages => @way_pages, :page_param => "way_page" } %>
   </div>
 <% end %>
 
 <% unless @relations.empty? %>
   <div class='browse-section  paginate'>
-    <h4><%= t 'browse.changeset_details.has_relations', :count => @relation_pages.item_count %></h4>
+    <h4>
-      <ul>
+      <%= type_and_paginated_count('relation', @relation_pages) %>
-        <% @relations.each do |relation| %>
-          <li><%= link_to h(printable_name(relation, true)), { :action => "relation", :id => relation.relation_id.to_s }, :class => link_class('relation', relation), :title => link_title(relation) %></li>
-        <% end %>
-      </ul>
       <%= render :partial => 'paging_nav', :locals => { :pages => @relation_pages, :page_param => "relation_page" } %>
+    </h4>
+    <ul>
+      <% @relations.each do |relation| %>
+        <li><%= link_to h(printable_name(relation, true)), { :action => "relation", :id => relation.relation_id.to_s }, :class => link_class('relation', relation), :title => link_title(relation) %></li>
+      <% end %>
+    </ul>
   </div>
 <% end %>
 

config/locales/en.yml

@@ -130,9 +130,12 @@ en:
       created_at: "Created"
       closed_at: "Closed"
       belongs_to: "Author"
-      has_nodes: "Nodes (%{count})"
+      node: "Nodes (%{count})"
-      has_ways: "Ways (%{count})"
+      node_paginated: "Nodes (%{x}-%{y} of %{count})"
-      has_relations: "Relations (%{count})"
+      way: "Ways (%{count})"
+      way_paginated: "Ways (%{x}-%{y} of %{count})"
+      relation: "Relations (%{count})"
+      relation_paginated: "Relations (%{x}-%{y} of %{count})"
       no_comment: "(no comment)"
       ago: "%{ago} ago"
       by: "by"
@@ -189,9 +192,6 @@ en:
         way: way
         relation: relation
         changeset: changeset
-    paging_nav:
-      showing_page: "page"
-      of: "of"
     redacted:
       redaction: "Redaction %{id}"
       message_html: "Version %{version} of this %{type} cannot be shown as it has been redacted. Please see %{redaction_link} for details."