Merge pull request #42 from bitpay/feat/txp-at-home

Feat/txp at home

public/views/activity.html

@@ -23,10 +23,6 @@
           <span ng-include="'views/includes/walletActivity.html'"></span>
         </div>
 
-        <a class="item text-center" ui-sref="activity" ng-show="notificationsMore">
-          <span translate>More</span> ({{notificationsMore}})
-        </a>
-
         <div class="item" ng-show="!notifications[0]">
           <span translate>No recent activity</span>
         </div>

public/views/includes/txp.html

@@ -0,0 +1,23 @@
+<i class="icon ion-ios-circle-filled" ng-show="tx.pendingForUs" ng-style="{'color':tx.wallet.color}"></i>
+<span ng-show="!tx.merchant">
+  <span ng-show="addressbook[tx.toAddress] && !tx.message">
+    {{addressbook[tx.toAddress]}}
+  </span>
+  <span class="ellipsis" ng-show="!addressbook[tx.toAddress] && tx.message">
+    {{tx.message}}
+  </span>
+  <span ng-show="!addressbook[tx.toAddress] && !tx.message" translate>
+    Sending
+  </span>
+</span>
+<span ng-show="tx.merchant">
+  <span ng-show="tx.merchant.pr.ca"><i class="fi-lock"></i> {{tx.merchant.domain}}</span>
+  <span ng-show="!tx.merchant.pr.ca"><i class="fi-unlock"></i> {{tx.merchant.domain}}</span>
+</span>
+<span>
+  - {{tx.amountStr}}
+</span>
+<div class="item-note">
+  {{tx.wallet.name}} &middot; <time>{{ (tx.ts || tx.createdOn ) * 1000 | amTimeAgo}}</time>
+</div>
+

public/views/includes/walletActivity.html

@@ -1,5 +1,4 @@
 <span class="wallet-activity">
-
   <div ng-if="x.type ==  'NewCopayer' && x.wallet.n>1">
     Copayer joined 
   </div>
@@ -25,36 +24,32 @@
   </div>
 
   <div ng-if="x.type == 'TxProposalRemoved'">
-    <i class="icon ion-ios-close-empty size-21" ng-style="{'color':x.wallet.color}"></i>
     <span translate>Proposal Deleted</span>: 
-    <i>{{x.message}}</i>
+    <b>{{x.message}}</b>
     <div class="wallet-activity-amount">
       {{x.amountStr}}:
     </div>
   </div>
 
-  <div ng-if="x.type == 'TxProposalRejected'">
+  <div ng-if="x.type == 'TxProposalRejectedBy'">
-    <i class="icon ion-ios-close-empty size-21" ng-style="{'color':x.wallet.color}"></i>
     <span translate>Proposal Rejected</span>:
-    <i>{{x.message}}</i>
+    <b>{{x.message}}</b>
     <div class="wallet-activity-amount">
       {{x.amountStr}}:
       </div>
   </div>
 
   <span ng-if="x.type == 'NewTxProposal'">
-    <i class="icon ion-arrow-up-c size-21" ng-style="{'color':x.wallet.color}"></i>
     <span translate>New Proposal</span>:
-    <i>{{x.message}}</i>
+    <b>{{x.message}}</b>
     <div class="wallet-activity-amount">
     {{x.amountStr}} 
     </div>
   </span>
 
   <span ng-if="x.type == 'TxProposalAcceptedBy'">
-    <i class="icon ion-checkmark-round size-21" ng-style="{'color':x.wallet.color}"></i>
+    <span translate>Proposal Accepted</span>:
-    <span translate>Proposal Accepted</span>
+    <b>{{x.message}}</b>
-    <i>{{x.message}}</i>
     <div class="wallet-activity-amount">
     {{x.amountStr}}
     </div>

public/views/proposals.html

@@ -0,0 +1,23 @@
+
+<ion-view>
+  <ion-nav-bar class="bar-royal">
+    <ion-nav-title>Pending Proposals</ion-nav-title>
+    <ion-nav-buttons side="primary">
+      <button class="button back-button" ui-sref="tabs.home">
+        <i class="icon ion-ios-arrow-thin-left"></i>
+      </button>
+    </ion-nav-buttons>
+  </ion-nav-bar>
+  <ion-content class="padding" ng-controller="proposalsController" ng-init="init()">
+
+   <div class="list card">
+      <a ng-repeat="tx in txps" class="item item-icon-left" ng-click="openTxpModal(tx)">
+        <span ng-include="'views/includes/txp.html'"></span>
+      </a>
+
+      <div class="item" ng-show="!txps[0]">
+        <span translate>No pending proposals</span>
+      </div>
+    </div>
+  </ion-content>
+</ion-view>

public/views/tab-home.html

@@ -5,7 +5,21 @@
 
   <ion-content class="padding" ng-controller="tabHomeController" ng-init="updateAllWallets(); nextStep()">
 
-    <div class="list card" ng-hide="!notifications[0]">
+
+    <div class="list card" ng-hide="!txps[0]">
+      <a class="item item-icon-right item-heading" ui-sref="proposals" translate>
+        Payment Proposals
+        <i class="icon ion-ios-arrow-right nav-item-arrow-right"></i>
+
+        <span class="badge badge-assertive" ng-show="txpsN>3" translate> {{txpsN}}</span>
+      </a>
+
+      <a ng-repeat="tx in txps" class="item item-icon-left" ng-click="openTxpModal(tx)">
+        <span ng-include="'views/includes/txp.html'"></span>
+      </a>
+    </div>
+
+    <div class="list card">
       <a class="item item-icon-right item-heading" ui-sref="activity" translate>
         Recent Activity
         <i class="icon ion-ios-arrow-right nav-item-arrow-right"></i>

public/views/walletDetails.html

@@ -104,34 +104,11 @@
       <h4 ng-show="!requiresMultipleSignatures" class="title m0" translate>Unsent transactions</h4>
       <div class="list card">
         <ul>
-          <li ng-repeat="tx in txps" class="item item-icon-left"
+          <li ng-repeat="tx in txps" class="item item-icon-left" ng-click="openTxpModal(tx)">
-            ng-click="openTxpModal(tx)">
+            <span ng-include="'views/includes/txp.html'"></span>
-            <i class="icon ion-ios-circle-filled" ng-show="tx.pendingForUs" ng-style="{'color':tx.wallet.color}"></i>
-            <span ng-show="!tx.merchant">
-              <span ng-show="addressbook[tx.toAddress] && !tx.message">
-                {{addressbook[tx.toAddress]}}
-              </span>
-              <span class="ellipsis" ng-show="!addressbook[tx.toAddress] && tx.message">
-                {{tx.message}}
-              </span>
-              <span ng-show="!addressbook[tx.toAddress] && !tx.message" translate>
-                Sending
-              </span>
-            </span>
-            <span ng-show="tx.merchant">
-              <span ng-show="tx.merchant.pr.ca"><i class="fi-lock"></i> {{tx.merchant.domain}}</span>
-              <span ng-show="!tx.merchant.pr.ca"><i class="fi-unlock"></i> {{tx.merchant.domain}}</span>
-            </span>
-            <span>
-              - {{tx.amountStr}}
-            </span>
-            <div class="item-note">
-              {{tx.wallet.name}} &middot; <time>{{ (tx.ts || tx.createdOn ) * 1000 | amTimeAgo}}</time>
-            </div>
           </li>
         </ul>
 
-
         <div ng-show="lockedBalanceSat">
           <span translate>Total Locked Balance</span>:
           <b>{{lockedBalanceStr}} </b>

src/js/controllers/proposals.js

@@ -0,0 +1,23 @@
+
+'use strict';
+
+angular.module('copayApp.controllers').controller('proposalsController',
+  function($timeout, $scope, profileService, $log, txpModalService) {
+    var self = this;
+
+
+    $scope.init = function() {
+      profileService.getTxps(50, function(err, txps) {
+        if (err) {
+          console.log('[tab-home.js.35:err:]', $log.error(err)); //TODO
+          return;
+        }
+        $scope.txps = txps;
+        $timeout(function() {
+          $scope.$apply();
+        }, 1);
+      });
+    }
+
+    $scope.openTxpModal = txpModalService.open;
+  });

src/js/controllers/tab-home.js

@@ -1,18 +1,23 @@
 'use strict';
 
 angular.module('copayApp.controllers').controller('tabHomeController',
-  function($rootScope, $timeout, $scope, $state, $ionicScrollDelegate, lodash, profileService, walletService, configService, txFormatService, $ionicModal, $log, platformInfo, storageService) {
+  function($rootScope, $timeout, $scope, $state, $ionicScrollDelegate, lodash, profileService, walletService, configService, txFormatService, $ionicModal, $log, platformInfo, storageService, txpModalService) {
 
     $scope.externalServices = {};
     $scope.bitpayCardEnabled = true; // TODO
 
-    var setNotifications = function(notifications) {
+
-      $scope.notifications = notifications;
+
-      $timeout(function() {
+    var setPendingTxps = function(txps) {
-        $scope.$apply();
+      if (!txps) {
-      }, 1);
+        $scope.txps = [];
+        return;
+      }
+      $scope.txps = lodash.sortBy(txps, 'createdOn').reverse();
     };
 
+
+
     $scope.updateAllWallets = function() {
       $scope.wallets = profileService.getWallets();
       if (lodash.isEmpty($scope.wallets)) return;
@@ -26,9 +31,25 @@ angular.module('copayApp.controllers').controller('tabHomeController',
         walletService.getStatus(wallet, {}, function(err, status) {
           if (err) {
             console.log('[tab-home.js.35:err:]', $log.error(err)); //TODO
-            return;
+          } else {
+            wallet.status = status;
+          }
+          if (++j==i) {
+            profileService.getTxps({
+              limit: 3
+            }, function(err, txps, n) {
+              if (err) {
+                console.log('[tab-home.js.35:err:]', $log.error(err)); //TODO
+              }
+              $scope.txps = txps;
+              $scope.txpsN = n;
+              $ionicScrollDelegate.resize();
+
+              $timeout(function() {
+                $scope.$apply();
+              }, 1);
+            });
           }
-          wallet.status = status;
         });
       });
 
@@ -41,8 +62,13 @@ angular.module('copayApp.controllers').controller('tabHomeController',
           return;
         }
         $scope.fetchingNotifications = false;
-        setNotifications(n);
+        $scope.notifications = n;
         $ionicScrollDelegate.resize();
+
+        $timeout(function() {
+          $scope.$apply();
+        }, 1);
+
       })
     };
 
@@ -57,13 +83,27 @@ angular.module('copayApp.controllers').controller('tabHomeController',
 
         profileService.getNotifications({
           limit: 3
-        }, function(err, n) {
+        }, function(err, notifications) {
           if (err) {
             console.log('[tab-home.js.35:err:]', $log.error(err)); //TODO
             return;
           }
-          setNotifications(n);
+          $scope.notifications = notifications;
-          $ionicScrollDelegate.resize();
+
+          profileService.getTxps({
+            limit: 3
+          }, function(err, txps, n) {
+            if (err) {
+              console.log('[tab-home.js.35:err:]', $log.error(err)); //TODO
+            }
+            $scope.txps = txps;
+            $scope.txpsN = n;
+            $ionicScrollDelegate.resize();
+
+            $timeout(function() {
+              $scope.$apply();
+            }, 1);
+          })
         })
       });
     };
@@ -101,4 +141,7 @@ angular.module('copayApp.controllers').controller('tabHomeController',
       $scope.coinbaseEnabled = config.coinbase.enabled && !isWindowsPhoneApp;
     });
 
+    $scope.openTxpModal = txpModalService.open;
+
+
   });

src/js/controllers/walletDetails.js

@@ -1,6 +1,6 @@
 'use strict';
 
-angular.module('copayApp.controllers').controller('walletDetailsController', function($scope, $rootScope, $interval, $timeout, $filter, $log, $ionicModal, $ionicPopover, $ionicNavBarDelegate, $state, $stateParams, bwcError, profileService, lodash, configService, gettext, gettextCatalog, platformInfo, walletService, $ionicPopup) {
+angular.module('copayApp.controllers').controller('walletDetailsController', function($scope, $rootScope, $interval, $timeout, $filter, $log, $ionicModal, $ionicPopover, $ionicNavBarDelegate, $state, $stateParams, bwcError, profileService, lodash, configService, gettext, gettextCatalog, platformInfo, walletService, $ionicPopup, txpModalService) {
 
   var isCordova = platformInfo.isCordova;
   var isWP = platformInfo.isWP;
@@ -47,26 +47,7 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun
   };
 
 
-  var glideraActive = true; // TODO TODO TODO
+  $scope.openTxpModal = txpModalService.open;
-  // isGlidera flag is a security measure so glidera status is not
-  // only determined by the tx.message
-  $scope.openTxpModal = function(tx) {
-    var config = configService.getSync().wallet;
-    var scope = $rootScope.$new(true);
-    scope.tx = tx;
-    scope.wallet = tx.wallet;
-    scope.copayers = tx.wallet.copayers;
-    scope.isGlidera = glideraActive;
-    scope.currentSpendUnconfirmed = config.spendUnconfirmed;
-
-    $ionicModal.fromTemplateUrl('views/modals/txp-details.html', {
-      scope: scope
-    }).then(function(modal) {
-      scope.txpDetailsModal = modal;
-      scope.txpDetailsModal.show();
-    });
-  };
-
 
   var listeners = [
     $rootScope.$on('bwsEvent', function(e, walletId) {

src/js/routes.js

@@ -147,7 +147,10 @@ angular.module('copayApp').config(function(historicLogProvider, $provide, $logPr
         url: '/activity',
         templateUrl: 'views/activity.html'
       })
-
+      .state('proposals', {
+        url: '/proposals',
+        templateUrl: 'views/proposals.html'
+      })
 
     /*
      *

src/js/services/profileService.js

@@ -123,6 +123,12 @@ angular.module('copayApp.services')
         if (wallet.cachedActivity)
           wallet.cachedActivity.isValid = false;
 
+
+        if (wallet.cachedTxps)
+          wallet.cachedTxps.isValid = false;
+
+
+
         $rootScope.$emit('bwsEvent', wallet.id, n.type, n);
       });
 
@@ -780,7 +786,7 @@ angular.module('copayApp.services')
       };
 
 
-      function getNotifications(wallet, cb2) {
+      function updateNotifications(wallet, cb2) {
         if (isActivityCached(wallet) && !opts.force) return cb2();
 
         wallet.getNotifications({
@@ -858,7 +864,7 @@ angular.module('copayApp.services')
       };
 
       lodash.each(w, function(wallet) {
-        getNotifications(wallet, function(err) {
+        updateNotifications(wallet, function(err) {
           j++;
           if (err) {
             $log.warn('Error updating notifications:' + err);
@@ -892,5 +898,33 @@ angular.module('copayApp.services')
       });
     };
 
+
+    root.getTxps = function(opts, cb) {
+      var MAX = 100;
+      opts = opts || {};
+
+      var w = root.getWallets();
+      if (lodash.isEmpty(w)) return cb();
+
+      var txps = [];
+
+      function process(notifications) {
+        if (!notifications) return [];
+
+        var shown = lodash.sortBy(notifications, 'createdOn').reverse();
+        shown = shown.splice(0, opts.limit || MAX);
+        return shown;
+      };
+
+      lodash.each(w, function(x) {
+        if (x.pendingTxps)
+          txps = txps.concat(x.pendingTxps);
+      });
+      txps = lodash.sortBy(txps, 'createdOn');
+      txps = lodash.compact(lodash.flatten(txps)).slice(0,MAX);
+      var n = txps.length;
+      return cb(null, process(txps), n);
+    };
+
     return root;
   });

src/js/services/txpModalService.js

@@ -0,0 +1,31 @@
+'use strict';
+
+angular.module('copayApp.services').factory('txpModalService', function(configService, $rootScope, $ionicModal) {
+
+  var root = {};
+
+
+  var glideraActive = true; // TODO TODO TODO
+  // isGlidera flag is a security measure so glidera status is not
+  // only determined by the tx.message
+
+
+  root.open = function(tx) {
+    var config = configService.getSync().wallet;
+    var scope = $rootScope.$new(true);
+    scope.tx = tx;
+    scope.wallet = tx.wallet;
+    scope.copayers = tx.wallet.copayers;
+    scope.isGlidera = glideraActive;
+    scope.currentSpendUnconfirmed = config.spendUnconfirmed;
+
+    $ionicModal.fromTemplateUrl('views/modals/txp-details.html', {
+      scope: scope
+    }).then(function(modal) {
+      scope.txpDetailsModal = modal;
+      scope.txpDetailsModal.show();
+    });
+  };
+
+  return root;
+});