Fixes #61 - upgrade to recommended angular project structure

README.md

@@ -89,13 +89,8 @@ Now browse to the app at `http://localhost:8000/app/index.html`.
       js/                 --> javascript files
         app.js            --> application
         config.js         --> where you configure Firebase and auth options
-        controllers.js    --> application controllers
-        directives.js     --> application directives
-        decorators.js     --> decorator functions
-        filters.js        --> custom angular filters
         firebase.utils.js --> some DRY methods for interacting with Firebase and AngularFire
-        routes.js         --> routing and route security for the app
-        services.js       --> custom angular services
+        security.js         --> routing and route security for the app
         auth.js    --> some DRY methods for interacting with Firebase authentication
       partials/           --> angular view partials (partial html templates)
         account.html

app/account/account.js

@@ -0,0 +1,77 @@
+(function (angular) {
+  "use strict";
+
+  var app = angular.module('myApp.account', ['firebase', 'firebase.utils', 'firebase.auth', 'ngRoute']);
+
+  app.controller('AccountCtrl', ['$scope', 'Auth', 'fbutil', 'user', '$location', '$firebaseObject',
+    function($scope, Auth, fbutil, user, $location, $firebaseObject) {
+      var unbind;
+      // create a 3-way binding with the user profile object in Firebase
+      var profile = $firebaseObject(fbutil.ref('users', user.uid));
+      profile.$bindTo($scope, 'profile').then(function(ub) { unbind = ub; });
+
+      // expose logout function to scope
+      $scope.logout = function() {
+        if( unbind ) { unbind(); }
+        profile.$destroy();
+        Auth.$unauth();
+        $location.path('/login');
+      };
+
+      $scope.changePassword = function(pass, confirm, newPass) {
+        resetMessages();
+        if( !pass || !confirm || !newPass ) {
+          $scope.err = 'Please fill in all password fields';
+        }
+        else if( newPass !== confirm ) {
+          $scope.err = 'New pass and confirm do not match';
+        }
+        else {
+          Auth.$changePassword({email: profile.email, oldPassword: pass, newPassword: newPass})
+            .then(function() {
+              $scope.msg = 'Password changed';
+            }, function(err) {
+              $scope.err = err;
+            })
+        }
+      };
+
+      $scope.clear = resetMessages;
+
+      $scope.changeEmail = function(pass, newEmail) {
+        resetMessages();
+        var oldEmail = profile.email;
+        Auth.$changeEmail({oldEmail: oldEmail, newEmail: newEmail, password: pass})
+          .then(function() {
+            // store the new email address in the user's profile
+            return fbutil.handler(function(done) {
+              fbutil.ref('users', user.uid, 'email').set(newEmail, done);
+            });
+          })
+          .then(function() {
+            $scope.emailmsg = 'Email changed';
+          }, function(err) {
+            $scope.emailerr = err;
+          });
+      };
+
+      function resetMessages() {
+        $scope.err = null;
+        $scope.msg = null;
+        $scope.emailerr = null;
+        $scope.emailmsg = null;
+      }
+    }
+  ]);
+
+  app.config(['$routeProvider', function($routeProvider) {
+    // require user to be authenticated before they can access this page
+    // this is handled by the .whenAuthenticated method declared in
+    // components/router/router.js
+    $routeProvider.whenAuthenticated('/account', {
+      templateUrl: 'account/account.html',
+      controller: 'AccountCtrl'
+    })
+  }]);
+
+})(angular);

app/account/account_test.js

@@ -0,0 +1,38 @@
+
+describe('myApp.account', function() {
+  beforeEach(function() {
+    module('myApp');
+    module('myApp.account');
+  });
+
+  describe('AccountCtrl', function() {
+    var accountCtrl, $scope;
+    beforeEach(function() {
+      module(function($provide) {
+        // comes from routes.js in the resolve: {} attribute
+        $provide.value('user', {uid: 'test123'});
+      });
+
+      inject(function($controller) {
+        $scope = {};
+        accountCtrl = $controller('AccountCtrl', {$scope: $scope});
+      });
+    });
+
+    it('should define logout method', function() {
+      expect(typeof $scope.logout).toBe('function');
+    });
+
+    it('should define changePassword method', function() {
+      expect(typeof $scope.changePassword).toBe('function');
+    });
+
+    it('should define changeEmail method', function() {
+      expect(typeof $scope.changeEmail).toBe('function');
+    });
+
+    it('should define clear method', function() {
+      expect(typeof $scope.clear).toBe('function');
+    });
+  });
+});

app/app.js

@@ -0,0 +1,18 @@
+'use strict';
+
+// Declare app level module which depends on filters, and services
+angular.module('myApp', [
+    'myApp.config',
+    'myApp.security',
+    'myApp.home',
+    'myApp.account',
+    'myApp.chat',
+    'myApp.login'
+  ])
+
+  .run(['$rootScope', 'Auth', function($rootScope, Auth) {
+    // track status of authentication
+    Auth.$onAuth(function(user) {
+      $rootScope.loggedIn = !!user;
+    });
+  }]);

app/partials/chat.html → app/chat/chat.html

@@ -8,8 +8,3 @@ <h2>Chat</h2>
 <ul id="messages" ng-show="messages.length">
     <li ng-repeat="message in messages | reverse">{{message.text}}</li>
 </ul>
-
-<p>
-  Running the 'interpolate' filter:
-  {{ 'Current version is v%VERSION%.' | interpolate }}
-</p>

app/chat/chat.js

@@ -0,0 +1,27 @@
+(function (angular) {
+  "use strict";
+
+  var app = angular.module('myApp.chat', ['ngRoute', 'firebase.utils', 'firebase']);
+
+  app.controller('ChatCtrl', ['$scope', 'messageList', function($scope, messageList) {
+      $scope.messages = messageList;
+      $scope.addMessage = function(newMessage) {
+        if( newMessage ) {
+          $scope.messages.$add({text: newMessage});
+        }
+      };
+    }]);
+
+  app.factory('messageList', ['fbutil', '$firebaseArray', function(fbutil, $firebaseArray) {
+    var ref = fbutil.ref('messages').limitToLast(10);
+    return $firebaseArray(ref);
+  }]);
+
+  app.config(['$routeProvider', function($routeProvider) {
+    $routeProvider.when('/chat', {
+      templateUrl: 'chat/chat.html',
+      controller: 'ChatCtrl'
+    });
+  }]);
+
+})(angular);

app/chat/chat_test.js

@@ -0,0 +1,18 @@
+
+describe('myApp.chat', function() {
+  beforeEach(module('myApp.chat'));
+
+  describe('ChatCtrl', function() {
+    var chatCtrl, $scope;
+    beforeEach(function() {
+      inject(function($controller) {
+        $scope = {};
+        chatCtrl = $controller('ChatCtrl', {$scope: $scope});
+      });
+    });
+
+    it('creates messages array in scope', function() {
+      expect(Object.prototype.toString.call($scope.messages)).toBe('[object Array]');
+    });
+  });
+});

app/components/appversion/appversion-directive.js

@@ -0,0 +1,12 @@
+'use strict';
+
+/* Directives */
+
+
+angular.module('myApp')
+
+  .directive('appVersion', ['version', function(version) {
+    return function(scope, elm) {
+      elm.text(version);
+    };
+  }]);

app/components/appversion/appversion-directive_test.js

@@ -0,0 +1,21 @@
+'use strict';
+
+/* jasmine specs for directives go here */
+
+describe('app-version directive', function() {
+  beforeEach(function() {
+    module('mock.firebase');
+    module('myApp');
+  });
+
+  it('should print current version', function() {
+    module(function($provide) {
+      $provide.constant('version', 'TEST_VER');
+    });
+    inject(function($compile, $rootScope) {
+      var element = $compile('<span app-version></span>')($rootScope);
+      expect(element.text()).toEqual('TEST_VER');
+    });
+  });
+
+});

app/components/auth/auth.js

@@ -0,0 +1,4 @@
+angular.module('firebase.auth', ['firebase', 'firebase.utils'])
+  .factory('Auth', ['$firebaseAuth', 'fbutil', function($firebaseAuth, fbutil) {
+    return $firebaseAuth(fbutil.ref());
+  }]);

app/components/auth/auth_test.js

@@ -0,0 +1,15 @@
+"use strict";
+describe('Auth', function() {
+  beforeEach(function() {
+    module('mock.firebase');
+    module('firebase.auth');
+  });
+
+  it('should return $firebaseAuth instance', function() {
+    inject(function (Auth, $firebaseAuth) {
+      var ref = new MockFirebase();
+      var testInst = $firebaseAuth(ref);
+      expect(Auth.prototype === testInst.prototype).toBe(true);
+    });
+  });
+});

app/components/firebase.utils/firebase.utils_test.js

@@ -0,0 +1,19 @@
+"use strict";
+describe('fbutil', function() {
+  beforeEach(function() {
+    module('mock.firebase');
+    module('firebase.utils');
+  });
+
+  describe('handler', function() {
+    it('should have tests');
+  });
+
+  describe('defer', function() {
+    it('should have tests');
+  });
+
+  describe('ref', function() {
+    it('should have tests');
+  });
+});

app/js/decorators.js → app/components/ngcloak/ngcloak-decorator.js

@@ -1,12 +1,13 @@
+
 /**
-* Wraps ng-cloak so that, instead of simply waiting for Angular to compile, it waits until
-* Auth resolves with the remote Firebase services.
-*
-* <code>
-*    <div ng-cloak>Authentication has resolved.</div>
-* </code>
-*/
-angular.module('myApp.decorators', ['firebase.utils', 'firebase.auth'])
+ * Wraps ng-cloak so that, instead of simply waiting for Angular to compile, it waits until
+ * Auth resolves with the remote Firebase services.
+ *
+ * <code>
+ *    <div ng-cloak>Authentication has resolved.</div>
+ * </code>
+ */
+angular.module('myApp')
   .config(['$provide', function($provide) {
     // adapt ng-cloak to wait for auth before it does its magic
     $provide.decorator('ngCloakDirective', ['$delegate', 'Auth',

app/components/reverse/reverse-filter.js

@@ -0,0 +1,10 @@
+'use strict';
+
+/* Filters */
+
+angular.module('myApp')
+  .filter('reverse', function() {
+    return function(items) {
+      return items.slice().reverse();
+    };
+  });

app/components/reverse/reverse-filter_test.js

@@ -0,0 +1,13 @@
+describe('reverse', function() {
+  var reverse;
+  beforeEach(function() {
+    module('myApp');
+    inject(function (reverseFilter) {
+      reverse = reverseFilter;
+    });
+  });
+
+  it('should reverse contents of an array', function() {
+    expect(reverse([3,2,1])).toEqual([1,2,3]);
+  });
+});