add moonv4

Change-Id: I247af788d0b0fb961fbc85416486b241eb1d807c
Signed-off-by: WuKong <rebirthmonkey@gmail.com>

2 files changed, 103 insertions, 0 deletions

diff --git a/moonv4/moon_gui/static/app/common/header/header.controller.js b/moonv4/moon_gui/static/app/common/header/header.controller.js
new file mode 100644
index 00000000..dfab502f
--- /dev/null
+++ b/moonv4/moon_gui/static/app/common/header/header.controller.js
@@ -0,0 +1,53 @@
+/**
+ * @author arnaud marhin<arnaud.marhin@orange.com>
+ */
+
+(function() {
+
+	'use strict';
+	
+	angular
+		.module('moon')
+				.controller('HeaderController', HeaderController);
+	
+	HeaderController.$inject = ['$translate', 'menuService', 'authenticationService', 'alertService'];
+	
+	function HeaderController($translate, menuService, authenticationService, alertService) {
+
+		var header = this;
+
+		/*
+		 *
+		 */
+
+		header.isProjectTabActive = menuService.isProjectTabActive;
+		header.isPDPTabActive = menuService.isPDPTabActive;
+		header.isLogsTabActive = menuService.isLogsTabActive;
+        header.isPolicyTabActive = menuService.isPolicyTabActive;
+        header.isModelTabActive = menuService.isModelTabActive;
+		header.changeLocale = changeLocale;
+		header.logout = logout;
+
+		header.getUser = authenticationService.GetUser;
+
+		/*
+		 *
+		 */
+
+		function changeLocale(localeKey, event) {
+
+            event.preventDefault();
+            
+            $translate.use(localeKey);
+            $translate.preferredLanguage(localeKey);
+
+        }
+
+        function logout(){
+            authenticationService.Logout();
+            $translate('moon.logout.success').then( function(translatedValue) {
+                alertService.alertSuccess(translatedValue);
+            });
+        }
+	}
+})();
\ No newline at end of file
diff --git a/moonv4/moon_gui/static/app/common/header/header.tpl.html b/moonv4/moon_gui/static/app/common/header/header.tpl.html
new file mode 100644
index 00000000..ad7b461d
--- /dev/null
+++ b/moonv4/moon_gui/static/app/common/header/header.tpl.html
@@ -0,0 +1,50 @@
+<div class="container banner" ng-controller="HeaderController as header">
+
+    <div class="row">
+    
+		<div class="col-md-3 sub-banner">
+            <a ui-sref="moon.dashboard"><img src="assets/img/logo-orange.gif" alt="Orange" /> </a>
+            <img src="assets/img/logo-openstack.png" alt="OpenStack" />
+        </div>
+        
+        <div class="col-md-6 center-block">
+            <h1 data-translate="moon.global.applicationName">Moon UI</h1>
+        </div>
+    
+    	<div class="col-md-3">
+
+	        <span class="pull-right">
+	            <a href="" ng-click="header.changeLocale('fr', $event)"><img src="assets/img/arrow-link.gif" alt="fr_" />fr</a>
+	            <a href="" ng-click="header.changeLocale('en', $event)"><img src="assets/img/arrow-link.gif" alt="en_" />en</a>
+
+	            <a href="" ng-if="connected" ng-click="header.logout()" class="left30">
+	            	<span class="glyphicon glyphicon-log-out"></span>
+	            	<span data-translate="moon.logout.title">Logout</span>(<span ng-bind="header.getUser().token.user.name"></span>)
+	            </a>
+                <a href="" ng-if="!connected" class="left30">
+	            	<span class="glyphicon glyphicon-log-in"></span>
+	            	<span data-translate="moon.login.title">Login</span>
+	            </a>
+	        </span>
+
+        </div>
+
+    </div>
+    
+    <div class="row">
+    	<toaster-container toaster-options="{'position-class': 'toast-top-right', 'close-button': true}"></toaster-container>
+    </div>
+
+    <div class="row" ng-if="connected">
+    
+        <ul class="nav nav-tabs">
+            <li ng-class="{active: header.isProjectTabActive()}"><a ui-sref="moon.project.list" data-translate="moon.menu.project">Projects</a></li>
+            <li ng-class="{active: header.isModelTabActive()}"><a ui-sref="moon.model.list" data-translate="moon.menu.model">Models</a></li>
+            <li ng-class="{active: header.isPolicyTabActive()}"><a ui-sref="moon.policy.list" data-translate="moon.menu.policy">Policy</a></li>
+            <li ng-class="{active: header.isPDPTabActive()}"><a ui-sref="moon.pdp.list" data-translate="moon.menu.pdp">PDP</a></li>
+            <!--<li ng-class="{active: header.isLogsTabActive()}"><a ui-sref="moon.logs" data-translate="moon.menu.logs">Logs</a></li>-->
+        </ul>
+                        
+    </div>
+
+</div>