merge

client/index.html

@@ -26,6 +26,9 @@
                 <div class="col-lg-12">
                     <!-- Login Overlay -->
                     <div ng-include="'./partials/login.html'"></div>
+					<!-- Machine Details Overlay -->
+                    <div ng-include="'./partials/home/machineDetails.html'"></div>
+
                     <!-- Nav -->
                     <div ng-include="'./partials/nav.html'"></div>
                 </div>
@@ -81,7 +84,9 @@
     <script src="./js/controllers/login.js"></script>
     <script src="./js/controllers/status.js"></script>
     <script src="./js/controllers/home/main.js"></script>
+    <script src="./js/controllers/home/machineDetails.js"></script>	
     <script src="./js/controllers/network/main.js"></script>
+
     
     
 

client/js/controllers/home/machineDetails.js

@@ -0,0 +1,39 @@
+/**
+ * The home controller
+ * 
+ * @param {$scope} $scope The $scope service from angular
+ */
+mainApp.controller('machineDetailsCtrl', [ '$scope', 'Compute', '$rootScope', '$timeout', function ($scope, Compute, $rootScope, $timeout)
+{
+
+	$scope.machine={};
+	$("#waitingForToggleMachine").hide();
+
+	$scope.$on('showMachineDetailsEvent', function(eventName ,machine){
+		$scope.machine=machine;
+		$('#machineDetailsModal').modal({backdrop: false, keyboard: true});
+	});
+
+
+	$scope.toggleMachineState=function(){
+		$("#waitingForToggleMachine").show();
+
+		// Fake timeout
+		$timeout(function(){
+		$("#waitingForToggleMachine").hide();	
+		}, 3000);
+		$timeout(function(){
+		$scope.machine.online=!$scope.machine.online;
+
+		}, 3000);
+
+		
+	};
+
+	$scope.applyModifications=function(){
+		//Todo
+	}
+	
+
+	
+}]);

client/js/controllers/home/main.js

@@ -3,15 +3,22 @@
  * 
  * @param {$scope} $scope The $scope service from angular
  */
-mainApp.controller('homeCtrl', [ '$scope', 'Compute', function ($scope, Compute)
+mainApp.controller('homeCtrl', [ '$scope', 'Compute', '$rootScope', function ($scope, Compute, $rootScope)
 {
 
-
 	var updatePage=function(){
 		// TODO Update graph etc...
 	}
 
 	// Retrieve all Data
 	Compute.pullData(updatePage);
-    
+
+	Compute.getMachines(function(adzda){});
+	
+	$scope.raiseShowMachineDetailsEvent=function(){
+		var machine={name: "Machine 1", online:true};
+		$rootScope.$broadcast("showMachineDetailsEvent", machine);		
+	}
+
+
 }]);

client/js/controllers/login.js

@@ -13,14 +13,19 @@ mainApp.controller('loginCtrl', ['$scope','$sce','Identity', function ($scope,$s
 	if(!Identity.isAlreadyLogin()){
 		$('#loginModal').modal({backdrop: 'static', keyboard: false});
 	}
+
+	// Manager logout event
 	$scope.$on('logoutEvent', function(){
+		Identity.logout();
 		$('#loginModal').modal({backdrop: 'static', keyboard: false});
 	});
-	
+
+	// Hide loading button and message alert
     $('#loadingLoginButton').hide();
     $('#failedToLoginAlert').hide();
 
-     
+	
+	// Defined function for login
     $scope.loginAction=function(){
 		
 		// Begin login state for template

client/js/controllers/status.js

@@ -10,13 +10,11 @@ mainApp.controller('statusCtrl', ['$scope','Identity', '$rootScope', function ($
 {
 
 	// Give profile to model
-    $scope.profile=Identity.profile;
+    $scope.profile=Identity.getProfile();
 
     // Function to logout
-    $scope.logout=function(){
-		Identity.logout();
+    $scope.raiseLogoutEvent=function(){
 		$rootScope.$broadcast('logoutEvent');
-
 	};
 
 }]);

client/js/services/Compute.js

@@ -2,11 +2,12 @@
 mainApp.factory('Compute',[ '$http', 'Identity', function($http, Identity){
 
 
-	
+	// Create data
 	var data={};
 	data.machines={};
 	
 
+	
 	// Parser
 	var parseGetMachinesAnswer=function(response, failedToSendRequest){
 		
@@ -16,8 +17,24 @@ mainApp.factory('Compute',[ '$http', 'Identity', function($http, Identity){
 	// Get Machine
 	var getMachines=function(callback){
 
+		var params={
+			"token" : Identity.getToken(),
+			"task" : "compute",
+			"action":"getServer",
+			"serverId":"69d5bcc4-2fab-4634-b0d2-f455fee5b7bd"
+		};
+		
 		var result=$http.post('../server/index.php',
-						  $.param({"token" : Identity.profile.token, "task" : "Compute"}));		
+							  $.param(params));		
+
+		// Wait and handle the response
+        result.then(function (response){
+			console.log(response.data.Servers);
+			callback(parseGetMachinesAnswer(response, false));
+        },function(response){
+			alert(response.status);
+			callback(parseGetMachinesAnswer(response, true));
+        });		
 
 		
 	};
@@ -31,8 +48,8 @@ mainApp.factory('Compute',[ '$http', 'Identity', function($http, Identity){
 		
 	// Return services objects
 	return {
-		getMachines: getMachines
-		pullData: pullData
+		getMachines: getMachines,
+		pullData: pullData,
 		data:data
 	};
 

client/js/services/Identity.js

@@ -7,37 +7,47 @@ mainApp.factory('Identity',[ '$http', '$cookies', function($http, $cookies){
     var profile={};
     profile.username=null;
     profile.projectname=null;
-	profile.token=null;
-
-
-	/**
-	 * Save profile in cookies 
-	 */
-	var saveCookieForSession=function(){
-		$cookies.putObject('profile', 5);
-	};
-
+	var token=null;
 
+	
 	/* 
 	 * @returns {boolean} Return true if a cookie is found (and load it in profile) false else 
 	 */
 	var isAlreadyLogin=function(){
+
+		// Load cookies
 		var profileInCookie=$cookies.getObject('profile');
-		console.log(profileInCookie);
+		var tokenPart_0InCookie=$cookies.getObject('token.part_0');
+		var tokenPart_1InCookie=$cookies.getObject('token.part_1');
+
 		
-		if(typeof profileInCookie !== 'undefined'){
+		// Check if cookie is defined
+		if(typeof profileInCookie !== 'undefined'
+		   && typeof tokenPart_0InCookie !== 'undefined'
+		   && typeof tokenPart_1InCookie !== 'undefined'
+		  ){
+
+			// If yes, put it into variables
 			angular.extend(profile, profileInCookie);
+			token=tokenPart_0InCookie+tokenPart_1InCookie;
+
+			// Return I'm Login
 			return true;
 		}
 
+		// Return I'm not Login
 		return false;
 	}
 
+
+	
 	/*
 	 * Destroy profile cookies
 	 */
 	var logout=function(){
 		$cookies.remove('profile');
+		$cookies.remove('token.part_0');
+		$cookies.remove('token.part_1');
 	}
 
 	
@@ -49,15 +59,28 @@ mainApp.factory('Identity',[ '$http', '$cookies', function($http, $cookies){
 	 */
 	var parseLoginAnswer=function(response, failedToSendRequest){
 		
-
+		// Defined return object
 		var requestParserResult={};
 		requestParserResult.status=1;
 		requestParserResult.failReason=null;
 
 		if (typeof response.data.token !== 'undefined') {
+			// Set status code
 			requestParserResult.status=0;
-			profile.token=response.data.token;
-			saveCookieForSession();
+
+			// Find the middle of the token to split it
+			var middle=parseInt(response.data.token.length/2);
+
+			// Create expire date (cookie expire in 55 mins)
+			var expireDate=new Date();
+			expireDate.setMinutes(expireDate.getMinutes()+55);
+			
+			// Save profile
+			$cookies.putObject('profile', profile, {'expires': expireDate});
+			// Save first part of token
+			$cookies.putObject('token.part_0', response.data.token.substring(0, middle), {'expires': expireDate});
+			// Save second part of token
+			$cookies.putObject('token.part_1', response.data.token.substring(middle, response.data.token.length), {'expires': expireDate});
 		}
 		else if(failedToSendRequest){
 			requestParserResult.failReason="Failed to send request";
@@ -69,7 +92,6 @@ mainApp.factory('Identity',[ '$http', '$cookies', function($http, $cookies){
 		return requestParserResult;
 	};
 
-
 	
 	/**
 	 * Function to connect to OpenStack
@@ -87,24 +109,39 @@ mainApp.factory('Identity',[ '$http', '$cookies', function($http, $cookies){
 		profile.projectname=projectname;
 		
 		var result=$http.post('../server/index.php',
-						  $.param({"task" : "Authenticate", "user" : username, "password" : password, "project" : projectname}));  
+							  $.param({"task" : "Authenticate", "user" : username, "password" : password, "project" : projectname}));  
 
 		// Wait and handle the response
         result.then(function (response){
-			callback(parseLoginAnswer(response), false);
+			callback(parseLoginAnswer(response, false));
         },function(response){
-			callback(parseLoginAnswer(response), true)
+			callback(parseLoginAnswer(response, true));
         });		
 	};	
 
 
+	/*
+     * Get the profile
+	 */
+	var getProfile=function(){
+		return profile;
+	}
+
+	/*
+     * Get the token
+	 */	
+	var getToken=function(){
+		return token;
+	}
+	
 
 	// Return services objects
 	return {
 		login: login,
-		profile: profile,
+		getProfile: getProfile,
 		isAlreadyLogin: isAlreadyLogin,
-		logout:logout
+		logout:logout,
+		getToken:getToken
 	};
 
 	

client/partials/home/machineDetails.html

@@ -0,0 +1,84 @@
+<div class="modal" id="machineDetailsModal" ng-controller="machineDetailsCtrl" >
+    <div class="modal-dialog">
+        <div class="modal-content"></div>
+    </div>
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <!--<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>-->
+                <h4 class="modal-title">Machine</h4>
+
+            </div>
+            <div class="modal-body">
+
+				<form class="form-horizontal" role="form">
+					<div class="form-group">
+						<label class="control-label col-sm-2" for="email">Name</label>
+						<div class="col-sm-10">
+							      <p class="form-control-static">{{ machine.name  }}</p>
+						</div>
+					</div>
+					<div class="form-group">
+						<label class="control-label col-sm-2" for="pwd">State</label>
+						<div class="col-sm-10">
+							<span ng-if="machine.online">Online</span>
+							<span ng-if="!machine.online">Offline</span>
+							&nbsp;
+							<button class="btn btn-danger" ng-if="machine.online" ng-click="toggleMachineState()">Turn Off</button>		 
+							<button class="btn btn-success" ng-if="!machine.online" ng-click="toggleMachineState()">Turn On</button>		 
+							&nbsp;<img src="images/spin/32x32/Preloader_1.gif" id="waitingForToggleMachine"></span>
+
+							
+						</div>
+					</div>
+					<fieldset class="form-group">
+						<label class="control-label col-sm-2">RAM</label>
+						<select class="col-sm-20" id="ramSelected">
+							<option>128 MB</option>
+							<option>512 MB</option>
+							<option>1024 MB</option>
+							<option>2048 MB</option>
+							<option>4096 MB</option>
+						</select>
+					</fieldset>
+
+					<fieldset class="form-group">
+						<label class="control-label col-sm-2">Disk</label>
+						<select class="col-sm-20" id="ramSelected">
+							<option>1 Go</option>
+							<option>2 Go</option>
+							<option>5 Go</option>
+							<option>10 Go</option>
+							<option>25 Go</option>
+							<option>50 Go</option>
+							<option>100 Go</option>
+							<option>150 Go</option>
+							<option>200 Go</option>
+						</select>
+					</fieldset>
+
+					<fieldset class="form-group">
+						<label class="control-label col-sm-2">Image</label>
+						<select class="col-sm-20" id="ramSelected">
+							<option>Cirros</option>
+							<option>Debian</option>
+							<option>Tiny Core</option>
+							<option>Centos</option>
+						</select>
+					</fieldset>
+
+
+
+
+
+				</form>
+
+
+			</div>
+            <div class="modal-footer"> 
+                <a href="#" data-dismiss="modal" class="btn btn-primary">Apply</a>
+                <a href="#" data-dismiss="modal" class="btn btn-default">Cancel</a>
+            </div>
+        </div>
+    </div>
+</div>

client/partials/home/main.html

@@ -1,8 +1,11 @@
- <div class="panel panel-default">
+ <div class="panel panel-default" ng-controller="homeCtrl">
     <div class="panel-heading">
         Home 
     </div>
     <div class="panel-body">
         Main Content
+		<button ng-click="raiseShowMachineDetailsEvent()" > Show Machine details</button>
+		<div id="test">
+		</div>
     </div>
-</div>
+</div>

client/partials/nav.html

@@ -32,7 +32,7 @@
             <li><a href="#">Informations</a></li>
             <li><a href="#">Settings</a></li>
             <li role="separator" class="divider"></li>
-            <li><a href="#" ng-click="logout()">Logout</a></li>
+            <li><a href="#" ng-click="raiseLogoutEvent()">Logout</a></li>
           </ul>
         </li>
       </ul>