add menu service provider

www/md_base/src/app/about/about.route.coffee

@@ -1,12 +1,19 @@
 class State extends Config
-    constructor: ($stateProvider) ->
+    constructor: (menuServiceProvider, $stateProvider) ->
 
         # Name of the state
         name = 'about'
 
+        menuServiceProvider.addItem
+            name: name
+            caption: 'About'
+            icon: 'info'
+            order: 30
+
         # Register new state
         $stateProvider.state
             controller: "#{name}Controller"
+            controllerAs: name
             templateUrl: "views/#{name}.html"
             name: name
             url: "/#{name}"

www/md_base/src/app/app.controller.coffee

@@ -1,27 +1,5 @@
 class App extends Controller
-    current: ''
-    navitems: [
-        {
-            name: 'home'
-            title: 'home'
-            icon: 'home'
-        },
-        {
-            name: 'builds'
-            title: 'builds'
-            icon: 'gear'
-        },
-        {
-            name: 'settings'
-            title: 'settings'
-            icon: 'toggle'
-        }
-        {
-            name: 'about'
-            title: 'about'
-            icon: 'info'
-        }
-    ]
+    title: ''
     constructor: ($scope, $rootScope)->
         $rootScope.$on '$stateChangeSuccess', (event, toState) =>
-            @current = toState.name
+            @title = toState.name

www/md_base/src/app/builds/builds.route.coffee

@@ -1,12 +1,19 @@
 class State extends Config
-    constructor: ($stateProvider) ->
+    constructor: (menuServiceProvider, $stateProvider) ->
 
         # Name of the state
         name = 'builds'
 
+        menuServiceProvider.addItem
+            name: name
+            caption: 'Builds'
+            icon: 'gear'
+            order: 10
+
         # Register new state
         $stateProvider.state
             controller: "#{name}Controller"
+            controllerAs: name
             templateUrl: "views/#{name}.html"
             name: name
             url: "/#{name}"

www/md_base/src/app/sidenav/sidenav.directive.coffee → www/md_base/src/app/common/directives/sidenav/sidenav.directive.coffee

@@ -14,14 +14,9 @@ class Sidenav extends Directive
 class _Sidenav extends Controller
 
     items: []
-    current: ''
 
-    constructor: (@$scope, @$attrs) ->
-        @$scope.$watch $attrs.items, (newItems) =>
-            @items = newItems
-
-        @$scope.$watch $attrs.current, (newCurrent) =>
-            @current = newCurrent
+    constructor: (@$scope, @$attrs, @menuService) ->
+        @items = @menuService.getItems()
 
     isHighlighted: (name) ->
-        return name == @current
+        return name == @menuService.getCurrent()

www/md_base/src/app/sidenav/sidenav.tpl.jade → www/md_base/src/app/common/directives/sidenav/sidenav.tpl.jade

@@ -7,8 +7,8 @@ md-sidenav.md-whiteframe-z1(
     md-content.nav-item-container(flex)
       md-button.nav-item(
         ui-sref="{{ item.name }}",
-        ng-repeat="item in sidenav.items",
+        ng-repeat="item in sidenav.items|orderBy:'order'",
         ng-class="{highlighted: sidenav.isHighlighted(item.name)}",
       )
         md-icon(md-svg-icon="{{ item.icon }}")
-        span.nav-item-title {{ item.title }}
+        span.nav-item-caption {{ item.caption}}

www/md_base/src/app/common/services/menu/menu.service.coffee

@@ -0,0 +1,17 @@
+class Menu extends Provider
+    title_icon: 'menu'
+    items: []
+    current: ''
+
+    addItem: (item) ->
+        item.order ?= 99
+        @items.push item
+
+    $get: ($rootScope) ->
+        $rootScope.$on '$stateChangeSuccess', (event, toState) =>
+            @current = toState.name
+
+        return {
+            getItems: => @items
+            getCurrent: => @current
+        }

www/md_base/src/app/home/home.route.coffee

@@ -1,12 +1,19 @@
 class State extends Config
-    constructor: ($stateProvider) ->
+    constructor: (menuServiceProvider, $stateProvider) ->
 
         # Name of the state
         name = 'home'
 
+        menuServiceProvider.addItem
+            name: name
+            caption: 'Home'
+            icon: 'home'
+            order: 0
+
         # Register new state
         $stateProvider.state
             controller: "#{name}Controller"
+            controllerAs: name
             templateUrl: "views/#{name}.html"
             name: name
             url: '/'

www/md_base/src/app/index.jade

@@ -6,7 +6,7 @@ html(ng-app="app", ng-controller="appController as app")
     meta(name='viewport', content='initial-scale=1, minimum-scale=1, user-scalable=no, maximum-scale=1, width=device-width')
 
     | {% raw %}
-    title(ng-bind-template="Buildbot | {{ app.current }}")
+    title(ng-bind-template="Buildbot | {{ app.title }}")
     | {% endraw %}
 
     link(rel='stylesheet', href='styles.css')

www/md_base/src/app/settings/settings.route.coffee

@@ -1,12 +1,19 @@
 class State extends Config
-    constructor: ($stateProvider) ->
+    constructor: (menuServiceProvider, $stateProvider) ->
 
         # Name of the state
         name = 'settings'
 
+        menuServiceProvider.addItem
+            name: name
+            caption: 'Settings'
+            icon: 'toggle'
+            order: 20
+
         # Register new state
         $stateProvider.state
             controller: "#{name}Controller"
+            controllerAs: name
             templateUrl: "views/#{name}.html"
             name: name
             url: "/#{name}"

www/md_base/src/styles/sidenav.less

@@ -27,7 +27,7 @@ md-sidenav {
       fill: #aaa;
     }
 
-    .nav-item-title {
+    .nav-item-caption {
       display: block;
       font-size: 12px;
       color: #aaa;
@@ -41,7 +41,7 @@ md-sidenav {
         fill: #90CAF9;
       }
 
-      .nav-item-title {
+      .nav-item-caption {
         color: #fff;
         font-weight: bold;
       }