From d759b67d76b6af664129acc0af16af976e6afa97 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marco=20Ch=C3=A1vez?= Date: Sat, 27 Feb 2016 17:22:38 -0600 Subject: [PATCH 1/3] chore(templates): update bower dependencies to angular 1.5 --- app/templates/_bower.json | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/app/templates/_bower.json b/app/templates/_bower.json index 59b5007ca..b2bcd90bd 100644 --- a/app/templates/_bower.json +++ b/app/templates/_bower.json @@ -2,16 +2,16 @@ "name": "<%= lodash.slugify(lodash.humanize(appname)) %>", "version": "0.0.0", "dependencies": { - "angular": "~1.4.0", + "angular": "~1.5.0", "json3": "~3.3.1", "es5-shim": "~3.0.1",<% if(filters.bootstrap) { if (filters.sass) { %> "bootstrap-sass-official": "~3.1.1",<% } %> "bootstrap": "~3.1.1",<% if(filters.oauth) { %> "bootstrap-social": "~4.9.1",<% }} %> - "angular-resource": "~1.4.0", - "angular-cookies": "~1.4.0", - "angular-sanitize": "~1.4.0",<% if (filters.ngroute) { %> - "angular-route": "~1.4.0",<% } if (filters.uibootstrap) { %> + "angular-resource": "~1.5.0", + "angular-cookies": "~1.5.0", + "angular-sanitize": "~1.5.0",<% if (filters.ngroute) { %> + "angular-route": "~1.5.0",<% } if (filters.uibootstrap) { %> "angular-bootstrap": "~1.1.2",<% } %> "font-awesome": ">=4.1.0", "lodash": "~2.4.1"<% if(filters.socketio) { %>, @@ -20,6 +20,6 @@ "angular-validation-match": "~1.5.2"<% } %> }, "devDependencies": { - "angular-mocks": "~1.4.0" + "angular-mocks": "~1.5.0" } } From 5064a6a28b59f52993625017fdf6dd0178dfa337 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marco=20Ch=C3=A1vez?= Date: Sat, 27 Feb 2016 17:24:56 -0600 Subject: [PATCH 2/3] chore(templates): update npm dev dependencies to work with angular 1.5 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit update karma-phantomjs-launcher to “1.0.0” for angular 1.5: angular/angular.js#13794 use phantomjs-prebuilt because of this: karma-runner/karma-phantomjs-launcher#101 --- app/templates/_package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/templates/_package.json b/app/templates/_package.json index 989cac7a3..a6689f87d 100644 --- a/app/templates/_package.json +++ b/app/templates/_package.json @@ -146,7 +146,7 @@ "karma-chrome-launcher": "~0.2.0", "karma-requirejs": "~0.2.2", "karma-jade-preprocessor": "0.0.11", - "karma-phantomjs-launcher": "~0.2.0",<% if (filters.jade) { %> + "karma-phantomjs-launcher": "~1.0.0",<% if (filters.jade) { %> "karma-ng-jade2js-preprocessor": "^0.2.0",<% } else { %> "karma-ng-html2js-preprocessor": "~0.2.0",<% } %> "karma-spec-reporter": "~0.0.20", @@ -159,7 +159,7 @@ "jasmine-spec-reporter": "^2.4.0",<% } if(filters.babel) { %> "karma-babel-preprocessor": "^5.2.1",<% } %> "requirejs": "~2.1.11", - "phantomjs": "^1.9.18", + "phantomjs-prebuilt": "^2.1.4", "proxyquire": "^1.0.1", "supertest": "^1.1.0" }, From 6899dd67c03ee5be173f790a0c82ff2e4c7a8b27 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marco=20Ch=C3=A1vez?= Date: Sat, 27 Feb 2016 18:08:31 -0600 Subject: [PATCH 3/3] chore(main): use component in templates/client/app/main --- app/templates/client/app/main/main(html).html | 8 ++--- app/templates/client/app/main/main(jade).jade | 8 ++--- .../client/app/main/main.controller.js | 22 +++++++----- .../client/app/main/main.controller.spec.js | 35 ++++++++++++------- app/templates/client/app/main/main.js | 8 ++--- 5 files changed, 46 insertions(+), 35 deletions(-) diff --git a/app/templates/client/app/main/main(html).html b/app/templates/client/app/main/main(html).html index 1c413a22a..13b811715 100644 --- a/app/templates/client/app/main/main(html).html +++ b/app/templates/client/app/main/main(html).html @@ -10,8 +10,8 @@

'Allo, 'Allo!

Features:

-
<% if (filters.socketio) { %> @@ -19,9 +19,9 @@

Features:

- + - +

<% } %> diff --git a/app/templates/client/app/main/main(jade).jade b/app/templates/client/app/main/main(jade).jade index 5a732f9dc..5084e5f22 100644 --- a/app/templates/client/app/main/main(jade).jade +++ b/app/templates/client/app/main/main(jade).jade @@ -8,15 +8,15 @@ 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 main.awesomeThings') + ul.nav.nav-tabs.nav-stacked.col-md-4.col-lg-4.col-sm-6(ng-repeat='thing in $ctrl.awesomeThings') li a(href='#', uib-tooltip='{{thing.info}}') | {{thing.name}}<% if (filters.socketio) { %> - button.close(type='button', ng-click='main.deleteThing(thing)') ×<% } %><% if (filters.socketio) { %> + button.close(type='button', ng-click='$ctrl.deleteThing(thing)') ×<% } %><% 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='main.newThing') + input.form-control(type='text', placeholder='Add a new thing here.', ng-model='$ctrl.newThing') span.input-group-btn - button.btn.btn-primary(type='submit', ng-click='main.addThing()') Add New<% } %> + button.btn.btn-primary(type='submit', ng-click='$ctrl.addThing()') Add New<% } %> diff --git a/app/templates/client/app/main/main.controller.js b/app/templates/client/app/main/main.controller.js index f69ad1e8b..02f408164 100644 --- a/app/templates/client/app/main/main.controller.js +++ b/app/templates/client/app/main/main.controller.js @@ -5,17 +5,20 @@ class MainController { constructor($http<% if (filters.socketio) { %>, $scope, socket<% } %>) { - this.$http = $http; - this.awesomeThings = []; - - $http.get('/api/things').then(response => { - this.awesomeThings = response.data;<% if (filters.socketio) { %> - socket.syncUpdates('thing', this.awesomeThings);<% } %> - });<% if (filters.socketio) { %> + this.$http = $http;<% if (filters.socketio) { %> + this.socket = socket;<% } %> + this.awesomeThings = [];<% if (filters.socketio) { %> $scope.$on('$destroy', function() { socket.unsyncUpdates('thing'); });<% } %> + } + + $onInit() { + this.$http.get('/api/things').then(response => { + this.awesomeThings = response.data;<% if (filters.socketio) { %> + this.socket.syncUpdates('thing', this.awesomeThings);<% } %> + }); }<% if (filters.models) { %> addThing() { @@ -31,6 +34,9 @@ class MainController { } angular.module('<%= scriptAppName %>') - .controller('MainController', MainController); + .component('main', { + templateUrl: 'app/main/main.html', + controller: MainController + }); })(); diff --git a/app/templates/client/app/main/main.controller.spec.js b/app/templates/client/app/main/main.controller.spec.js index 42b1ea135..67982faa0 100644 --- a/app/templates/client/app/main/main.controller.spec.js +++ b/app/templates/client/app/main/main.controller.spec.js @@ -1,6 +1,6 @@ 'use strict'; -describe('Controller: MainController', function() { +describe('Component: mainComponent', function() { // load the controller's module beforeEach(module('<%= scriptAppName %>'));<% if (filters.uirouter) {%> @@ -8,26 +8,35 @@ describe('Controller: MainController', function() { beforeEach(module('socketMock'));<% } %> var scope; - var MainController;<% if (filters.uirouter) {%> + var mainComponent;<% if (filters.uirouter) {%> var state;<% } %> var $httpBackend; // Initialize the controller and a mock scope - beforeEach(inject(function(_$httpBackend_, $controller, $rootScope<% if (filters.uirouter) {%>, $state<% } %>) { - $httpBackend = _$httpBackend_; - $httpBackend.expectGET('/api/things') - .respond(['HTML5 Boilerplate', 'AngularJS', 'Karma', 'Express']); + beforeEach(inject(function( + _$httpBackend_, + $http, + $componentController, + $rootScope<% if (filters.uirouter) {%>, + $state<% } %><% if (filters.socketio) {%>, + socket<% } %>) { + $httpBackend = _$httpBackend_; + $httpBackend.expectGET('/api/things') + .respond(['HTML5 Boilerplate', 'AngularJS', 'Karma', 'Express']); - scope = $rootScope.$new();<% if (filters.uirouter) {%> - state = $state;<% } %> - MainController = $controller('MainController', { - $scope: scope - }); + scope = $rootScope.$new();<% if (filters.uirouter) {%> + state = $state;<% } %> + mainComponent = $componentController('main', { + $http: $http, + $scope: scope<% if (filters.socketio) {%>, + socket: socket<% } %> + }); })); it('should attach a list of things to the controller', function() { + mainComponent.$onInit(); $httpBackend.flush();<% if (filters.jasmine) { %> - expect(MainController.awesomeThings.length).toBe(4);<% } if (filters.mocha) { %> - <%= expect() %>MainController.awesomeThings.length<%= to() %>.equal(4);<% } %> + expect(mainComponent.awesomeThings.length).toBe(4);<% } if (filters.mocha) { %> + <%= expect() %>mainComponent.awesomeThings.length<%= to() %>.equal(4);<% } %> }); }); diff --git a/app/templates/client/app/main/main.js b/app/templates/client/app/main/main.js index 43206bce4..9d5f59887 100644 --- a/app/templates/client/app/main/main.js +++ b/app/templates/client/app/main/main.js @@ -4,16 +4,12 @@ angular.module('<%= scriptAppName %>') <% if (filters.ngroute) { %>.config(function($routeProvider) { $routeProvider .when('/', { - templateUrl: 'app/main/main.html', - controller: 'MainController', - controllerAs: 'main' + template: '
' }); });<% } %><% if (filters.uirouter) { %>.config(function($stateProvider) { $stateProvider .state('main', { url: '/', - templateUrl: 'app/main/main.html', - controller: 'MainController', - controllerAs: 'main' + template: '
' }); });<% } %>