diff options
| -rw-r--r-- | client/js/controllers/home/machineDetails.js | 1 | ||||
| -rw-r--r-- | client/js/controllers/home/main.js | 9 | ||||
| -rw-r--r-- | client/js/services/Compute.js | 55 | ||||
| -rw-r--r-- | client/partials/home/machineDetails.html | 14 | ||||
| -rw-r--r-- | client/partials/home/main.html | 9 |
5 files changed, 48 insertions, 40 deletions
diff --git a/client/js/controllers/home/machineDetails.js b/client/js/controllers/home/machineDetails.js index f84a073..7476c69 100644 --- a/client/js/controllers/home/machineDetails.js +++ b/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}); }); diff --git a/client/js/controllers/home/main.js b/client/js/controllers/home/main.js index ee564b2..b44836b 100644 --- a/client/js/controllers/home/main.js +++ b/client/js/controllers/home/main.js @@ -6,18 +6,19 @@ mainApp.controller('homeCtrl', [ '$scope', 'Compute', '$rootScope', function ($scope, Compute, $rootScope) { - var updatePage=function(){ - // TODO Update graph etc... + var callMeAfterGetMachines=function(data){ + $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); diff --git a/client/js/services/Compute.js b/client/js/services/Compute.js index f4e8fa8..e2fb3df 100644 --- a/client/js/services/Compute.js +++ b/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){ - - var params={ - "token" : Identity.getToken(), - "task" : "compute", - "action":"listServers" - }; - + // Send listServers request 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(parseGetMachinesAnswer(response, false)); + callback(parsePullMachinesAnswer(response, false)); },function(response){ - alert(response.status); - callback(parseGetMachinesAnswer(response, true)); - }); - - + callback(parsePullMachinesAnswer(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; } diff --git a/client/partials/home/machineDetails.html b/client/partials/home/machineDetails.html index 606edcf..28c9165 100644 --- a/client/partials/home/machineDetails.html +++ b/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.online">Offline</span> + <span ng-if="machine.status=='ACTIVE'">Online</span> + <span ng-if="machine.status!=='ACTIVE'">Offline</span> - <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> + <button class="btn btn-danger" ng-if="machine.status=='ACTIVE'" ng-click="toggleMachineState()">Turn Off</button> + <button class="btn btn-success" ng-if="machine.status!=='ACTIVE'" ng-click="toggleMachineState()">Turn On</button> <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> diff --git a/client/partials/home/main.html b/client/partials/home/main.html index 37638d3..77a9bc4 100644 --- a/client/partials/home/main.html +++ b/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"> - </div> + + + Selectionner une machine: + <div ng-repeat="machine in machines"> <a ng-click="raiseShowMachineDetailsEvent(machine.id)"> {{ machine.name }}</a></div> + </div> </div> |