Improves buy page

public/views/buyGlidera.html

@@ -6,6 +6,20 @@
 
 
 <div class="content glidera p20v" ng-controller="buyGlideraController as buy">
+
+  <div class="onGoingProcess" ng-show="buy.loading">
+    <div class="onGoingProcess-content" ng-style="{'background-color':index.backgroundColor}">
+    <div class="spinner">
+      <div class="rect1"></div>
+      <div class="rect2"></div>
+      <div class="rect3"></div>
+      <div class="rect4"></div>
+      <div class="rect5"></div>
+    </div>
+    <span translate>Sending request to Glidera...</span>
+    </div>
+  </div>
+
   <div class="row">
     <div class="columns">
       <div ng-show="!buy.show2faCodeInput && !buy.success">
@@ -26,42 +40,49 @@
               ng-click="showAlternative = true; qty = null; buy.buyPrice = null">BTC</a>
             <a ng-show="showAlternative" class="postfix" 
               ng-click="showAlternative = false; fiat = null; buy.buyPrice = null">USD</a>
-            <input class="button dark-gray outline round" 
-            type="submit" value="Continue" ng-disabled="!buy.buyPrice.qty">
+
+            <div class="text-center text-gray size-12 m20b" ng-show="buy.buyPrice.qty">
+              Buy 
+              <span ng-show="qty">${{buy.buyPrice.subtotal}} {{buy.buyPrice.currency}} in Bitcoin</span> 
+              <span ng-show="fiat">{{buy.buyPrice.qty}} BTC</span> 
+              at ${{buy.buyPrice.price}} {{buy.buyPrice.currency}} 
+            </div>
+
+            <input class="button dark-gray outline round expand" 
+            type="submit" value="Continue" ng-disabled="!buy.buyPrice.qty || buy.loading">
           </div>
-        </form>
-        <div class="text-gray size-12 m10b" ng-show="buy.buyPrice.qty">
-          Buy 
-          <span ng-show="qty">${{buy.buyPrice.subtotal}} {{buy.buyPrice.currency}} in Bitcoin</span> 
-          <span ng-show="fiat">{{buy.buyPrice.qty}} BTC</span> 
-          at ${{buy.buyPrice.price}} {{buy.buyPrice.currency}} 
-        </div>
+        </form> 
       </div>
       <div ng-show="buy.show2faCodeInput && !buy.success">
-        <p class="text-center text-gray">
-        The purchase price of ${{buy.buyPrice.price}} USD will be immediately withdrawn from your bank account.
+        <p class="text-center text-gray" translate>
+        The purchase price of ${{buy.buyPrice.price}} {{buy.buyPrice.currency}} will be immediately withdrawn from your bank account.
         </p>
-        <p class="text-center text-gray">
+        <p class="text-center text-gray" translate>
         The total of {{buy.buyPrice.qty}} BTC will be purchased and deposited in your bitcoin wallet ({{index.walletName}}) in 2-4 business days.
         </p>
-        <p class="text-center text-gray">
         <form name="buyForm" 
-          ng-submit="buy.sendRequest(index.glideraToken, twoFaCode)" novalidate>
+          ng-submit="buy.sendRequest(index.glideraToken, index.glideraPermissions, twoFaCode)" novalidate>
           <label>Enter 2FA Code</label>
             <input type="number" ng-model="twoFaCode" required>
-            <input class="button dark-gray outline round" 
-            type="submit" value="Buy Bitcoin">
+            <input class="button dark-gray outline round expand" 
+            type="submit" value="Buy Bitcoin" ng-disabled="buyForm.$invalid || buy.loading">
         </form>
       </div>
-      <div ng-show="buy.error && !buy.success" class="text-warning m10b">{{buy.error}}</div>
+      <div class="box-notification" ng-show="buy.error && !buy.success">
+        <span class="text-warning size-14">
+          {{buy.error|translate}}
+        </span>
+      </div>
       <div class="text-center" ng-show="buy.success">
         <h1>Purchase complete</h1>
-        <p class="text-gray">
+        <p class="text-gray" translate>
         A transfer has been initiated from your bank account. Your bitcoin should arrive in your wallet in 4-6 business days.
         </p>
 
         <button class="outline dark-gray round expand"
-          ng-click="$root.go('glidera')">Finish</button>
+          ng-click="$root.go('glidera')">
+          Finish
+        </button>
       </div>
     </div>
   </div> 

public/views/glidera.html

@@ -79,7 +79,7 @@
       <div class="size-12" ng-show="index.glideraEmail">{{index.glideraEmail}}</div>
 
       <div ng-show="index.glideraPersonalInfo" class="size-12">
-        {{index.glideraPersonalInfo.firstName}} {{index.glideraPersonalInfo.lastName}} {{index.glideraPersonalInfo.personalInfoState}}
+        {{index.glideraPersonalInfo.firstName}} {{index.glideraPersonalInfo.lastName}}
       </div>
     </div>
 

src/js/controllers/buyGlidera.js

@@ -1,7 +1,7 @@
 'use strict';
 
 angular.module('copayApp.controllers').controller('buyGlideraController', 
-  function($scope, $timeout, profileService, addressService, glideraService) {
+  function($scope, $timeout, profileService, addressService, glideraService, gettext) {
     
     this.addr = {};
     this.show2faCodeInput = null;
@@ -14,27 +14,44 @@ angular.module('copayApp.controllers').controller('buyGlideraController',
         this.buyPrice = null;
         return;
       }
-      glideraService.buyPrice(token, price, function(error, buyPrice) {
-        self.buyPrice = buyPrice;
+      glideraService.buyPrice(token, price, function(err, buyPrice) {
+        if (err) {
+          self.error = gettext('Glidera could not get pricing to buy bitcoin');
+        }
+        else {
+          self.buyPrice = buyPrice;
+        }
       });     
     };
 
     this.get2faCode = function(token) {
       var self = this;
+      this.loading = true;
       $timeout(function() {
-        glideraService.get2faCode(token, function(error, sent) {
-          self.show2faCodeInput = sent;
+        glideraService.get2faCode(token, function(err, sent) {
+          self.loading = false;
+          if (err) {
+            self.error = gettext('Glidera could not the 2FA code to your phone');
+          }
+          else {
+            self.show2faCodeInput = sent;
+          }
         });
       }, 100);
     };
 
-    this.sendRequest = function(token, twoFaCode) {
+    this.sendRequest = function(token, permissions, twoFaCode) {
       var fc = profileService.focusedClient;
       if (!fc) return;
-      this.loading = true;
       var self = this;
+      self.error = null;
       addressService.getAddress(fc.credentials.walletId, null, function(err, addr) {
-        if (addr) {
+        if (!addr) {
+          self.error = gettext('Could not get the bitcoin address');
+          $scope.$apply();
+        }
+        else {
+          self.loading = true;
           var data = {
             destinationAddress: addr,
             qty: self.buyPrice.qty,
@@ -42,15 +59,18 @@ angular.module('copayApp.controllers').controller('buyGlideraController',
             useCurrentPrice: false,
             ip: null 
           };
-          glideraService.buy(token, twoFaCode, data, function(error, data) {
-            self.loading = false;
-            if (error) {
-              self.error = error;
-            }
-            else {
-              self.success = data
-            }
-          });
+          $timeout(function() {
+            glideraService.buy(token, twoFaCode, data, function(err, data) {
+              self.loading = false;
+              if (err) {
+                self.error = gettext('Could not buy bitcoin');
+              }
+              else {
+                self.success = data;
+                $scope.$emit('Local/GlideraUpdated', token, permissions);
+              }
+            });
+          }, 100);
         }
       });
     };