From c51731dc69b6e767dc85540c630cd0e86a76af2a Mon Sep 17 00:00:00 2001
From: Yemel Jardi <angel.jardi@gmail.com>
Date: Tue, 20 May 2014 11:14:52 -0700
Subject: [PATCH 1/2] Add pagination to transaction proposals All-tab

---
 index.html                     |  3 ++-
 js/controllers/transactions.js |  3 +++
 js/filters.js                  | 11 ++++++++++-
 3 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/index.html b/index.html
index e62cab0c0..d4237e5a3 100644
--- a/index.html
+++ b/index.html
@@ -388,7 +388,7 @@
             <li> <button  ng-click="show(true)" ng-disabled="loading || onlyPending" loading="Updating"> Pending </button>
             <li> <button  ng-click="show()" ng-disabled="loading || !onlyPending" loading="Updating"> All </button>
             </ul>
-            <div class="panel radius pending" ng-repeat="tx in txs | orderBy: 'createdTs':true">
+            <div class="panel radius pending" ng-repeat="tx in txs | orderBy: 'createdTs':true | paged:txpCurrentPage:txpItemsPerPage:onlyPending">
               <div class="txheader row m10">
                 <div class="large-8 medium-8 small-12 columns">
                   <div class="row" ng-repeat="out in tx.outs">
@@ -477,6 +477,7 @@
                 </div>
               </div>
             </div>
+            <pagination ng-show="!onlyPending" total-items="txs.length" items-per-page="txpItemsPerPage" page="txpCurrentPage" class="pagination-small"></pagination>
           </div>
           <div class="large-12 columns">
             <h4>Last transactions</h4>
diff --git a/js/controllers/transactions.js b/js/controllers/transactions.js
index 2094c2d4c..52cd13b57 100644
--- a/js/controllers/transactions.js
+++ b/js/controllers/transactions.js
@@ -8,6 +8,9 @@ angular.module('copay.transactions').controller('TransactionsController',
     $scope.onlyPending = true;
     $scope.lastShowed = false;
 
+    $scope.txpCurrentPage = 1;
+    $scope.txpItemsPerPage = 4;
+
     $scope.update = function () {
       $scope.loading = false;
       controllerUtils.updateTxs({onlyPending:$scope.onlyPending});
diff --git a/js/filters.js b/js/filters.js
index e726e280b..827df6404 100644
--- a/js/filters.js
+++ b/js/filters.js
@@ -19,4 +19,13 @@ angular.module('copay.filters', [])
         return { addr: key, value: dic[key] };
       });
     };
-  });
\ No newline at end of file
+  })
+  .filter('paged', function() {
+    return function(elements, page, pageSize, disable) {
+      if (disable) return elements;
+
+      var from = (page - 1) * pageSize;
+      var to = from + pageSize;
+      return elements.slice(from, to);;
+    };
+  });

From 15fc035ba974d447530935ddd1a08225f008c3a8 Mon Sep 17 00:00:00 2001
From: Yemel Jardi <angel.jardi@gmail.com>
Date: Tue, 20 May 2014 14:34:55 -0700
Subject: [PATCH 2/2] Move pagination of transaction proposals to the backend

---
 index.html                     | 4 ++--
 js/controllers/transactions.js | 7 ++++++-
 js/filters.js                  | 8 ++------
 js/services/controllerUtils.js | 8 ++++++--
 4 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/index.html b/index.html
index d4237e5a3..11a7c7966 100644
--- a/index.html
+++ b/index.html
@@ -388,7 +388,7 @@
             <li> <button  ng-click="show(true)" ng-disabled="loading || onlyPending" loading="Updating"> Pending </button>
             <li> <button  ng-click="show()" ng-disabled="loading || !onlyPending" loading="Updating"> All </button>
             </ul>
-            <div class="panel radius pending" ng-repeat="tx in txs | orderBy: 'createdTs':true | paged:txpCurrentPage:txpItemsPerPage:onlyPending">
+            <div class="panel radius pending" ng-repeat="tx in txs | paged">
               <div class="txheader row m10">
                 <div class="large-8 medium-8 small-12 columns">
                   <div class="row" ng-repeat="out in tx.outs">
@@ -477,7 +477,7 @@
                 </div>
               </div>
             </div>
-            <pagination ng-show="!onlyPending" total-items="txs.length" items-per-page="txpItemsPerPage" page="txpCurrentPage" class="pagination-small"></pagination>
+            <pagination ng-show="!onlyPending" total-items="txs.length" items-per-page="txpItemsPerPage" page="txpCurrentPage" on-select-page="show()" class="pagination-small"></pagination>
           </div>
           <div class="large-12 columns">
             <h4>Last transactions</h4>
diff --git a/js/controllers/transactions.js b/js/controllers/transactions.js
index 52cd13b57..b97659d89 100644
--- a/js/controllers/transactions.js
+++ b/js/controllers/transactions.js
@@ -13,7 +13,12 @@ angular.module('copay.transactions').controller('TransactionsController',
 
     $scope.update = function () {
       $scope.loading = false;
-      controllerUtils.updateTxs({onlyPending:$scope.onlyPending});
+      var from = ($scope.txpCurrentPage-1) * $scope.txpItemsPerPage;
+      var opts = {
+        onlyPending: $scope.onlyPending,
+        skip: !$scope.onlyPending ? [from, from + $scope.txpItemsPerPage] : null
+      };
+      controllerUtils.updateTxs(opts);
       $rootScope.$digest();
     };
 
diff --git a/js/filters.js b/js/filters.js
index 827df6404..5c685f61c 100644
--- a/js/filters.js
+++ b/js/filters.js
@@ -21,11 +21,7 @@ angular.module('copay.filters', [])
     };
   })
   .filter('paged', function() {
-    return function(elements, page, pageSize, disable) {
-      if (disable) return elements;
-
-      var from = (page - 1) * pageSize;
-      var to = from + pageSize;
-      return elements.slice(from, to);;
+    return function(elements) {
+      return elements.filter(Boolean);
     };
   });
diff --git a/js/services/controllerUtils.js b/js/services/controllerUtils.js
index d0298f0d7..f9a1bbc67 100644
--- a/js/services/controllerUtils.js
+++ b/js/services/controllerUtils.js
@@ -132,11 +132,15 @@ angular.module('copay.controllerUtils')
       console.log('## updating tx proposals', opts); //TODO
       var myCopayerId = w.getMyCopayerId();
       var pendingForUs = 0;
-      var inT = w.getTxProposals();
+      var inT = w.getTxProposals().sort(function(t1, t2) { return t1.createdTs < t2.createdTs });
       var txs  = [];
 
       console.log('[START LOOP]'); //TODO
-      inT.forEach(function(i){
+      inT.forEach(function(i, index){
+        if (opts.skip && (index < opts.skip[0] || index >= opts.skip[1])) {
+          return txs.push(null);
+        }
+
         if (myCopayerId != i.creator && !i.finallyRejected && !i.sentTs && !i.rejectedByUs && !i.signedByUs) {
           pendingForUs++;
         }