refactor(client:main): use controller as, named function, new name

controller as main, MainCtrl -> MainController

Author: Awk34

Diff for: app/templates/client/app/main/main(coffee).coffee

@@ -5,11 +5,13 @@ angular.module '<%= scriptAppName %>'
   $routeProvider
   .when '/',
     templateUrl: 'app/main/main.html'
-    controller: 'MainCtrl'
+    controller: 'MainController'
+    controllerAs: 'main'
 <% } %><% if (filters.uirouter) { %>.config ($stateProvider) ->
   $stateProvider
   .state 'main',
     url: '/'
     templateUrl: 'app/main/main.html'
-    controller: 'MainCtrl'
+    controller: 'MainController'
+    controllerAs: 'main'
 <% } %>

Diff for: app/templates/client/app/main/main(html).html

@@ -12,18 +12,18 @@ <h1>'Allo, 'Allo!</h1>
   <div class="row">
     <div class="col-lg-12">
       <h1 class="page-header">Features:</h1>
-      <ul class="nav nav-tabs nav-stacked col-md-4 col-lg-4 col-sm-6" ng-repeat="thing in awesomeThings">
-        <li><a href="#" tooltip="{{thing.info}}">{{thing.name}}<% if (filters.socketio) { %><button type="button" class="close" ng-click="deleteThing(thing)">&times;</button><% } %></a></li>
+      <ul class="nav nav-tabs nav-stacked col-md-4 col-lg-4 col-sm-6" ng-repeat="thing in main.awesomeThings">
+        <li><a href="#" tooltip="{{thing.info}}">{{thing.name}}<% if (filters.socketio) { %><button type="button" class="close" ng-click="main.deleteThing(thing)">&times;</button><% } %></a></li>
       </ul>
     </div>
   </div><% if (filters.socketio) { %>
 
   <form class="thing-form">
     <label>Syncs in realtime across clients</label>
     <p class="input-group">
-      <input type="text" class="form-control" placeholder="Add a new thing here." ng-model="newThing">
+      <input type="text" class="form-control" placeholder="Add a new thing here." ng-model="main.newThing">
       <span class="input-group-btn">
-        <button type="submit" class="btn btn-primary" ng-click="addThing()">Add New</button>
+        <button type="submit" class="btn btn-primary" ng-click="main.addThing()">Add New</button>
       </span>
     </p>
   </form><% } %>

Diff for: app/templates/client/app/main/main(jade).jade

@@ -10,17 +10,17 @@ header#banner.hero-unit
   .row
     .col-lg-12
       h1.page-header Features:
-      ul.nav.nav-tabs.nav-stacked.col-md-4.col-lg-4.col-sm-6(ng-repeat='thing in awesomeThings')
+      ul.nav.nav-tabs.nav-stacked.col-md-4.col-lg-4.col-sm-6(ng-repeat='thing in main.awesomeThings')
         li
           a(href='#', tooltip='{{thing.info}}')
             | {{thing.name}}<% if (filters.socketio) { %>
-            button.close(type='button', ng-click='deleteThing(thing)') &times;<% } %><% if (filters.socketio) { %>
+            button.close(type='button', ng-click='main.deleteThing(thing)') &times;<% } %><% if (filters.socketio) { %>
 
   form.thing-form
     label Syncs in realtime across clients
     p.input-group
-      input.form-control(type='text', placeholder='Add a new thing here.', ng-model='newThing')
+      input.form-control(type='text', placeholder='Add a new thing here.', ng-model='main.newThing')
       span.input-group-btn
-        button.btn.btn-primary(type='submit', ng-click='addThing()') Add New<% } %>
+        button.btn.btn-primary(type='submit', ng-click='main.addThing()') Add New<% } %>
 
 footer

Diff for: app/templates/client/app/main/main(js).js

@@ -5,13 +5,15 @@ angular.module('<%= scriptAppName %>')
     $routeProvider
       .when('/', {
         templateUrl: 'app/main/main.html',
-        controller: 'MainCtrl'
+        controller: 'MainController',
+        conterollerAs: 'main'
       });
   });<% } %><% if (filters.uirouter) { %>.config(function($stateProvider) {
     $stateProvider
       .state('main', {
         url: '/',
         templateUrl: 'app/main/main.html',
-        controller: 'MainCtrl'
+        controller: 'MainController',
+        conterollerAs: 'main'
       });
   });<% } %>

Diff for: app/templates/client/app/main/main.controller(coffee).coffee

@@ -1,22 +1,27 @@
 'use strict'
 
-angular.module '<%= scriptAppName %>'
-.controller 'MainCtrl', ($scope, $http<% if (filters.socketio) { %>, socket<% } %>) ->
-  $scope.awesomeThings = []
-
-  $http.get('/api/things').then (response) ->
-    $scope.awesomeThings = response.data
-    <% if (filters.socketio) { %>socket.syncUpdates 'thing', $scope.awesomeThings<% } %>
+MainController = ($scope, $http<% if (filters.socketio) { %>, socket<% } %>) ->
+  @awesomeThings = []
+  $http.get('/api/things').then (response) =>
+    this.awesomeThings = response.data<% if (filters.socketio) { %>
+    socket.syncUpdates 'thing', this.awesomeThings<% } %>
+    return
 <% if (filters.models) { %>
-  $scope.addThing = ->
-    return if $scope.newThing is ''
-    $http.post '/api/things',
-      name: $scope.newThing
-
-    $scope.newThing = ''
+  @addThing = =>
+    if this.newThing == ''
+      return
+    $http.post '/api/things', name: this.newThing
+    this.newThing = ''
+    return
 
-  $scope.deleteThing = (thing) ->
-    $http.delete '/api/things/' + thing._id<% } %><% if (filters.socketio) { %>
+  @deleteThing = (thing) ->
+    $http.delete '/api/things/' + thing._id
+    return<% } %><% if (filters.socketio) { %>
 
   $scope.$on '$destroy', ->
-    socket.unsyncUpdates 'thing'<% } %>
+    socket.unsyncUpdates 'thing'
+    return<% } %>
+  return this
+
+angular.module '<%= scriptAppName %>'
+.controller 'MainController', MainController

Diff for: app/templates/client/app/main/main.controller(js).js

@@ -1,27 +1,33 @@
 'use strict';
+(function() {
 
-angular.module('<%= scriptAppName %>')
-  .controller('MainCtrl', function($scope, $http<% if (filters.socketio) { %>, socket<% } %>) {
-    $scope.awesomeThings = [];
+function MainController($scope, $http<% if (filters.socketio) { %>, socket<% } %>) {
+  var self = this;
+  this.awesomeThings = [];
 
-    $http.get('/api/things').then(function(response) {
-      $scope.awesomeThings = response.data;<% if (filters.socketio) { %>
-      socket.syncUpdates('thing', $scope.awesomeThings);<% } %>
-    });
+  $http.get('/api/things').then(function(response) {
+    self.awesomeThings = response.data;<% if (filters.socketio) { %>
+    socket.syncUpdates('thing', self.awesomeThings);<% } %>
+  });
 <% if (filters.models) { %>
-    $scope.addThing = function() {
-      if ($scope.newThing === '') {
-        return;
-      }
-      $http.post('/api/things', { name: $scope.newThing });
-      $scope.newThing = '';
-    };
+  this.addThing = function() {
+    if (self.newThing === '') {
+      return;
+    }
+    $http.post('/api/things', { name: self.newThing });
+    self.newThing = '';
+  };
 
-    $scope.deleteThing = function(thing) {
-      $http.delete('/api/things/' + thing._id);
-    };<% } %><% if (filters.socketio) { %>
+  this.deleteThing = function(thing) {
+    $http.delete('/api/things/' + thing._id);
+  };<% } %><% if (filters.socketio) { %>
 
-    $scope.$on('$destroy', function() {
-      socket.unsyncUpdates('thing');
-    });<% } %>
-  });
+  $scope.$on('$destroy', function() {
+    socket.unsyncUpdates('thing');
+  });<% } %>
+}
+
+angular.module('<%= scriptAppName %>')
+  .controller('MainController', MainController);
+
+})();

Diff for: app/templates/client/app/main/main.controller.spec(coffee).coffee

@@ -1,13 +1,13 @@
 'use strict'
 
-describe 'Controller: MainCtrl', ->
+describe 'Controller: MainController', ->
 
   # load the controller's module
   beforeEach module '<%= scriptAppName %>' <% if (filters.uirouter) {%>
   beforeEach module 'stateMock' <% } %><% if (filters.socketio) {%>
   beforeEach module 'socketMock' <% } %>
 
-  MainCtrl = undefined
+  MainController = undefined
   scope = undefined<% if (filters.uirouter) {%>
   state = undefined<% } %>
   $httpBackend = undefined
@@ -23,10 +23,10 @@ describe 'Controller: MainCtrl', ->
     ]
     scope = $rootScope.$new()<% if (filters.uirouter) {%>
     state = $state<% } %>
-    MainCtrl = $controller 'MainCtrl',
+    MainController = $controller 'MainController',
       $scope: scope
 
-  it 'should attach a list of things to the scope', ->
+  it 'should attach a list of things to the controller', ->
     $httpBackend.flush()<% if (filters.jasmine) { %>
-    expect(scope.awesomeThings.length).toBe 4 <% } if (filters.mocha) { %>
-    <%= expect() %>scope.awesomeThings.length<%= to() %>.equal 4<% } %>
+    expect(MainController.awesomeThings.length).toBe 4 <% } if (filters.mocha) { %>
+    <%= expect() %>MainController.awesomeThings.length<%= to() %>.equal 4<% } %>

Diff for: app/templates/client/app/main/main.controller.spec(js).js

@@ -1,14 +1,14 @@
 'use strict';
 
-describe('Controller: MainCtrl', function() {
+describe('Controller: MainController', function() {
 
   // load the controller's module
   beforeEach(module('<%= scriptAppName %>'));<% if (filters.uirouter) {%>
   beforeEach(module('stateMock'));<% } %><% if (filters.socketio) {%>
   beforeEach(module('socketMock'));<% } %>
 
-  var MainCtrl;
-  var scope;<% if (filters.uirouter) {%>
+  var scope;
+  var MainController;<% if (filters.uirouter) {%>
   var state;<% } %>
   var $httpBackend;
 
@@ -20,14 +20,14 @@ describe('Controller: MainCtrl', function() {
 
     scope = $rootScope.$new();<% if (filters.uirouter) {%>
     state = $state;<% } %>
-    MainCtrl = $controller('MainCtrl', {
+    MainController = $controller('MainController', {
       $scope: scope
     });
   }));
 
-  it('should attach a list of things to the scope', function() {
+  it('should attach a list of things to the controller', function() {
     $httpBackend.flush();<% if (filters.jasmine) { %>
-    expect(scope.awesomeThings.length).toBe(4);<% } if (filters.mocha) { %>
-    <%= expect() %>scope.awesomeThings.length<%= to() %>.equal(4);<% } %>
+    expect(MainController.awesomeThings.length).toBe(4);<% } if (filters.mocha) { %>
+    <%= expect() %>MainController.awesomeThings.length<%= to() %>.equal(4);<% } %>
   });
 });