fix offline notifications

public/views/history.html

@@ -2,16 +2,15 @@
   <div class="row m20t" ng-show="!index.txHistory[0]">
     <div class="large-12 columns">
       <div class="oh text-center">
-        <span ng-if="index.updatingTxHistory" class="text-gray" translate>Getting transactions...</span>
+        <span ng-if="index.updatingTxHistory" class="text-gray animated flash infinite" translate>Getting transactions...</span>
-
+        <span ng-if="!index.updatingTxHistory">
-          <div class="box-notification" ng-show="index.txHistoryError">
+          <span ng-show="index.txHistoryError">
-            <div class="box-icon error">
+              Could not fetch transaction history
-              <i class="fi-x size-24"></i>
+          </span>
-            </div>
+          <span ng-if="!index.txHistoryError">
-            <span class="text-warning size-14" translate> Could not fetch transaction history
+              No transactions yet
-            </span>
+          </span>
-          </div>
+        </span>
-        <span ng-if="!index.updatingTxHistory && !index.txHistoryError">No transactions yet</span>
       </div>
     </div>
   </div>
@@ -30,7 +29,7 @@
         <span class="size-18">
           <span ng-if="btx.action == 'received'">+</span>
           <span ng-if="btx.action == 'sent'">-</span>
-          {{history.formatAmount(btx.amount)}}
+          {{btx.amountStr}}
           {{history.getUnitName()}}
         </span>
       </div>

public/views/includes/clientError.html

@@ -4,7 +4,7 @@
       <i class="fi-alert"></i>
     </div>
     <div class="dr-notification-content">
-      <h3 class="dr-notification-title">Connection error</h3>
+      <h3 class="dr-notification-title">Wallet Service Error</h3>
       <div class="dr-notification-text ellipsis">{{index.clientError.message || index.clientError}}</div>
     </div>
   </div>

public/views/includes/offline.html

@@ -5,7 +5,7 @@
     </div>
     <div class="dr-notification-content">
       <h3 class="dr-notification-title">{{'Could not connect to Wallet Service'|translate}}</h3>
-      <div class="dr-notification-text ellipsis">{{'Trying to reconnnect...'|translate}}</div>
+      <div class="dr-notification-text ellipsis  animated infinite flash">{{'Trying to reconnnect...'|translate}}</div>
     </div>
   </div>
 </div>

public/views/walletHome.html

@@ -2,20 +2,23 @@
   <div class="row" ng-show="!index.noFocusedWallet">
     <div class="amount" ng-style="{'background-color':index.backgroundColor}">
 
-          <div class="size-36">
+          <div class="size-36" ng-show="!index.anyOnGoingProcess">
             <strong>
-              <span ng-show="!index.hideBalance">
+              <span>
-                <span ng-class="{'animated pulse':!index.hideBalance}">{{index.totalBalanceStr || '...'}}</span> 
+                <span ng-class="{'animated pulse':!index.anyOnGoingProcess}">{{index.totalBalanceStr }}</span> 
               </span>
-              <span ng-show="index.hideBalance">...</span>
             </strong>
           </div>
-          <div class="size-14" ng-show="!index.hideBalance">
+          <div class="text-white text-center animated infinite flash" ng-show="index.anyOnGoingProcess" > 
-            <span ng-if="index.alternativeBalanceAvailable" ng-class="{'animated fadeIn':!index.hideBalance}">{{index.totalBalanceAlternative}} {{index.alternativeIsoCode}}</span>
+            <span translate ng-show="index.onGoingProcessName == 'openingWallet'">Opening Wallet...</span>
-            <span ng-if="!index.alternativeBalanceAvailable">N/A</span>
+            <span translate ng-show="index.onGoingProcessName == 'updatingStatus'">Updating Status...</span>
+            <span translate ng-show="index.onGoingProcessName == 'updatingBalance'">Updating Balance...</span>
+            <span translate ng-show="index.onGoingProcessName == 'updatingPendingTxps'">Updating Pending Transactions...</span>
+            <span translate ng-show="index.onGoingProcessName == 'scanning'">Scanning Wallet funds...</span>
+            <span translate ng-show="index.onGoingProcessName == 'recreating'">Recreating Wallet on BWS...</span>
           </div>
-          <div class="size-14" ng-show="index.hideBalance">
+          <div class="size-14" ng-show="!index.anyOnGoingProcess">
-            &nbsp;
+            <span ng-if="index.alternativeBalanceAvailable" ng-class="{'animated fadeIn':!index.hideBalance}">{{index.totalBalanceAlternative}} {{index.alternativeIsoCode}}</span>
           </div>
         </div>
         <div class="pr columns line-b">
@@ -41,13 +44,7 @@
   </div>
 
   <div ng-show="index.updateError && !index.notAuthorized"> 
-  <div class="text-center text-warning m10t"> 
-      <i class="fi-alert"></i>
-<span translate>
         Could not update Wallet
-</span>
-  </div>
-    </div>
   </div>
 
   <div ng-show="index.notAuthorized"> 
@@ -109,16 +106,6 @@ You can recreate it from the local information.
     <button class="button black expand" ng-click="$root.go('add')" translate>Create</button>
   </div>
 
-  <div class="text-gray text-center m10t animated infinite flash" ng-show="index.anyOnGoingProcess" > 
-    <span translate ng-show="index.onGoingProcessName == 'openingWallet'">Opening Wallet...</span>
-    <span translate ng-show="index.onGoingProcessName == 'updatingStatus'">Updating Status...</span>
-    <span translate ng-show="index.onGoingProcessName == 'updatingBalance'">Updating Balance...</span>
-    <span translate ng-show="index.onGoingProcessName == 'updatingPendingTxps'">Updating Pending Transactions...</span>
-    <span translate ng-show="index.onGoingProcessName == 'scanning'">Scanning Wallet funds...</span>
-    <span translate ng-show="index.onGoingProcessName == 'recreating'">Recreating Wallet on BWS...</span>
-  </div>
-
-
  
 </div>
 <div class="extra-margin-bottom"></div>

src/css/main.css

@@ -1137,3 +1137,4 @@ input.ng-invalid-match, input.ng-invalid-match:focus {
 .tx-details-blockchain li {
   cursor: pointer !important;
 }
+

src/css/mobile.css

@@ -154,6 +154,7 @@ _:-ms-fullscreen, :root .main {
   padding: 3rem 1rem;
   margin-bottom: 11px;
   color: #fff;
+  height: 175px;
 }
 
 .scroll-section {

src/js/controllers/history.js

@@ -9,7 +9,6 @@ angular.module('copayApp.controllers').controller('historyController',
 
     var fc = profileService.focusedClient;
     var config = configService.getSync().wallet.settings;
-    var formatAmount = profileService.formatAmount;
     this.unitToSatoshi = config.unitToSatoshi;
     this.satToUnit = 1 / this.unitToSatoshi;
     this.unitName = config.unitName;
@@ -42,10 +41,9 @@ angular.module('copayApp.controllers').controller('historyController',
     this.openTxModal = function(btx) {
       var self = this;
       var fc = profileService.focusedClient;
-      var ModalInstanceCtrl = function($scope, $modalInstance, profileService) {
+      var ModalInstanceCtrl = function($scope, $modalInstance) {
         $scope.btx = btx;
         $scope.settings = config;
-        $scope.btx.amountStr = profileService.formatAmount(btx.amount);
         $scope.color = fc.backgroundColor;
 
         $scope.getAmount = function(amount) {
@@ -73,11 +71,6 @@ angular.module('copayApp.controllers').controller('historyController',
       });
     };
 
-
-    this.formatAmount = function(amount) {
-      return profileService.formatAmount(amount);
-    };
-
     this.hasAction = function(actions, action) {
       return actions.hasOwnProperty('create');
     };

src/js/controllers/index.js

@@ -15,9 +15,6 @@ angular.module('copayApp.controllers').controller('indexController', function($r
     self[processName] = isOn;
     self.onGoingProcess[processName] = isOn;
 
-    // derived rules
-    self.hideBalance = self.updatingBalance || self.updatingStatus || self.openingWallet;
-
     var name;
     self.anyOnGoingProcess = lodash.any(self.onGoingProcess, function(isOn, processName) {
       if (isOn)
@@ -26,6 +23,9 @@ angular.module('copayApp.controllers').controller('indexController', function($r
     });
     // The first one
     self.onGoingProcessName = name;
+    $timeout(function() {
+      $rootScope.$apply();
+    });
   };
 
   self.setFocusedWallet = function() {
@@ -147,14 +147,14 @@ angular.module('copayApp.controllers').controller('indexController', function($r
     }
     self.skipHistory = skip || 0;
     $timeout(function() {
-      self.setOngoingProcess('updatingTxHistory', true);
       $log.debug('Updating Transaction History');
       self.txHistoryError = false;
+      self.updatingTxHistory = true;
       fc.getTxHistory({
         skip: self.skipHistory,
         limit: self.limitHistory + 1
       }, function(err, txs) {
-        self.setOngoingProcess('updatingTxHistory', false);
+        self.updatingTxHistory = false;
         if (err) {
           $log.debug('TxHistory ERROR:', err);
           self.handleError(err);
@@ -346,6 +346,12 @@ angular.module('copayApp.controllers').controller('indexController', function($r
       self.notAuthorized = false;
       self.setOngoingProcess('recreating', false);
 
+      if (err) {
+        self.clientError = 'Could not recreate wallet:' + err;
+        $rootScope.$apply();
+        return;
+      }
+
       profileService.setWalletClients();
       $timeout(function() {
         $rootScope.$emit('Local/WalletImported', self.walletId);
@@ -375,6 +381,8 @@ angular.module('copayApp.controllers').controller('indexController', function($r
         c.scanning = false;
         if (self.walletId == walletId)
           self.setOngoingProcess('scanning', false);
+        self.clientError = 'Could not scan wallet:' + err;
+        $rootScope.$apply();
       }
     });
   };