Make the history view pagination prettier.

realms/modules/wiki/views.py

@@ -64,14 +64,14 @@ def revert():
 def history(name):
     if current_app.config.get('PRIVATE_WIKI') and current_user.is_anonymous():
         return current_app.login_manager.unauthorized()
-    ITEMS_PER_PAGE = 15
+    items_per_page = 15
     page = int(request.args.get('page', 1))
-    start_index = (page - 1) * ITEMS_PER_PAGE
-    hist = g.current_wiki.get_page(name).get_history()
+    start_index = (page - 1) * items_per_page
+    hist = g.current_wiki.get_page(name).history
     # Grab one extra item to see if there is a next page
-    items = hist[start_index:start_index+ITEMS_PER_PAGE+1]
+    items = list(itertools.islice(hist, start_index, start_index+items_per_page+1))
     more = False
-    if len(items) > ITEMS_PER_PAGE:
+    if len(items) > items_per_page:
         more = True
         items.pop()
     if page > 1 and not items:

realms/templates/wiki/history.html

@@ -15,6 +15,27 @@
       <th>Date</th>
     </tr>
     </thead>
+    {% if pagination.page > 1 or pagination.more %}
+      <tfoot>
+      <tr><td colspan="4">
+      <ul class="pagination" style="float: right">
+        <li class="paginate_button previous{% if pagination.page == 1 %} disabled{% endif %}">
+          <a href="{{ url_for('.history', name=name, page=pagination.page - 1) }}">Previous</a>
+        </li>
+        {% for p in range(1, pagination.page + 1) %}
+          <li class="paginate_button{% if p ==  pagination.page %} active{% endif %}">
+            <a href="{{ url_for('.history', name=name, page=p) }}">{{ p }}</a>
+          </li>
+        {% endfor %}
+        {% if pagination.more %}<li class="paginate_button disabled"><a>…</a></li>{% endif %}
+        <li class="paginate_button next{% if not pagination.more %} disabled{% endif %}">
+          <a href="{{ url_for('.history', name=name, page=pagination.page + 1) }}">Next</a>
+        </li>
+      </ul>
+      </td></tr>
+      </tfoot>
+    {% endif %}
+    <tbody>
     {% for h in history %}
       <tr>
         <td class="checkbox-cell text-center">
@@ -27,23 +48,8 @@
         <td>{{ h.time|datetime }}</td>
       </tr>
     {% endfor %}
+    </tbody>
   </table>
-  <!-- TODO: make this pagination look good -->
-  {% if pagination.page > 1 or pagination.more %}
-    <div>
-      {% if pagination.page > 1 %}
-        <a href="{{ url_for('.history', name=name, page=pagination.page - 1) }}">&lt;</a>
-      {% else %}
-        &lt;
-      {% endif %}
-      {{ pagination.page }}
-      {% if pagination.more %}
-        <a href="{{ url_for('.history', name=name, page=pagination.page + 1) }}">&gt;</a>
-      {% else %}
-        &gt;
-      {% endif %}
-    </div>
-  {% endif %}
   <p>
     <a class="btn btn-default btn-sm compare-revisions">Compare Revisions</a>
   </p>