feat(titleService): set pageTitle via state object

  - Removed titleService service, opting for scope variable instead
  - Deleted titleService files and folder
  - Setting 'pageTitle', a AppCtrl scope variable instead, which is bound to the title tag using ng-bind
  - Put the code back into AppCtrl controller, it now makes more sense there since <title> falls under AppCtrl's domain

Closes ngbp#55.

src/README.md

@@ -16,7 +16,6 @@ src/
   |  |- fonts/
   |- common/
   |  |- plusOne/
-  |  |- titleService/
   |- less/
   |  |- main.less
   |  |- font-awesome.less

src/app/README.md

@@ -63,24 +63,25 @@ is where we want to start, which has a defined route for `/home` in
 })
 ```
 
-One of the components included by default is a basic `titleService` that simply
-allows you to set the page title from any of your controllers. The service accepts
-an optional suffix to be appended to the end of any title set later on, so we set
-this now to ensure it runs before our controllers set titles.
+Use the main applications run method to execute any code after services
+have been instantiated.
 
 ```js
-.run([ 'titleService', function run ( titleService ) {
-  titleService.setSuffix( ' | ngBoilerplate' );
-}])
+.run( function run () {
+})
 ```
 
-And then we define our main application controller. It need not have any logic, 
-but this is a good place for logic not specific to the template or route, such as
-menu logic or page title wiring.
+And then we define our main application controller. This is a good place for logic
+not specific to the template or route, such as menu logic or page title wiring.
 
 ```js
-.controller( 'AppCtrl', [ '$scope', function AppCtrl ( $scope ) {
-}])
+.controller( 'AppCtrl', function AppCtrl ( $scope, $location ) {
+  $scope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState, fromParams){
+    if ( angular.isDefined( toState.data.pageTitle ) ) {
+      $scope.pageTitle = toState.data.pageTitle + ' | ngBoilerplate' ;
+    }
+  });
+})
 ```
 
 ### Testing

src/app/about/about.js

@@ -1,8 +1,7 @@
 angular.module( 'ngBoilerplate.about', [
   'ui.state',
   'placeholders',
-  'ui.bootstrap',
-  'titleService'
+  'ui.bootstrap'
 ])
 
 .config(function config( $stateProvider ) {
@@ -13,13 +12,12 @@ angular.module( 'ngBoilerplate.about', [
         controller: 'AboutCtrl',
         templateUrl: 'about/about.tpl.html'
       }
-    }
+    },
+    data:{ pageTitle: 'What is It?' }
   });
 })
 
-.controller( 'AboutCtrl', function AboutCtrl( $scope, titleService ) {
-  titleService.setTitle( 'What is It?' );
-
+.controller( 'AboutCtrl', function AboutCtrl( $scope ) {
   // This is simple a demo for UI Boostrap.
   $scope.dropdownDemoItems = [
     "The first choice!",

src/app/app.js

@@ -11,11 +11,15 @@ angular.module( 'ngBoilerplate', [
   $urlRouterProvider.otherwise( '/home' );
 })
 
-.run( function run ( titleService ) {
-  titleService.setSuffix( ' | ngBoilerplate' );
+.run( function run () {
 })
 
 .controller( 'AppCtrl', function AppCtrl ( $scope, $location ) {
+  $scope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState, fromParams){
+    if ( angular.isDefined( toState.data.pageTitle ) ) {
+      $scope.pageTitle = toState.data.pageTitle + ' | ngBoilerplate' ;
+    }
+  });
 })
 
 ;

src/app/home/README.md

@@ -33,29 +33,40 @@ specified, as shown below.
 
 ```js
 angular.module( 'ngBoilerplate.home', [
-  'placeholders',
-  'titleService'
+  'ui.state',
+  'plusOne'
 ])
 ```
 
 Each section or module of the site can also have its own routes. AngularJS will
 handle ensuring they are all available at run-time, but splitting it this way
-makes each module more self-contained.
+makes each module more self-contained. We use [ui-router](https://github.com/angular-ui/ui-router) to create
+a state for our 'home' page. We set the url we'd like to see in the address bar
+as well as the controller and template file to load. Specifying "main" as our view
+means the controller and template will be loaded into the <div ui-view="main"/> element
+of the root template (aka index.html). Read more over at the [ui-router wiki](https://github.com/angular-ui/ui-router/wiki).
+Finally we add a custom data property, pageTitle, which will be used to set the page's
+title (see the app.js controller).
 
 ```js
-.config([ '$routeProvider', function config( $routeProvider ) {
-  $routeProvider.when( '/home', {
-    controller: 'HomeCtrl',
-    templateUrl: 'home/home.tpl.html'
+.config(function config( $stateProvider ) {
+  $stateProvider.state( 'home', {
+    url: '/home',
+    views: {
+      "main": {
+        controller: 'HomeCtrl',
+        templateUrl: 'home/home.tpl.html'
+      }
+    },
+    data:{ pageTitle: 'Home' }
   });
-}])
+})
 ```
 
 And of course we define a controller for our route, though in this case it does
 nothing.
 
 ```js
-.controller( 'HomeCtrl', [ '$scope', 'titleService', function HomeController( $scope, titleService ) {
-  titleService.setTitle( 'Home' );
-}]);
+.controller( 'HomeCtrl', function HomeController( $scope ) {
+});
 ```

src/app/home/home.js

@@ -14,7 +14,6 @@
  */
 angular.module( 'ngBoilerplate.home', [
   'ui.state',
-  'titleService',
   'plusOne'
 ])
 
@@ -31,15 +30,15 @@ angular.module( 'ngBoilerplate.home', [
         controller: 'HomeCtrl',
         templateUrl: 'home/home.tpl.html'
       }
-    }
+    },
+    data:{ pageTitle: 'Home' }
   });
 })
 
 /**
  * And of course we define a controller for our route.
  */
-.controller( 'HomeCtrl', function HomeController( $scope, titleService ) {
-  titleService.setTitle( 'Home' );
+.controller( 'HomeCtrl', function HomeController( $scope ) {
 })
 
 ;

src/common/README.md

@@ -15,12 +15,9 @@ handle components that do not meet this pattern.
 src/
   |- common/
   |  |- plusOne/
-  |  |- titleService/
 ```
 
 - `plusOne` - a simple directive to load a Google +1 Button on an element.
-- `titleService` - a service to change the page title, complete with a
-  consistent suffix.
 
 Every component contained here should be drag-and-drop reusable in any other 
 project; they should depend on no other components that aren't similarly 

src/index.html

@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html ng-app="ngBoilerplate" ng-controller="AppCtrl">
   <head>
-    <title>ng-boilerplate</title>
+    <title ng-bind="pageTitle"></title>
 
     <!-- social media tags -->
     <meta name="twitter:card" content="summary">