mirror of
https://github.com/OpenNebula/one.git
synced 2025-03-20 10:50:08 +03:00
feature #2798: Add vm list and info features to the provisioning view
This commit is contained in:
Daniel Molina
parent
81b94632b8
commit
4ccc52843b
File diff suppressed because one or more lines are too long
@ -70,14 +70,16 @@ var provision_create_vm = '<form id="provision_create_vm" class="hidden section_
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<br>'+
|
||||
'<br>'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-9 columns large-centered">'+
|
||||
'<div data-alert class="alert-box alert-box-error radius text-center hidden">'+
|
||||
'</div>'+
|
||||
'<button href="#" class="button large radius success right" type="submit">'+tr("Create")+'</button>'+
|
||||
'<button href="#" class="button large large-12 radius right" type="submit">'+tr("Create")+'</button>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<br>'+
|
||||
'<br>'+
|
||||
'</form>';
|
||||
|
||||
var provision_list_vms = '<div id="provision_list_vms" class="section_content">'+
|
||||
@ -85,7 +87,10 @@ var provision_list_vms = '<div id="provision_list_vms" class="section_content">'
|
||||
'<div class="large-11 large-centered columns">'+
|
||||
'<h2 class="subheader">'+
|
||||
tr("Virtual Machines")+
|
||||
'<a href"#" id="provision_create_vm_button" class="button medium radius success right"><i class="fa fa-fw fa-plus"/>'+tr("Create")+'</a>'+
|
||||
'<a href"#" id="provision_vms_list_refresh_button" data-tooltip title="'+ tr("Refresh the list of Virtual Machines")+'" class="has-tip tip-top" style="font-size:80%">'+
|
||||
'<i class="fa fa-fw fa-refresh"/>'+
|
||||
'</a>'+
|
||||
'<a href"#" id="provision_create_vm_button" class="button medium radius right"><i class="fa fa-fw fa-plus"/>'+tr("Create")+'</a>'+
|
||||
'</h2>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
@ -111,15 +116,14 @@ var provision_info_vm = '<div id="provision_info_vm" class="section_content hid
|
||||
'<div class="row">'+
|
||||
'<div class="large-11 large-centered columns">'+
|
||||
'<h2 class="subheader">'+
|
||||
'<span id="provision_info_vm_name">'+
|
||||
'<span id="provision_info_vm_name" class="left">'+
|
||||
'</span>'+
|
||||
'<a href"#" id="provision_refresh_info" data-tooltip title="'+ tr("Refresh the Virtual Machine information")+'" class="has-tip tip-top" style="font-size:80%">'+
|
||||
'<i class="fa fa-fw fa-refresh"/>'+
|
||||
'</a>'+
|
||||
'</h2>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<div class="row">'+
|
||||
'<div id="provision_info_vm_resume" class="large-10 large-centered columns">'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<br>'+
|
||||
'<div class="row">'+
|
||||
'<div id="provision_info_vm_state" class="large-10 large-centered columns">'+
|
||||
@ -129,27 +133,17 @@ var provision_info_vm = '<div id="provision_info_vm" class="section_content hid
|
||||
'<div id="provision_info_vm_state_hr" class="large-10 large-centered columns">'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<br>'+
|
||||
'<br>'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-10 large-centered columns">'+
|
||||
'<span class="left">'+
|
||||
'<a href"#" id="" class="secondary button medium radius" style="font-size:12px"><i style="color: #555" class="fa fa-fw fa-power-off fa-2x"/><br>'+tr("Power off")+'</a>'+
|
||||
'<a href"#" id="" class="secondary button medium radius" style="font-size:12px"><i style="color: #555" class="fa fa-fw fa-repeat fa-2x"/><br>'+tr("Reboot")+'</a>'+
|
||||
'<a href"#" id="" class="secondary button medium radius" style="font-size:12px"><i style="color: #555" class="fa fa-fw fa-trash-o fa-2x"/><br>'+tr("Destroy")+'</a>'+
|
||||
'</span>'+
|
||||
'<span class="right">'+
|
||||
'<a href"#" id="" class="secondary button medium radius" style="font-size:12px"><i style="color: #555" class="fa fa-fw fa-camera-retro fa-2x"/><br>'+tr("Snapshot")+'</a>'+
|
||||
'<a href"#" id="" class="secondary button medium radius" style="font-size:12px"><i style="color: #555" class="fa fa-fw fa-desktop fa-2x"/><br>'+tr("VNC")+'</a>'+
|
||||
'</span>'+
|
||||
'<div id="provision_info_vm_resume" class="large-10 large-centered columns">'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<br>'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-6 columns">'+
|
||||
'<div class="large-10 large-centered columns">'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-6 medium-6 columns">'+
|
||||
'<div class="row text-center">'+
|
||||
'<div class="large-12 columns">'+
|
||||
'<h3 class="subheader"><small>'+tr("REAL CPU")+'</small></h3>'+
|
||||
'<h3 class="subheader"><small>'+tr("CPU")+'</small></h3>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<div class="row">'+
|
||||
@ -163,12 +157,16 @@ var provision_info_vm = '<div id="provision_info_vm" class="section_content hid
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<div class="large-6 columns">'+
|
||||
'<div class="large-6 medium-6 columns">'+
|
||||
'<div class="row text-center">'+
|
||||
'<h3 class="subheader"><small>'+tr("REAL MEMORY")+'</small></h3>'+
|
||||
'<div class="large-12 columns">'+
|
||||
'<h3 class="subheader"><small>'+tr("MEMORY")+'</small></h3>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-10 columns centered graph vm_memory_graph" style="height: 100px;">'+
|
||||
'<div class="large-12 columns">'+
|
||||
'<div class="large-10 columns centered graph vm_memory_graph" style="height: 100px;">'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<div class="row graph_legend">'+
|
||||
@ -176,6 +174,52 @@ var provision_info_vm = '<div id="provision_info_vm" class="section_content hid
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<br>'+
|
||||
'<br>'+
|
||||
'<br>'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-10 large-centered columns">'+
|
||||
'<h2 class="subheader">'+
|
||||
'<span class="right" style="padding: 5px;border: 1px solid #dfdfdf; background: #f7f7f7; border-radius: 5px; color:#777 !important; width: 100%; font-size: 90%">'+
|
||||
'<a href"#" id="provision_delete_confirm_button" data-tooltip title="Delete" class="has-tip tip-top right" style="margin-left:15px; margin-right:15px">'+
|
||||
'<i class="fa fa-fw fa-trash-o"/><span style="font-size: 12px; vertical-align: middle">'+tr("Delete")+'</span>'+
|
||||
'</a>'+
|
||||
'<a href"#" id="provision_shutdownhard_confirm_button" data-tooltip title="Delete" class="has-tip tip-top right" style="margin-left:15px; margin-right:15px">'+
|
||||
'<i class="fa fa-fw fa-trash-o"/><span style="font-size: 12px; vertical-align: middle">'+tr("Delete")+'</span>'+
|
||||
'</a>'+
|
||||
'<a href"#" id="provision_poweroff_confirm_button" data-tooltip title="Power off" class="has-tip tip-top right" style="margin-left:15px; margin-right:15px">'+
|
||||
'<i class="fa fa-fw fa-power-off"/><span style="font-size: 12px; vertical-align: middle">'+tr("Power off")+'</span>'+
|
||||
'</a>'+
|
||||
'<a href"#" id="provision_poweron_button" data-tooltip title="Power on" class="has-tip tip-top right" style="margin-left:15px; margin-right:15px">'+
|
||||
'<i class="fa fa-fw fa-play"/><span style="font-size: 12px; vertical-align: middle">'+tr("Power on")+'</span>'+
|
||||
'</a>'+
|
||||
'<a href"#" id="provision_reboot_confirm_button" data-tooltip title="Reboot" class="has-tip tip-top right" style="margin-left:10px; margin-right:15px">'+
|
||||
'<i class="fa fa-fw fa-repeat"/><span style="font-size: 12px; vertical-align: middle">'+tr("Reboot")+'</span>'+
|
||||
'</a>'+
|
||||
'<a href"#" id="provision_vnc_button" data-tooltip title="Open a VNC console in a new window" class="has-tip tip-top" style="margin-left:15px; margin-right:25px">'+
|
||||
'<i class="fa fa-fw fa-desktop"/><span style="font-size: 12px; vertical-align: middle">'+tr("VNC")+'</span>'+
|
||||
'</a>'+
|
||||
'<span id="provision_vnc_button_disabled" data-tooltip title="You have to boot the Virtual Machine first" class="has-tip tip-top" style="margin-left:15px; margin-right:25px; color: #999">'+
|
||||
'<i class="fa fa-fw fa-desktop"/><span style="font-size: 12px; vertical-align: middle">'+tr("VNC")+'</span>'+
|
||||
'</span>'+
|
||||
'<a href"#" id="provision_snapshot_button" data-tooltip title="The main disk of the Virtual Machine will be saved in a new Image" class="has-tip tip-top" style="margin-left:15px; margin-right:15px">'+
|
||||
'<i class="fa fa-fw fa-camera-retro"/><span style="font-size: 12px; vertical-align: middle">'+tr("Snapshot")+'</span>'+
|
||||
'</a>'+
|
||||
'<span id="provision_snapshot_button_disabled" data-tooltip title="You have to power-off the virtual machine first" class="has-tip tip-top" style="margin-left:15px; margin-right:15px; color: #999">'+
|
||||
'<i class="fa fa-fw fa-camera-retro"/><span style="font-size: 12px; vertical-align: middle">'+tr("Snapshot")+'</span>'+
|
||||
'</span>'+
|
||||
'</span>'+
|
||||
'</h2>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<br>'+
|
||||
'<br>'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-10 large-centered columns" id="provision_confirm_action">'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'</div>';
|
||||
|
||||
@ -187,19 +231,201 @@ var provision_content = provision_create_vm +
|
||||
var provision_tab = {
|
||||
title: '<img src="images/one_small_logo.png" style="height:40px">',
|
||||
list_header: '<img src="images/one_small_logo.png" style="height:40px">'+
|
||||
'<span class="right" style="font-size: 70%">'+
|
||||
'<a href"#" class="medium" id="provision_vms_list_button" style="margin-left: 20px;">'+tr("Virtual Machines")+' </a>'+
|
||||
'<a href"#" class="medium" style="margin-left: 20px;">'+tr("Images")+'</a> '+
|
||||
'<a href"#" class="medium" style="margin-left: 20px;"><i class="fa fa-fw fa-user" style="color: #777"/>'+tr("oneadmin")+'</a> '+
|
||||
'<a href"#" class="medium" style="margin-left: 20px;"><i class="fa fa-fw fa-sign-out" style="color: #777"/></a>'+
|
||||
'<span class="right" style="font-size: 60%; color: #999">'+
|
||||
'<a href"#" class="medium" id="provision_vms_list_button" style="color: #555; margin-left: 10px;margin-right: 10px;">'+tr("Virtual Machines")+'</a> | '+
|
||||
'<a href"#" class="medium" style="color: #555; margin-left: 10px;margin-right: 10px;">'+tr("Images")+'</a> | '+
|
||||
'<a href"#" class="medium" style="color: #555; margin-left: 10px;margin-right: 10px;"><i class="fa fa-fw fa-user" style="color: #777"/>'+tr("oneadmin")+'</a> | '+
|
||||
'<a href"#" class="medium" style="color: #555; margin-left: 10px;margin-right: 10px;"><i class="fa fa-fw fa-sign-out" style="color: #777"/></a>'+
|
||||
'</span>'+
|
||||
'<br>',
|
||||
content: provision_content
|
||||
};
|
||||
|
||||
Sunstone.addMainTab('provision-tab',provision_tab);
|
||||
var povision_actions = {
|
||||
"Provision.show" : {
|
||||
type: "single",
|
||||
call: OpenNebula.VM.show,
|
||||
callback: function(request, response){
|
||||
update_provision_vm_info(response.VM);
|
||||
},
|
||||
error: onError
|
||||
},
|
||||
"Provision.instantiate" : {
|
||||
type: "single",
|
||||
call: OpenNebula.Template.instantiate,
|
||||
callback: function(){
|
||||
show_provision_vm_list();
|
||||
$("#vm_name", $("#provision_create_vm")).val('');
|
||||
$(".provision-pricing-table", $("#provision_create_vm")).removeClass("selected");
|
||||
$(".alert-box-error", context).hide();
|
||||
},
|
||||
error: onError
|
||||
},
|
||||
"Provision.saveas" : {
|
||||
type: "single",
|
||||
call: OpenNebula.VM.saveas,
|
||||
callback: function(request, response){
|
||||
$("#provision_confirm_action").html(
|
||||
'<div data-alert class="alert-box secondary radius" style="background: #fff">'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-11 columns">'+
|
||||
'<span style="font-size: 14px; line-height: 20px">'+
|
||||
'A new snapshot has been included in your list of images:'+
|
||||
'<br>'+
|
||||
equest.request.data[0][1].image_name +
|
||||
'<br>'+
|
||||
'<br>'+
|
||||
'This image can be used in a new virtual machine'+
|
||||
'</span>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<a href="#" class="close" style="top: 20px">×</a>'+
|
||||
'</div>');
|
||||
},
|
||||
error: onError
|
||||
},
|
||||
"Provision.poweroff" : {
|
||||
type: "single",
|
||||
call: OpenNebula.VM.poweroff,
|
||||
callback: provision_show_vm_callback,
|
||||
error: onError
|
||||
},
|
||||
|
||||
var update_provision_images_datatable = function(datatable) {
|
||||
"Provision.poweroff_hard" : {
|
||||
type: "single",
|
||||
call: OpenNebula.VM.poweroff_hard,
|
||||
callback: provision_show_vm_callback,
|
||||
error: onError
|
||||
},
|
||||
"Provision.resume" : {
|
||||
type: "single",
|
||||
call: OpenNebula.VM.resume,
|
||||
callback: provision_show_vm_callback,
|
||||
error: onError
|
||||
},
|
||||
|
||||
"Provision.shutdown_hard" : {
|
||||
type: "single",
|
||||
call: OpenNebula.VM.cancel,
|
||||
callback: show_provision_vm_list,
|
||||
error: onError
|
||||
},
|
||||
|
||||
"Provision.delete" : {
|
||||
type: "single",
|
||||
call: OpenNebula.VM.del,
|
||||
callback: show_provision_vm_list,
|
||||
error: onError
|
||||
},
|
||||
"Provision.monitor" : {
|
||||
type: "monitor",
|
||||
call : OpenNebula.VM.monitor,
|
||||
callback: function(req,response) {
|
||||
var vm_graphs = [
|
||||
{
|
||||
monitor_resources : "CPU",
|
||||
labels : "Real CPU",
|
||||
humanize_figures : false,
|
||||
div_graph : $(".vm_cpu_graph")
|
||||
},
|
||||
{
|
||||
monitor_resources : "MEMORY",
|
||||
labels : "Real MEM",
|
||||
humanize_figures : true,
|
||||
div_graph : $(".vm_memory_graph")
|
||||
},
|
||||
{ labels : "Network reception",
|
||||
monitor_resources : "NET_RX",
|
||||
humanize_figures : true,
|
||||
convert_from_bytes : true,
|
||||
div_graph : $("#vm_net_rx_graph")
|
||||
},
|
||||
{ labels : "Network transmission",
|
||||
monitor_resources : "NET_TX",
|
||||
humanize_figures : true,
|
||||
convert_from_bytes : true,
|
||||
div_graph : $("#vm_net_tx_graph")
|
||||
},
|
||||
{ labels : "Network reception speed",
|
||||
monitor_resources : "NET_RX",
|
||||
humanize_figures : true,
|
||||
convert_from_bytes : true,
|
||||
y_sufix : "B/s",
|
||||
derivative : true,
|
||||
div_graph : $("#vm_net_rx_speed_graph")
|
||||
},
|
||||
{ labels : "Network transmission speed",
|
||||
monitor_resources : "NET_TX",
|
||||
humanize_figures : true,
|
||||
convert_from_bytes : true,
|
||||
y_sufix : "B/s",
|
||||
derivative : true,
|
||||
div_graph : $("#vm_net_tx_speed_graph")
|
||||
}
|
||||
];
|
||||
|
||||
// The network speed graphs require the derivative of the data,
|
||||
// and this process is done in place. They must be the last
|
||||
// graphs to be processed
|
||||
|
||||
for(var i=0; i<vm_graphs.length; i++) {
|
||||
plot_graph(
|
||||
response,
|
||||
vm_graphs[i]
|
||||
);
|
||||
}
|
||||
},
|
||||
error: vmMonitorError
|
||||
},
|
||||
"Provision.reboot" : {
|
||||
type: "single",
|
||||
call: OpenNebula.VM.reboot,
|
||||
callback: provision_show_vm_callback,
|
||||
error: onError
|
||||
},
|
||||
"Provision.reboot_hard" : {
|
||||
type: "single",
|
||||
call: OpenNebula.VM.reset,
|
||||
callback: provision_show_vm_callback,
|
||||
error: onError
|
||||
},
|
||||
"Provision.startvnc" : {
|
||||
type: "single",
|
||||
call: OpenNebula.VM.startvnc,
|
||||
callback: function(request, response) {
|
||||
var proxy_host = window.location.hostname;
|
||||
var proxy_port = config['system_config']['vnc_proxy_port'];
|
||||
var pw = response["password"];
|
||||
var token = response["token"];
|
||||
var vm_name = response["vm_name"];
|
||||
var path = '?token='+token;
|
||||
|
||||
var url = "vnc?";
|
||||
url += "host=" + proxy_host;
|
||||
url += "&port=" + proxy_port;
|
||||
url += "&token=" + token;
|
||||
url += "&password=" + pw;
|
||||
url += "&encrypt=" + config['user_config']['vnc_wss'];
|
||||
url += "&title=" + vm_name;
|
||||
|
||||
window.open(url, '_blank');
|
||||
},
|
||||
error: onError
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Sunstone.addMainTab('provision-tab',provision_tab);
|
||||
Sunstone.addActions(povision_actions);
|
||||
|
||||
function show_provision_vm_list() {
|
||||
update_provision_vms_datatable(provision_vms_datatable);
|
||||
|
||||
$(".section_content").hide();
|
||||
$("#provision_list_vms").fadeIn();
|
||||
}
|
||||
|
||||
function update_provision_images_datatable(datatable) {
|
||||
OpenNebula.Image.list({
|
||||
timeout: true,
|
||||
success: function (request, item_list){
|
||||
@ -209,7 +435,7 @@ var update_provision_images_datatable = function(datatable) {
|
||||
});
|
||||
}
|
||||
|
||||
var update_provision_templates_datatable = function(datatable) {
|
||||
function update_provision_templates_datatable(datatable) {
|
||||
OpenNebula.Template.list({
|
||||
timeout: true,
|
||||
success: function (request, item_list){
|
||||
@ -219,7 +445,7 @@ var update_provision_templates_datatable = function(datatable) {
|
||||
});
|
||||
}
|
||||
|
||||
var update_provision_vms_datatable = function(datatable) {
|
||||
function update_provision_vms_datatable(datatable) {
|
||||
OpenNebula.VM.list({
|
||||
timeout: true,
|
||||
success: function (request, item_list){
|
||||
@ -229,18 +455,210 @@ var update_provision_vms_datatable = function(datatable) {
|
||||
});
|
||||
}
|
||||
|
||||
function get_provision_vm_state(data) {
|
||||
var state = OpenNebula.Helper.resource_state("vm",data.STATE);
|
||||
var state_color;
|
||||
var state_str;
|
||||
|
||||
switch (state) {
|
||||
case tr("INIT"):
|
||||
case tr("PENDING"):
|
||||
case tr("HOLD"):
|
||||
state_color = 'deploying';
|
||||
state_str = tr("DEPLOYING") + " (1/3)";
|
||||
break;
|
||||
case tr("FAILED"):
|
||||
state_color = 'error';
|
||||
state_str = tr("ERROR");
|
||||
break;
|
||||
case tr("ACTIVE"):
|
||||
var lcm_state = OpenNebula.Helper.resource_state("vm_lcm",data.LCM_STATE);
|
||||
|
||||
switch (lcm_state) {
|
||||
case tr("LCM_INIT"):
|
||||
state_color = 'deploying';
|
||||
state_str = tr("DEPLOYING") + " (1/3)";
|
||||
break;
|
||||
case tr("PROLOG"):
|
||||
state_color = 'deploying';
|
||||
state_str = tr("DEPLOYING") + " (2/3)";
|
||||
break;
|
||||
case tr("BOOT"):
|
||||
state_color = 'deploying';
|
||||
state_str = tr("DEPLOYING") + " (3/3)";
|
||||
break;
|
||||
case tr("RUNNING"):
|
||||
case tr("HOTPLUG"):
|
||||
case tr("SNAPSHOT"):
|
||||
case tr("MIGRATE"):
|
||||
state_color = 'running';
|
||||
state_str = tr("RUNNING");
|
||||
break;
|
||||
case tr("FAILURE"):
|
||||
state_color = 'error';
|
||||
state_str = tr("ERROR");
|
||||
break;
|
||||
case tr("SAVE"):
|
||||
case tr("EPILOG"):
|
||||
case tr("SHUTDOWN"):
|
||||
case tr("CLEANUP"):
|
||||
state_color = 'powering_off';
|
||||
state_str = tr("POWERING OFF");
|
||||
break;
|
||||
case tr("UNKNOWN"):
|
||||
state_color = 'powering_off';
|
||||
state_str = tr("UNKNOWN");
|
||||
break;
|
||||
default:
|
||||
state_color = 'powering_off';
|
||||
state_str = tr("UNKNOWN");
|
||||
break;
|
||||
}
|
||||
|
||||
break;
|
||||
case tr("STOPPED"):
|
||||
case tr("SUSPENDED"):
|
||||
case tr("POWEROFF"):
|
||||
state_color = 'off';
|
||||
state_str = tr("OFF");
|
||||
|
||||
break;
|
||||
default:
|
||||
state_color = 'powering_off';
|
||||
state_str = tr("UNKNOWN");
|
||||
break;
|
||||
}
|
||||
|
||||
return {
|
||||
color: state_color,
|
||||
str: state_str
|
||||
}
|
||||
}
|
||||
|
||||
function update_provision_vm_info(data) {
|
||||
var state = get_provision_vm_state(data);
|
||||
|
||||
switch (state.color) {
|
||||
case "deploying":
|
||||
$("#provision_reboot_confirm_button").hide();
|
||||
$("#provision_poweroff_confirm_button").hide();
|
||||
$("#provision_poweron_button").hide();
|
||||
$("#provision_delete_confirm_button").show();
|
||||
$("#provision_shutdownhard_confirm_button").hide();
|
||||
$("#provision_snapshot_button").hide();
|
||||
$("#provision_vnc_button").hide();
|
||||
$("#provision_snapshot_button_disabled").hide();
|
||||
$("#provision_vnc_button_disabled").hide();
|
||||
break;
|
||||
case "running":
|
||||
$("#provision_reboot_confirm_button").show();
|
||||
$("#provision_poweroff_confirm_button").show();
|
||||
$("#provision_poweron_button").hide();
|
||||
$("#provision_delete_confirm_button").hide();
|
||||
$("#provision_shutdownhard_confirm_button").show();
|
||||
$("#provision_snapshot_button").hide();
|
||||
$("#provision_vnc_button").show();
|
||||
$("#provision_snapshot_button_disabled").show();
|
||||
$("#provision_vnc_button_disabled").hide();
|
||||
break;
|
||||
case "off":
|
||||
$("#provision_reboot_confirm_button").hide();
|
||||
$("#provision_poweroff_confirm_button").hide();
|
||||
$("#provision_poweron_button").show();
|
||||
$("#provision_delete_confirm_button").show();
|
||||
$("#provision_shutdownhard_confirm_button").hide();
|
||||
$("#provision_snapshot_button").show();
|
||||
$("#provision_vnc_button").hide();
|
||||
$("#provision_snapshot_button_disabled").hide();
|
||||
$("#provision_vnc_button_disabled").show();
|
||||
break;
|
||||
case "powering_off":
|
||||
case "error":
|
||||
$("#provision_reboot_confirm_button").hide();
|
||||
$("#provision_poweroff_confirm_button").hide();
|
||||
$("#provision_poweron_button").hide();
|
||||
$("#provision_delete_confirm_button").show();
|
||||
$("#provision_shutdownhard_confirm_button").hide();
|
||||
$("#provision_snapshot_button").hide();
|
||||
$("#provision_vnc_button").hide();
|
||||
$("#provision_snapshot_button_disabled").hide();
|
||||
$("#provision_vnc_button_disabled").hide();
|
||||
break;
|
||||
default:
|
||||
color = 'secondary';
|
||||
$("#provision_reboot_confirm_button").hide();
|
||||
$("#provision_poweroff_confirm_button").hide();
|
||||
$("#provision_poweron_button").hide();
|
||||
$("#provision_delete_confirm_button").show();
|
||||
$("#provision_shutdownhard_confirm_button").hide();
|
||||
$("#provision_snapshot_button").hide();
|
||||
$("#provision_vnc_button").hide();
|
||||
$("#provision_snapshot_button_disabled").hide();
|
||||
$("#provision_vnc_button_disabled").hide();
|
||||
break;
|
||||
}
|
||||
|
||||
var context = $("#provision_info_vm");
|
||||
$("#provision_info_vm").attr("vm_id", data.ID);
|
||||
$("#provision_info_vm_name", context).text(data.NAME);
|
||||
|
||||
$("#provision_info_vm_resume").html('<ul class="inline-list" style="color: #555; font-size: 14px;">'+
|
||||
'<li>'+
|
||||
'<span>'+
|
||||
'<i class="fa fa-fw fa-laptop"/> '+
|
||||
'x'+data.TEMPLATE.CPU+' - '+
|
||||
((data.TEMPLATE.MEMORY > 1000) ?
|
||||
(Math.floor(data.TEMPLATE.MEMORY/1024)+'GB') :
|
||||
(data.TEMPLATE.MEMORY+'MB'))+
|
||||
'</span>'+
|
||||
'</li>'+
|
||||
'<li>'+
|
||||
'<span>'+
|
||||
'<i class="fa fa-fw fa-download"></i>'+
|
||||
'Ubuntu 12.04'+
|
||||
'</span>'+
|
||||
'</li>'+
|
||||
'<li>'+
|
||||
'<span>'+
|
||||
'<i class="fa fa-fw fa-globe"/>'+
|
||||
'192.168.1.1'+
|
||||
'</span>'+
|
||||
'</li>'+
|
||||
'<li class="right">'+
|
||||
'</li>'+
|
||||
'</ul>');
|
||||
|
||||
$("#provision_info_vm_state").html('<span class="'+ state.color +'-color">'+
|
||||
state.str+
|
||||
'</span>'+
|
||||
'<span style="color: #999; font-size:14px" class="right" >'+
|
||||
'<i class="fa fa-fw fa-clock-o"/>'+
|
||||
_format_date(data.STIME)+
|
||||
'</span>');
|
||||
$("#provision_info_vm_state_hr").html('<div style="height:1px; margin-top:5px; margin-bottom: 5px;" class="'+state.color+'-bg"></div>');
|
||||
|
||||
$("#provision_confirm_action").html("");
|
||||
|
||||
Sunstone.runAction("VM.monitor",data.ID, { monitor_resources : "CPU,MEMORY"});
|
||||
}
|
||||
|
||||
function provision_show_vm_callback(request, response) {
|
||||
Sunstone.runAction("Provision.show",request.request.data[0]);
|
||||
}
|
||||
|
||||
$(document).ready(function(){
|
||||
var tab_name = 'provision-tab';
|
||||
var tab = $("#"+tab_name);
|
||||
|
||||
if (Config.isTabEnabled(tab_name)) {
|
||||
$(".left-content").remove();
|
||||
$(".right-content").addClass("large-centered");
|
||||
$(".right-content").addClass("large-centered small-12");
|
||||
|
||||
$(".user-zone-info").remove();
|
||||
|
||||
showTab('provision-tab');
|
||||
|
||||
|
||||
//
|
||||
// Create VM
|
||||
//
|
||||
@ -257,7 +675,7 @@ $(document).ready(function(){
|
||||
],
|
||||
"fnPreDrawCallback": function (oSettings) {
|
||||
// create a thumbs container if it doesn't exist. put it in the dataTables_scrollbody div
|
||||
$("#provision_templates_table").html('<ul id="provision_templates_ul" class="small-block-grid-3 text-center"></ul>');
|
||||
$("#provision_templates_table").html('<ul id="provision_templates_ul" class="large-block-grid-3 medium-block-grid-3 small-block-grid-1 text-center"></ul>');
|
||||
|
||||
return true;
|
||||
},
|
||||
@ -303,7 +721,7 @@ $(document).ready(function(){
|
||||
],
|
||||
"fnPreDrawCallback": function (oSettings) {
|
||||
// create a thumbs container if it doesn't exist. put it in the dataTables_scrollbody div
|
||||
$("#provision_images_table").html('<ul id="provision_images_ul" class="small-block-grid-3 text-center"></ul>');
|
||||
$("#provision_images_table").html('<ul id="provision_images_ul" class="large-block-grid-3 medium-block-grid-3 small-block-grid-1 text-center"></ul>');
|
||||
|
||||
return true;
|
||||
},
|
||||
@ -358,8 +776,7 @@ $(document).ready(function(){
|
||||
}
|
||||
}
|
||||
|
||||
Sunstone.runAction("Template.instantiate_quiet", template_id, extra_info);
|
||||
$(".alert-box-error", context).hide();
|
||||
Sunstone.runAction("Provision.instantiate", template_id, extra_info);
|
||||
return false;
|
||||
})
|
||||
|
||||
@ -368,12 +785,15 @@ $(document).ready(function(){
|
||||
$("#provision_create_vm").fadeIn();
|
||||
});
|
||||
|
||||
|
||||
//
|
||||
// List VMs
|
||||
//
|
||||
var provision_vms_datatable = $('#provision_vms_table').dataTable({
|
||||
|
||||
provision_vms_datatable = $('#provision_vms_table').dataTable({
|
||||
"iDisplayLength": 6,
|
||||
"sDom" : '<"H">t<"F"lp>',
|
||||
"sDom" : '<"H">t<"F"p>',
|
||||
"aaSorting" : [[0, "desc"]],
|
||||
"aoColumnDefs": [
|
||||
{ "bVisible": false, "aTargets": ["all"]}
|
||||
],
|
||||
@ -383,63 +803,44 @@ $(document).ready(function(){
|
||||
],
|
||||
"fnPreDrawCallback": function (oSettings) {
|
||||
// create a thumbs container if it doesn't exist. put it in the dataTables_scrollbody div
|
||||
$("#provision_vms_table").html('<ul id="provision_vms_ul" class="small-block-grid-3 text-center"></ul>');
|
||||
|
||||
$("#provision_vms_table").html('<ul id="provision_vms_ul" class="large-block-grid-3 medium-block-grid-3 small-block-grid-1 text-center"></ul>');
|
||||
return true;
|
||||
},
|
||||
"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
|
||||
var data = aData.VM;
|
||||
var state = OpenNebula.Helper.resource_state("vm",data.STATE);
|
||||
var state_color;
|
||||
switch (state) {
|
||||
case tr("INIT"):
|
||||
case tr("PENDING"):
|
||||
case tr("HOLD"):
|
||||
state_color = 'warning';
|
||||
break;
|
||||
case tr("FAILED"):
|
||||
state_color = 'error';
|
||||
break;
|
||||
case tr("ACTIVE"):
|
||||
state_color = 'success';
|
||||
break;
|
||||
case tr("STOPPED"):
|
||||
case tr("SUSPENDED"):
|
||||
case tr("POWEROFF"):
|
||||
state_color = 'secondary';
|
||||
break;
|
||||
default:
|
||||
state_color = 'secondary';
|
||||
break;
|
||||
}
|
||||
var state = get_provision_vm_state(data);
|
||||
|
||||
state_color= "success"
|
||||
$("#provision_vms_ul").append('<li>'+
|
||||
'<ul class="provision-pricing-table" opennebula_id="'+data.ID+'" datatable_index="'+iDisplayIndexFull+'">'+
|
||||
'<li class="provision-title text-left">'+
|
||||
'<a class="provision_info_vm_button" href="#"><i class="fa fa-fw fa-plus-square-o right"/>'+ data.NAME + '</a>'+
|
||||
'<a class="provision_info_vm_button" style="color:#333" href="#"><i style="color:#0099c3" class="fa fa-fw fa-plus-square-o right"/>'+ data.NAME + '</a>'+
|
||||
'</li>'+
|
||||
'<li class="provision-bullet-item">'+
|
||||
'<li class="provision-bullet-item text-left" style="margin-left:20px">'+
|
||||
'<i class="fa fa-fw fa-laptop"/> '+
|
||||
'x'+data.TEMPLATE.CPU+' - '+
|
||||
((data.TEMPLATE.MEMORY > 1000) ?
|
||||
(Math.floor(data.TEMPLATE.MEMORY/1024)+'GB') :
|
||||
(data.TEMPLATE.MEMORY+'MB'))+
|
||||
'</li>'+
|
||||
'<li class="provision-bullet-item">'+
|
||||
'<li class="provision-bullet-item text-left" style="margin-left:20px">'+
|
||||
'<i class="fa fa-fw fa-download"></i>'+
|
||||
'Ubuntu 12.04'+
|
||||
'</li>'+
|
||||
'<li class="provision-bullet-item">'+
|
||||
'<li class="provision-bullet-item text-left" style="margin-left:20px">'+
|
||||
'<i class="fa fa-fw fa-globe"/>'+
|
||||
'192.168.1.1'+
|
||||
'</li>'+
|
||||
'<li class="provision-bullet-item text-left" style="font-size:12px; color: #999; margin-top:10px">'+
|
||||
'<i class="fa fa-fw fa-clock-o"/>'+
|
||||
pretty_time_runtime(data.STIME)+
|
||||
'<span class="'+ state_color +'-color right">RUNNING</span>'+
|
||||
_format_date(data.STIME)+
|
||||
'<span class="'+ state.color +'-color right">'+
|
||||
state.str+
|
||||
'</span>'+
|
||||
'</li>'+
|
||||
'<li class="provision-bullet-item" style="padding: 0px">'+
|
||||
'<div style="height:1px" class="'+ state.color +'-bg"></div>'+
|
||||
'</li>'+
|
||||
'<li class="provision-bullet-item '+ state_color +'-bg"></li>'+
|
||||
'</ul>'+
|
||||
'</li>');
|
||||
|
||||
@ -449,67 +850,198 @@ $(document).ready(function(){
|
||||
|
||||
update_provision_vms_datatable(provision_vms_datatable);
|
||||
|
||||
|
||||
$("#provision_vms_list_button").on("click", function(){
|
||||
$(".section_content").hide();
|
||||
$("#provision_list_vms").fadeIn();
|
||||
show_provision_vm_list();
|
||||
});
|
||||
|
||||
$("#provision_list_vms").on("click", "#provision_vms_list_refresh_button", function(){
|
||||
show_provision_vm_list();
|
||||
});
|
||||
|
||||
//
|
||||
// Info VM
|
||||
//
|
||||
|
||||
$(document).on("click", "#provision_vms_ul .provision_info_vm_button", function(){
|
||||
$(".section_content").hide();
|
||||
$("#provision_info_vm").fadeIn();
|
||||
var vm_id = $(this).parents(".provision-pricing-table").attr("opennebula_id");
|
||||
Sunstone.runAction('Provision.show', vm_id);
|
||||
|
||||
var datatable_index = $(this).parents(".provision-pricing-table").attr("datatable_index");
|
||||
var aData = provision_vms_datatable.fnGetData(datatable_index);
|
||||
var data = aData.VM;
|
||||
var state = OpenNebula.Helper.resource_state("vm",data.STATE);
|
||||
var state_color;
|
||||
switch (state) {
|
||||
case tr("INIT"):
|
||||
case tr("PENDING"):
|
||||
case tr("HOLD"):
|
||||
state_color = 'warning';
|
||||
break;
|
||||
case tr("FAILED"):
|
||||
state_color = 'error';
|
||||
break;
|
||||
case tr("ACTIVE"):
|
||||
state_color = 'success';
|
||||
break;
|
||||
case tr("STOPPED"):
|
||||
case tr("SUSPENDED"):
|
||||
case tr("POWEROFF"):
|
||||
state_color = 'secondary';
|
||||
break;
|
||||
default:
|
||||
state_color = 'secondary';
|
||||
break;
|
||||
}
|
||||
|
||||
state_color= "success"
|
||||
var context = $("#provision_info_vm");
|
||||
$("#provision_info_vm_name", context).text(data.NAME);
|
||||
|
||||
$("#provision_info_vm_resume").html('<span class="secondary-color">'+
|
||||
'<i class="fa fa-fw fa-laptop"/> '+
|
||||
'x'+data.TEMPLATE.CPU+' - '+
|
||||
((data.TEMPLATE.MEMORY > 1000) ?
|
||||
(Math.floor(data.TEMPLATE.MEMORY/1024)+'GB') :
|
||||
(data.TEMPLATE.MEMORY+'MB'))+
|
||||
'  <i class="fa fa-fw fa-download"></i>'+
|
||||
'Ubuntu 12.04'+
|
||||
'  <i class="fa fa-fw fa-globe"/>'+
|
||||
'192.168.1.1'+
|
||||
'  <i class="fa fa-fw fa-clock-o"/>'+
|
||||
pretty_time_runtime(data.STIME)+
|
||||
'</span>');
|
||||
|
||||
$("#provision_info_vm_state").html('<span class="'+ state_color +'-color right">'+state+'</span>');
|
||||
|
||||
$("#provision_info_vm_state_hr").html('<div style="height:3px" class="'+state_color+'-bg">'+
|
||||
"</div>");
|
||||
|
||||
Sunstone.runAction("VM.monitor",data.ID, { monitor_resources : "CPU,MEMORY"});
|
||||
return false;
|
||||
})
|
||||
|
||||
$("#provision_info_vm").on("click", "#provision_snapshot_button", function(){
|
||||
$("#provision_confirm_action").html(
|
||||
'<div data-alert class="alert-box secondary radius">'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-12 columns">'+
|
||||
'<span style="font-size: 14px; line-height: 20px">'+
|
||||
'The main disk of the Virtual Machine will be saved in a new Image'+
|
||||
'</span>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<br>'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-9 columns">'+
|
||||
'<input type="text" id="provision_snapshot_name" placeholder="'+tr("Image Name")+'" style="height: 40px !important; font-size: 16px; padding: 0.5rem !important; margin: 0px"/>'+
|
||||
'</div>'+
|
||||
'<div class="large-3 columns">'+
|
||||
'<a href"#" id="provision_snapshot_create_button" class="success button large-12 radius right" style="margin-right: 15px">'+tr("Take Snapshot")+'</a>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<a href="#" class="close" style="top: 20px">×</a>'+
|
||||
'</div>');
|
||||
});
|
||||
|
||||
$("#provision_info_vm").on("click", "#provision_delete_confirm_button", function(){
|
||||
$("#provision_confirm_action").html(
|
||||
'<div data-alert class="alert-box secondary radius">'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-9 columns">'+
|
||||
'<span style="font-size: 14px; line-height: 20px">'+
|
||||
'This action will inmediately destroy the Virtual Machine and all the information will be lost.'+
|
||||
'</span>'+
|
||||
'</div>'+
|
||||
'<div class="large-3 columns">'+
|
||||
'<a href"#" id="provision_delete_button" class="alert button large-12 radius right" style="margin-right: 15px">'+tr("Delete")+'</a>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<a href="#" class="close">×</a>'+
|
||||
'</div>');
|
||||
});
|
||||
|
||||
$("#provision_info_vm").on("click", "#provision_shutdownhard_confirm_button", function(){
|
||||
$("#provision_confirm_action").html(
|
||||
'<div data-alert class="alert-box secondary radius">'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-9 columns">'+
|
||||
'<span style="font-size: 14px; line-height: 20px">'+
|
||||
'This action will inmediately destroy the Virtual Machine and all the information will be lost.'+
|
||||
'</span>'+
|
||||
'</div>'+
|
||||
'<div class="large-3 columns">'+
|
||||
'<a href"#" id="provision_shutdownhard_button" class="alert button large-12 radius right" style="margin-right: 15px">'+tr("Delete")+'</a>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<a href="#" class="close" style="top: 20px">×</a>'+
|
||||
'</div>');
|
||||
});
|
||||
|
||||
$("#provision_info_vm").on("click", "#provision_poweroff_confirm_button", function(){
|
||||
$("#provision_confirm_action").html(
|
||||
'<div data-alert class="alert-box secondary radius">'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-11 columns">'+
|
||||
'<span style="font-size: 14px; line-height: 20px">'+
|
||||
'This action will power off the given Virtual Machine.'+
|
||||
'<br>'+
|
||||
'The Virtual Machine will remain in the poweroff state, and can be powered on later'+
|
||||
'</span>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<br>'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-12 columns">'+
|
||||
'<a href"#" id="provision_poweroff_button" class="button radius right" style="margin-right: 15px">'+tr("Power off")+'</a>'+
|
||||
'<input type="radio" name="provision_poweroff_radio" value="poweroff_hard" id="provision_poweroff_hard_radio">'+
|
||||
'<label for="provision_poweroff_hard_radio">'+
|
||||
'<i class="fa fa-fw fa-bolt"/>'+tr("Power off the machine")+
|
||||
'</label>'+
|
||||
'<input type="radio" name="provision_poweroff_radio" value="poweroff" id="provision_poweroff_radio" checked>'+
|
||||
'<label for="provision_poweroff_radio">'+
|
||||
'<i class="fa fa-fw fa-power-off"/>'+tr("Send the power off signal")+
|
||||
'</label>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<a href="#" class="close" style="top: 20px">×</a>'+
|
||||
'</div>');
|
||||
});
|
||||
|
||||
$("#provision_info_vm").on("click", "#provision_reboot_confirm_button", function(){
|
||||
$("#provision_confirm_action").html(
|
||||
'<div data-alert class="alert-box secondary radius">'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-11 columns">'+
|
||||
'<span style="font-size: 14px; line-height: 20px">'+
|
||||
'This action will reboot the given Virtual Machine.'+
|
||||
'<br>'+
|
||||
'The Virtual Machine will be ungracefully rebooted, unless the reboot signal is sent. This is equivalent to execute the reboot commnand from the console'+
|
||||
'</span>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<br>'+
|
||||
'<div class="row">'+
|
||||
'<div class="large-12 columns">'+
|
||||
'<a href"#" id="provision_reboot_button" class="button radius right" style="margin-right: 15px">'+tr("Reboot")+'</a>'+
|
||||
'<input type="radio" name="provision_reboot_radio" value="reboot_hard" id="provision_reboot_hard_radio">'+
|
||||
'<label for="provision_reboot_hard_radio">'+
|
||||
'<i class="fa fa-fw fa-bolt"/>'+tr("Reboot the machine")+
|
||||
'</label>'+
|
||||
'<input type="radio" name="provision_reboot_radio" value="reboot" id="provision_reboot_radio" checked>'+
|
||||
'<label for="provision_reboot_radio">'+
|
||||
'<i class="fa fa-fw fa-power-off"/>'+tr("Send the reboot signal")+
|
||||
'</label>'+
|
||||
'</div>'+
|
||||
'</div>'+
|
||||
'<a href="#" class="close" style="top: 20px">×</a>'+
|
||||
'</div>');
|
||||
});
|
||||
|
||||
$("#provision_info_vm").on("click", "#provision_snapshot_create_button", function(){
|
||||
var context = $("#provision_info_vm");
|
||||
|
||||
var vm_id = context.attr("vm_id");
|
||||
var image_name = $('#provision_snapshot_name', context).val();
|
||||
|
||||
var obj = {
|
||||
disk_id : "0",
|
||||
image_name : image_name,
|
||||
type: "",
|
||||
hot: true
|
||||
};
|
||||
|
||||
Sunstone.runAction('Provision.saveas', vm_id, obj);
|
||||
});
|
||||
|
||||
$("#provision_info_vm").on("click", "#provision_delete_button", function(){
|
||||
var vm_id = $("#provision_info_vm").attr("vm_id");
|
||||
Sunstone.runAction('Provision.delete', vm_id);
|
||||
});
|
||||
|
||||
$("#provision_info_vm").on("click", "#provision_shutdownhard_button", function(){
|
||||
var vm_id = $("#provision_info_vm").attr("vm_id");
|
||||
Sunstone.runAction('Provision.shutdown_hard', vm_id);
|
||||
});
|
||||
|
||||
$("#provision_info_vm").on("click", "#provision_poweroff_button", function(){
|
||||
var vm_id = $("#provision_info_vm").attr("vm_id");
|
||||
var poweroff_action = $('input[name=provision_poweroff_radio]:checked').val()
|
||||
Sunstone.runAction('Provision.' + poweroff_action, vm_id);
|
||||
});
|
||||
|
||||
$("#provision_info_vm").on("click", "#provision_reboot_button", function(){
|
||||
var vm_id = $("#provision_info_vm").attr("vm_id");
|
||||
var reboot_action = $('input[name=provision_reboot_radio]:checked').val()
|
||||
Sunstone.runAction('Provision.' + reboot_action, vm_id);
|
||||
});
|
||||
|
||||
$("#provision_info_vm").on("click", "#provision_poweron_button", function(){
|
||||
var vm_id = $("#provision_info_vm").attr("vm_id");
|
||||
Sunstone.runAction('Provision.resume', vm_id);
|
||||
});
|
||||
|
||||
$("#provision_info_vm").on("click", "#provision_vnc_button", function(){
|
||||
var vm_id = $("#provision_info_vm").attr("vm_id");
|
||||
Sunstone.runAction('Provision.startvnc', vm_id);
|
||||
});
|
||||
|
||||
$("#provision_info_vm").on("click", "#provision_refresh_info", function(){
|
||||
$(".section_content").hide();
|
||||
$("#provision_info_vm").fadeIn();
|
||||
var vm_id = $("#provision_info_vm").attr("vm_id");
|
||||
Sunstone.runAction('Provision.show', vm_id);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
@ -1032,6 +1032,42 @@ function pretty_time_runtime(time){
|
||||
return day + "d " + hour + "h " + mins + "m ";
|
||||
}
|
||||
|
||||
function _format_date(unix_timestamp) {
|
||||
var difference_in_seconds = (Math.round((new Date()).getTime() / 1000)) - unix_timestamp,
|
||||
current_date = new Date(unix_timestamp * 1000), minutes, hours,
|
||||
months = new Array(
|
||||
'January','February','March','April','May',
|
||||
'June','July','August','September','October',
|
||||
'November','December');
|
||||
|
||||
if(difference_in_seconds < 60) {
|
||||
return difference_in_seconds + " second" + _plural(difference_in_seconds) + " ago";
|
||||
} else if (difference_in_seconds < 60*60) {
|
||||
minutes = Math.floor(difference_in_seconds/60);
|
||||
return minutes + " minute" + _plural(minutes) + " ago";
|
||||
} else if (difference_in_seconds < 60*60*24) {
|
||||
hours = Math.floor(difference_in_seconds/60/60);
|
||||
return hours + " hour" + _plural(hours) + " ago";
|
||||
} else if (difference_in_seconds > 60*60*24){
|
||||
if(current_date.getYear() !== new Date().getYear())
|
||||
return current_date.getDay() + " " + months[current_date.getMonth()].substr(0,3) + " " + _fourdigits(current_date.getYear());
|
||||
else {
|
||||
return current_date.getDay() + " " + months[current_date.getMonth()].substr(0,3);
|
||||
}
|
||||
}
|
||||
|
||||
return difference_in_seconds;
|
||||
|
||||
function _fourdigits(number) {
|
||||
return (number < 1000) ? number + 1900 : number;}
|
||||
|
||||
function _plural(number) {
|
||||
if(parseInt(number) === 1) {
|
||||
return "";
|
||||
}
|
||||
return "s";
|
||||
}
|
||||
}
|
||||
//returns a human readable size in Kilo, Mega, Giga or Tera bytes
|
||||
//if no from_bytes, assumes value comes in Ks
|
||||
function humanize_size(value,from_bytes,sufix) {
|
||||
@ -1743,14 +1779,27 @@ function plot_graph(response, info) {
|
||||
xaxis : {
|
||||
tickFormatter: function(val,axis){
|
||||
return pretty_time_axis(val, info.show_date);
|
||||
}
|
||||
},
|
||||
color: "#999",
|
||||
size: 8
|
||||
},
|
||||
yaxis : { labelWidth: 50,
|
||||
tickFormatter: function(val, axis) {
|
||||
return humanize(val, info.convert_from_bytes, info.y_sufix);
|
||||
},
|
||||
min: 0
|
||||
}
|
||||
min: 0,
|
||||
color: "#999",
|
||||
size: 8
|
||||
},
|
||||
series: {
|
||||
lines: {
|
||||
lineWidth: 1
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
borderWidth: 1,
|
||||
borderColor: "#cfcfcf"
|
||||
}
|
||||
};
|
||||
|
||||
$.plot(info.div_graph, series, options);
|
||||
|
||||
@ -51,8 +51,9 @@ $body-font-family: "Open Sans", sans-serif;
|
||||
// $default-float: left;
|
||||
|
||||
// We use these as default colors throughout
|
||||
//$primary-color: #2ba6cb;
|
||||
$primary-color: #0099c3;
|
||||
$secondary-color: #F5F5F5;
|
||||
$secondary-color: #f7f7f7;
|
||||
// $alert-color: #f04124;
|
||||
// $success-color: #43AC6A;
|
||||
// $warning-color: #f08a24;
|
||||
@ -249,7 +250,7 @@ $h3-font-size: rem-calc(24);
|
||||
// We use these to control border styles.
|
||||
// $alert-border-style: solid;
|
||||
// $alert-border-width: 1px;
|
||||
// $alert-border-color: scale-color($primary-color, $lightness: $alert-function-factor);
|
||||
$alert-border-color: #dfdfdf;
|
||||
// $alert-bottom-margin: rem-calc(20);
|
||||
|
||||
// We use these to style the close buttons
|
||||
@ -762,13 +763,13 @@ $fieldset-padding: rem-calc(20);
|
||||
// $include-html-panel-classes: $include-html-classes;
|
||||
|
||||
// We use these to control the background and border styles
|
||||
// $panel-bg: scale-color(#fff, $lightness: -5%);
|
||||
$panel-bg: #f7f7f7;
|
||||
// $panel-border-style: solid;
|
||||
// $panel-border-size: 1px;
|
||||
|
||||
// We use this % to control how much we darken things on hover
|
||||
// $panel-function-factor: -11%;
|
||||
// $panel-border-color: scale-color($panel-bg, $lightness: $panel-function-factor);
|
||||
$panel-border-color: #dfdfdf;
|
||||
|
||||
// We use these to set default inner padding and bottom margin
|
||||
// $panel-margin-bottom: rem-calc(20);
|
||||
@ -786,13 +787,13 @@ $fieldset-padding: rem-calc(20);
|
||||
// $include-html-pricing-classes: $include-html-classes;
|
||||
|
||||
// We use this to control the border color
|
||||
$price-table-border: 1px solid #efefef;
|
||||
$price-table-border: 1px solid #dfdfdf;
|
||||
|
||||
// We use this to control the bottom margin of the pricing table
|
||||
$price-table-margin-bottom: rem-calc(0);
|
||||
|
||||
// We use these to control the title styles
|
||||
$price-title-bg: #f6f6f6;
|
||||
$price-title-bg: #f7f7f7;
|
||||
$price-title-padding: rem-calc(10);
|
||||
// $price-title-align: center;
|
||||
$price-title-color: #555;
|
||||
@ -820,7 +821,7 @@ $price-desc-padding: rem-calc(10);
|
||||
$price-desc-bottom-border: none;
|
||||
|
||||
// We use these to control the list item styles
|
||||
$price-bg: #f6f6f6;
|
||||
$price-bg: #f7f7f7;
|
||||
$price-item-color: #777;
|
||||
$price-item-padding: rem-calc(5);
|
||||
// $price-item-align: center;
|
||||
|
||||
@ -281,6 +281,8 @@ select {
|
||||
|
||||
.has-tip {
|
||||
margin-left: 10px;
|
||||
color: #555;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
// Totals
|
||||
@ -647,7 +649,7 @@ div.dataTables_scrollFoot table {
|
||||
@include pricing-table-title;
|
||||
|
||||
font-weight: normal;
|
||||
color: #0099c3;
|
||||
color: #333;
|
||||
}
|
||||
.provision-price {
|
||||
@include pricing-table-price;
|
||||
@ -666,10 +668,10 @@ div.dataTables_scrollFoot table {
|
||||
-moz-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
|
||||
background: #f6f6f6;
|
||||
background: #f7f7f7;
|
||||
|
||||
li {
|
||||
background: none;
|
||||
background: none !important;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
@ -677,17 +679,25 @@ div.dataTables_scrollFoot table {
|
||||
&.hoverable:not(.selected):hover {
|
||||
|
||||
li:not(.provision-title) {
|
||||
background: scale-color(#fff, $lightness: -10%) !important;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
li {
|
||||
color: #333;
|
||||
background: scale-color(#fff, $lightness: -10%) !important;
|
||||
}
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
&:not(.selected):hover {
|
||||
border-color: #cfcfcf !important;
|
||||
|
||||
.provision-title {
|
||||
color: $primary-color !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.selected {
|
||||
//border: 1px solid #0099c3;
|
||||
|
||||
@ -709,35 +719,44 @@ div.dataTables_scrollFoot table {
|
||||
|
||||
}
|
||||
|
||||
.warning-bg {
|
||||
background-color: scale-color($warning-color, $lightness:50%) !important;
|
||||
.deploying-bg {
|
||||
background-color: #C7731F !important;
|
||||
}
|
||||
|
||||
.error-bg {
|
||||
background-color: scale-color($alert-color, $lightness:50%) !important;
|
||||
}
|
||||
|
||||
.secondary-bg {
|
||||
background-color: scale-color($secondary-color, $lightness:50%) !important;
|
||||
}
|
||||
|
||||
.success-bg {
|
||||
background-color: scale-color($success-color, $lightness:50%) !important;
|
||||
background-color: #cf280e !important;
|
||||
}
|
||||
|
||||
|
||||
.warning-color {
|
||||
color: $warning-color;
|
||||
.powering_off-bg {
|
||||
background-color: #cf280e !important;
|
||||
}
|
||||
|
||||
.off-bg {
|
||||
background-color: #999;
|
||||
}
|
||||
|
||||
.running-bg {
|
||||
background-color: #368a54 !important;
|
||||
}
|
||||
|
||||
|
||||
.deploying-color {
|
||||
color: #C7731F;
|
||||
}
|
||||
|
||||
.error-color {
|
||||
color: $alert-color;
|
||||
color: #cf280e;
|
||||
}
|
||||
|
||||
.secondary-color {
|
||||
.powering_off-color {
|
||||
color: #cf280e;
|
||||
}
|
||||
|
||||
.off-color {
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.success-color {
|
||||
color: $success-color;
|
||||
.running-color {
|
||||
color: #368a54;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user