From 0ae4534e00bc39e31e9052a660506fa8562d27fd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=A9r=C3=B4me=20Tamarelle?= <jerome@tamarelle.net>
Date: Thu, 19 Jul 2012 00:12:27 +0200
Subject: [PATCH] Implement infinite scrolling in commits list

---
 lib/GitList/Controller/CommitController.php |  4 ++-
 views/commits.twig                          | 35 +--------------------
 views/commits_list.twig                     | 34 ++++++++++++++++++++
 web/js/main.js                              | 19 +++++++++--
 4 files changed, 55 insertions(+), 37 deletions(-)
 create mode 100644 views/commits_list.twig

diff --git a/lib/GitList/Controller/CommitController.php b/lib/GitList/Controller/CommitController.php
index ead748f..7f7c956 100644
--- a/lib/GitList/Controller/CommitController.php
+++ b/lib/GitList/Controller/CommitController.php
@@ -25,7 +25,9 @@ class CommitController implements ControllerProviderInterface
                 $categorized[$date][] = $commit;
             }
 
-            return $app['twig']->render('commits.twig', array(
+            $template = $app['request']->isXmlHttpRequest() ? 'commits_list.twig' : 'commits.twig';
+
+            return $app['twig']->render($template, array(
                 'pager'          => $pager,
                 'repo'           => $repo,
                 'branch'         => $branch,
diff --git a/views/commits.twig b/views/commits.twig
index c4fdd03..9fb3034 100644
--- a/views/commits.twig
+++ b/views/commits.twig
@@ -7,40 +7,7 @@
 {% block content %}
     {% include 'breadcrumb.twig' with {breadcrumbs: [{dir: 'Commit history', path:''}]} %}
 
-    {% for date, commit in commits %}
-    <table class="table table-striped table-bordered">
-        <thead>
-            <tr>
-                <th colspan="3">{{ date | date("F j, Y") }}</th>
-            </tr>
-        </thead>
-        <tbody>
-            {% for item in commit %}
-            <tr>
-                <td width="5%"><img src="http://gravatar.com/avatar/{{ item.author.email | md5 }}?s=40" /></td>
-                <td width="95%">
-                    <span class="pull-right"><a class="btn btn-small" href="{{ path('commit', {repo: repo, commit: item.shortHash}) }}"><i class="icon-list-alt"></i> View {{ item.shortHash }}</a></span>
-                    <h4>{{ item.message }}</h4>
-                    <span><a href="mailto:{{ item.author.email }}">{{ item.author.name }}</a> authored in {{ item.date | date('d/m/Y \\a\\t H:i:s') }}</span>
-                </td>
-            </tr>
-            {% endfor %}
-        </tbody>
-    </table>
-    {% endfor %}
-
-    <ul class="pager">
-        {% if pager.current != 0 %}
-        <li class="previous">
-            <a href="?page={{ pager.previous }}">&larr; Newer</a>
-        </li>
-        {% endif %}
-        {% if pager.current != pager.last %}
-        <li class="next">
-            <a href="?page={{ pager.next }}">Older &rarr;</a>
-        </li>
-        {% endif %}
-    </ul>
+    {% include 'commits_list.twig' %}
 
     <hr>
 {% endblock %}
diff --git a/views/commits_list.twig b/views/commits_list.twig
new file mode 100644
index 0000000..e0ec786
--- /dev/null
+++ b/views/commits_list.twig
@@ -0,0 +1,34 @@
+{% for date, commit in commits %}
+<table class="table table-striped table-bordered">
+    <thead>
+        <tr>
+            <th colspan="3">{{ date | date("F j, Y") }}</th>
+        </tr>
+    </thead>
+    <tbody>
+        {% for item in commit %}
+        <tr>
+            <td width="5%"><img src="http://gravatar.com/avatar/{{ item.author.email | md5 }}?s=40" /></td>
+            <td width="95%">
+                <span class="pull-right"><a class="btn btn-small" href="{{ path('commit', {repo: repo, commit: item.shortHash}) }}"><i class="icon-list-alt"></i> View {{ item.shortHash }}</a></span>
+                <h4>{{ item.message }}</h4>
+                <span><a href="mailto:{{ item.author.email }}">{{ item.author.name }}</a> authored in {{ item.date | date('d/m/Y \\a\\t H:i:s') }}</span>
+            </td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+{% endfor %}
+
+<ul class="pager">
+    {% if pager.current != 0 %}
+    <li class="previous">
+        <a href="?page={{ pager.previous }}">&larr; Newer</a>
+    </li>
+    {% endif %}
+    {% if pager.current != pager.last %}
+    <li class="next">
+        <a href="?page={{ pager.next }}">Older &rarr;</a>
+    </li>
+    {% endif %}
+</ul>
diff --git a/web/js/main.js b/web/js/main.js
index d625d70..06a21c7 100755
--- a/web/js/main.js
+++ b/web/js/main.js
@@ -15,10 +15,25 @@ $(function () {
             readOnly: true,
             mode: mode
         });
-    };
+    }
 
     if ($('#readme-content').length) {
         var converter = new Showdown.converter();
         $('#readme-content').html(converter.makeHtml($('#readme-content').text()));
     }
-});
\ No newline at end of file
+
+    function paginate() {
+        var $pager = $('.pager');
+        $pager.find('.next a').one('click', function (e) {
+            e.preventDefault();
+            $(this).css('pointer-events', 'none');
+            $.get(this.href, function (html) {
+                $pager.after(html);
+                $pager.remove();
+                paginate();
+            });
+        });
+        $pager.find('.previous').remove();
+    }
+    paginate();
+});