Better auth with UserService and caching.
authorCameron Ball <cameron@getapproved.com.au>
Wed, 22 Oct 2014 07:33:25 +0000 (15:33 +0800)
committerCameron Ball <cameron@getapproved.com.au>
Wed, 22 Oct 2014 07:33:25 +0000 (15:33 +0800)
app/components/hello/hello-service.js
app/components/menu/menu-controller.js
app/components/menu/menu-directive.js [new file with mode: 0644]
app/components/menu/menu.html
app/components/user/user-service.js [new file with mode: 0644]
app/components/userMenu/userMenu-directive.js [new file with mode: 0644]
app/components/userMenu/userMenu.html [new file with mode: 0644]
app/divinelegy.js
app/index.html

index 605d9af..8e1e93f 100644 (file)
@@ -8,9 +8,9 @@ factory("HelloService", ['$http', function($http)
     
     hello.services.facebook.scope.hometown = 'user_hometown';
     
-    hello.isLoggedIn = function(network)
+    hello.isLoggedIn = function()
     {
-        var session = window.hello(network).getAuthResponse();
+        var session = window.hello('facebook').getAuthResponse();
         var current_time = (new Date()).getTime() / 1000;
         return session && session.access_token && session.expires > current_time;
     };
@@ -28,9 +28,7 @@ factory("HelloService", ['$http', function($http)
         // get the short term token
         hello('facebook').login( {scope: "hometown"} ).then(function() {
             var facebookObj = hello.utils.store('facebook');
-        
-            console.log(JSON.stringify({token: facebookObj.access_token}));
-        
+                
             // send to 
             $http({
                 url: "http://rock.divinelegy.meeples/user/auth",
@@ -40,10 +38,17 @@ factory("HelloService", ['$http', function($http)
             success(function (data)
             {
                 hello.setAccessToken(data.token, data.expires);
-                console.log(data);
             });
         });
     };
     
+    hello.getFacebookId = function()
+    {
+        return hello('facebook').api('/me').then(function(r)
+        {
+            return r.id;
+        });
+    };
+    
     return hello; //assume hello has been loaded
 }]);
\ No newline at end of file
index 85b7f51..8514909 100644 (file)
@@ -1,8 +1,7 @@
 'use strict';
 
-angular.module("DivinElegy.components.menu", ["DivinElegy.components.hello"]).
+angular.module("DivinElegy.components.menu", ["DivinElegy.components.hello", "DivinElegy.components.user"]).
     
-//TODO: This really should be done with directives if I want to reuse the login link stuff    
 controller("MenuController", ['$scope', 'HelloService', function($scope, HelloService)
 {    
     $scope.doLogin = function()
@@ -14,29 +13,4 @@ controller("MenuController", ['$scope', 'HelloService', function($scope, HelloSe
     {
         HelloService.logout('facebook');
     };
-
-    $scope.loggedIn = false;
-    $scope.loggedOut = true;
-    $scope.loginLink = 'Login';
-    
-    HelloService.on('auth.login', function(auth)
-    {
-        HelloService(auth.network).api('/me').then(function(r)
-        {
-            $scope.loggedIn = true;
-            $scope.loggedOut = false;
-            $scope.greeting = 'Hi ' + r.name;
-            $scope.logoutLink = 'Logout';
-            $scope.$apply();
-        });
-    });
-    
-    HelloService.on('auth.logout', function(auth)
-    {
-        $scope.loggedIn = false;
-        $scope.loggedOut = true;
-        $scope.greeting = null;
-        $scope.loginLink = 'Login';
-        $scope.$apply();
-    });
 }]);
\ No newline at end of file
diff --git a/app/components/menu/menu-directive.js b/app/components/menu/menu-directive.js
new file mode 100644 (file)
index 0000000..a7739e4
--- /dev/null
@@ -0,0 +1,30 @@
+'use strict';
+
+//Module is defined in menu-controller.js so we only use angular.module(name) to retrieve and add to it.
+angular.module('DivinElegy.components.menu').
+        
+directive('menu', ['HelloService', 'UserService', function(HelloService, UserService) 
+{
+    return {
+        templateUrl: 'components/menu/menu.html',
+        link: function(scope, element){
+            HelloService.on('auth.login', function()
+            {
+                UserService.getCurrentUser().then(function(user)
+                {
+                    scope.welcomeMessage = 'Welcome, ' + user.displayName;
+                    scope.loggedIn = true;
+                });
+                UserService.getCurrentUser();
+            });
+            
+            HelloService.on('auth.logout', function()
+            {
+                scope.welcomeMessage = '';
+                scope.loggedIn = false;
+                scope.$apply();
+            });
+        }
+    };
+}]);
+
index f8a0c8b..966ae5c 100644 (file)
@@ -2,8 +2,8 @@
     <li><a href="#/">Home</a></li>
     <li><a href="#/upload">Upload</a></li>
     <li>
-        {{greeting}}<a ng-if="loggedIn" href="#" ng-click="doLogout()">{{logoutLink}}</a>
-        <a ng-if="loggedOut" href="#" ng-click="doLogin()">{{loginLink}}</a>
+        {{welcomeMessage}}
+        <a href="#" ng-if="loggedIn" ng-click="doLogout()">logout</a>
+        <a href="#" ng-if="!loggedIn" ng-click="doLogin()">login</a>
     </li>
-
 </ul>
\ No newline at end of file
diff --git a/app/components/user/user-service.js b/app/components/user/user-service.js
new file mode 100644 (file)
index 0000000..cd03318
--- /dev/null
@@ -0,0 +1,51 @@
+'use strict';
+
+angular.module("DivinElegy.components.user", ['DivinElegy.components.hello']).
+      
+factory("UserService", ['$http', '$q', 'HelloService', function($http, $q, HelloService)
+{
+    var UserService = {};
+    UserService.userCache = {};
+    
+    UserService.getUser = function(facebookId)
+    {
+        var deferred = $q.defer();
+        
+        if(this.userCache[facebookId])
+        {
+            this.userCache[facebookId]['fromCache'] = true;
+            deferred.resolve(this.userCache[facebookId]);
+            return deferred.promise;
+        }
+
+        $http({
+            url: "http://rock.divinelegy.meeples/user/" + facebookId,
+            method: "GET"
+        }).
+        success(function (data)
+        {
+            UserService.userCache[facebookId] = data;
+            deferred.resolve(data);
+        });
+        
+        
+        return deferred.promise;
+    };
+
+    UserService.getCurrentUser = function()
+    {           
+        if (!this.facebookId)
+        {
+            return HelloService.getFacebookId().then(function(fbId)
+                {
+                    //cant use this here bc scope or something
+                    UserService.facebookId = fbId;
+                    return UserService.getUser(fbId);
+                });
+        } else {
+            return this.getUser(this.facebookId);
+        }
+    };
+         
+    return UserService;
+}]);
\ No newline at end of file
diff --git a/app/components/userMenu/userMenu-directive.js b/app/components/userMenu/userMenu-directive.js
new file mode 100644 (file)
index 0000000..3ea12ca
--- /dev/null
@@ -0,0 +1,23 @@
+'use strict'
+
+angular.module('DivinElegy.components.userMenu', ['DivinElegy.components.hello']).
+        
+directive('userMenu', ['HelloService', function(HelloService) 
+{
+    return {
+        templateUrl: 'components/userMenu/userMenu.html',
+        link: function(scope, element){
+            HelloService.on('auth.login', function()
+            {
+                scope.showMenu = true;
+            });
+            
+            HelloService.on('auth.logout', function()
+            {
+                scope.showMenu = false;
+                scope.$apply();
+            });
+        }
+    };
+}]);
+
diff --git a/app/components/userMenu/userMenu.html b/app/components/userMenu/userMenu.html
new file mode 100644 (file)
index 0000000..2cebf57
--- /dev/null
@@ -0,0 +1,15 @@
+<div id="usermenu" ng-if="showMenu">
+    <ul>
+        <li>Public Profile</li>
+        <li>Account Settings</li>
+    </ul>
+    <ul>
+        <li>My Uploads</li>
+        <li>My Favourite Files</li>
+        <li>My Favourite Uploaders</li>
+        <li>My Followers</li>
+    </ul>
+    <ul>
+        <li>All Members</li>
+    </ul>
+</div>
\ No newline at end of file
index d035e65..1c8abff 100644 (file)
@@ -4,11 +4,13 @@
 angular.module('DivinElegy', [
   'ngRoute',
   'DivinElegy.components.hello',
+  'DivinElegy.components.user',
   'DivinElegy.components.menu',
+  'DivinElegy.components.userMenu',
   'DivinElegy.pages.index',
   'DivinElegy.pages.upload'
 ]).
-        
+
 config(['$routeProvider', function($routeProvider) {
     $routeProvider.
     when('/',
@@ -23,7 +25,7 @@ config(['$routeProvider', function($routeProvider) {
     }).
     otherwise({redirectTo: '/'});
 }]).
-    
+        
 run(['HelloService', function(HelloService)
 {
     HelloService.init({
index f7583d3..bd5e59f 100644 (file)
 
         <!-- components -->
         <script src="components/hello/hello-service.js"></script>
+        <script src="components/user/user-service.js"></script>
         <script src="components/menu/menu-controller.js"></script>
+        <script src="components/menu/menu-directive.js"></script>
+        <script src="components/userMenu/userMenu-directive.js"></script>
         
         <!-- pages -->
         <script src="pages/index/index.js"></script>
         <script src="divinelegy.js"></script>  
     </head>
     <body>
-        <div ng-include="'components/menu/menu.html'"></div>
+        <div menu></div>
 
         <div ng-view>
             <!-- extreme hard rock for DivinElegy gets loaded in here. -->
         </div>
+        
+        <div user-menu></div>
 
         <!-- <div>Angular seed app: v<span app-version></span></div> -->
     </body>