embed views and load them using templateCache

config/config.js

@@ -132,6 +132,9 @@ var initGlobalConfigFiles = function (config, assets) {
   // Setting Globbed css files
   config.files.client.css = getGlobbedPaths(assets.client.lib.css, 'public/').concat(getGlobbedPaths(assets.client.css, ['public/']));
 
+  // Setting Globbed html files
+  config.files.client.html = getGlobbedPaths(assets.client.views, 'public/');
+
   // Setting Globbed test files
   config.files.client.tests = getGlobbedPaths(assets.client.tests);
 };

config/lib/express.js

@@ -34,6 +34,7 @@ module.exports.initLocalVariables = function (app) {
   app.locals.facebookAppId = config.facebook.clientID;
   app.locals.jsFiles = config.files.client.js;
   app.locals.cssFiles = config.files.client.css;
+  app.locals.htmlFiles = config.files.client.html;
   app.locals.livereload = config.livereload;
   app.locals.logo = config.logo;
   app.locals.favicon = config.favicon;

karma.conf.js

@@ -21,7 +21,10 @@ module.exports = function (karmaConfig) {
       moduleName: 'mean',
 
       cacheIdFromPath: function (filepath) {
-        return filepath;
+        //the returned value must match the IDs used in templateUrl inside the angular app
+        var splittedPath = filepath.split('/');
+        var viewName = splittedPath[splittedPath.length-1].split('.')[0];
+        return viewName;
       },
     },
 

modules/articles/client/config/articles.client.routes.js

@@ -12,22 +12,22 @@ angular.module('articles').config(['$stateProvider',
       })
       .state('articles.list', {
         url: '',
-        templateUrl: 'modules/articles/client/views/list-articles.client.view.html'
+        templateUrl: 'list-articles'
       })
       .state('articles.create', {
         url: '/create',
-        templateUrl: 'modules/articles/client/views/create-article.client.view.html',
+        templateUrl: 'create-article',
         data: {
           roles: ['user', 'admin']
         }
       })
       .state('articles.view', {
         url: '/:articleId',
-        templateUrl: 'modules/articles/client/views/view-article.client.view.html'
+        templateUrl: 'view-article'
       })
       .state('articles.edit', {
         url: '/:articleId/edit',
-        templateUrl: 'modules/articles/client/views/edit-article.client.view.html',
+        templateUrl: 'edit-article',
         data: {
           roles: ['user', 'admin']
         }

modules/chat/client/config/chat.client.routes.js

@@ -6,7 +6,7 @@ angular.module('chat').config(['$stateProvider',
     $stateProvider
       .state('chat', {
         url: '/chat',
-        templateUrl: 'modules/chat/client/views/chat.client.view.html',
+        templateUrl: 'chat',
         data: {
           roles: ['user', 'admin']
         }

modules/core/client/config/core.client.routes.js

@@ -15,25 +15,25 @@ angular.module('core').config(['$stateProvider', '$urlRouterProvider',
     $stateProvider
     .state('home', {
       url: '/',
-      templateUrl: 'modules/core/client/views/home.client.view.html'
+      templateUrl: 'home'
     })
     .state('not-found', {
       url: '/not-found',
-      templateUrl: 'modules/core/client/views/404.client.view.html',
+      templateUrl: '404',
       data: {
         ignoreState: true
       }
     })
     .state('bad-request', {
       url: '/bad-request',
-      templateUrl: 'modules/core/client/views/400.client.view.html',
+      templateUrl: '400',
       data: {
         ignoreState: true
       }
     })
     .state('forbidden', {
       url: '/forbidden',
-      templateUrl: 'modules/core/client/views/403.client.view.html',
+      templateUrl: '403',
       data: {
         ignoreState: true
       }

modules/core/server/controllers/core.server.controller.js

@@ -1,11 +1,36 @@
 'use strict';
 
+var fs = require('fs'),
+  path = require('path'),
+  async = require('async');
+
 /**
  * Render the main application page
  */
 exports.renderIndex = function (req, res) {
-  res.render('modules/core/server/views/index', {
-    user: req.user || null
+  function readViewFromDisk (viewPath, callback) {
+    var splittedPath = viewPath.split('/');
+    var viewId = splittedPath[splittedPath.length-1].split('.')[0];
+    fs.readFile(path.resolve(viewPath), 'utf8', function (err, file) {
+      if(err) {
+        callback(err);
+      } else {
+        callback(null, {
+          id: viewId,
+          content: file
+        });
+      }
+    });
+  }
+  async.map(res.app.locals.htmlFiles, readViewFromDisk, function (err, embeddableViews) {
+    if(err) {
+      res.status(500).send(err);
+    } else {
+      res.locals.htmlFiles = embeddableViews;
+      res.render('modules/core/server/views/index', {
+        user: req.user || null
+      });
+    }
   });
 };
 

modules/core/server/views/layout.server.view.html

@@ -43,6 +43,11 @@
     </section>
   </section>
 
+  <!--Embedding views, load in ui-router using their ID instead of the file path. ID = (fileName removing .client.view.html)-->
+  {% for htmlFile in htmlFiles %}
+    <script type="text/ng-template" id="{{htmlFile.id}}">{{htmlFile.content | safe}}</script>
+  {% endfor %}
+
   <!--Embedding The User Object-->
   <script type="text/javascript">
     var user = {{ user | json | safe }};

modules/users/client/config/users-admin.client.routes.js

@@ -6,12 +6,12 @@ angular.module('users.admin.routes').config(['$stateProvider',
     $stateProvider
       .state('admin.users', {
         url: '/users',
-        templateUrl: 'modules/users/client/views/admin/list-users.client.view.html',
+        templateUrl: 'list-users',
         controller: 'UserListController'
       })
       .state('admin.user', {
         url: '/users/:userId',
-        templateUrl: 'modules/users/client/views/admin/view-user.client.view.html',
+        templateUrl: 'view-user',
         controller: 'UserController',
         resolve: {
           userResolve: ['$stateParams', 'Admin', function ($stateParams, Admin) {
@@ -23,7 +23,7 @@ angular.module('users.admin.routes').config(['$stateProvider',
       })
       .state('admin.user-edit', {
         url: '/users/:userId/edit',
-        templateUrl: 'modules/users/client/views/admin/edit-user.client.view.html',
+        templateUrl: 'edit-user',
         controller: 'UserController',
         resolve: {
           userResolve: ['$stateParams', 'Admin', function ($stateParams, Admin) {

modules/users/client/config/users.client.routes.js

@@ -8,39 +8,39 @@ angular.module('users').config(['$stateProvider',
       .state('settings', {
         abstract: true,
         url: '/settings',
-        templateUrl: 'modules/users/client/views/settings/settings.client.view.html',
+        templateUrl: 'settings',
         data: {
           roles: ['user', 'admin']
         }
       })
       .state('settings.profile', {
         url: '/profile',
-        templateUrl: 'modules/users/client/views/settings/edit-profile.client.view.html'
+        templateUrl: 'edit-profile'
       })
       .state('settings.password', {
         url: '/password',
-        templateUrl: 'modules/users/client/views/settings/change-password.client.view.html'
+        templateUrl: 'change-password'
       })
       .state('settings.accounts', {
         url: '/accounts',
-        templateUrl: 'modules/users/client/views/settings/manage-social-accounts.client.view.html'
+        templateUrl: 'manage-social-accounts'
       })
       .state('settings.picture', {
         url: '/picture',
-        templateUrl: 'modules/users/client/views/settings/change-profile-picture.client.view.html'
+        templateUrl: 'change-profile-picture'
       })
       .state('authentication', {
         abstract: true,
         url: '/authentication',
-        templateUrl: 'modules/users/client/views/authentication/authentication.client.view.html'
+        templateUrl: 'authentication'
       })
       .state('authentication.signup', {
         url: '/signup',
-        templateUrl: 'modules/users/client/views/authentication/signup.client.view.html'
+        templateUrl: 'signup'
       })
       .state('authentication.signin', {
         url: '/signin?err',
-        templateUrl: 'modules/users/client/views/authentication/signin.client.view.html'
+        templateUrl: 'signin'
       })
       .state('password', {
         abstract: true,
@@ -49,7 +49,7 @@ angular.module('users').config(['$stateProvider',
       })
       .state('password.forgot', {
         url: '/forgot',
-        templateUrl: 'modules/users/client/views/password/forgot-password.client.view.html'
+        templateUrl: 'forgot-password'
       })
       .state('password.reset', {
         abstract: true,
@@ -58,15 +58,15 @@ angular.module('users').config(['$stateProvider',
       })
       .state('password.reset.invalid', {
         url: '/invalid',
-        templateUrl: 'modules/users/client/views/password/reset-password-invalid.client.view.html'
+        templateUrl: 'reset-password-invalid'
       })
       .state('password.reset.success', {
         url: '/success',
-        templateUrl: 'modules/users/client/views/password/reset-password-success.client.view.html'
+        templateUrl: 'reset-password-success'
       })
       .state('password.reset.form', {
         url: '/:token',
-        templateUrl: 'modules/users/client/views/password/reset-password.client.view.html'
+        templateUrl: 'reset-password'
       });
   }
 ]);