feat(Login): new browser approval - different browser

blockchain · Dec 18, 2015 · 395827a · 395827a
1 parent 513e8f0
commit 395827a
Show file tree

Hide file tree

Showing 6 changed files with 132 additions and 17 deletions.
diff --git a/app/partials/authorize-approve.jade b/app/partials/authorize-approve.jade
@@ -0,0 +1,60 @@
+div(ng-show="checkingToken")
+  header
+    hgroup
+      .flex-between.flex-center.flex-wrap
+        h2.em-300.mtn(translate="CHECKING_LOGIN_ATTEMPT")
+    hgroup
+      img(src="img/spinner.gif")
+div(ng-show="differentBrowser")
+  header
+    hgroup
+      .flex-between.flex-center.flex-wrap
+        h2.em-300.mtn(translate="AUTHORIZE_APPROVE_OTHER_BROWSER")
+      p.em-300(translate="AUTHORIZE_APPROVE_OTHER_BROWSER_EXPLAIN")
+    hgroup
+      p.em-300 {{ details.device_change_reason }}
+
+  .row
+    .col-xs-6
+      h4(translate="AUTHORIZE_APPROVE_REQUESTING_DEVICE")
+      p
+        b
+          span(translate="BROWSER")
+          span :
+        |  {{ details.requester_device_description }}
+        br
+        b
+          span(translate="IP_ADDRESS")
+          span :
+        |  {{ details.requester_ip }}
+        br
+        b
+          span(translate="COUNTRY_OF_ORIGIN")
+          span :
+        |  {{ details.requester_country }}
+        br
+    .col-xs-6
+      h4(translate="AUTHORIZE_APPROVE_THIS_DEVICE")
+      p
+        b
+          span(translate="BROWSER")
+          span :
+        |  {{ details.approver_device_description }}
+        br
+        b
+          span(translate="IP_ADDRESS")
+          span :
+        |  {{ details.approver_ip }}
+        br
+        b
+          span(translate="COUNTRY_OF_ORIGIN")
+          span :
+        |  {{ details.approver_country }}
+        br
+
+  form.ptl.form-horizontal.clearfix(role="form")
+    .flex-between.flex-center.pal
+      .flex-center
+        button.button-danger(ui-ladda="busyApproving", ng-click="approve()", data-style="expand-left", ladda-translate="ACCEPT")
+      .flex-center.flex-end
+        button.button-primary(ui-ladda="busyRejecting", ng-click="reject()", data-style="expand-left", ladda-translate="REJECT")
diff --git a/assets/js/controllers/app.controller.js b/assets/js/controllers/app.controller.js
@@ -59,7 +59,7 @@ function AppCtrl($scope, Wallet, Alerts, $state, $rootScope, $location, $cookieS
   };
 
   $scope.$on('$stateChangeSuccess', (event, toState, toParams, fromState, fromParams) => {
-    let loggedOutStates = ['public', 'public.login-no-uid', 'public.login-uid', 'public.recover', 'public.reminder', 'public.signup', 'public.help', 'open', 'wallet.common.verify-email', 'wallet.common.unsubscribe'];
+    let loggedOutStates = ['public', 'public.login-no-uid', 'public.login-uid', 'public.recover', 'public.reminder', 'public.signup', 'public.help', 'open', 'wallet.common.verify-email', 'wallet.common.unsubscribe', 'public.authorize-approve'];
     if (loggedOutStates.every(s => toState.name !== s) && $scope.status.isLoggedIn === false) {
       $state.go("public.login-no-uid");
     }

diff --git a/assets/js/controllers/authorizeApprove.controller.js b/assets/js/controllers/authorizeApprove.controller.js
@@ -4,6 +4,10 @@ angular
 
 function AuthorizeApproveCtrl($window, $scope, Wallet, $stateParams, $state, Alerts, $translate) {
   const success = (uid) => {
+    $scope.checkingToken = false;
+    $scope.busyApproving = false;
+    $scope.busyRejecting = false;
+
 
     $window.close(); // This is sometimes ignored, hence the code below:
 
@@ -20,14 +24,46 @@ function AuthorizeApproveCtrl($window, $scope, Wallet, $stateParams, $state, Ale
         });
       });
     }
-
-
   }
 
   const error = (message) => {
+    $scope.checkingToken = false;
+    $scope.busyApproving = false;
+    $scope.busyRejecting = false;
+
     $state.go("public.login-no-uid");
     Alerts.displayError(message, true);
   }
 
-  Wallet.authorizeApprove($stateParams.token, success, error)
+  const differentBrowser = (details) => {
+    $scope.checkingToken = false;
+
+    $scope.differentBrowser = true;
+    $scope.details = details;
+  }
+
+  $scope.checkingToken = true;
+
+  Wallet.authorizeApprove($stateParams.token, success, differentBrowser, null, error);
+
+  $scope.approve = () => {
+    $scope.busyApproving = true;
+    Wallet.authorizeApprove($stateParams.token, success, () => {}, true, error);
+  }
+
+  $scope.reject = () => {
+    $scope.busyRejecting = true;
+
+    const rejected = () => {
+      $scope.busyRejecting = false;
+
+      $translate('AUTHORIZE_REJECT_SUCCESS').then(translation => {
+        $state.go("public.login-no-uid").then(() => {
+          Alerts.displaySuccess(translation)
+        });
+      });
+    };
+
+    Wallet.authorizeApprove($stateParams.token, rejected, () => {}, false, error);
+  }
 }
diff --git a/assets/js/routes.js b/assets/js/routes.js
@@ -129,6 +129,16 @@ function AppRouter($stateProvider, $urlRouterProvider) {
         }
       }
     })
+    .state('public.authorize-approve', {
+      url: '/authorize-approve/{token:.*}',
+      views: {
+        alerts: commonViews.alerts,
+        contents: {
+          templateUrl: 'partials/authorize-approve.jade',
+          controller: 'AuthorizeApproveCtrl'
+        }
+      }
+    })
     .state('signup.finish', {
       url: '/signup/finish',
       views: commonViews
@@ -253,16 +263,6 @@ function AppRouter($stateProvider, $urlRouterProvider) {
         }
       }
     })
-    .state('wallet.common.authorize-approve', {
-      url: '/authorize-approve/{token:.*}',
-      views: {
-        top: top,
-        left: walletNav,
-        right: {
-          controller: 'AuthorizeApproveCtrl'
-        }
-      }
-    })
     .state('wallet.common.settings', {
       url: '/settings',
       views: {

diff --git a/assets/js/services/wallet.service.js b/assets/js/services/wallet.service.js
@@ -1214,6 +1214,7 @@ function Wallet($http, $window, $timeout, Alerts, MyWallet, MyBlockchainApi, MyB
     const error = (message) => {
       console.log(message);
       errorCallback(message);
+      wallet.applyIfNeeded();
     }
 
     wallet.tokenEndpoints.verifyEmail(token, success, error);
@@ -1228,12 +1229,13 @@ function Wallet($http, $window, $timeout, Alerts, MyWallet, MyBlockchainApi, MyB
     const error = (message) => {
       console.log(message);
       errorCallback(message);
+      wallet.applyIfNeeded();
     }
 
     wallet.tokenEndpoints.unsubscribe(token, success, error);
   }
 
-  wallet.authorizeApprove = (token, successCallback, errorCallback) => {
+  wallet.authorizeApprove = (token, successCallback, differentBrowserCallback, differentBrowserApproved, errorCallback) => {
     const success = (guid) => {
       successCallback(guid);
       wallet.applyIfNeeded();
@@ -1242,9 +1244,15 @@ function Wallet($http, $window, $timeout, Alerts, MyWallet, MyBlockchainApi, MyB
     const error = (message) => {
       console.log(message);
       errorCallback(message);
+      wallet.applyIfNeeded();
+    }
+
+    const differentBrowser = (details) => {
+      differentBrowserCallback(details);
+      wallet.applyIfNeeded();
     }
 
-    wallet.tokenEndpoints.authorizeApprove(token, success, error);
+    wallet.tokenEndpoints.authorizeApprove(token, success, differentBrowser, differentBrowserApproved, error);
   }
 
   // Testing: only works on mock MyWallet

diff --git a/locales/en-human.json b/locales/en-human.json
@@ -504,5 +504,16 @@
   "NOTIFICATIONS_EXPLAIN" : "Enable notifications to receive an email whenever you receive bitcoins. Only labeled addresses in your accounts and imported addresses are eligible to trigger notifications.",
   "VERIFY_EMAIL_FIRST" : "Please verify your email address first.",
   "UNSUBSCRIBE_SUCCESS" : "We have removed your email address (and phone number) from our systems.",
-  "AUTHORIZE_APPROVE_SUCCESS" : "Login approved! Please return to your previous browser / tab to see your wallet."
+  "AUTHORIZE_APPROVE_SUCCESS" : "Login approved! Please return to your previous browser / tab to see your wallet.",
+  "AUTHORIZE_APPROVE_OTHER_BROWSER" : "Login attempt from other browser",
+  "AUTHORIZE_APPROVE_OTHER_BROWSER_EXPLAIN" : "Someone, hopefully you, is attempting to login to your wallet from a different browser.",
+  "AUTHORIZE_APPROVE_REQUESTING_DEVICE" : "Requesting device",
+  "AUTHORIZE_APPROVE_THIS_DEVICE" : "This device",
+  "ACCEPT" : "Accept",
+  "REJECT" : "Reject",
+  "BROWSER" : "Browser",
+  "IP_ADDRESS" : "IP Address",
+  "COUNTRY_OF_ORIGIN" : "Country Of Origin",
+  "AUTHORIZE_REJECT_SUCCESS" : "Login attempt rejected! Please contact support if this was not you.",
+  "CHECKING_LOGIN_ATTEMPT" : "Checking login attempt"
 }