Commit 7f1b6510 authored by Thomas Lechauve's avatar Thomas Lechauve

Refresh automatically instances list

Supported: refresh when an instance is modified or created
parent ea2791e6
......@@ -3,9 +3,6 @@
var methods = {
init: function (options) {
var settings = $.extend({
'host': '',
'access_token': '',
'clientID': ''
}, options);
return this.each(function () {
......@@ -58,80 +55,88 @@
statusDefault: function () {
return {
0: function () { console.error("status error code: 0"); },
404: function () { console.error("status error code: Not Found !"); }
404: function () { console.error("status error code: Not Found !"); },
500: function () { console.error("Server error !"); }
};
},
request: function (type, url, callback, statusCode, data) {
data = data || '';
statusCode = statusCode || this.statusDefault;
request: function (type, authentication, args) {
var statusCode;
var data;
if (args.hasOwnProperty('statusCode')) {
statusCode = args.statusCode || methods.statusDefault();
} else {
statusCode = methods.statusDefault();
}
if (args.hasOwnProperty('data')) {
data = args.data || undefined;
} else {
data = undefined;
}
delete args.data
$.extend(args, {statusCode: statusCode});
return this.each(function () {
$.ajax({
url: "http://" + $(this).slapos('host') + url,
var ajaxOptions = {
type: type,
contentType: 'application/octet-stream',
contentType: 'application/json',
data: JSON.stringify(data),
dataType: 'json',
datatype: 'json',
context: $(this),
beforeSend: function (xhr) {
if ($(this).slapos("access_token")) {
if ($(this).slapos("access_token") && authentication) {
xhr.setRequestHeader("Authorization", $(this).slapos("store", "token_type") + " " + $(this).slapos("access_token"));
xhr.setRequestHeader("Accept", "application/json");
}
},
statusCode: statusCode,
success: callback
});
}
};
$.extend(ajaxOptions, args);
$.ajax(ajaxOptions);
});
},
newInstance: function (data, callback, statusEvent) {
return $(this).slapos('request', 'POST', '/request', callback, statusEvent, data);
},
deleteInstance: function (id, callback, statusEvent) {
return $(this).slapos('request', 'DELETE', '/instance/' + id, callback, statusEvent);
},
getInstance: function (id, callback, statusEvent) {
return $(this).slapos('request', 'GET', '/instance/' + id, callback, statusEvent);
},
getInstanceCert: function (id, callback, statusEvent) {
return $(this).slapos('request', 'GET', '/instance/' + id + '/certificate', callback, statusEvent);
},
bangInstance: function (id, log, callback, statusEvent) {
return $(this).slapos('request', 'POST', '/instance/' + id + '/bang', callback, statusEvent, log);
},
editInstance: function (id, data, callback, statusEvent) {
return $(this).slapos('request', 'PUT', '/instance/' + id, callback, statusEvent, data);
},
newComputer: function (data, callback, statusEvent) {
return $(this).slapos('request', 'POST', '/computer', callback, statusEvent, data);
},
getComputer: function (id, callback, statusEvent) {
return $(this).slapos('request', 'GET', '/computer/' + id, callback, statusEvent);
prepareRequest: function (methodName, args) {
var $this = $(this);
return this.each(function(){
$(this).slapos('discovery', function(access){
if (access.hasOwnProperty(methodName)) {
var url = args.url || access[methodName].url;
$.extend(args, {'url': url});
$this.slapos('request',
access[methodName].method,
access[methodName].authentication,
args);
}
});
})
},
editComputer: function (id, data, callback, statusEvent) {
return $(this).slapos('request', 'PUT', '/computer/' + id, callback, statusEvent, data);
discovery: function (callback) {
return this.each(function(){
$.ajax({
url: "http://10.8.2.34:12002/erp5/portal_vifib_rest_api_v1",
dataType: "json",
beforeSend: function (xhr) {
xhr.setRequestHeader("Accept", "application/json");
},
success: callback
});
});
},
newSoftware: function (computerId, data, callback, statusEvent) {
return $(this).slapos('request', 'POST', '/computer/' + computerId + '/supply', callback, statusEvent, data);
instanceList: function (args) {
return $(this).slapos('prepareRequest', 'instance_list', args);
},
bangComputer: function (id, log, callback, statusEvent) {
return $(this).slapos('request', 'POST', '/computer/' + id + '/bang', callback, statusEvent, log);
instanceInfo: function (url, args) {
url = decodeURIComponent(url);
$.extend(args, {'url': url});
return $(this).slapos('prepareRequest', 'instance_info', args);
},
computerReport: function (id, data, callback, statusEvent) {
return $(this).slapos('request', 'POST', '/computer/' + id + '/report', callback, statusEvent, data);
instanceRequest: function (args) {
return $(this).slapos('prepareRequest', 'request_instance', args)
}
};
$.fn.slapos = function (method) {
......
......@@ -16,17 +16,14 @@
</article>
</script>
<script id="service.list" type="text/html">
<article>
<table class="table table-condensed" id="service.table">
<script id="instance.list" type="text/html">
<table class="table table-condensed" id="instance-table">
<caption><h2>Instances list</h2></caption>
<tr><th>Title</th><th>Status</th></tr>
</table>
</article>
</script>
<script id="service.list.elem" type="text/html">
<tr><td><a href="{{ url }}">{{ title }}</a></td><td>{{ status }}</td></tr>
<script id="instance.list.elem" type="text/html">
<td><a href="{{ url }}">{{ title }}</a></td><td>{{ status }}</td>
</script>
<script id="invoice.list" type="text/html">
......@@ -90,7 +87,7 @@
<div class="control-group">
<label class="control-label">Reference</label>
<div class="controls">
<span class="uneditable-input">{{ }}</span>
<span class="uneditable-input">{{ title }}</span>
</div>
</div>
<div class="control-group">
......@@ -109,8 +106,8 @@
<label class="control-label">Status</label>
<div class="controls">
<div class="btn-group">
<button class="btn">Stop</button>
<button class="btn btn-success disabled">Started</button>
<button class="btn" id="stopInstance">Stop</button>
<button class="btn btn-success disabled" id="startInstance">Started</button>
</div>
</div>
</div>
......@@ -159,7 +156,7 @@
<script id="error" type="text/html">
<div class="alert alert-{{ state }}">
<a class="close" data-dismiss="alert" href="#">×</a>
<h4 class="alert-heading">{{ state }}</h4>
<h4 class="alert-heading">{{ state }} - {{ date }}</h4>
{{ message }}
</div>
</script>
......@@ -196,8 +193,8 @@
<li autofocus="autofocus"><a href="#/computers"><i class="icon-list"></i>List all servers</a></li>
<li><a href="#/computer"><i class="icon-plus-sign"></i>Add new server</a></li>
<li class="nav-header">Services</li>
<li><a href="#/instances"><i class="icon-list"></i>List all services</a></li>
<li><a href="#/instance"><i class="icon-plus-sign"></i>Add new service</a></li>
<li><a href="#/instances"><i class="icon-list"></i>List all instances</a></li>
<li><a href="#/instance"><i class="icon-plus-sign"></i>Add new instance</a></li>
<li class="nav-header">Account</li>
<li><a href="#/invoices"><i class="icon-inbox"></i>Invoices</a></li>
<li><a href="#/settings"><i class="icon-cog"></i>Settings</a></li>
......
......@@ -71,7 +71,7 @@ var inst1 =
var fakeserver = sinon.fakeServer.create();
// Get instance
/*fakeserver.respondWith("GET", "/instance/200",[200, {"Content-Type":"application/json; charset=utf-8"}, JSON.stringify(inst0)]);
fakeserver.respondWith("GET", "/instance/200",[200, {"Content-Type":"application/json; charset=utf-8"}, JSON.stringify(inst0)]);
fakeserver.respondWith("GET", "/instance/201",[200, {"Content-Type":"application/json; charset=utf-8"}, JSON.stringify(inst1)]);
// Get instance FAIL
fakeserver.respondWith("GET", "/instance/408",[408, {"Content-Type":"application/json; charset=utf-8"}, "NOT FOUND"]);
......@@ -82,4 +82,4 @@ $.ajax = function(url, options){
var result = tmp(url, options);
fakeserver.respond();
return result;
}*/
};
......@@ -5,7 +5,7 @@
*/
(function($) {
var routes = {
"/instance" : "requestService",
"/instance" : "requestInstance",
"/instance/:url" : "showInstance",
"/computers" : "listComputers",
"/instances" : "listInstances",
......@@ -24,10 +24,26 @@
}
});
}
var getDate = function () {
var today = new Date();
return [today.getFullYear(), today.getMonth(), today.getDay()].join('/')
+ ' ' + [today.getHours(), today.getMinutes(), today.getSeconds()].join(':');
};
var substractLists = function(l1, l2){
var newList = [];
$.each(l2, function(){
if ($.inArray(""+this, l1) == -1) {
newList.push(""+this);
}
});
return newList;
};
var redirect = function(){
$(this).vifib('render', 'auth', {
'host':'http://192.168.242.64:12002/erp5/web_site_module/hosting/request-access-token',
'host':'http://10.8.2.34:12002/erp5/web_site_module/hosting/request-access-token',
'client_id': 'client',
'redirect':escape(window.location.href)
})
......@@ -53,7 +69,7 @@
var methods = {
init: function() {
// Initialize slapos in this context
$(this).slapos({host: 'http://192.168.242.64:12002/erp5/portal_vifib_rest_api_v1'});
$(this).slapos();
var $this = $(this);
// Bind Loading content
$("#loading").ajaxStart(function(){
......@@ -76,6 +92,10 @@
return location.href.split('#')[0] + "#/instance/" + encodeURIComponent(uri)
},
extractInstanceURIFromUrl: function () {
return decodeURIComponent($(this).attr('href').split('/').pop())
},
authenticate: function(data) {
for (var d in data) {
if (data.hasOwnProperty(d)) {
......@@ -84,6 +104,19 @@
}
},
refresh: function(method, interval, eventName){
eventName = eventName || 'ajaxStop';
var $this = $(this);
$(this).one(eventName, function(){
var id = setInterval(function(){
method.call($this);
}, interval * 1000);
$.subscribe('urlChange', function(e, d){
clearInterval(id);
})
});
},
showInstance: function (uri) {
var statusCode = {
401: redirect,
......@@ -91,35 +124,84 @@
404: notFound,
500: serverError
};
var $this = $(this);
$(this).slapos('instanceInfo', uri, function(infos){
$this.vifib('render', 'instance', infos);
}, statusCode);
$(this).slapos('instanceInfo', uri, {
success: function(infos){
$(this).vifib('render', 'instance', infos);
},
statusCode: statusCode
});
},
getCurrentList: function () {
var list = [];
$.each($(this).find('a'), function () {
list.push($(this).vifib('extractInstanceURIFromUrl'));
});
return list;
},
listComputers: function(){
$(this).vifib('render', 'server.list');
},
refreshRowInstance: function(){
return this.each(function(){
var url = $(this).find('a').vifib('extractInstanceURIFromUrl');
$(this).vifib('fillRowInstance', url);
});
},
fillRowInstance: function(url){
return this.each(function(){
$(this).slapos('instanceInfo', url, {
success: function(instance){
$.extend(instance, {'url': methods.genInstanceUrl(url)});
$(this).vifib('render', 'instance.list.elem', instance);
}
});
});
},
refreshListInstance: function () {
var currentList = $(this).vifib('getCurrentList');
$(this).slapos('instanceList', {
success: function (data) {
var $this = $(this);
var newList = substractLists(currentList, data['list']);
var oldList = substractLists(data['list'], currentList);
$.each(newList, function(){
var url = this+"";
var row = $("<tr></tr>").vifib('fillRowInstance', url);
$this.prepend(row);
});
console.log("newList")
console.log(newList)
console.log("oldList")
console.log(oldList)
},
});
},
listInstances: function(){
var $this = $(this);
var statusCode = {
401: redirect,
402: payment,
404: notFound,
500: serverError
500: serverError,
503: serverError
};
var $this = $(this);
$(this).slapos('instanceList', function(data){
$(this).vifib('render', 'service.list'),
var table = $(this).vifib('render', 'instance.list').find("#instance-table");
table.vifib('refresh', methods.refreshListInstance, 30);
$(this).slapos('instanceList', {
success: function(data){
$.each(data['list'], function(){
var url = this+"";
$this.vifib('instanceInfo', url, function(instance){
$.extend(instance, {'url': methods.genInstanceUrl(url)})
$this.vifib('renderAppend', 'service.list.elem', 'service.table', instance);
})
})},
statusCode
);
var row = $("<tr></tr>").vifib('fillRowInstance', url);
row.vifib('refresh', methods.refreshRowInstance, 30);
table.append(row);
});
}, statusCode: statusCode});
},
listInvoices: function(){
......@@ -127,10 +209,12 @@
},
instanceInfo: function (url, callback) {
$(this).slapos('instanceInfo', url, callback);
$(this).slapos('instanceInfo', {
success: callback, url: url
});
},
requestService: function() {
requestInstance: function() {
$(this).vifib('render', 'form.new.instance');
var data = {};
$(this).find("form").submit(function(){
......@@ -143,46 +227,59 @@
},
requestAsking: function(data){
var request = {
var statusCode = {
401: redirect,
402: payment,
404: notFound,
500: serverError
};
var instance = {
software_type: "type_provided_by_the_software",
slave: false,
status: "started",
parameter: {
Custom1: "one string",
Custom2: "one float",
Custom3: ["abc", "def"],
Custom1: "one string",
Custom2: "one float",
Custom3: ["abc", "def"],
},
sla: {
computer_id: "COMP-0",
computer_id: "COMP-0",
}
};
var statusCode = {
401: redirect,
402: payment,
404: notFound,
500: serverError
$.extend(instance, data);
var args = {
statusCode: statusCode,
data: instance,
success: function (response) {
console.log(response);
}
};
$.extend(request, data);
$(this).slapos('newInstance', request, function(data){
$(this).html(data);},
statusCode
);
return this.each(function(){
$(this).slapos('instanceRequest', args);
});
},
popup: function(message, state) {
state = state || 'error';
return this.each(function(){
$(this).prepend(ich['error']({'message': message, 'state': state}, true))
$(this).prepend(ich['error'](
{'message': message, 'state': state, 'date': getDate()}
, true))
})
},
render: function(template, data){
$(this).html(ich[template](data, true));
return this.each(function(){
$(this).html(ich[template](data, true));
});
},
renderAppend: function(template, data){
$(this).append(ich[template](data, true));
},
renderAppend: function(template, rootId, data){
rootId = rootId.replace('.', '\\.');
$(this).find('#'+rootId).append(ich[template](data, true));
renderPrepend: function(template, data){
$(this).prepend(ich[template](data, true));
}
};
......
......@@ -60,42 +60,51 @@
};
},
request: function (type, url, authentication, callback, statusCode, data) {
request: function (type, authentication, args) {
var statusCode;
var data;
if (args.hasOwnProperty('statusCode')) {
statusCode = args.statusCode || methods.statusDefault();
} else {
statusCode = methods.statusDefault();
}
if (args.hasOwnProperty('data')) {
data = args.data || undefined;
} else {
data = undefined;
}
delete args.data
$.extend(args, {statusCode: statusCode});
return this.each(function () {
$.ajax({
url: url,
var ajaxOptions = {
type: type,
contentType: 'application/json',
data: JSON.stringify(data),
dataType: 'json',
datatype: 'json',
context: $(this),
beforeSend: function (xhr) {
if ($(this).slapos("access_token") && authentication) {
xhr.setRequestHeader("Authorization", $(this).slapos("store", "token_type") + " " + $(this).slapos("access_token"));
xhr.setRequestHeader("Accept", "application/json");
}
},
statusCode: statusCode,
success: callback
});
}
};
$.extend(ajaxOptions, args);
$.ajax(ajaxOptions);
});
},
prepareRequest: function (methodName, callback, statusCode, url, data) {
data = data || undefined;
statusCode = statusCode || methods.statusDefault();
prepareRequest: function (methodName, args) {
var $this = $(this);
return this.each(function(){
$(this).slapos('discovery', function(access){
if (access.hasOwnProperty(methodName)) {
url = url || access[methodName].url;
var url = args.url || access[methodName].url;
$.extend(args, {'url': url});
$this.slapos('request',
access[methodName].method,
url,
access[methodName].authentication,
callback,
statusCode,
data);
args);
}
});
})
......@@ -104,7 +113,7 @@
discovery: function (callback) {
return this.each(function(){
$.ajax({
url: "http://192.168.242.64:12002/erp5/portal_vifib_rest_api_v1",
url: "http://10.8.2.34:12002/erp5/portal_vifib_rest_api_v1",
dataType: "json",
beforeSend: function (xhr) {
xhr.setRequestHeader("Accept", "application/json");
......@@ -114,13 +123,18 @@
});
},
instanceList: function (callback, statusCode) {
return $(this).slapos('prepareRequest', 'instance_list', callback, statusCode);
instanceList: function (args) {
return $(this).slapos('prepareRequest', 'instance_list', args);
},
instanceInfo: function (url, callback, statusCode) {
instanceInfo: function (url, args) {
url = decodeURIComponent(url);
return $(this).slapos('prepareRequest', 'instance_info', callback, statusCode, url);
$.extend(args, {'url': url});
return $(this).slapos('prepareRequest', 'instance_info', args);
},
instanceRequest: function (args) {
return $(this).slapos('prepareRequest', 'request_instance', args)
}
};
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment