From patchwork Wed Sep 18 18:52:24 2013
Content-Type: text/plain; charset="utf-8"
MIME-Version: 1.0
Content-Transfer-Encoding: 7bit
Subject: [1, of, 2] hgweb: add ajaxScrollInit function,
 which does the ajax requests and processing
From: Alexander Plavin <alexander@plav.in>
X-Patchwork-Id: 2526
Message-Id: <0a792989e90204557812.1379530344@debian-alexander.dolgopa>
To: mercurial-devel@selenic.com
Date: Wed, 18 Sep 2013 22:52:24 +0400

# HG changeset patch
# User Alexander Plavin <alexander@plav.in>
# Date 1379529852 -14400
#      Wed Sep 18 22:44:12 2013 +0400
# Node ID 0a792989e90204557812427f02ba2f176f08d8c1
# Parent  e8d739dbcf00190f5ee92cd18c1b015e2c2fc52f
hgweb: add ajaxScrollInit function, which does the ajax requests and processing

This function should be correctly called on a page, otherwise there is
no effect.
When called, it makes ajax requests for the next portion of changesets when the
user scrolls to the end. Also, when the monitor is high so that the
default amount of changesets isn't enough to fill it, multiple portions are
loaded if needed after the page load.

diff -r e8d739dbcf00 -r 0a792989e902 mercurial/templates/static/mercurial.js
--- a/mercurial/templates/static/mercurial.js	Fri Sep 06 13:30:58 2013 +0400
+++ b/mercurial/templates/static/mercurial.js	Wed Sep 18 22:44:12 2013 +0400
@@ -345,3 +345,61 @@
 function appendFormatHTML(element, formatStr, replacements) {
     element.insertAdjacentHTML('beforeend', format(formatStr, replacements));
 }
+
+function ajaxScrollInit(urlFormat,
+                        nextHash,
+                        nextHashRegex,
+                        containerSelector,
+                        messageFormat) {
+    updateInitiated = false;
+    container = document.querySelector(containerSelector);
+
+    function scrollHandler() {
+        if (updateInitiated) {
+            return;
+        }
+
+        var scrollHeight = document.documentElement.scrollHeight;
+        var clientHeight = document.documentElement.clientHeight;
+        var scrollTop = document.body.scrollTop
+            || document.documentElement.scrollTop;
+
+        if (scrollHeight - (scrollTop + clientHeight) < 50) {
+            updateInitiated = true;
+
+            if (!nextHash) {
+                return;
+            }
+
+            makeRequest(
+                format(urlFormat, {hash: nextHash}),
+                'GET',
+                function onstart() {
+                },
+                function onsuccess(htmlText) {
+                    var m = htmlText.match(nextHashRegex);
+                    nextHash = m ? m[1] : null;
+
+                    var doc = docFromHTML(htmlText);
+                    var nodes = doc.querySelector(containerSelector).children;
+                    while (nodes.length) {
+                        var node = nodes[0];
+                        node = document.adoptNode(node);
+                        container.appendChild(node);
+                    }
+                    process_dates();
+                },
+                function onerror(errorText) {
+                },
+                function oncomplete() {
+                    updateInitiated = false;
+                    scrollHandler();
+                }
+            );
+        }
+    }
+
+    window.addEventListener('scroll', scrollHandler);
+    window.addEventListener('resize', scrollHandler);
+    scrollHandler();
+}