vm - descriptive names

modules/core/client/config/core.client.routes.js

@@ -20,7 +20,7 @@
         url: '/',
         templateUrl: 'modules/core/client/views/home.client.view.html',
         controller: 'HomeController',
-        controllerAs: 'vm'
+        controllerAs: 'homeVm'
       })
       .state('not-found', {
         url: '/not-found',

modules/core/client/views/header.client.view.html

@@ -1,26 +1,26 @@
-<div class="container" ng-controller="HeaderController as vm">
+<div class="container" ng-controller="HeaderController as headerVm">
   <div class="navbar-header">
-    <button class="navbar-toggle" type="button" ng-click="vm.isCollapsed = !vm.isCollapsed">
+    <button class="navbar-toggle" type="button" ng-click="headerVm.isCollapsed = !headerVm.isCollapsed">
       <span class="sr-only">Toggle navigation</span>
       <span class="icon-bar"></span>
       <span class="icon-bar"></span>
       <span class="icon-bar"></span>
     </button>
     <a ui-sref="home" class="navbar-brand">MEAN.JS</a>
   </div>
-  <nav class="collapse navbar-collapse" uib-collapse="!vm.isCollapsed" role="navigation">
-    <ul class="nav navbar-nav" ng-if="vm.menu.shouldRender(vm.authentication.user);">
-      <li ng-repeat="item in vm.menu.items | orderBy: 'position'" ng-if="item.shouldRender(vm.authentication.user);" ng-switch="item.type" ng-class="{ dropdown: item.type === 'dropdown' }" ui-sref-active="active" class="{{item.class}}" uib-dropdown="item.type === 'dropdown'">
+  <nav class="collapse navbar-collapse" uib-collapse="!headerVm.isCollapsed" role="navigation">
+    <ul class="nav navbar-nav" ng-if="headerVm.menu.shouldRender(headerVm.authentication.user);">
+      <li ng-repeat="item in headerVm.menu.items | orderBy: 'position'" ng-if="item.shouldRender(headerVm.authentication.user);" ng-switch="item.type" ng-class="{ dropdown: item.type === 'dropdown' }" ui-sref-active="active" class="{{item.class}}" uib-dropdown="item.type === 'dropdown'">
         <a ng-switch-when="dropdown" class="dropdown-toggle" uib-dropdown-toggle role="button">{{::item.title}}&nbsp;<span class="caret"></span></a>
         <ul ng-switch-when="dropdown" class="dropdown-menu">
-          <li ng-repeat="subitem in item.items | orderBy: 'position'" ng-if="subitem.shouldRender(vm.authentication.user);">
+          <li ng-repeat="subitem in item.items | orderBy: 'position'" ng-if="subitem.shouldRender(headerVm.authentication.user);">
             <a ui-sref="{{subitem.state}}" ng-bind="subitem.title"></a>
           </li>
         </ul>
         <a ng-switch-default ui-sref="{{item.state}}" ng-bind="item.title"></a>
       </li>
     </ul>
-    <ul class="nav navbar-nav navbar-right" ng-hide="vm.authentication.user">
+    <ul class="nav navbar-nav navbar-right" ng-hide="headerVm.authentication.user">
       <li ui-sref-active="active">
         <a ui-sref="authentication.signup">Sign Up</a>
       </li>
@@ -29,14 +29,14 @@
         <a ui-sref="authentication.signin">Sign In</a>
       </li>
     </ul>
-    <ul class="nav navbar-nav navbar-right" ng-show="vm.authentication.user">
+    <ul class="nav navbar-nav navbar-right" ng-show="headerVm.authentication.user">
       <li class="dropdown" uib-dropdown>
         <a class="dropdown-toggle user-header-dropdown-toggle" uib-dropdown-toggle role="button">
-          <img ng-src="{{vm.authentication.user.profileImageURL}}" alt="{{vm.authentication.user.displayName}}" class="header-profile-image" />
-          <span ng-bind="vm.authentication.user.displayName"></span> <b class="caret"></b>
+          <img ng-src="{{headerVm.authentication.user.profileImageURL}}" alt="{{headerVm.authentication.user.displayName}}" class="header-profile-image" />
+          <span ng-bind="headerVm.authentication.user.displayName"></span> <b class="caret"></b>
         </a>
         <ul class="dropdown-menu" role="menu">
-          <li ui-sref-active="active" ng-repeat="item in vm.accountMenu.items">
+          <li ui-sref-active="active" ng-repeat="item in headerVm.accountMenu.items">
             <a ui-sref="{{item.state}}" ng-bind="item.title"></a>
           </li>
           <li class="divider"></li>

modules/core/tests/client/header.client.controller.tests.js

@@ -16,45 +16,45 @@
       $state = _$state_;
       Authentication = _Authentication_;
 
-      HeaderController = $controller('HeaderController as vm', {
+      HeaderController = $controller('HeaderController as headerVm', {
         $scope: scope
       });
     }));
 
     it('should expose the authentication service', function () {
-      expect(scope.vm.authentication).toBe(Authentication);
+      expect(scope.headerVm.authentication).toBe(Authentication);
     });
 
     it('should default menu to collapsed', function () {
-      expect(scope.vm.isCollapsed).toBeFalsy();
+      expect(scope.headerVm.isCollapsed).toBeFalsy();
     });
 
     describe('when toggleCollapsibleMenu', function () {
       var defaultCollapse;
       beforeEach(function () {
-        defaultCollapse = scope.vm.isCollapsed;
+        defaultCollapse = scope.headerVm.isCollapsed;
 
-        scope.vm.isCollapsed = !scope.vm.isCollapsed;
+        scope.headerVm.isCollapsed = !scope.headerVm.isCollapsed;
       });
 
       it('should toggle isCollapsed to non default value', function () {
-        expect(scope.vm.isCollapsed).not.toBe(defaultCollapse);
+        expect(scope.headerVm.isCollapsed).not.toBe(defaultCollapse);
       });
 
       it('should then toggle isCollapsed back to default value', function () {
-        scope.vm.isCollapsed = !scope.vm.isCollapsed;
-        expect(scope.vm.isCollapsed).toBe(defaultCollapse);
+        scope.headerVm.isCollapsed = !scope.headerVm.isCollapsed;
+        expect(scope.headerVm.isCollapsed).toBe(defaultCollapse);
       });
     });
 
     describe('when view state changes', function () {
       beforeEach(function () {
-        scope.vm.isCollapsed = true;
+        scope.headerVm.isCollapsed = true;
         scope.$broadcast('$stateChangeSuccess');
       });
 
       it('should set isCollapsed to false', function () {
-        expect(scope.vm.isCollapsed).toBeFalsy();
+        expect(scope.headerVm.isCollapsed).toBeFalsy();
       });
     });
   });

modules/core/tests/client/home.client.controller.tests.js

@@ -12,7 +12,7 @@
     beforeEach(inject(function ($controller, $rootScope) {
       scope = $rootScope.$new();
 
-      HomeController = $controller('HomeController as vm', {
+      HomeController = $controller('HomeController as homeVm', {
         $scope: scope
       });
     }));