feat(gen): Added navbar to starting template

Should make it easier to start building a multi-page app required for #36
angular-fullstack · Dec 16, 2013 · b5e9474 · b5e9474
1 parent 087ede5
commit b5e9474
Show file tree

Hide file tree

Showing 9 changed files with 111 additions and 18 deletions.
diff --git a/app/index.js b/app/index.js
@@ -384,12 +384,29 @@ function appendFilesToJade(jadeOrOptions, fileType, optimizedPath, sourceFileLis
   return updatedContent;
 }
 
+Generator.prototype.navBarScript = function navBarScript() {
+  var ext = 'js';
+  var folder = 'javascript';
+  var minsafe = '';
+
+  if(this.env.options.coffee) {
+    ext = 'coffee';
+    folder = 'coffeescript';
+  }
+
+  if(this.env.options.minsafe) {
+    minsafe = '-min';
+  }
+
+  this.copy('../../templates/' + folder + minsafe + '/navbar.' + ext, 'app/scripts/controllers/navbar.' + ext);
+};
+
 Generator.prototype.appJs = function appJs() {
   var appendOptions = {
     html: this.indexFile,
     fileType: 'js',
     optimizedPath: 'scripts/scripts.js',
-    sourceFileList: ['scripts/app.js', 'scripts/controllers/main.js'],
+    sourceFileList: ['scripts/app.js', 'scripts/controllers/main.js', 'scripts/controllers/navbar.js'],
     searchPath: ['.tmp', 'app']
   };
   if (this.jade) {
@@ -410,13 +427,15 @@ Generator.prototype.createIndex = function createIndex() {
 Generator.prototype.addJadeViews = function addHtmlJade() {
   if(this.jade) {
     this.copy('../../templates/views/jade/partials/main.jade', 'app/views/partials/main.jade');
+    this.copy('../../templates/views/jade/partials/navbar.jade', 'app/views/partials/navbar.jade');
     this.copy('../../templates/views/jade/404.jade', 'app/views/404.jade');
   }
 };
 
 Generator.prototype.addHtmlViews = function addHtmlViews() {
   if(!this.jade) {
     this.copy('../../templates/views/html/partials/main.html', 'app/views/partials/main.html');
+    this.copy('../../templates/views/html/partials/navbar.html', 'app/views/partials/navbar.html');
     this.copy('../../templates/views/html/404.html', 'app/views/404.html');
   }
 };

diff --git a/templates/coffeescript-min/navbar.coffee b/templates/coffeescript-min/navbar.coffee
@@ -0,0 +1,17 @@
+'use strict'
+
+angular.module('<%= scriptAppName %>')
+	.controller 'NavbarCtrl', ['$scope', '$location', ($scope, $location) ->
+	  $scope.menu = [
+	    title: 'Home'
+	    link: '/'
+	  ,
+	    title: 'About'
+	    link: '#'
+	  ,
+	    title: 'Contact'
+	    link: '#'
+	  ]
+	  $scope.isActive = (route) ->
+	    route is $location.path()
+	]
diff --git a/templates/coffeescript/navbar.coffee b/templates/coffeescript/navbar.coffee
@@ -0,0 +1,16 @@
+'use strict'
+
+angular.module('<%= scriptAppName %>')
+	.controller 'NavbarCtrl', ($scope, $location) ->
+	  $scope.menu = [
+	    title: 'Home'
+	    link: '/'
+	  ,
+	    title: 'About'
+	    link: '#'
+	  ,
+	    title: 'Contact'
+	    link: '#'
+	  ]
+	  $scope.isActive = (route) ->
+	    route is $location.path()
diff --git a/templates/javascript-min/navbar.js b/templates/javascript-min/navbar.js
@@ -0,0 +1,21 @@
+'use strict';
+
+angular.module('<%= scriptAppName %>')
+  .controller('NavbarCtrl', ['$scope', '$location', function ($scope, $location) {
+    $scope.menu = [{
+      'title': 'Home',
+      'link': '/'
+    },
+    {
+      'title': 'About',
+      'link': '#'
+    },
+    {
+      'title': 'Contact',
+      'link': '#'
+    }];
+
+    $scope.isActive = function(route) {
+      return route === $location.path();
+    };
+  }]);
diff --git a/templates/javascript/navbar.js b/templates/javascript/navbar.js
@@ -0,0 +1,21 @@
+'use strict';
+
+angular.module('<%= scriptAppName %>')
+  .controller('NavbarCtrl', function ($scope, $location) {
+    $scope.menu = [{
+      'title': 'Home',
+      'link': '/'
+    },
+    {
+      'title': 'About',
+      'link': '#'
+    },
+    {
+      'title': 'Contact',
+      'link': '#'
+    }];
+
+    $scope.isActive = function(route) {
+      return route === $location.path();
+    };
+  });
diff --git a/templates/views/html/partials/main.html b/templates/views/html/partials/main.html
@@ -1,11 +1,4 @@
-<div class="header">
-  <ul class="nav nav-pills pull-right">
-    <li class="active"><a ng-href="#">Home</a></li>
-    <li><a ng-href="#">About</a></li>
-    <li><a ng-href="#">Contact</a></li>
-  </ul>
-  <h3 class="text-muted"><%= appname %></h3>
-</div>
+<div ng-include="'partials/navbar.html'"></div>
 
 <div class="jumbotron">
   <h1>'Allo, 'Allo!</h1>

diff --git a/templates/views/html/partials/navbar.html b/templates/views/html/partials/navbar.html
@@ -0,0 +1,8 @@
+<div class="header" ng-controller="NavbarCtrl">
+  <ul class="nav nav-pills pull-right">
+    <li ng-repeat="item in menu" ng-class="{active: isActive(item.link)}">
+        <a ng-href="{{item.link}}">{{item.title}}</a>
+    </li>
+  </ul>
+  <h3 class="text-muted"><%= appname %></h3>
+</div>
diff --git a/templates/views/jade/partials/main.jade b/templates/views/jade/partials/main.jade
@@ -1,12 +1,5 @@
-.header
-  ul.nav.nav-pills.pull-right
-    li.active
-      a(ng-href='#') Home
-    li
-      a(ng-href='#') About
-    li
-      a(ng-href='#') Contact
-  h3.text-muted <%= scriptAppName %>
+div(ng-include='\'partials/navbar.html\'')
+
 .jumbotron
   h1 'Allo, 'Allo!
   p.lead

diff --git a/templates/views/jade/partials/navbar.jade b/templates/views/jade/partials/navbar.jade
@@ -0,0 +1,5 @@
+.header(ng-controller='NavbarCtrl')
+  ul.nav.nav-pills.pull-right
+    li(ng-repeat='item in menu', ng-class='{active: isActive(item.link)}')
+      a(ng-href='{{item.link}}') {{item.title}}
+  h3.text-muted <%= scriptAppName %>