Paged history loading.
authorRadek Czajka <rczajka@rczajka.pl>
Tue, 27 Jun 2023 11:13:30 +0000 (13:13 +0200)
committerRadek Czajka <rczajka@rczajka.pl>
Tue, 27 Jun 2023 11:13:30 +0000 (13:13 +0200)
src/redakcja/static/css/history.css
src/redakcja/static/js/wiki/view_history.js
src/redakcja/static/js/wiki/wikiapi.js
src/wiki/templates/wiki/tabs/history_view.html
src/wiki/views.py

index fd3ad03..18c606c 100644 (file)
@@ -6,6 +6,11 @@
 #history-view {
     flex: 1;
     overflow: auto;
+
+}
+
+#history-view .message-box {
+    text-align: center;
 }
 
 /*
index 8744995..6e30639 100644 (file)
@@ -1,10 +1,10 @@
 (function($){
 
     function HistoryPerspective(options) {
-               var old_callback = options.callback || function() {};
+       var old_callback = options.callback || function() {};
 
-               options.callback = function() {
-                       var self = this;
+       options.callback = function() {
+           var self = this;
             if (CurrentDocument.diff) {
                 rev_from = CurrentDocument.diff[0];
                 rev_to = CurrentDocument.diff[1];
                 });
             }
 
-                       // first time page is rendered
-               $('#make-diff-button').click(function() {
-                               self.makeDiff();
-                       });
+           // first time page is rendered
+            $('#make-diff-button').click(function() {
+               self.makeDiff();
+           });
 
-                       $('#pubmark-changeset-button').click(function() {
-                               self.showPubmarkForm();
-                       });
+           $('#pubmark-changeset-button').click(function() {
+               self.showPubmarkForm();
+           });
 
-               $('#doc-revert-button').click(function() {
-                   self.revertDialog();
-               });
+           $('#doc-revert-button').click(function() {
+               self.revertDialog();
+           });
 
-                       $('#open-preview-button').click(function(event) {
-                               var selected = $('#changes-list .entry.selected');
+           $('#open-preview-button').click(function(event) {
+               var selected = $('#changes-list .entry.selected');
 
-                               if (selected.length != 1) {
-                           window.alert("Wybierz dokładnie *jedną* wersję.");
-                       return;
-                       }
+               if (selected.length != 1) {
+                    window.alert("Wybierz dokładnie *jedną* wersję.");
+                    return;
+               }
 
-                               var version = parseInt($("*[data-stub-value='version']", selected[0]).text());
-                               window.open($(this).attr('data-basehref') + "?revision=" + version);
+               var version = parseInt($("*[data-stub-value='version']", selected[0]).text());
+               window.open($(this).attr('data-basehref') + "?revision=" + version);
 
-                               event.preventDefault();
-                       });
+               event.preventDefault();
+           });
 
-                    $(document).on('click', '#changes-list .entry', function(){
+            $(document).on('click', '#changes-list .entry', function(){
                var $this = $(this);
 
                var selected_count = $("#changes-list .entry.selected").length;
 
                if ($this.hasClass('selected')) {
-                       $this.removeClass('selected');
-                       selected_count -= 1;
+                    $this.removeClass('selected');
+                    selected_count -= 1;
                }
                else {
                    if (selected_count  < 2) {
                };
 
                $('#history-view-editor .toolbar button').attr('disabled', 'disabled').
-                            filter('*[data-enabled-when~="' + selected_count + '"]').
+                    filter('*[data-enabled-when~="' + selected_count + '"]').
                    attr('disabled', null);
-               });
+            });
 
-                    $(document).on('click', '#changes-list span.tag', function(event){
-                   return false;
-               });
+            $(document).on('click', '#changes-list span.tag', function(event){
+                return false;
+            });
 
-               old_callback.call(this);
-               }
+            $('#history-view').on('scroll', function() {
+                if (self.finished || self.fetching) return;
+                var elemTop = $('#history-view .message-box').offset().top;
+                var windowH = $(window).innerHeight();
+                if (elemTop - 20 < windowH) {
+                    self.triggerFetch();
+                }
+            });
+
+            old_callback.call(this);
+       }
 
-               $.wiki.Perspective.call(this, options);
+       $.wiki.Perspective.call(this, options);
     };
 
     HistoryPerspective.prototype = new $.wiki.Perspective();
 
     HistoryPerspective.prototype.onEnter = function(success, failure){
         $.wiki.Perspective.prototype.onEnter.call(this);
+        this.startFetching();
+        success && success();
+    };
 
-        $.blockUI({
-            message: 'Odświeżanie historii...'
-        });
+    HistoryPerspective.prototype.startFetching = function() {
+        $('#history-view .message-box').html('Wczytywanie historii…').show();
+        $('#changes-list').html('');
+        this.finished = false;
+        this.befored = '';
+        this.triggerFetch();
+    };
+    HistoryPerspective.prototype.stopFetching = function() {
+        self.finished = true;
+        $('#history-view .message-box').hide()
+    };
 
-        function _finalize(s){
-            $.unblockUI();
 
-            if (s) {
-                if (success)
-                    success();
-            }
-            else {
-                if (failure)
-                    failure();
-            }
+    HistoryPerspective.prototype.triggerFetch = function() {
+        var self = this;
+        self.fetching = true;
+
+        function _finalize() {
+            self.fetching = false;
         }
 
         function _failure(doc, message){
             $('#history-view .message-box').html('Nie udało się odświeżyć historii:' + message).show();
-            _finalize(false);
+            _finalize();
         };
 
         function _success(doc, data){
-            $('#history-view .message-box').hide();
+            //$('#history-view .message-box').hide(); ONLY AFTER LAST!
             var changes_list = $('#changes-list');
             var $stub = $('#history-view .row-stub');
-            changes_list.html('');
 
-                       var tags = $('select#id_addtag-tag option');
+            if (!data.length) {
+                self.stopFetching();
+            }
 
             $.each(data, function(){
                 $.wiki.renderStub({
-                                       container: changes_list,
-                                       stub: $stub,
-                                       data: this,
-                                       filters: {
-//                                             tag: function(value) {
-//                                                     return tags.filter("*[value='"+value+"']").text();
-//                                             }
-//                        description: function(value) {
-//                                                 return value.replace('\n', ');
-//                                             }
-                                       }
-                               });
+                   container: changes_list,
+                   stub: $stub,
+                   data: this,
+               });
+                self.before = this.version;
+                if (this.version == 1) {
+                    self.stopFetching();
+                }
             });
 
-            _finalize(true);
+            _finalize();
         };
 
-        return this.doc.fetchHistory({
+        this.doc.fetchHistory({
             success: _success,
-            failure: _failure
+            failure: _failure,
+            before: this.before,
         });
-    };
+    }
+
 
        HistoryPerspective.prototype.showPubmarkForm = function(){
                var selected = $('#changes-list .entry.selected');
index b53bf06..c05c501 100644 (file)
                        }
                });
        };
-       /*
-        * Fetch history of this document.
-        *
-        * from - First revision to fetch (default = 0) upto - Last revision to
-        * fetch (default = tip)
-        *
-        */
-       WikiDocument.prototype.fetchHistory = function(params) {
-               /* this doesn't modify anything, so no locks */
-               params = $.extend({}, noops, params);
-               var self = this;
-               $.ajax({
-                       method: "GET",
-                       url: reverse("ajax_document_history", self.id),
-                       dataType: 'json',
-                       data: {
-                               "from": params['from'],
-                               "upto": params['upto']
-                       },
-                       success: function(data) {
-                               params['success'](self, data);
-                       },
-                       error: function() {
-                               params['failure'](self, "Nie udało się wczytać historii dokumentu.");
-                       }
-               });
-       };
+    /*
+     * Fetch history of this document.
+     *
+     */
+    WikiDocument.prototype.fetchHistory = function(params) {
+       /* this doesn't modify anything, so no locks */
+       params = $.extend({}, noops, params);
+       var self = this;
+       $.ajax({
+           method: "GET",
+           url: reverse("ajax_document_history", self.id) + "?before=" + params.before,
+           dataType: 'json',
+           success: function(data) {
+               params['success'](self, data);
+           },
+           error: function() {
+               params['failure'](self, "Nie udało się wczytać historii dokumentu.");
+           }
+       });
+    };
        WikiDocument.prototype.fetchDiff = function(params) {
                /* this doesn't modify anything, so no locks */
                var self = this;
index d590f32..1384fb6 100644 (file)
 
     </div>
   </div>
-    <div id="history-view">
-        <p class="message-box" style="display:none;"></p>
-
-               <table id="changes-list-container">
-        <tbody id="changes-list">
-        </tbody>
-               <tbody style="display: none;">
-                       <tr class="entry row-stub">
-                       <td data-stub-value="version"></td>
-                       <td>
-                <span data-stub-value="date"></span>
-               <br/><span data-stub-value="author"></span>
-                               <br />
-                               <span data-stub-value="description"></span>
-                       </td>
-                       <td>
-                <div data-stub-value="publishable"></div>
-                <div data-stub-value="published"></div>
-                <div data-stub-value="tag"></div>
-                       </td>
-               </tr>
-               </tbody>
-               </table>
-    </div>
+  <div id="history-view">
+    <table id="changes-list-container">
+      <tbody id="changes-list">
+      </tbody>
+      <tbody style="display: none;">
+       <tr class="entry row-stub">
+         <td data-stub-value="version"></td>
+         <td>
+            <span data-stub-value="date"></span>
+            <br/><span data-stub-value="author"></span>
+           <br />
+           <span data-stub-value="description"></span>
+         </td>
+         <td>
+            <div data-stub-value="publishable"></div>
+            <div data-stub-value="published"></div>
+            <div data-stub-value="tag"></div>
+         </td>
+        </tr>
+      </tbody>
+    </table>
+    <p class="message-box" style="display:none;"></p>
+  </div>
 </div>
index 0b9cbc1..29c389a 100644 (file)
@@ -293,8 +293,15 @@ def history(request, chunk_id):
     if not doc.book.accessible(request):
         return HttpResponseForbidden("Not authorized.")
 
+    history = doc.history()
+    try:
+        before = int(request.GET.get('before'))
+    except:
+        pass
+    else:
+        history = history.filter(revision__lt=before)
     changes = []
-    for change in doc.history().reverse():
+    for change in history.reverse()[:20]:
         changes.append({
                 "version": change.revision,
                 "description": change.description,