Add email loading state until user info resolved

stellar-deprecated · Nov 21, 2014 · de83699 · de83699
1 parent 5cc4216
commit de83699
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 11 deletions.
diff --git a/app/scripts/controllers/settings-email-controller.js b/app/scripts/controllers/settings-email-controller.js
@@ -1,12 +1,29 @@
 angular.module('stellarClient').controller('SettingsEmailCtrl', function($scope, $http, $state, $q, session, singletonPromise) {
+  $scope.loading = true;
+  $scope.error = null;
 
   $scope.$on('settings-refresh', function () {
-    $scope.email = session.getUser().getEmailAddress();
-    $scope.emailVerified = session.getUser().isEmailVerified();
-    $scope.verifyToken = null;
-    $scope.resetEmailState();
+    $scope.refresh();
   });
 
+  $scope.refresh = function() {
+    $scope.loading = true;
+    $scope.error = null;
+
+    session.getUserInfo()
+      .then(function(userInfo) {
+        $scope.loading = false;
+
+        $scope.email = session.getUser().getEmailAddress();
+        $scope.emailVerified = session.getUser().isEmailVerified();
+        $scope.verifyToken = null;
+        $scope.resetEmailState();
+      })
+      .catch(function(err) {
+        $scope.error = "Unable to contact server!";
+      });
+  };
+
   $scope.resetEmailState = function () {
     if ($scope.email) {
       $scope.emailState = 'added';

diff --git a/app/scripts/services/session.js b/app/scripts/services/session.js
@@ -5,8 +5,10 @@ var sc = angular.module('stellarClient');
 
 var cache = {};
 
-sc.service('session', function($rootScope, $http, $timeout, StellarNetwork, Wallet, contacts, UserPrivateInfo) {
-  var Session = function() {};
+sc.service('session', function($rootScope, $http, $timeout, $q, StellarNetwork, Wallet, contacts, UserPrivateInfo) {
+  var Session = function() {
+    this.waitingForUserInfo = $q.defer();
+  };
 
   Session.prototype.get = function(name){ return cache[name]; };
   Session.prototype.put = function(name, value){ 
@@ -85,12 +87,13 @@ sc.service('session', function($rootScope, $http, $timeout, StellarNetwork, Wall
     UserPrivateInfo.load(this.get('username'), this.get('wallet').keychainData.updateToken)
       .then(function (user) {
         self.put('userPrivateInfo', user);
-      })
-      .then(function () {
+        self.waitingForUserInfo.resolve(user);
         $rootScope.$broadcast('userLoaded');
-      })
-      .then(function () {
+
         self.identifyToAnalytics();
+      })
+      .catch(function(err) {
+        self.waitingForUserInfo.reject(err);
       });
 
     // check for the most up to date fairy address
@@ -165,6 +168,10 @@ sc.service('session', function($rootScope, $http, $timeout, StellarNetwork, Wall
     return this.get('userPrivateInfo');
   };
 
+  Session.prototype.getUserInfo = function() {
+    return this.waitingForUserInfo.promise;
+  };
+
   Session.prototype.identifyToAnalytics = function() {
       window.analytics.identify(this.get('username'), this.getAnalyticsTraits());
   };

diff --git a/app/states/settings.html b/app/states/settings.html
@@ -51,7 +51,21 @@ <h1 class="title">Settings<span class="link-dashboard"><a href="/#/dashboard">&#
                 <div class="row" ng-controller="SettingsEmailCtrl">
                     <div class="settings-label col-md-3 col-xs-6">EMAIL</div>
                     <div class="settings-control col-md-9 col-xs-6">
-                        <div class="row">
+                        <!-- User data hasn't loaded yet -->
+                        <div class="row" ng-show="loading">
+                            <div class="icon-col col-xs-1">
+                                <span class="icon icon-email"/>
+                            </div>
+                            <div class="col-xs-10">Loading...</div>
+                        </div>
+                        <div class="row" ng-show="error">
+                            <div class="icon-col col-xs-1">
+                                <span class="icon icon-email"/>
+                            </div>
+                            <div class="col-xs-10">{{ error }}</div>
+                        </div>
+                        <!-- User data has loaded -->
+                        <div class="row" ng-hide="loading || error">
                             <div class="icon-col col-xs-1">
                                 <span class="icon icon-email"/>
                             </div>