Switch page history view to use jquery datatable

realms/modules/wiki/models.py

@@ -142,6 +142,20 @@ class WikiPage(object):
         finally:
             cache.set(self._cache_key('history'), cached_revs)
 
+    @property
+    def history_cache(self):
+        """Get info about the history cache.
+
+        :return: tuple -- (cached items, cache complete?)
+        """
+        cache_complete = False
+        cached_revs = cache.get(self._cache_key('history')) or []
+        if cached_revs:
+            if cached_revs[-1] == 'TAIL':
+                del cached_revs[-1]
+                cache_complete = True
+        return len(cached_revs), cache_complete
+
     @property
     def partials(self):
         data = self.data

realms/modules/wiki/views.py

@@ -64,22 +64,32 @@ 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
+    return render_template('wiki/history.html', name=name)
-    page = int(request.args.get('page', 1))
+
-    start_index = (page - 1) * items_per_page
+
-    hist = g.current_wiki.get_page(name).history
+@blueprint.route("/_history_data/<path:name>")
-    # Grab one extra item to see if there is a next page
+def history_data(name):
-    items = list(itertools.islice(hist, start_index, start_index+items_per_page+1))
+    """Ajax provider for paginated history data."""
-    more = False
+    if current_app.config.get('PRIVATE_WIKI') and current_user.is_anonymous():
-    if len(items) > items_per_page:
+        return current_app.login_manager.unauthorized()
-        more = True
+    draw = int(request.args.get('draw', 0))
-        items.pop()
+    start = int(request.args.get('start', 0))
-    if page > 1 and not items:
+    length = int(request.args.get('length', 10))
-        abort(404, 'Page is past end of history.')
+    page = g.current_wiki.get_page(name)
+    items = list(itertools.islice(page.history, start, start + length))
     for item in items:
         item['gravatar'] = gravatar_url(item['author_email'])
-    return render_template('wiki/history.html', name=name, history=items,
+    total_records, hist_complete = page.history_cache
-                           pagination={'page': page, 'more': more})
+    if not hist_complete:
+        # Force datatables to fetch more data when it gets to the end
+        total_records += 1
+    return {
+        'draw': draw,
+        'recordsTotal': total_records,
+        'recordsFiltered': total_records,
+        'data': items
+    }
+
 
 
 @blueprint.route("/_edit/<path:name>")

realms/templates/wiki/history.html

@@ -6,49 +6,14 @@
     <a class="btn btn-default btn-sm compare-revisions">Compare Revisions</a>
   </p>
 
-  <table class="table table-bordered revision-tbl">
+  <table class="table table-bordered revision-tbl data-table">
     <thead>
     <tr>
-      <th></th>
       <th>Name</th>
       <th>Revision Message</th>
       <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">
-          {% if h.type != 'delete' %}
-          <input type="checkbox" name="versions[]" value="{{ h.sha }}" />
-          {% endif %}
-        </td>
-        <td><img src="{{ h.gravatar }}?s=20" class="avatar"/> {{ h.author }}</td>
-        <td><a href="{{ url_for('wiki.commit', name=name, sha=h.sha) }}" class='label label-primary'>View</a> {{ h.message }} </td>
-        <td>{{ h.time|datetime }}</td>
-      </tr>
-    {% endfor %}
-    </tbody>
   </table>
   <p>
     <a class="btn btn-default btn-sm compare-revisions">Compare Revisions</a>
@@ -58,6 +23,24 @@
 
 {% block js %}
   <script>
+    $(document).ready(function() {
+      $('.data-table').dataTable({
+        serverSide: true,
+        ajax: '{{ url_for('.history_data', name=name) }}',
+        ordering: false,
+        bFilter: false,
+        columns: [
+          { "data": "author" },
+          { "data": "message" },
+          { "data": "time",
+            "render": function (data) {
+              var date = new Date(0);
+              date.setUTCSeconds(data)
+              return date.toDateString();
+            }}
+        ]
+      });
+    });
     $(function(){
       $('.revision-tbl :checkbox').change(function () {
         var $cs=$(this).closest('.revision-tbl').find(':checkbox:checked');