add some pagination functionality

irclogs/api.py

@@ -1,4 +1,4 @@
 from .core import api
 from .models import Message
 
-api.create_api(Message, url_prefix='/api/v1')
+api.create_api(Message, results_per_page=25, url_prefix='/api/v1')

irclogs/static/js/app.js

@@ -11,6 +11,19 @@ app.config(['$routeProvider', function($routeProvider) {
 
 app.controller('MessageListCtrl', ['$scope', '$http', '$location', function($scope, $http, $location) {
     $scope.searchQuery = $location.search().q || '';
+    $scope.page_num = 1;
+    $scope.older = function() {
+        if ($scope.page_num !== $scope.total_pages) {
+            $scope.page_num++;
+            $scope.fetch();
+        }
+    };
+    $scope.newer = function() {
+        if ($scope.page_num !== 1) {
+            $scope.page_num--;
+            $scope.fetch();
+        }
+    };
     $scope.fetch = function() {
         if($scope.searchQuery.trim().length) {
             $location.search('q', $scope.searchQuery.trim());
@@ -19,14 +32,24 @@ app.controller('MessageListCtrl', ['$scope', '$http', '$location', function($sco
             method: 'GET',
             url: '/api/v1/message',
             params: {
-                q: {filters:[{
-                    name: 'body',
-                    op: 'like',
-                    val: '%' + $scope.searchQuery + '%',
-                }]},
+                q: {
+                    filters:[{
+                        name: 'body',
+                        op: 'like',
+                        val: '%' + $scope.searchQuery + '%',
+                    }],
+                    order_by:[{
+                        field: 'created',
+                        direction: 'desc',
+                    }],
+                },
+                page: $scope.page_num,
             },
         }).success(function(data) {
             $scope.messages = data.objects;
+            $scope.total_pages = data.total_pages;
         });
     };
 }]);
+
+

irclogs/templates/irclogs/index.html

@@ -21,16 +21,18 @@
                     <th>Timestamp</th>
                     <th>Nick</th>
                     <th>Message</th>
-            </thead>
+                </thead>
             <tr ng-repeat="message in messages">
                 <td>{{ message.created | date:'yyyy-MM-dd HH:mm:ss' }}</td>
                 <td>{{ message.nick }}</td>
                 <td>{{ message.body }}</td>
+                <td>{{ message.page }}</td>
             </tr>
         </table>
+        <button ng-click="newer()">Newer Posts</button>
+        <button ng-click="older()">Older Posts</button>
     </div>
 {% endraw %}
-
 </script>
 {% endblock %}