loic/istic-openstack
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'develop' into Evan

Browse source
This commit is contained in:
Yoggzo 2016-03-02 10:58:01 +01:00
commit d1bd9b4a0c
10 changed files with 229 additions and 66 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
client/index.html
View file

@ -28,8 +28,9 @@
<div ng-include="'./partials/login.html'"></div> <div ng-include="'./partials/login.html'"></div>
<!-- Machine Details Overlay --> <!-- Machine Details Overlay -->
<div ng-include="'./partials/home/machineDetails.html'"></div> <div ng-include="'./partials/home/machineDetails.html'"></div>
<div ng-include="'./partials/loading.html'"></div>
<!-- Nav --> <!-- Nav -->
<div ng-include="'./partials/nav.html'"></div> <div ng-include="'./partials/nav.html'"></div>
</div> </div>
</div> </div>
@ -79,6 +80,7 @@
<script src="./js/services/Identity.js"></script> <script src="./js/services/Identity.js"></script>
<script src="./js/services/Image.js"></script> <script src="./js/services/Image.js"></script>
<script src="./js/services/Compute.js"></script> <script src="./js/services/Compute.js"></script>
<script src="./js/services/Loading.js"></script>
<!-- Include controller --> <!-- Include controller -->
<script src="./js/controllers/login.js"></script> <script src="./js/controllers/login.js"></script>

4
client/js/controllers/home/machineDetails.js
View file

@ -9,8 +9,10 @@ mainApp.controller('machineDetailsCtrl', [ '$scope', 'Compute', '$rootScope', '$
$scope.machine={}; $scope.machine={};
$("#waitingForToggleMachine").hide(); $("#waitingForToggleMachine").hide();
$scope.$on('showMachineDetailsEvent', function(eventName ,machine){ $scope.$on('showMachineDetailsEvent', function(eventName ,machine, axioms){
$scope.machine=machine; $scope.machine=machine;
$scope.axioms=axioms;
console.log(machine);
$('#machineDetailsModal').modal({backdrop: false, keyboard: true}); $('#machineDetailsModal').modal({backdrop: false, keyboard: true});
}); });

30
client/js/controllers/home/main.js
View file

@ -3,21 +3,33 @@
* *
* @param {$scope} $scope The $scope service from angular * @param {$scope} $scope The $scope service from angular
*/ */
mainApp.controller('homeCtrl', [ '$scope', 'Compute', '$rootScope', function ($scope, Compute, $rootScope) mainApp.controller('homeCtrl', [ '$scope', 'Compute', '$rootScope', 'Loading','Identity', function ($scope, Compute, $rootScope, Loading, Identity)
{ {
var updatePage=function(){ var callMeAfterPullData=function(data){
// TODO Update graph etc... $scope.machines=Compute.getData().machines;
Loading.stop();
} }
// Retrieve all Data ;
Compute.pullData(updatePage); if(Compute.getData().machines == null && Identity.isAlreadyLogin()){
Loading.start();
Compute.pullData(callMeAfterPullData);
}
Compute.getMachines(function(adzda){});
$scope.raiseShowMachineDetailsEvent=function(){ $scope.raiseShowMachineDetailsEvent=function(id){
var machine={name: "Machine 1", online:true};
$rootScope.$broadcast("showMachineDetailsEvent", machine); var callback=function(){
Loading.stop();
var data=Compute.getData();
$rootScope.$broadcast("showMachineDetailsEvent", data.machines[id], data.axioms);
}
Loading.start();
Compute.pullMachines(callback);
} }

134
client/js/services/Compute.js
View file

@ -2,55 +2,139 @@
mainApp.factory('Compute',[ '$http', 'Identity', function($http, Identity){ mainApp.factory('Compute',[ '$http', 'Identity', function($http, Identity){
// Create data // Init data
var data={}; var data={};
data.machines={}; data.machines=null;
data.axioms={} // Contain static data
data.axioms.ram=[128,512,1024,2048,4096];
data.axioms.disk=[1,2,5,10,25,50,100,150,200]
data.axioms.images={}; // Retrieve after
/**
// Parser * Parse pullMachines answer
var parseGetMachinesAnswer=function(response, failedToSendRequest){ * @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;
if (typeof response.data.Servers !== 'undefined') {
// Set status code
requestParserResult.status=0;
data.machines=response.data.Servers;
}
else if(failedToSendRequest){
requestParserResult.failReason="Failed to send request";
}
else{
requestParserResult.failReason="Error";
}
return requestParserResult;
}; };
// Get Machine /**
var getMachines=function(callback){ * Retrieve machine list
* @param {callback} function to call after request complete
var params={ */
"token" : Identity.getToken(), var pullMachines=function(callback){
"task" : "compute", // Send listServers request
"action":"getServer",
"serverId":"69d5bcc4-2fab-4634-b0d2-f455fee5b7bd"
};
var result=$http.post('../server/index.php', var result=$http.post('../server/index.php',
$.param(params)); $.param({"token" : Identity.getToken(), "task" : "compute", "action":"listServers"}));
// Wait and handle the response // Wait and handle the response
result.then(function (response){ result.then(function (response){
console.log(response.data.Servers); callback(parsePullMachinesAnswer(response, false));
callback(parseGetMachinesAnswer(response, false));
},function(response){ },function(response){
alert(response.status); callback(parsePullMachinesAnswer(response, true));
callback(parseGetMachinesAnswer(response, true)); });
}); };
/**
* Parse pullImages answer
* @param {response} the server response
* @param {boolean} false if the request as been send true else
* @return {requestParserResult} the result of parsing
*/
var parsePullImagesAnswer=function(response, failedToSendRequest){
// Defined return object
var requestParserResult={};
requestParserResult.status=1;
requestParserResult.failReason=null;
if (typeof response.data.Images !== 'undefined') {
// Set status code
requestParserResult.status=0;
data.axioms.images=response.data.Images;
}
else if(failedToSendRequest){
requestParserResult.failReason="Failed to send request";
}
else{
requestParserResult.failReason="Error";
}
return requestParserResult;
}; };
/**
* Retrieve machine list
* @param {callback} function to call after request complete
*/
var pullImages=function(callback){
// Send listServers request
var result=$http.post('../server/index.php',
$.param({"token" : Identity.getToken(), "task" : "compute", "action":"listImages"}));
// Wait and handle the response
result.then(function (response){
callback(parsePullImagesAnswer(response, false));
},function(response){
callback(parsePullImagesAnswer(response, true));
});
};
/**
* Retrieve all data
* @param {callback} function to call after request complete
*/
var pullData=function(callback){ var pullData=function(callback){
// TODO call getMachines etc... var nextFunction=function(response){
if(response.status==0){
pullMachines(callback);
}
}
pullImages(nextFunction);
} }
/**
* Get Data
* @return {data} return the data object
*/
var getData=function(){
return data;
}
// Return services objects // Return services objects
return { return {
getMachines: getMachines, pullMachines: pullMachines,
pullData: pullData, pullData: pullData,
data:data getData: getData
}; };

13
client/js/services/Identity.js
View file

@ -48,6 +48,9 @@ mainApp.factory('Identity',[ '$http', '$cookies', function($http, $cookies){
$cookies.remove('profile'); $cookies.remove('profile');
$cookies.remove('token.part_0'); $cookies.remove('token.part_0');
$cookies.remove('token.part_1'); $cookies.remove('token.part_1');
token=null;
profile.username=null;
profile.projectname=null;
} }
@ -81,6 +84,10 @@ mainApp.factory('Identity',[ '$http', '$cookies', function($http, $cookies){
$cookies.putObject('token.part_0', response.data.token.substring(0, middle), {'expires': expireDate}); $cookies.putObject('token.part_0', response.data.token.substring(0, middle), {'expires': expireDate});
// Save second part of token // Save second part of token
$cookies.putObject('token.part_1', response.data.token.substring(middle, response.data.token.length), {'expires': expireDate}); $cookies.putObject('token.part_1', response.data.token.substring(middle, response.data.token.length), {'expires': expireDate});
// Put token in var
token=response.data.token;
} }
else if(failedToSendRequest){ else if(failedToSendRequest){
requestParserResult.failReason="Failed to send request"; requestParserResult.failReason="Failed to send request";
@ -102,7 +109,7 @@ mainApp.factory('Identity',[ '$http', '$cookies', function($http, $cookies){
* @param {string} projectname The user project name * @param {string} projectname The user project name
* @param {function} function to call when data is avalaible * @param {function} function to call when data is avalaible
*/ */
var login=function(username, password,projectname, callback){ var login=function(username, password,projectname,callback){
// Set profile information (early) // Set profile information (early)
profile.username=username; profile.username=username;
@ -120,6 +127,9 @@ mainApp.factory('Identity',[ '$http', '$cookies', function($http, $cookies){
}; };
/* /*
* Get the profile * Get the profile
*/ */
@ -133,6 +143,7 @@ mainApp.factory('Identity',[ '$http', '$cookies', function($http, $cookies){
var getToken=function(){ var getToken=function(){
return token; return token;
} }
// Return services objects // Return services objects

22
client/js/services/Loading.js Normal file
View file

@ -0,0 +1,22 @@
mainApp.factory('Loading',[ '$http', 'Identity', function($http, Identity){
var start=function(){
$('#loadingModal').modal({backdrop: 'static', keyboard: false});
};
var stop=function(){
$('#loadingModal').modal('hide');
}
return {
start:start,
stop:stop
};
}]);

30
client/partials/home/machineDetails.html
View file

@ -21,11 +21,11 @@
<div class="form-group"> <div class="form-group">
<label class="control-label col-sm-2" for="pwd">State</label> <label class="control-label col-sm-2" for="pwd">State</label>
<div class="col-sm-10"> <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; &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> &nbsp;<img src="images/spin/32x32/Preloader_1.gif" id="waitingForToggleMachine"></span>
@ -34,36 +34,22 @@
<fieldset class="form-group"> <fieldset class="form-group">
<label class="control-label col-sm-2">RAM</label> <label class="control-label col-sm-2">RAM</label>
<select class="col-sm-20" id="ramSelected"> <select class="col-sm-20" id="ramSelected">
<option>128 MB</option> <option ng-repeat="ram in axioms.ram" ng-selected="machine.ram == ram">{{ ram }}</option>
<option>512 MB</option>
<option>1024 MB</option>
<option>2048 MB</option>
<option>4096 MB</option>
</select> </select>
<span>MB</span>
</fieldset> </fieldset>
<fieldset class="form-group"> <fieldset class="form-group">
<label class="control-label col-sm-2">Disk</label> <label class="control-label col-sm-2">Disk</label>
<select class="col-sm-20" id="ramSelected"> <select class="col-sm-20" id="ramSelected">
<option>1 Go</option> <option ng-repeat="disk in axioms.disk" ng-selected="machine.disk == disk">{{ disk }}</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> </select>
</fieldset> </fieldset>
<fieldset class="form-group"> <fieldset class="form-group">
<label class="control-label col-sm-2">Image</label> <label class="control-label col-sm-2">Image</label>
<select class="col-sm-20" id="ramSelected"> <select class="col-sm-20" id="ramSelected">
<option>Cirros</option> <option ng-repeat="image in axioms.images" ng-selected="machine.imageId == Object.keys(image)">{{ image.name }}</option>
<option>Debian</option>
<option>Tiny Core</option>
<option>Centos</option>
</select> </select>
</fieldset> </fieldset>

9
client/partials/home/main.html
View file

@ -3,9 +3,10 @@
Home Home
</div> </div>
<div class="panel-body"> <div class="panel-body">
Main Content
<button ng-click="raiseShowMachineDetailsEvent()" > Show Machine details</button> Pour charger les machines, recharger la page (temporaire)<br />
<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>
</div> </div>

18
client/partials/loading.html Normal file
View file

@ -0,0 +1,18 @@
<div class="modal fade" id="loadingModal" ng-controller="loginCtrl">
<div class="modal-dialog">
<div class="modal-content"></div>
</div>
<div class="modal-dialog" style="width:200px;">
<div class="modal-content">
<div class="modal-body" >
<div align="center">
<img src="images/spin/128x128/Preloader_8.gif" />
</div>
</div>
</div>
</div>
</div>

31
server/core/Compute.php
View file

@ -35,7 +35,20 @@ class compute
*/ */
public function listServers() public function listServers()
{ {
$servers = $this->libClass->listServers(); $serverList = $this->libClass->listServers(true);
$servers = Array();
foreach($serverList as $server){
$servers[$server->id] = Array();
$server->flavor->retrieve();
$server->image->retrieve();
$servers[$server->id]["id"] = $server->id;
$servers[$server->id]["name"] = $server->name;
$servers[$server->id]["imageId"] = $server->image->id;
$servers[$server->id]["flavorId"] = $server->flavor->id;
$servers[$server->id]["status"] = $server->status;
$servers[$server->id]["ram"] = $server->flavor->ram;
$servers[$server->id]["disk"] = $server->flavor->disk;
}
$this->app->setOutput("Servers", $servers); $this->app->setOutput("Servers", $servers);
return; return;
} }
@ -45,7 +58,13 @@ class compute
*/ */
public function listFlavors() public function listFlavors()
{ {
$flavors = $this->libClass->listFlavors(); $flavorList = $this->libClass->listFlavors();
$flavors = Array();
foreach($flavorList as $flavor){
$flavors[$flavor->id] = Array();
$flavors[$flavor->id]["id"] = $flavor->id;
$flavors[$flavor->id]["name"] = $flavor->name;
}
$this->app->setOutput("Flavors", $flavors); $this->app->setOutput("Flavors", $flavors);
return; return;
} }
@ -55,7 +74,13 @@ class compute
*/ */
public function listImages() public function listImages()
{ {
$images = $this->libClass->listImages(); $imageList = $this->libClass->listImages();
$images = Array();
foreach($imageList as $image){
$images[$image->id] = Array();
$images[$image->id]["id"] = $image->id;
$images[$image->id]["name"] = $image->name;
}
$this->app->setOutput("Images", $images); $this->app->setOutput("Images", $images);
return; return;
} }