From 311605a4e2165256a7b54532fa0b14bfe8b530dd Mon Sep 17 00:00:00 2001 From: Amos Haviv Date: Fri, 21 Feb 2014 00:41:21 +0200 Subject: [PATCH] Replacing ngRoute with UI-Router --- app/views/index.html | 2 +- app/views/layout.html | 2 +- bower.json | 4 +- karma.conf.js | 2 +- public/js/config.js | 2 +- public/modules/articles/config/routes.js | 37 +++++++++++-------- .../modules/articles/controllers/articles.js | 6 +-- .../modules/articles/tests/articles.spec.js | 8 ++-- public/modules/core/config/routes.js | 19 ++++++---- public/modules/users/config/routes.js | 23 +++++++----- 10 files changed, 59 insertions(+), 46 deletions(-) diff --git a/app/views/index.html b/app/views/index.html index 44b2a3111f..832522f4d0 100644 --- a/app/views/index.html +++ b/app/views/index.html @@ -1,5 +1,5 @@ {% extends 'layout.html' %} {% block content %} -
+
{% endblock %} diff --git a/app/views/layout.html b/app/views/layout.html index 7caafe9c6e..15186c0dad 100644 --- a/app/views/layout.html +++ b/app/views/layout.html @@ -58,7 +58,6 @@ - @@ -66,6 +65,7 @@ + diff --git a/bower.json b/bower.json index e99dafb400..99a49d6897 100644 --- a/bower.json +++ b/bower.json @@ -5,12 +5,12 @@ "dependencies": { "bootstrap": "latest", "angular": "latest", - "angular-route": "latest", "angular-cookies": "latest", "angular-resource": "latest", "angular-animate": "latest", "angular-mocks": "latest", "angular-bootstrap": "latest", - "angular-ui-utils": "latest" + "angular-ui-utils": "latest", + "angular-ui-router": "#master" } } \ No newline at end of file diff --git a/karma.conf.js b/karma.conf.js index 62a90e8561..302e63b48d 100644 --- a/karma.conf.js +++ b/karma.conf.js @@ -21,9 +21,9 @@ module.exports = function(config) { 'public/lib/angular-mocks/angular-mocks.js', 'public/lib/angular-cookies/angular-cookies.js', 'public/lib/angular-resource/angular-resource.js', - 'public/lib/angular-route/angular-route.js', 'public/lib/angular-bootstrap/ui-bootstrap.js', 'public/lib/angular-ui-utils/ui-utils.js', + 'public/lib/angular-ui-router/release/angular-ui-router.js', 'public/js/config.js', 'public/js/application.js', ].concat(modulesJSFiles), diff --git a/public/js/config.js b/public/js/config.js index aef8f4a207..1ed739185a 100644 --- a/public/js/config.js +++ b/public/js/config.js @@ -4,7 +4,7 @@ var ApplicationConfiguration = (function() { // Init module configuration options var applicationModuleName = 'mean'; - var applicationModuleVendorDependencies = ['ngRoute', 'ngResource', 'ngCookies', 'ngAnimate', 'ui.bootstrap', 'ui.utils']; + var applicationModuleVendorDependencies = ['ngResource', 'ngCookies', 'ngAnimate', 'ui.router', 'ui.bootstrap', 'ui.utils']; // Add a new vertical module var registerModule = function(moduleName) { diff --git a/public/modules/articles/config/routes.js b/public/modules/articles/config/routes.js index 4f2bc00f0f..3ba5fa75d6 100755 --- a/public/modules/articles/config/routes.js +++ b/public/modules/articles/config/routes.js @@ -1,20 +1,25 @@ 'use strict'; //Setting up route -angular.module('mean.articles').config(['$routeProvider', - function($routeProvider) { - $routeProvider. - when('/articles', { - templateUrl: 'modules/articles/views/list.html' - }). - when('/articles/create', { - templateUrl: 'modules/articles/views/create.html' - }). - when('/articles/:articleId', { - templateUrl: 'modules/articles/views/view.html' - }). - when('/articles/:articleId/edit', { - templateUrl: 'modules/articles/views/edit.html' - }); - } +angular.module('mean.articles').config(['$stateProvider', + function($stateProvider) { + // Articles state routing + $stateProvider. + state('listArticles', { + url: '/articles', + templateUrl: 'modules/articles/views/list.html' + }). + state('createArticle', { + url: '/articles/create', + templateUrl: 'modules/articles/views/create.html' + }). + state('viewArticle', { + url: '/articles/:articleId', + templateUrl: 'modules/articles/views/view.html' + }). + state('editArticle', { + url: '/articles/:articleId/edit', + templateUrl: 'modules/articles/views/edit.html' + }); + } ]); \ No newline at end of file diff --git a/public/modules/articles/controllers/articles.js b/public/modules/articles/controllers/articles.js index 5fd9760516..79d8ccefd7 100644 --- a/public/modules/articles/controllers/articles.js +++ b/public/modules/articles/controllers/articles.js @@ -1,7 +1,7 @@ 'use strict'; -angular.module('mean.articles').controller('ArticlesController', ['$scope', '$routeParams', '$location', 'Authentication', 'Articles', - function($scope, $routeParams, $location, Authentication, Articles) { +angular.module('mean.articles').controller('ArticlesController', ['$scope', '$stateParams', '$location', 'Authentication', 'Articles', + function($scope, $stateParams, $location, Authentication, Articles) { $scope.authentication = Authentication; $scope.create = function() { @@ -53,7 +53,7 @@ angular.module('mean.articles').controller('ArticlesController', ['$scope', '$ro $scope.findOne = function() { Articles.get({ - articleId: $routeParams.articleId + articleId: $stateParams.articleId }, function(article) { $scope.article = article; }); diff --git a/public/modules/articles/tests/articles.spec.js b/public/modules/articles/tests/articles.spec.js index 994df54525..a1d1599016 100644 --- a/public/modules/articles/tests/articles.spec.js +++ b/public/modules/articles/tests/articles.spec.js @@ -8,7 +8,7 @@ var ArticlesController, scope, $httpBackend, - $routeParams, + $stateParams, $location; // The $resource service augments the response object with methods for updating and deleting the resource. @@ -36,12 +36,12 @@ // The injector ignores leading and trailing underscores here (i.e. _$httpBackend_). // This allows us to inject a service but then attach it to a variable // with the same name as the service. - beforeEach(inject(function($controller, $rootScope, _$location_, _$routeParams_, _$httpBackend_) { + beforeEach(inject(function($controller, $rootScope, _$location_, _$stateParams_, _$httpBackend_) { // Set a new global scope scope = $rootScope.$new(); // Point global variables to injected services - $routeParams = _$routeParams_; + $stateParams = _$stateParams_; $httpBackend = _$httpBackend_; $location = _$location_; @@ -80,7 +80,7 @@ }); // Set the URL parameter - $routeParams.articleId = '525a8422f6d0f87f0e407a33'; + $stateParams.articleId = '525a8422f6d0f87f0e407a33'; // Set GET response $httpBackend.expectGET(/articles\/([0-9a-fA-F]{24})$/).respond(sampleArticle); diff --git a/public/modules/core/config/routes.js b/public/modules/core/config/routes.js index b9a3cec372..96b7ea0d9b 100755 --- a/public/modules/core/config/routes.js +++ b/public/modules/core/config/routes.js @@ -1,11 +1,16 @@ 'use strict'; // Setting up route -angular.module('mean.core').config(['$routeProvider', - function($routeProvider) { - $routeProvider. - when('/', { - templateUrl: 'modules/core/views/home.html' - }); - } +angular.module('mean.core').config(['$stateProvider', '$urlRouterProvider', + function($stateProvider, $urlRouterProvider) { + // Redirect to home view when route not found + $urlRouterProvider.otherwise('/'); + + // Home state routing + $stateProvider. + state('home', { + url: '/', + templateUrl: 'modules/core/views/home.html' + }); + } ]); \ No newline at end of file diff --git a/public/modules/users/config/routes.js b/public/modules/users/config/routes.js index 65b5a533ab..2688b2f38e 100755 --- a/public/modules/users/config/routes.js +++ b/public/modules/users/config/routes.js @@ -1,14 +1,17 @@ 'use strict'; // Setting up route -angular.module('mean.users').config(['$routeProvider', - function($routeProvider) { - $routeProvider. - when('/signup', { - templateUrl: 'modules/users/views/signup.html' - }). - when('/signin', { - templateUrl: 'modules/users/views/signin.html' - }); - } +angular.module('mean.users').config(['$stateProvider', + function($stateProvider) { + // Users state routing + $stateProvider. + state('signup', { + url: '/signup', + templateUrl: 'modules/users/views/signup.html' + }). + state('signin', { + url: '/signin', + templateUrl: 'modules/users/views/signin.html' + }); + } ]); \ No newline at end of file