rr/navigation bar (#3)

* rr/main-controller (pull request #2)

rr/main-controller

* fix gulp indexHTML task

* removing unecessary elements

* main-controller base

Approved-by: Roberto Robson Soares Nogueira <[email protected]>

* Merged in rr/navigation-bar (pull request #3)

rr/navigation-bar

* navigation-bar directive

* add navigation-bar app.js dependency. set tiny md override md-button-icon

Approved-by: Roberto Robson Soares Nogueira <[email protected]>

Author: betorobson

src/app.js

@@ -19,6 +19,7 @@
 
 		// directives
 		'directives.mainController',
+		'directives.navigation-bar'
 
 		// views
 		// 'views.home'

src/directives/main-controller/main-controller.html

@@ -1,4 +1,6 @@
 
+<navigation-bar flex="none"></navigation-bar>
+
 <div layout="row" flex>
 
 	<md-content

src/directives/main-controller/main-controller.js

@@ -9,7 +9,6 @@
 		'MainController',
 
 		function(
-			$rootScope,
 			$scope,
 			$location,
 			$element,

src/directives/navigation-bar/navigation-bar-factory.js

@@ -0,0 +1,30 @@
+
+'use strict';
+
+(function(){
+
+	angular.module('factories.navigation-bar', [])
+
+	.factory('navigationBarFactory', function(){
+
+		var title = 'nav bar title';
+
+		var getTitle = function(){
+			return title;
+		};
+
+		var setTitle = function(newTitle){
+			title = newTitle;
+		};
+
+		var factory = {
+
+			getTitle: getTitle,
+			setTitle: setTitle
+
+		};
+
+		return factory;
+	});
+
+})();

src/directives/navigation-bar/navigation-bar.html

@@ -0,0 +1,30 @@
+<md-toolbar>
+	<div class="md-toolbar-tools">
+
+		<md-button
+			ng-click="toggleSideMenu($event)"
+			aria-label="Menu"
+			md-ripple-size="auto"
+			class="md-icon-button"
+			xhide-gt-md
+		>
+			<md-icon md-svg-icon="assets/icons/menu.svg"></md-icon>
+		</md-button>
+
+		<h2 flex class="md-toolbar-tools">
+			{{navigationBarTitle()}}
+		</h2>
+
+	</div>
+</md-toolbar>
+
+<md-button
+	ng-show="navigationBarService.fabButton"
+	ng-click="navigationBarService.fabButton.func($event)"
+	class="md-fab md-fab-bottom-right color2"
+	aria-label="Adicionar">
+	<md-icon
+		class="{{navigationBarService.fabButton.icon}}"
+		aria-hidden="true">
+	</md-icon>
+</md-button>

src/directives/navigation-bar/navigation-bar.js

@@ -0,0 +1,36 @@
+
+'use strict';
+
+(function(){
+
+	angular.module('directives.navigation-bar',[
+		'factories.navigation-bar'
+	])
+
+	.controller('NavigationBarCtrl',
+
+		function(
+			$scope,
+			navigationBarFactory
+		){
+
+			$scope.navigationBarTitle = navigationBarFactory.getTitle;
+
+			$scope.toggleSideMenu = function(){
+
+				console.log('toggleSideMenu');
+
+			};
+
+		}
+	)
+
+	.directive('navigationBar', function(){
+		return {
+			restrict: 'E',
+			templateUrl: 'navigation-bar/navigation-bar.html',
+			controller: 'NavigationBarCtrl',
+		};
+	});
+
+})();

src/sass/md-overrides/md-button.scss

@@ -0,0 +1,7 @@
+
+a.md-icon-button,
+.md-icon-button {
+	svg {
+		fill: currentColor;
+	}
+}