refactor isChange logic

css/main.css

@@ -325,3 +325,6 @@ hr { margin: 2.25rem 0;}
   background: #C0392B;
 }
 
+a.loading {
+  background: #fff;
+}

index.html

@@ -18,11 +18,15 @@
               <span class="logo"></span>
             </div>
             <div class="large-9 medium-9 columns text-center p10t" ng-show="$root.wallet">
-              <div class="large-4 medium-4 columns line-dashed-v">
+              <div class="large-4 columns line-dashed-v">
                 <a href="#/addresses" class="has-tip" tooltip-placement="bottom" tooltip="{{$root.wallet.id}}">
                   <strong><span>{{$root.getWalletDisplay()}}</span></strong>
                 </a> 
-                <a class="button radius small-icon" href="#" title="Signout" ng-click="signout()"><i class="fi-power"></i></a>
+                <a class="button radius small-icon" title="Manual Refresh"
+                  ng-disabled="$root.loading"
+                  ng-click="refresh()"><i class="fi-refresh"></i></a>
+                <a class="button radius small-icon" title="Signout" 
+                  ng-click="signout()"><i class="fi-power"></i></a>
               </div>
               <div class="large-4 medium-4 columns line-dashed-v">
                 Balance: {{totalBalance || 0}} <i class="fi-bitcoin"></i><br>
@@ -248,29 +252,34 @@
       <div class="addresses" data-ng-controller="AddressesController">
         <div ng-show='$root.wallet.publicKeyRing.isComplete()'>
           <div class="row">
-            <div class="large-9 columns" ng-if="addrs[0]">
+            <div class="large-9 columns" ng-if="addrInfos[0]">
               <div class="large-8 columns">
-                <a class="panel db" ng-repeat="addr in addrs" ng-click="selectAddr(addr)">
+                <a class="panel db" ng-repeat="addrInfo in addrInfos"
-                  <span>{{addr}}</span>
+                  ng-click="selectAddr(addrInfo.address.toString())">
-                  <span ng-if="!isMain[addr]">(change)</span>
+                  <span>{{addrInfo.address.toString()}}</span>
-                  <span ng-if="typeof(balanceByAddr[addr]) !== 'undefined'" class="right">
+                  <span ng-if="addrInfo.isChange">(change)</span>
-                    {{balanceByAddr[addr]}} <i class="fi-bitcoin"></i>
+                  <span class="right">
-                  </span>
+                    <span ng-if="$root.loading">...</span>
-                  <span ng-if="typeof(balanceByAddr[addr]) === 'undefined'" class="right">
+                    <span ng-if="!$root.loading">{{balanceByAddr[addrInfo.address.toString()] || 0}}</span>
-                    Loading...
+                    <i class="fi-bitcoin"></i>
                   </span>
                 </a>
               </div>
               <div class="large-4 columns line-dashed-v text-center">
                 <qrcode size="160" data="{{selectedAddr}}"></qrcode>
-                <p class="m10t" ng-repeat="addr in addrs" ng-if="selectedAddr==addr">
+                <p class="m10t">
-                  <strong> {{balanceByAddr[addr]}} <i class="fi-bitcoin"></i> </strong>
+                  <strong>
+                    <span ng-if="$root.loading">...</span>
+                    <span ng-if="!$root.loading">{{balanceByAddr[selectedAddr] || 0}}</span>
+                    <i class="fi-bitcoin"></i>
+                  </strong>
                 </p>
               </div>
             </div>
-            <div class="columns text-center" ng-class="{'large-3' : addrs[0]}">
+            <div class="columns text-center" ng-class="{'large-3' : !!addrInfos[0]}">
               <p> Create a New <strong> Address </strong> </p>
-              <button class="secondary radius expandi new-address" ng-click="newAddr()" ng-disabled="loading" loading="Creating"> Create </button>
+              <button class="secondary radius expandi new-address" ng-click="newAddr()"
+                ng-disabled="loading" loading="Creating"> Create </button>
             </div>
           </div> 
         </div> 

js/controllers/addresses.js

@@ -2,38 +2,21 @@
 
 angular.module('copay.addresses').controller('AddressesController',
   function($scope, $rootScope, controllerUtils) {
-    $scope.title = 'Home';
-    $scope.addrBalance = {};
 
     var w = $rootScope.wallet;
-
+    $scope.loading = false;
-    var _updateBalance = function() {
-      $scope.addrs = w.getAddressesStr(true);
-      controllerUtils.setSocketHandlers();
-      w.getBalance(true, function(balance, balanceByAddr, isMain) {
-        if (balanceByAddr && Object.keys(balanceByAddr).length) {
-          $rootScope.balanceByAddr = balanceByAddr;
-          $scope.isMain = isMain;
-          $scope.addrs = Object.keys(balanceByAddr);
-          $scope.selectedAddr = $scope.addrs[0];
-          $scope.loading = false;
-          $rootScope.$digest();
-          alert('digest');
-        }
-      });
-    };
 
     $scope.newAddr = function() {
       $scope.loading = true;
       w.generateAddress();
-      _updateBalance();
+      controllerUtils.updateBalance(function() {
-      alert('new address');
+        $scope.loading = false;
+        $rootScope.$digest();
+      });
     };
 
     $scope.selectAddr = function(addr) {
       $scope.selectedAddr = addr;
     };
 
-    _updateBalance();
-    w.on('refresh', _updateBalance);
   });

js/controllers/header.js

@@ -40,7 +40,13 @@ angular.module('copay.header').controller('HeaderController',
         w.disconnect();
         controllerUtils.logout();
       }
-      $rootScope.flashMessage = {};
+      $scope.clearFlashMessage();
+    };
+
+    $scope.refresh = function() {
+      controllerUtils.updateBalance(function() {
+        $rootScope.$digest();
+      });
     };
 
     $scope.clearFlashMessage = function() {

js/models/core/PublicKeyRing.js

@@ -210,17 +210,29 @@ PublicKeyRing.prototype.generateAddress = function(isChange) {
 };
 
 PublicKeyRing.prototype.getAddresses = function(excludeChange) {
+  return this.getAddressesInfo(excludeChange).map(function(info) {
+    return info.address;
+  });
+};
+
+PublicKeyRing.prototype.getAddressesInfo = function(excludeChange) {
   var ret = [];
-
-  for (var i=0; i<this.addressIndex; i++) {
-    ret.unshift(this.getAddress(i,false));
-  }
-
   if (!excludeChange) {
     for (var i=0; i<this.changeAddressIndex; i++) {
-      ret.unshift(this.getAddress(i,true));
+      ret.unshift({
+        address: this.getAddress(i,true),
+        isChange: true
+      });
     }
   }
+
+  for (var i=0; i<this.addressIndex; i++) {
+    ret.unshift({
+      address: this.getAddress(i,false),
+      isChange: false
+    });
+  }
+
   return ret;
 };
 

js/models/core/Wallet.js

@@ -401,6 +401,7 @@ Wallet.prototype.addSeenToTxProposals = function() {
   return ret;
 };
 
+// TODO: remove this method and use getAddressesInfo everywhere
 Wallet.prototype.getAddresses = function(excludeChange) {
   return this.publicKeyRing.getAddresses(excludeChange);
 };
@@ -411,6 +412,10 @@ Wallet.prototype.getAddressesStr = function(excludeChange) {
   });
 };
 
+Wallet.prototype.getAddressesInfo = function(excludeChange) {
+  return this.publicKeyRing.getAddressesInfo(excludeChange);
+};
+
 Wallet.prototype.addressIsOwn = function(addrStr) {
   var addrList = this.getAddressesStr();
   var l = addrList.length;
@@ -430,15 +435,6 @@ Wallet.prototype.getBalance = function(safe, cb) {
   var balanceByAddr = {};
   var isMain = {};
   var COIN = bitcore.util.COIN;
-  var addresses = this.getAddressesStr(true);
-
-  if (!addresses.length) return cb(0, []);
-
-  // Prefill balanceByAddr with main address
-  addresses.forEach(function(a) {
-    balanceByAddr[a] = 0;
-    isMain[a] = 1;
-  });
   var f = safe ? this.getSafeUnspent.bind(this) : this.getUnspent.bind(this);
   f(function(utxos) {
     for (var i = 0; i < utxos.length; i++) {
@@ -453,7 +449,6 @@ Wallet.prototype.getBalance = function(safe, cb) {
       balanceByAddr[a] = balanceByAddr[a] / COIN;
     }
     balance = balance / COIN;
-
     return cb(balance, balanceByAddr, isMain);
   });
 };

js/services/controllerUtils.js

@@ -4,6 +4,8 @@ angular.module('copay.controllerUtils')
   .factory('controllerUtils', function($rootScope, $sce, $location, Socket, video) {
     var root = {};
     $rootScope.videoSrc = {};
+    $rootScope.loading = false;
+
     $rootScope.getVideoURL = function(copayer) {
       var encoded = $rootScope.videoSrc[copayer];
       if (!encoded) return;
@@ -43,7 +45,7 @@ angular.module('copay.controllerUtils')
           return;
         }
         $rootScope.videoSrc[peerID] = encodeURI(url);
-        $rootScope.$apply();
+        $rootScope.$digest();
       };
       w.on('badMessage', function(peerId) {
         $rootScope.flashMessage = {
@@ -53,11 +55,15 @@ angular.module('copay.controllerUtils')
       });
       w.on('created', function(myPeerID) {
         video.setOwnPeer(myPeerID, w, handlePeerVideo);
-        $location.path('addresses');
         $rootScope.wallet = w;
+        $location.path('addresses');
       });
       w.on('refresh', function() {
-        root.updateBalance();
+        root.setSocketHandlers();
+        root.updateBalance(function() {
+          $rootScope.$digest();
+        });
+        $rootScope.$digest();
       });
       w.on('publicKeyRingUpdated', function() {
         root.setSocketHandlers();
@@ -70,23 +76,31 @@ angular.module('copay.controllerUtils')
       w.netStart();
     };
 
-    root.updateBalance = function() {
+    root.updateBalance = function(cb) {
+      root.setSocketHandlers();
+      $rootScope.balanceByAddr = {};
       var w = $rootScope.wallet;
-      if (!w) return;
+      $rootScope.addrInfos = w.getAddressesInfo();
+      if ($rootScope.addrInfos.length === 0) return;
+      $rootScope.loading = true;
       w.getBalance(false, function(balance, balanceByAddr) {
+        console.log('New total balance:', balance);
         $rootScope.totalBalance = balance;
         $rootScope.balanceByAddr = balanceByAddr;
-        $rootScope.$digest();
+        $rootScope.selectedAddr = $rootScope.addrInfos[0].address.toString();
-        console.log('New total balance:', balance);
+        $rootScope.loading = false;
+        if (cb) cb();
       });
       w.getBalance(true, function(balance) {
-        $rootScope.availableBalance = balance;
-        $rootScope.$digest();
         console.log('New available balance:', balance);
+        $rootScope.availableBalance = balance;
+        $rootScope.loading = false;
+        if (cb) cb();
       });
     };
 
     root.setSocketHandlers = function() {
+      // TODO: optimize this?
       Socket.removeAllListeners();
       if (!$rootScope.wallet) return;
 
@@ -98,10 +112,11 @@ angular.module('copay.controllerUtils')
       addrs.forEach(function(addr) {
         Socket.on(addr, function(txid) {
           console.log('Received!', txid);
-          root.updateBalance();
+          root.updateBalance(function() {
+            $rootScope.$digest();
+          });
         });
       });
     };
-
     return root;
   });

js/services/video.js

@@ -72,7 +72,7 @@ Video.prototype._addCall = function(mediaConnection, cb) {
 }
 
 Video.prototype.close = function() {
-  if (this.localStream){
+  if (this.localStream) {
     this.localStream.stop();
     this.localStream.mozSrcObject = null;
     this.localStream.src = "";