From 49f6a83032195d442235afe6ba93ea1e0e0d4e74 Mon Sep 17 00:00:00 2001
From: IteloFilho <itelofilho@gmail.com>
Date: Thu, 4 Feb 2016 15:54:50 -0300
Subject: [PATCH] feat (title): Dynamic Title: Improve SEO

---
 .../client/config/articles.client.routes.js   | 14 +++--
 .../chat/client/config/chat.client.routes.js  |  3 +-
 .../core/client/config/core.client.routes.js  | 53 ++++++++++---------
 .../page-title.client.directives.js           | 40 ++++++++++++++
 .../core/server/views/layout.server.view.html |  2 +-
 .../config/users-admin.client.routes.js       | 11 +++-
 .../client/config/users.client.routes.js      | 50 +++++++++++++----
 7 files changed, 132 insertions(+), 41 deletions(-)
 create mode 100644 modules/core/client/directives/page-title.client.directives.js

diff --git a/modules/articles/client/config/articles.client.routes.js b/modules/articles/client/config/articles.client.routes.js
index f254b5c1..b7671b11 100644
--- a/modules/articles/client/config/articles.client.routes.js
+++ b/modules/articles/client/config/articles.client.routes.js
@@ -18,7 +18,10 @@
         url: '',
         templateUrl: 'modules/articles/client/views/list-articles.client.view.html',
         controller: 'ArticlesListController',
-        controllerAs: 'vm'
+        controllerAs: 'vm',
+        data: {
+          pageTitle: 'Articles List'
+        }
       })
       .state('articles.create', {
         url: '/create',
@@ -29,7 +32,8 @@
           articleResolve: newArticle
         },
         data: {
-          roles: ['user', 'admin']
+          roles: ['user', 'admin'],
+          pageTitle : 'Articles Create'
         }
       })
       .state('articles.edit', {
@@ -41,7 +45,8 @@
           articleResolve: getArticle
         },
         data: {
-          roles: ['user', 'admin']
+          roles: ['user', 'admin'],
+          pageTitle: 'Edit Article {{ articleResolve.title }}'
         }
       })
       .state('articles.view', {
@@ -51,6 +56,9 @@
         controllerAs: 'vm',
         resolve: {
           articleResolve: getArticle
+        },
+        data:{
+          pageTitle: 'Article {{ articleResolve.title }}'
         }
       });
   }
diff --git a/modules/chat/client/config/chat.client.routes.js b/modules/chat/client/config/chat.client.routes.js
index edfc959e..fc869031 100644
--- a/modules/chat/client/config/chat.client.routes.js
+++ b/modules/chat/client/config/chat.client.routes.js
@@ -15,7 +15,8 @@
         controller: 'ChatController',
         controllerAs: 'vm',
         data: {
-          roles: ['user', 'admin']
+          roles: ['user', 'admin'],
+          pageTitle: 'Chat'
         }
       });
   }
diff --git a/modules/core/client/config/core.client.routes.js b/modules/core/client/config/core.client.routes.js
index cec96327..e67e3335 100644
--- a/modules/core/client/config/core.client.routes.js
+++ b/modules/core/client/config/core.client.routes.js
@@ -13,30 +13,33 @@ angular.module('core').config(['$stateProvider', '$urlRouterProvider',
 
     // Home state routing
     $stateProvider
-    .state('home', {
-      url: '/',
-      templateUrl: 'modules/core/client/views/home.client.view.html'
-    })
-    .state('not-found', {
-      url: '/not-found',
-      templateUrl: 'modules/core/client/views/404.client.view.html',
-      data: {
-        ignoreState: true
-      }
-    })
-    .state('bad-request', {
-      url: '/bad-request',
-      templateUrl: 'modules/core/client/views/400.client.view.html',
-      data: {
-        ignoreState: true
-      }
-    })
-    .state('forbidden', {
-      url: '/forbidden',
-      templateUrl: 'modules/core/client/views/403.client.view.html',
-      data: {
-        ignoreState: true
-      }
-    });
+      .state('home', {
+        url: '/',
+        templateUrl: 'modules/core/client/views/home.client.view.html'
+      })
+      .state('not-found', {
+        url: '/not-found',
+        templateUrl: 'modules/core/client/views/404.client.view.html',
+        data: {
+          ignoreState: true,
+          pageTitle: 'Not-Found'
+        }
+      })
+      .state('bad-request', {
+        url: '/bad-request',
+        templateUrl: 'modules/core/client/views/400.client.view.html',
+        data: {
+          ignoreState: true,
+          pageTitle: 'Bad-Request'
+        }
+      })
+      .state('forbidden', {
+        url: '/forbidden',
+        templateUrl: 'modules/core/client/views/403.client.view.html',
+        data: {
+          ignoreState: true,
+          pageTitle: 'Forbidden'
+        }
+      });
   }
 ]);
diff --git a/modules/core/client/directives/page-title.client.directives.js b/modules/core/client/directives/page-title.client.directives.js
new file mode 100644
index 00000000..2eea805a
--- /dev/null
+++ b/modules/core/client/directives/page-title.client.directives.js
@@ -0,0 +1,40 @@
+(function () {
+  'use strict';
+
+  angular.module('core')
+    .directive('pageTitle', pageTitle);
+
+  pageTitle.$inject = ['$rootScope', '$timeout', '$interpolate', '$state'];
+
+  function pageTitle($rootScope, $timeout, $interpolate, $state) {
+    var directive = {
+      retrict: 'A',
+      link: link
+    };
+
+    return directive;
+
+    function link(scope, element) {
+      $rootScope.$on('$stateChangeSuccess', listener);
+
+      function listener(event, toState) {
+        var title = (getTitle($state.$current));
+        $timeout(function () {
+          element.text(title);
+        }, 0, false);
+      }
+
+      function getTitle(currentState) {
+        var applicationCoreTitle = 'MEAN.js';
+        var workingState = currentState;
+        if (currentState.data) {
+          workingState = (typeof workingState.locals !== 'undefined') ? workingState.locals.globals : workingState;
+          var stateTitle = $interpolate(currentState.data.pageTitle)(workingState);
+          return applicationCoreTitle + ' - ' + stateTitle;
+        } else {
+          return applicationCoreTitle;
+        }
+      }
+    }
+  }
+})();
diff --git a/modules/core/server/views/layout.server.view.html b/modules/core/server/views/layout.server.view.html
index aba668af..79ecf5c7 100644
--- a/modules/core/server/views/layout.server.view.html
+++ b/modules/core/server/views/layout.server.view.html
@@ -5,7 +5,7 @@
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
   <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">
   <base href="/">
-  <title>{{title}}</title>
+  <title page-title></title>
   <meta name="description" content="{{description}}">
   <meta name="fragment" content="!">
 
diff --git a/modules/users/client/config/users-admin.client.routes.js b/modules/users/client/config/users-admin.client.routes.js
index 15d15f3f..426a7298 100644
--- a/modules/users/client/config/users-admin.client.routes.js
+++ b/modules/users/client/config/users-admin.client.routes.js
@@ -7,7 +7,10 @@ angular.module('users.admin.routes').config(['$stateProvider',
       .state('admin.users', {
         url: '/users',
         templateUrl: 'modules/users/client/views/admin/list-users.client.view.html',
-        controller: 'UserListController'
+        controller: 'UserListController',
+        data: {
+          pageTitle: 'Users List'
+        }
       })
       .state('admin.user', {
         url: '/users/:userId',
@@ -19,6 +22,9 @@ angular.module('users.admin.routes').config(['$stateProvider',
               userId: $stateParams.userId
             });
           }]
+        },
+        data: {
+          pageTitle: 'Edit {{ userResolve.displayName }}'
         }
       })
       .state('admin.user-edit', {
@@ -31,6 +37,9 @@ angular.module('users.admin.routes').config(['$stateProvider',
               userId: $stateParams.userId
             });
           }]
+        },
+        data: {
+          pageTitle: 'Edit User {{ userResolve.displayName }}'
         }
       });
   }
diff --git a/modules/users/client/config/users.client.routes.js b/modules/users/client/config/users.client.routes.js
index 36ef995c..8fb3bafb 100644
--- a/modules/users/client/config/users.client.routes.js
+++ b/modules/users/client/config/users.client.routes.js
@@ -15,19 +15,31 @@ angular.module('users').config(['$stateProvider',
       })
       .state('settings.profile', {
         url: '/profile',
-        templateUrl: 'modules/users/client/views/settings/edit-profile.client.view.html'
+        templateUrl: 'modules/users/client/views/settings/edit-profile.client.view.html',
+        data: {
+          pageTitle: 'Settings'
+        }
       })
       .state('settings.password', {
         url: '/password',
-        templateUrl: 'modules/users/client/views/settings/change-password.client.view.html'
+        templateUrl: 'modules/users/client/views/settings/change-password.client.view.html',
+        data: {
+          pageTitle: 'Settings password'
+        }
       })
       .state('settings.accounts', {
         url: '/accounts',
-        templateUrl: 'modules/users/client/views/settings/manage-social-accounts.client.view.html'
+        templateUrl: 'modules/users/client/views/settings/manage-social-accounts.client.view.html',
+        data: {
+          pageTitle: 'Settings accounts'
+        }
       })
       .state('settings.picture', {
         url: '/picture',
-        templateUrl: 'modules/users/client/views/settings/change-profile-picture.client.view.html'
+        templateUrl: 'modules/users/client/views/settings/change-profile-picture.client.view.html',
+        data: {
+          pageTitle: 'Settings picture'
+        }
       })
       .state('authentication', {
         abstract: true,
@@ -36,11 +48,17 @@ angular.module('users').config(['$stateProvider',
       })
       .state('authentication.signup', {
         url: '/signup',
-        templateUrl: 'modules/users/client/views/authentication/signup.client.view.html'
+        templateUrl: 'modules/users/client/views/authentication/signup.client.view.html',
+        data: {
+          pageTitle: 'Signup'
+        }
       })
       .state('authentication.signin', {
         url: '/signin?err',
-        templateUrl: 'modules/users/client/views/authentication/signin.client.view.html'
+        templateUrl: 'modules/users/client/views/authentication/signin.client.view.html',
+        data: {
+          pageTitle: 'Signin'
+        }
       })
       .state('password', {
         abstract: true,
@@ -49,7 +67,10 @@ angular.module('users').config(['$stateProvider',
       })
       .state('password.forgot', {
         url: '/forgot',
-        templateUrl: 'modules/users/client/views/password/forgot-password.client.view.html'
+        templateUrl: 'modules/users/client/views/password/forgot-password.client.view.html',
+        data: {
+          pageTitle: 'Password forgot'
+        }
       })
       .state('password.reset', {
         abstract: true,
@@ -58,15 +79,24 @@ angular.module('users').config(['$stateProvider',
       })
       .state('password.reset.invalid', {
         url: '/invalid',
-        templateUrl: 'modules/users/client/views/password/reset-password-invalid.client.view.html'
+        templateUrl: 'modules/users/client/views/password/reset-password-invalid.client.view.html',
+        data: {
+          pageTitle: 'Password reset invalid'
+        }
       })
       .state('password.reset.success', {
         url: '/success',
-        templateUrl: 'modules/users/client/views/password/reset-password-success.client.view.html'
+        templateUrl: 'modules/users/client/views/password/reset-password-success.client.view.html',
+        data: {
+          pageTitle: 'Password reset success'
+        }
       })
       .state('password.reset.form', {
         url: '/:token',
-        templateUrl: 'modules/users/client/views/password/reset-password.client.view.html'
+        templateUrl: 'modules/users/client/views/password/reset-password.client.view.html',
+        data: {
+          pageTitle: 'Password reset form'
+        }
       });
   }
 ]);