Edit machineDetails

client/js/controllers/home/machineDetails.js

@@ -11,6 +11,7 @@ mainApp.controller('machineDetailsCtrl', [ '$scope', 'Compute', '$rootScope', '$
 
 	$scope.$on('showMachineDetailsEvent', function(eventName ,machine){
 		$scope.machine=machine;
+		console.log(machine);
 		$('#machineDetailsModal').modal({backdrop: false, keyboard: true});
 	});
 

client/js/controllers/home/main.js

@@ -6,18 +6,19 @@
 mainApp.controller('homeCtrl', [ '$scope', 'Compute', '$rootScope', function ($scope, Compute, $rootScope)
 {
 
-	var updatePage=function(){
+	var callMeAfterGetMachines=function(data){
-		// TODO Update graph etc...
+		$scope.machines=Compute.getData().machines;
 	}
 
 
+	Compute.pullMachines(callMeAfterGetMachines);
 
 
 	
-	$scope.raiseShowMachineDetailsEvent=function(){
+	$scope.raiseShowMachineDetailsEvent=function(id){
 		var callback=function(){
 			var data=Compute.getData();
-			$rootScope.$broadcast("showMachineDetailsEvent", data.machines[Object.keys(data.machines)[0]]);		
+			$rootScope.$broadcast("showMachineDetailsEvent", data.machines[id]);		
 	
 		}
 		Compute.pullMachines(callback);

client/js/services/Compute.js

@@ -2,19 +2,27 @@
 mainApp.factory('Compute',[ '$http', 'Identity', function($http, Identity){
 
 
-	// Create data
+	// Init data
 	var data={};
-	data.machines={};
+	data.machines=null;
 	
 
 	
-	// Parser
+
-	var parseGetMachinesAnswer=function(response, failedToSendRequest){
+	/**
+	 * Retrieve machine list 
+	 * @param {response} the server response
+	 * @param {boolean} false if the request as been send true else
+	 * @return {requestParserResult} the result of parsing
+	 */
+	var parsePullMachinesAnswer=function(response, failedToSendRequest){
+
 		// Defined return object
 		var requestParserResult={};
 		requestParserResult.status=1;
 		requestParserResult.failReason=null;
-		console.log(response.data.Servers[Object.keys(response.data.Servers)[0]])
+
+		
 		if (typeof response.data.Servers !== 'undefined') {
 			// Set status code
 			requestParserResult.status=0;
@@ -27,44 +35,41 @@ mainApp.factory('Compute',[ '$http', 'Identity', function($http, Identity){
 		else{
 			requestParserResult.failReason="Error";
 		}
-		
 		return requestParserResult;
-
-		
 	};
 
 
-	// Get Machine
+	/**
+	 * Retrieve machine list 
+	 * @param {callback} function to call after request complete
+	 */
 	var pullMachines=function(callback){
-
+		// Send listServers request
-		var params={
-			"token" : Identity.getToken(),
-			"task" : "compute",
-			"action":"listServers"
-		};
-		
 		var result=$http.post('../server/index.php',
-							  $.param(params));		
+							  $.param({"token" : Identity.getToken(), "task" : "compute", "action":"listServers"}));		
 
 		// Wait and handle the response
         result.then(function (response){
-
+			callback(parsePullMachinesAnswer(response, false));
-			callback(parseGetMachinesAnswer(response, false));
         },function(response){
-			alert(response.status);
+			callback(parsePullMachinesAnswer(response, true));
-			callback(parseGetMachinesAnswer(response, true));
+        });
-        });		
-
-		
 	};
 	
 
-
+	/**
+	 * Retrieve all data 
+	 * @param {callback} function to call after request complete
+	 */
 	var pullData=function(callback){
 		// TODO call getMachines etc...
 	}
 
 
+	/**
+	 * Get Data
+	 * @return {data} return the data object
+	 */
 	var getData=function(){
 		return data;
 	}

client/partials/home/machineDetails.html

@@ -21,11 +21,11 @@
 					<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.status=='ACTIVE'">Online</span>
-							<span ng-if="!machine.online">Offline</span>
+							<span ng-if="machine.status!=='ACTIVE'">Offline</span>
 							&nbsp;
-							<button class="btn btn-danger" ng-if="machine.online" ng-click="toggleMachineState()">Turn Off</button>		 
+							<button class="btn btn-danger" ng-if="machine.status=='ACTIVE'" ng-click="toggleMachineState()">Turn Off</button>		 
-							<button class="btn btn-success" ng-if="!machine.online" ng-click="toggleMachineState()">Turn On</button>		 
+							<button class="btn btn-success" ng-if="machine.status!=='ACTIVE'" ng-click="toggleMachineState()">Turn On</button>		 
 							&nbsp;<img src="images/spin/32x32/Preloader_1.gif" id="waitingForToggleMachine"></span>
 
 							
@@ -34,7 +34,7 @@
 					<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>{{ machine.ram  }} MB</option>
 							<option>512 MB</option>
 							<option>1024 MB</option>
 							<option>2048 MB</option>
@@ -45,7 +45,7 @@
 					<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>{{ machine.disk }} Go</option>
 							<option>2 Go</option>
 							<option>5 Go</option>
 							<option>10 Go</option>
@@ -60,7 +60,7 @@
 					<fieldset class="form-group">
 						<label class="control-label col-sm-2">Image</label>
 						<select class="col-sm-20" id="ramSelected">
-							<option>Cirros</option>
+							<option>{{ machine.imageId  }}</option>
 							<option>Debian</option>
 							<option>Tiny Core</option>
 							<option>Centos</option>

client/partials/home/main.html

@@ -3,9 +3,10 @@
         Home 
     </div>
     <div class="panel-body">
-        Main Content
+        
-		<button ng-click="raiseShowMachineDetailsEvent()" > Show Machine details</button>
+		
-		<div id="test">
+		Selectionner une machine:
-		</div>
+		<div ng-repeat="machine in machines"> <a ng-click="raiseShowMachineDetailsEvent(machine.id)"> {{ machine.name  }}</a></div>
+		
     </div>
 </div>