Merge pull request #2414 from cmgustavo/bug/ux-loading-01

Fixes loading message after press a button

cordova/build.sh

@@ -112,6 +112,9 @@ if [ ! -d $PROJECT ]; then
   cordova plugin add https://github.com/EddyVerbruggen/SocialSharing-PhoneGap-Plugin.git && cordova prepare
   checkOK
 
+  cordova plugin add hu.dpal.phonegap.plugins.spinnerdialog
+  checkOK
+
 fi
 
 if $DBGJS

js/controllers/home.js

@@ -127,7 +127,9 @@ angular.module('copayApp.controllers').controller('HomeController', function($sc
       return;
     }
 
-    $scope.open(form.email.$modelValue, form.password.$modelValue);
+    $timeout(function() {
+      $scope.open(form.email.$modelValue, form.password.$modelValue);
+    }, 100);
   };
 
 
@@ -165,7 +167,6 @@ angular.module('copayApp.controllers').controller('HomeController', function($sc
         } else {
           $scope.error = 'Unknown error';
         }
-        $rootScope.starting = false;
         $timeout(function() {
           $rootScope.$digest();
         }, 1)

js/controllers/homeWallet.js

@@ -1,6 +1,6 @@
 'use strict';
 
-angular.module('copayApp.controllers').controller('HomeWalletController', function($scope, $rootScope, $timeout, $filter, $modal, rateService, notification, txStatus, identityService) {
+angular.module('copayApp.controllers').controller('HomeWalletController', function($scope, $rootScope, $timeout, $filter, $modal, rateService, notification, txStatus, identityService, isCordova) {
 
   $scope.openTxModal = function(tx) {
     var ModalInstanceCtrl = function($scope, $modalInstance) {
@@ -16,10 +16,16 @@ angular.module('copayApp.controllers').controller('HomeWalletController', functi
       };
 
       $scope.sign = function(ntxid) {
+        if (isCordova) {
+          window.plugins.spinnerDialog.show(null, 'Signing transaction...', true);
+        }
         $scope.loading = true;
         $scope.error = null;
         $timeout(function() {
           w.signAndSend(ntxid, function(err, id, status) {
+            if (isCordova) {
+              window.plugins.spinnerDialog.hide();
+            }
             $scope.loading = false;
             if (err) {
               $scope.error = 'Transaction could not send. Please try again.';
@@ -33,10 +39,16 @@ angular.module('copayApp.controllers').controller('HomeWalletController', functi
       };
 
       $scope.reject = function(ntxid) {
+        if (isCordova) {
+          window.plugins.spinnerDialog.show(null, 'Rejecting transaction...', true);
+        }
         $scope.loading = true;
         $scope.error = null;
         $timeout(function() {
           w.reject(ntxid, function(err, status) {
+            if (isCordova) {
+              window.plugins.spinnerDialog.hide();
+            }
             $scope.loading = false;
             if (err) {
               $scope.error = err;
@@ -50,10 +62,16 @@ angular.module('copayApp.controllers').controller('HomeWalletController', functi
       };
 
       $scope.broadcast = function(ntxid) {
+        if (isCordova) {
+          window.plugins.spinnerDialog.show(null, 'Sending transaction...', true);
+        }
         $scope.loading = true;
         $scope.error = null;
         $timeout(function() {
           w.issueTx(ntxid, function(err, txid, status) {
+            if (isCordova) {
+              window.plugins.spinnerDialog.hide();
+            }
             $scope.loading = false;
             if (err) {
               $scope.error = 'Transaction could not send. Please try again.';

js/controllers/import.js

@@ -70,33 +70,36 @@ angular.module('copayApp.controllers').controller('ImportController',
 
       $rootScope.starting = true;
 
-      $scope.importOpts = {};
+      $timeout(function() {
 
-      var skipFields = [];
+        $scope.importOpts = {};
 
-      if ($scope.skipPublicKeyRing)
+        var skipFields = [];
-        skipFields.push('publicKeyRing');
 
-      if ($scope.skipTxProposals)
+        if ($scope.skipPublicKeyRing)
-        skipFields.push('txProposals');
+          skipFields.push('publicKeyRing');
 
-      if (skipFields)
+        if ($scope.skipTxProposals)
-        $scope.importOpts.skipFields = skipFields;
+          skipFields.push('txProposals');
 
-      if (backupFile) {
+        if (skipFields)
-        reader.readAsBinaryString(backupFile);
+          $scope.importOpts.skipFields = skipFields;
-      } else {
+
-        updateStatus('Importing wallet - Procesing backup...');
+        if (backupFile) {
-        identityService.importWallet(backupText, $scope.password, $scope.importOpts, function(err) {
+          reader.readAsBinaryString(backupFile);
-          if (err) {
+        } else {
-            $rootScope.starting = false;
+          updateStatus('Importing wallet - Procesing backup...');
-            $scope.error = 'Could not read wallet. Please check your password';
+          identityService.importWallet(backupText, $scope.password, $scope.importOpts, function(err) {
-            $timeout(function() {
+            if (err) {
-              $rootScope.$digest();
+              $rootScope.starting = false;
-            }, 1);
+              $scope.error = 'Could not read wallet. Please check your password';
-          }
+              $timeout(function() {
-        });
+                $rootScope.$digest();
-      }
+              }, 1);
+            }
+          });
+        }
+      }, 100);
     };
 
 

js/controllers/importProfile.js

@@ -70,10 +70,13 @@ angular.module('copayApp.controllers').controller('ImportProfileController',
       
       $rootScope.starting = true;
 
-      if (backupFile) {
+      $timeout(function() {
-        reader.readAsBinaryString(backupFile);
+
-      } else {
+        if (backupFile) {
-        _importBackup(backupText);
+          reader.readAsBinaryString(backupFile);
-      }
+        } else {
+          _importBackup(backupText);
+        }
+      }, 100);
     };
   });

js/controllers/send.js

@@ -163,6 +163,9 @@ angular.module('copayApp.controllers').controller('SendController',
       if (msg.match('expired'))
         msg = 'The payment request has expired';
 
+      if (msg.match('XMLHttpRequest'))
+        msg = 'Error when sending to the blockchain. Resend it from Home';
+
       var message = 'The transaction' + ($scope.requiresMultipleSignatures ? ' proposal' : '') +
         ' could not be created: ' + msg;
 
@@ -182,37 +185,45 @@ angular.module('copayApp.controllers').controller('SendController',
         return;
       }
 
+      if (isCordova) {
+        window.plugins.spinnerDialog.show(null, 'Creating transaction...', true);
+      }
+
       $scope.loading = true;
-      $scope.creatingTX = true;
       if ($scope.isWindowsPhoneApp)
-          $rootScope.wpInputFocused = true;
+        $rootScope.wpInputFocused = true;
 
       $timeout(function () {
-          var comment = form.comment.$modelValue;
+        var comment = form.comment.$modelValue;
-          var merchantData = $scope._merchantData;
+        var merchantData = $scope._merchantData;
-          var address, amount;
+        var address, amount;
-          if (!merchantData) {
+        if (!merchantData) {
-              address = form.address.$modelValue;
+          address = form.address.$modelValue;
-              amount = parseInt((form.amount.$modelValue * unitToSat).toFixed(0));
+          amount = parseInt((form.amount.$modelValue * unitToSat).toFixed(0));
+        }
+
+        w.spend({
+          merchantData: merchantData,
+          toAddress: address,
+          amountSat: amount,
+          comment: comment,
+        }, function (err, txid, status) {
+          if (isCordova) {
+            window.plugins.spinnerDialog.hide();
           }
+          $scope.loading = false;
+          if ($scope.isWindowsPhoneApp)
+            $rootScope.wpInputFocused = false;
 
-          w.spend({
+          if (err) {
-              merchantData: merchantData,
+            $scope.setError(err);
-              toAddress: address,
+          }
-              amountSat: amount,
+          else {
-              comment: comment,
+            txStatus.notify(status);
-          }, function (err, txid, status) {
+            $scope.resetForm();
-              $scope.loading = false;
+          }
-              $scope.creatingTX = false;
+        });
-              if ($scope.isWindowsPhoneApp)
+      }, 100);
-                  $rootScope.wpInputFocused = false;
-
-              if (err)
-                  return $scope.setError(err);
-              txStatus.notify(status);
-              $scope.resetForm();
-          });
-      }, 1);
     };
 
     // QR code Scanner

js/models/Wallet.js

@@ -1651,6 +1651,7 @@ Wallet.prototype.broadcastToBitcoinNetwork = function(ntxid, cb) {
       log.debug('Wallet:' + self.getName() + ' Send failed:' + err);
 
       self._checkIfTxIsSent(ntxid, function(err, txid) {
+        self.emitAndKeepAlive('balanceUpdated');
         return cb(err, txid);
       });
     } else {

views/home.html

@@ -119,9 +119,9 @@
 
 
 
-        <button translate type="submit" class="button primary radius expand m0" ng-disabled="loginForm.$invalid">
+        <button translate type="submit" class="button primary radius expand m0" 
+          ng-disabled="loginForm.$invalid">
           Sign in
- {{hideAll}}
         </button>
       </form>
         <div ng-if="usingLocalStorage" class="text-gray size-12 m10v">

views/import.html

@@ -86,7 +86,7 @@
 
             <div class="text-right m20t">
               <button translate type="submit" class="button expand black m0" 
-                ng-disabled="importForm.$invalid || $root.starting">
+                ng-disabled="importForm.$invalid">
                 Import backup
               </button>
             </div>

views/importProfile.html

@@ -47,7 +47,7 @@
 
           <button translate type="submit" 
             class="button primary radius expand m0" 
-            ng-disabled="importProfileForm.$invalid || $root.starting">
+            ng-disabled="importProfileForm.$invalid">
             Import backup
           </button>
         </form>

views/send.html

@@ -1,5 +1,5 @@
 <div class="send" ng-controller="SendController" ng-init="init()">
-  <div class="columns" ng-show="$root.wallet.balanceInfo.lockedBalance && !walletSelection">
+  <div class="columns" ng-show="$root.wallet.balanceInfo.lockedBalance">
     <div class="panel">
       <div class="left">
         <i class="fi-info size-42 m10r"></i>
@@ -32,25 +32,9 @@
     </div>
   </div>
 
-  <div class="row" ng-show="creatingTX">
+  <div class="row" ng-show="!fetchingURL">
-    <div class="large-12 columns">
-      <div class="panel">
-        <div class="box-notification">
-          <div class="box-icon secondary">
-            <i class="fi-bitcoin-circle icon-rotate spinner size-24"></i>
-          </div>
-          <span class="text-secondary size-14">
-            Creating Transaction...
-          </span>
-        </div>
-      </div>
-    </div>
-  </div>
-
-
-  <div class="row" ng-show="!fetchingURL && !creatingTX">
     <div class="large-8 large-centered columns"> 
-      <form name="sendForm" ng-submit="submitForm(sendForm)" novalidate>
+      <form name="sendForm" ng-submit="submitForm(sendForm)" ng-disabled="loading" novalidate>
         <div class="panel">
           <div class="box-notification" ng-show="error  && !hideForWP ">
             <div class="box-icon error">
@@ -159,7 +143,7 @@
           <div class="row">
             <div class="large-6 medium-6 small-12 columns text-right">
               <button type="submit" class="button primary expand" ng-disabled="sendForm.$invalid || loading">
-                <i class="fi-bitcoin-circle icon-rotate spinner" ng-show="loading"></i> Send
+                Send
               </button>
             </div>
             <div class="large-4 medium-4 small-12 columns text-left">
@@ -171,7 +155,8 @@
                   <a translate class="button radius tiny warning" ng-click="cancelScanner()"><i class="fi-x size-18"></i> </a>
                 </div>
               </div>
-              <a ng-click="resetForm()" class="button expand warning m0" ng-show="_merchantData || lockAddress" ng-disabled="loading">Cancel</a>
+              <a ng-click="resetForm()" class="button expand warning m0" 
+                ng-show="(_merchantData || lockAddress) && !loading">Cancel</a>
             </div>
           </div>
         </div>