1
0
mirror of https://github.com/OpenNebula/one.git synced 2025-03-25 02:50:08 +03:00

Sunstone small fixes and corrections:

This commit performs several small changes all around Sunstone:

 * Unify list bullets
 * Increase menu indentation to fit better with new menu icons (ozones and selfservice too)
 * Reduce tab headers width and include icon (took too much space on small screens)
 * Fix action drop down list gradient to work with opera and other browsers (or fallback to a color)
 * Do not attempt to plot empty series, instead inform that no monitoring is available: cover the case when no resources exist.
 * Remove unused, commented code
 * Fix individual host and VM monitoring information divs width, so no scrollbar appears.
 * Update documentation links to point to latest available documentation
 * Fix hotplugging tab width
(cherry picked from commit cb4afbc091d124fa330351eb87b3ca1e1e851acc)
This commit is contained in:
Hector Sanjuan 2012-06-25 15:17:07 +02:00 committed by Ruben S. Montero
parent 18c41da670
commit a708ffb5f5
25 changed files with 142 additions and 334 deletions

View File

@ -115,6 +115,11 @@ div.panel_info table.info_table td.value_td {
text-align: right;
}
div.panel_info ul {
list-style: circle;
margin-left: 25px;
}
.green {
color: green!important;
}

View File

@ -136,14 +136,14 @@ body {
line-height: 1.8em;
font-size: 12px;
text-align: left;
padding-left: 30px;
padding-left: 45px;
}
.navigation li.subsubTab {
line-height: 1.7em;
font-size: 11px;
text-align: left;
padding-left: 40px;
padding-left: 55px;
}
.navigation li.topTab span.plusIcon,

View File

@ -115,6 +115,11 @@ div.panel_info table.info_table td.value_td {
text-align: right;
}
div.panel_info ul {
list-style: circle;
margin-left: 25px;
}
.green {
color: green!important;
}

View File

@ -133,14 +133,14 @@ body {
line-height: 1.8em;
font-size: 12px;
text-align: left;
padding-left: 30px;
padding-left: 40px;
}
.navigation li.subsubTab {
line-height: 1.7em;
font-size: 11px;
text-align: left;
padding-left: 40px;
padding-left: 33px;
}
.navigation li.topTab span.plusIcon,

View File

@ -42,9 +42,10 @@ h2 {
margin-bottom: 2px;
margin-top: 8px;
padding-bottom: 2px;
width:400px;
width:280px;
minWidth: 200px;
color: #636663;
border-bottom: 3px solid;
border-bottom: 2px solid;
}
h3 {
@ -140,6 +141,11 @@ div.panel_info table.info_table td.value_td {
text-align: right;
}
div.panel_info ul {
list-style: circle;
margin-left: 25px;
}
.green {
color: green!important;
}
@ -548,18 +554,6 @@ ul.action_list{
/*background: #EDEDED;*/
border: 1px solid #525252;
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.25, #E9E9E9),
color-stop(0.63, #F5F5F5)
);
background-image: -moz-linear-gradient(
center bottom,
#E9E9E9 25%,
#F5F5F5 63%
);
position:absolute;
z-index:1;
list-style-type:none;
@ -574,6 +568,15 @@ ul.action_list{
border-radius:4px;
border-bottom-right-radius:5px;
border-bottom-left-radius:5px;
background: rgb(233,233,233); /* Old browsers */
background: -moz-linear-gradient(top, rgba(233,233,233,1) 25%, rgba(245,245,245,1) 63%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,rgba(233,233,233,1)), color-stop(63%,rgba(245,245,245,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(233,233,233,1) 25%,rgba(245,245,245,1) 63%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(233,233,233,1) 25%,rgba(245,245,245,1) 63%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(233,233,233,1) 25%,rgba(245,245,245,1) 63%); /* IE10+ */
background: linear-gradient(top, rgba(233,233,233,1) 25%,rgba(245,245,245,1) 63%); /* W3C */
}
ul.action_list li a{
@ -654,7 +657,8 @@ ul.action_list li a:hover{
}
.legend_p:before {
content: '⇨ ';
/* content: '⇨ '; */
content: '○ ';
}
.big_text {

View File

@ -141,14 +141,14 @@ body {
line-height: 1.8em;
font-size: 12px;
text-align: left;
padding-left: 30px;
padding-left: 45px;
}
.navigation li.subsubTab {
line-height: 1.7em;
font-size: 11px;
text-align: left;
padding-left: 40px;
padding-left: 55px;
}
.navigation li.topTab span.plusIcon,

View File

@ -37,7 +37,14 @@ var SunstoneMonitoring = {
plot : function(resource,plotID,container,series){
var config = SunstoneMonitoringConfig[resource].monitor[plotID]
var options = config.plotOptions
$.plot(container,series,options)
if (!series.length){
$(container).unbind();
$(container).text(tr("No monitoring information available"));
}
else {
$.plot(container,series,options)
}
},
ops : {
partition : function(resource,list,config){
@ -95,7 +102,7 @@ var SunstoneMonitoring = {
return series
},
hostCpuUsagePartition : function(resource,list,config){
partitions = {
var partitions = {
"Idle" : 0,
"Ok" : 0,
"Used" : 0,
@ -103,6 +110,8 @@ var SunstoneMonitoring = {
"Overloaded" : 0
}
if (!list.length) return [];
for (var i=0; i< list.length; i++){
var elem = list[i][resource]
var value = elem.HOST_SHARE.USED_CPU * 100 /
@ -119,7 +128,7 @@ var SunstoneMonitoring = {
partitions["Idle"]++
}
series = [];
var series = [];
for (partition in partitions) {
var data = partitions[partition]
var color = config.colorize ? config.colorize(partition) : null

View File

@ -482,9 +482,6 @@ var OpenNebula = {
"monitor" : function(params){
OpenNebula.Action.monitor(params,OpenNebula.Host.resource,false);
},
"monitor_all" : function(params){
OpenNebula.Action.monitor(params,OpenNebula.Host.resource,true);
}
},
"Network": {
@ -677,9 +674,6 @@ var OpenNebula = {
"monitor" : function(params){
OpenNebula.Action.monitor(params,OpenNebula.VM.resource,false);
},
"monitor_all" : function(params){
OpenNebula.Action.monitor(params,OpenNebula.VM.resource,true);
},
"attachdisk" : function(params){
var action_obj = {"disk_template": params.data.extra_param};
OpenNebula.Action.simple_action(params,OpenNebula.VM.resource,

View File

@ -19,7 +19,7 @@ var dataTable_acls;
var $create_acl_dialog;
var acls_tab_content = '\
<h2>'+tr("Access Control Lists")+'</h2>\
<h2><i class="icon-key"></i> '+tr("Access Control Lists")+'</h2>\
<form id="acl_form" action="" action="javascript:alert(\'js error!\');">\
<div class="action_blocks">\
</div>\

View File

@ -18,7 +18,7 @@
var clusters_tab_content = '\
<h2>'+tr("Clusters")+'</h2>\
<h2><i class="icon-copy"></i> '+tr("Clusters")+'</h2>\
<form id="form_cluters" action="javascript:alert(\'js errors?!\')">\
<div class="action_blocks">\
</div>\
@ -496,8 +496,8 @@ function clusterTabContent(cluster_json) {
<td class="key_td">' + tr("Hosts CPU Usage") + '</td>\
</tr>\
<tr>\
<td colspan="2"><div id="globalCpuUsage'+cluster.ID+'" style="float:left;width:50%;height:100px;"></div>\
<div id="statePie'+cluster.ID+'" style="float:right;width:50%;height:100px;"></div></td>\
<td colspan="2"><div id="statePie'+cluster.ID+'" style="float:left;width:50%;height:100px;"></div>\
<div id="globalCpuUsage'+cluster.ID+'" style="float:right;width:50%;height:100px;"></div></td>\
</tr>\
\
<tr>\
@ -534,10 +534,11 @@ function clusterTabContent(cluster_json) {
<div class="panel">\
<h3>' + tr("Hosts") + '</h3>\
<div class="panel_info">\
<br />\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#hosts_tab" value="Host.create_dialog">'+tr("Create new host")+'</a><br />\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="show_tab_button" filter_id="'+cluster.ID+'" href="#hosts_tab">'+tr("Manage unclustered hosts")+'</a><br /></p>\
\
<ul>\
<li><a class="action_button" href="#hosts_tab" value="Host.create_dialog">'+tr("Create new host")+'</a></li>\
<li><a class="action_button" href="#hosts_tab" value="Host.create_dialog">'+tr("Create new host")+'</a></li>\
<li><a class="show_tab_button" filter_id="'+cluster.ID+'" href="#hosts_tab">'+tr("Manage unclustered hosts")+'</a></li>\
</ul>\
</div>\
</td>\
</tr>\
@ -546,9 +547,10 @@ function clusterTabContent(cluster_json) {
<div class="panel">\
<h3>' + tr("Datastores") + '</h3>\
<div class="panel_info">\
<br />\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#datastores_tab" value="Datastore.create_dialog">'+tr("Create new datastore")+'</a><br />\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="show_tab_button" filter_id="'+cluster.ID+'" href="#datastores_tab">'+tr("Manage unclustered datastores")+'</a><br /></p>\
<ul>\
<li><a class="action_button" href="#datastores_tab" value="Datastore.create_dialog">'+tr("Create new datastore")+'</a></li>\
<li><a class="show_tab_button" filter_id="'+cluster.ID+'" href="#datastores_tab">'+tr("Manage unclustered datastores")+'</a></li>\
</ul>\
</div>\
</div>\
</td>\
@ -558,9 +560,10 @@ function clusterTabContent(cluster_json) {
<div class="panel">\
<h3>' + tr("Virtual Networks") + '</h3>\
<div class="panel_info">\
<br />\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#vnets_tab" value="Network.create_dialog">'+tr("Create new virtual network")+'</a><br />\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="show_tab_button" filter_id="'+cluster.ID+'" href="#vnets_tab">'+tr("Manage unclustered virtual networks")+'</a><br /></p>\
<ul>\
<li><a class="action_button" href="#vnets_tab" value="Network.create_dialog">'+tr("Create new virtual network")+'</a></li>\
<li><a class="show_tab_button" filter_id="'+cluster.ID+'" href="#vnets_tab">'+tr("Manage unclustered virtual networks")+'</a></li>\
</ul>\
</div>\
</div>\
</td>\
@ -599,8 +602,9 @@ function clusterTabContent(cluster_json) {
<td class="key_td">' + tr("Hosts CPU Usage") + '</td>\
</tr>\
<tr>\
<td colspan="2"><div id="globalCpuUsage'+cluster.ID+'" style="float:left;width:50%;height:100px;"></div>\
<div id="statePie'+cluster.ID+'" style="float:right;width:50%;height:100px;"></div></td>\
<td colspan="2">\
<div id="statePie'+cluster.ID+'" style="float:left;width:50%;height:100px;">'+tr("No monitoring information available")+'</div>\
<div id="globalCpuUsage'+cluster.ID+'" style="float:right;width:50%;height:100px;">'+tr("No monitoring information available")+'</div></td>\
</tr>\
\
<tr>\
@ -639,8 +643,9 @@ function clusterTabContent(cluster_json) {
<div class="panel_info">\
\
<p><br />'+tr("Current number of hosts in this cluster")+': '+hosts_n+'.</p><p>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#hosts_tab" value="Host.create_dialog">'+tr("Create new host")+'</a><br />\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="show_tab_button" filter_id="'+cluster.ID+'" href="#hosts_tab">'+tr("Manage cluster hosts")+'</a><br /></p>\
<ul>\
<li><a class="action_button" href="#hosts_tab" value="Host.create_dialog">'+tr("Create new host")+'</a></li>\
<li><a class="show_tab_button" filter_id="'+cluster.ID+'" href="#hosts_tab">'+tr("Manage cluster hosts")+'</a></li>\
\
</div>\
</td>\
@ -653,8 +658,10 @@ function clusterTabContent(cluster_json) {
\
<p><br />'+tr("Current number of datastores in this cluster")+': '+dss_n+'.</p><p>\
\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#datastores_tab" value="Datastore.create_dialog">'+tr("Create new datastore")+'</a><br />\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="show_tab_button" filter_id="'+cluster.ID+'" href="#datastores_tab">'+tr("Manage cluster datastores")+'</a><br /></p>\
<ul>\
<li><a class="action_button" href="#datastores_tab" value="Datastore.create_dialog">'+tr("Create new datastore")+'</a></li>\
<li><a class="show_tab_button" filter_id="'+cluster.ID+'" href="#datastores_tab">'+tr("Manage cluster datastores")+'</a></li>\
</ul>\
</div>\
</div>\
</td>\
@ -667,8 +674,10 @@ function clusterTabContent(cluster_json) {
\
<p><br />'+tr("Current number of virtual networks in this cluster")+': '+vnets_n+'.</p><p>\
\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#vnets_tab" value="Network.create_dialog">'+tr("Create new virtual network")+'</a><br />\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="show_tab_button" filter_id="'+cluster.ID+'" href="#vnets_tab">'+tr("Manage cluster virtual networks")+'</a><br /></p>\
<ul>\
<li><a class="action_button" href="#vnets_tab" value="Network.create_dialog">'+tr("Create new virtual network")+'</a></li>\
<li><a class="show_tab_button" filter_id="'+cluster.ID+'" href="#vnets_tab">'+tr("Manage cluster virtual networks")+'</a></li>\
</ul>\
</div>\
</div>\
</td>\
@ -754,10 +763,6 @@ function newClusterMenuElement(element){
};
*/
Sunstone.addMainTab('cluster_tab_'+cluster.ID,menu_cluster,true);
$('li#li_cluster_tab_'+cluster.ID).click(function(){
$('div#cluster_tab_'+cluster.ID+' div.plot').trigger('resize');
});
// Sunstone.addMainTab('cluster_hosts_tab_'+cluster.ID,submenu_hosts,true);
// Sunstone.addMainTab('cluster_datastores_tab_'+cluster.ID,submenu_datastores,true);
@ -813,118 +818,6 @@ function clusterResourceViewListeners(){
*/
};
/*
//Updates the host info panel tab content and pops it up
function updateHostInfo(request,host){
var host_info = host.HOST;
//Information tab
var info_tab = {
title : tr("Host information"),
content :
'<table id="info_host_table" class="info_table">\
<thead>\
<tr><th colspan="2">' + tr("Host information") + ' - '+host_info.NAME+'</th></tr>\
</thead>\
<tbody>\
<tr>\
<td class="key_td">' + tr("id") + '</td>\
<td class="value_td">'+host_info.ID+'</td>\
</tr>\
<tr>\
<td class="key_td">' + tr("Name") + '</td>\
<td class="value_td">'+host_info.NAME+'</td>\
</tr>\
<tr>\
<td class="key_td">' + tr("Cluster") + '</td>\
<td class="value_td">'+host_info.CLUSTER+'</td>\
</tr>\
<tr>\
<td class="key_td">' + tr("State") + '</td>\
<td class="value_td">'+tr(OpenNebula.Helper.resource_state("host",host_info.STATE))+'</td>\
</tr>\
<tr>\
<td class="key_td">' + tr("IM MAD") + '</td>\
<td class="value_td">'+host_info.IM_MAD+'</td>\
</tr>\
<tr>\
<td class="key_td">' + tr("VM MAD") + '</td>\
<td class="value_td">'+host_info.VM_MAD+'</td>\
</tr>\
<tr>\
<td class="key_td">'+ tr("VN MAD") +'</td>\
<td class="value_td">'+host_info.VN_MAD+'</td>\
</tr>\
<tr>\
<td class="key_td">'+ tr("TM MAD") +'</td>\
<td class="value_td">'+host_info.TM_MAD+'</td>\
</tr>\
</tbody>\
</table>\
<table id="host_shares_table" class="info_table">\
<thead>\
<tr><th colspan="2">' + tr("Host shares") + '</th></tr>\
</thead>\
<tbody>\
<tr>\
<td class="key_td">' + tr("Max Mem") + '</td>\
<td class="value_td">'+humanize_size(host_info.HOST_SHARE.MAX_MEM)+'</td>\
</tr>\
<tr>\
<td class="key_td">' + tr("Used Mem (real)") + '</td>\
<td class="value_td">'+humanize_size(host_info.HOST_SHARE.USED_MEM)+'</td>\
</tr>\
<tr>\
<td class="key_td">' + tr("Used Mem (allocated)") + '</td>\
<td class="value_td">'+humanize_size(host_info.HOST_SHARE.MAX_USAGE)+'</td>\
</tr>\
<tr>\
<td class="key_td">' + tr("Used CPU (real)") + '</td>\
<td class="value_td">'+host_info.HOST_SHARE.USED_CPU+'</td>\
</tr>\
<tr>\
<td class="key_td">' + tr("Used CPU (allocated)") + '</td>\
<td class="value_td">'+host_info.HOST_SHARE.CPU_USAGE+'</td>\
</tr>\
<tr>\
<td class="key_td">' + tr("Running VMs") + '</td>\
<td class="value_td">'+host_info.HOST_SHARE.RUNNING_VMS+'</td>\
</tr>\
</tbody>\
</table>'
}
//Template tab
var template_tab = {
title : tr("Host template"),
content :
'<table id="host_template_table" class="info_table" style="width:80%">\
<thead><tr><th colspan="2">' + tr("Host template") + '</th></tr></thead>'+
prettyPrintJSON(host_info.TEMPLATE)+
'</table>'
}
var monitor_tab = {
title: tr("Monitoring information"),
content : generateMonitoringDivs(host_graphs,"host_monitor_")
}
//Sunstone.updateInfoPanelTab(info_panel_name,tab_name, new tab object);
Sunstone.updateInfoPanelTab("host_info_panel","host_info_tab",info_tab);
Sunstone.updateInfoPanelTab("host_info_panel","host_template_tab",template_tab);
Sunstone.updateInfoPanelTab("host_info_panel","host_monitoring_tab",monitor_tab);
Sunstone.popUpInfoPanel("host_info_panel");
//pop up panel while we retrieve the graphs
for (var i=0; i<host_graphs.length; i++){
Sunstone.runAction("Host.monitor",host_info.ID,host_graphs[i]);
};
}
*/
//Prepares the host creation dialog
function setupCreateClusterDialog(){
dialogs_context.append('<div title=\"'+tr("Create cluster")+'\" id="create_cluster_dialog"></div>');
@ -968,7 +861,15 @@ function popUpCreateClusterDialog(){
}
function monitorClusters(list){
clustered_hosts = {}
var clustered_hosts = { "-" : []}
//extract current clusters from table
//and initialize the object in which hosts will be divided
var cluster_list = dataTable_clusters.fnGetData();
$.each(cluster_list,function(){
clustered_hosts[this[1]] = []
});
for (var i = 0; i < list.length; i++){
var cluster_id = list[i].HOST.CLUSTER_ID;
if (!clustered_hosts[cluster_id])

View File

@ -188,53 +188,6 @@ Sunstone.addMainTab('dashboard_tab',dashboard_tab);
var $dashboard;
function plot_global_graph(data,info){
var context = $('#historical_table',main_tabs_context);
var id = info.title;
var monitoring = data.monitoring;
var serie;
var series = [];
var width = ($(window).width()-129)*48/100;
var mon_count = 0;
var labels_array = info.monitor_resources.split(',');
$('#'+id,context).html('<div id="'+id+'_graph" style="height:70px;width:'+width+'px;margin-bottom:10px;"><div>');
for (var i=0; i<labels_array.length; i++) {
serie = {
label: tr(labels_array[i]),
data: monitoring[labels_array[i]]
};
series.push(serie);
mon_count++;
};
var options = {
legend : {
show : true,
noColumns: mon_count,
container: $('#'+id+'_legend')
},
xaxis : {
tickFormatter: function(val,axis){
return pretty_time_axis(val);
},
},
yaxis : { labelWidth: 20 }
}
switch (id){
case "graph2":
case "graph4":
options["yaxis"]["tickFormatter"] = function(val,axis) {
return humanize_size(val);
}
}
$.plot($('#'+id+'_graph',context),series,options);
}
$(document).ready(function(){
$dashboard = $('#dashboard_tab', main_tabs_context);
});

View File

@ -128,53 +128,6 @@ Sunstone.addMainTab('dashboard_tab',dashboard_tab);
var $dashboard;
function plot_global_graph(data,info){
var context = $('#historical_table',main_tabs_context);
var id = info.title;
var monitoring = data.monitoring;
var serie;
var series = [];
var width = ($(window).width()-129)*48/100;
var mon_count = 0;
var labels_array = info.monitor_resources.split(',');
$('#'+id,context).html('<div id="'+id+'_graph" style="height:70px;width:'+width+'px;margin-bottom:10px;"><div>');
for (var i=0; i<labels_array.length; i++) {
serie = {
label: tr(labels_array[i]),
data: monitoring[labels_array[i]]
};
series.push(serie);
mon_count++;
};
var options = {
legend : {
show : true,
noColumns: mon_count,
container: $('#'+id+'_legend')
},
xaxis : {
tickFormatter: function(val,axis){
return pretty_time_axis(val);
},
},
yaxis : { labelWidth: 20 }
}
switch (id){
case "graph2":
case "graph4":
options["yaxis"]["tickFormatter"] = function(val,axis) {
return humanize_size(val);
}
}
$.plot($('#'+id+'_graph',context),series,options);
}
$(document).ready(function(){
$dashboard = $('#dashboard_tab', main_tabs_context);
});

View File

@ -18,7 +18,7 @@
var datastores_tab_content = '\
<h2>'+tr("Datastores")+'</h2>\
<h2><i class="icon-folder-open"></i> '+tr("Datastores")+'</h2>\
<form id="form_datastores" action="javascript:alert(\'js errors?!\')">\
<div class="action_blocks">\
</div>\

View File

@ -20,7 +20,7 @@ var $create_group_dialog;
var $group_quotas_dialog;
var groups_tab_content = '\
<h2>'+tr("Groups")+'</h2>\
<h2><i class="icon-group"></i> '+tr("Groups")+'</h2>\
<form id="group_form" action="" action="javascript:alert(\'js error!\');">\
<div class="action_blocks">\
</div>\

View File

@ -34,7 +34,7 @@ var host_graphs = [
var hosts_tab_content = '\
<h2>'+tr("Hosts")+'</h2>\
<h2><i class="icon-hdd"></i> '+tr("Hosts")+'</h2>\
<form id="form_hosts" action="javascript:alert(\'js errors?!\')">\
<div class="action_blocks">\
</div>\
@ -237,16 +237,6 @@ var host_actions = {
error: hostMonitorError
},
"Host.monitor_all" : {
type: "monitor_global",
call: OpenNebula.Host.monitor_all,
callback: function(req,response) {
var info = req.request.data[0].monitor;
plot_global_graph(response,info);
},
error: onError
},
"Host.fetch_template" : {
type: "single",
call: OpenNebula.Host.fetch_template,
@ -378,7 +368,7 @@ SunstoneMonitoringConfig['HOST'] = {
$('#totalHosts', $dashboard).text(monitoring['totalHosts'])
delete monitoring['totalHosts']
if (!$dashboard.is(':visible')) return;
//if (!$dashboard.is(':visible')) return;
for (plotID in monitoring){
var container = $('div#'+plotID,$dashboard);

View File

@ -17,7 +17,7 @@
/*Images tab plugin*/
var images_tab_content = '\
<h2>'+tr("Images")+'</h2>\
<h2><i class="icon-upload"></i> '+tr("Images")+'</h2>\
<form id="image_form" action="" action="javascript:alert(\'js error!\');">\
<div class="action_blocks">\
</div>\

View File

@ -53,12 +53,12 @@ var infra_tab_content =
<div class="panel">\
<h3>' + tr("Quickstart") + '</h3>\
<div class="panel_info dashboard_p">\
<p></br>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon cluster_related" /><a class="action_button cluster_related" href="#clusters_tab" value="Cluster.create_dialog">'+tr("Create new Cluster")+'</a></br>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#hosts_tab" value="Host.create_dialog">'+tr("Create new Host")+'</a></br>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#datastores_tab" value="Datastore.create_dialog">'+tr("Create new Datastore")+'</a></br>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#vnets_tab" value="Network.create_dialog">'+tr("Create new Virtual Network")+'</a></br>\
</p>\
<ul>\
<li><a class="action_button cluster_related" href="#clusters_tab" value="Cluster.create_dialog">'+tr("Create new Cluster")+'</a></li>\
<li><a class="action_button" href="#hosts_tab" value="Host.create_dialog">'+tr("Create new Host")+'</a></li>\
<li><a class="action_button" href="#datastores_tab" value="Datastore.create_dialog">'+tr("Create new Datastore")+'</a></li>\
<li><a class="action_button" href="#vnets_tab" value="Network.create_dialog">'+tr("Create new Virtual Network")+'</a></li>\
</ul>\
</div>\
</div>\
</td>\
@ -75,10 +75,10 @@ var infra_tab_content =
<p><img src="images/network_icon.png" style="float:right;" alt="network icon"/>'+tr("The Infrastructure menu allows management of Hosts, Datastores, Virtual Networks. Users in the oneadmin group can manage clusters as well.")+'</p>\
<p>'+tr("You can find further information on the following links:")+'</p>\
<ul>\
<li><a href="http://opennebula.org/documentation:rel3.4:hostsubsystem" target="_blank">Host subsystem</a></li>\
<li><a href="http://opennebula.org/documentation:rel3.4:host_guide" target="_blank">Managing Hosts</a></li>\
<li><a href="http://opennebula.org/documentation:rel3.4:nm" target="_blank">Networking subsystem</a></li>\
<li><a href="http://opennebula.org/documentation:rel3.4:cluster_guide" target="_blank">Managing Clusters</a></li>\
<li><a href="http://opennebula.org/documentation:documentation:hostsubsystem" target="_blank">Host subsystem</a></li>\
<li><a href="http://opennebula.org/documentation:documentation:host_guide" target="_blank">Managing Hosts</a></li>\
<li><a href="http://opennebula.org/documentation:documentation:nm" target="_blank">Networking subsystem</a></li>\
<li><a href="http://opennebula.org/documentation:documentation:cluster_guide" target="_blank">Managing Clusters</a></li>\
</ul>\
</div>\
</div>\

View File

@ -129,7 +129,7 @@ var market_buttons = {
};
var marketplace_tab_content = '\
<h2>'+tr("OpenNebula Marketplace")+'</h2>\
<h2><i class="icon-shopping-cart"></i> '+tr("OpenNebula Marketplace")+'</h2>\
<form id="marketplace_form" action="" action="javascript:alert(\'js error!\');">\
<div class="action_blocks">\
</div>\

View File

@ -49,11 +49,11 @@ var system_tab_content =
<div class="panel">\
<h3>' + tr("Quickstart") + '</h3>\
<div class="panel_info dashboard_p">\
<p></br>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#groups_tab" value="Group.create_dialog">'+tr("Create new Group")+'</a></br>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#users_tab" value="User.create_dialog">'+tr("Create new User")+'</a></br>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#acls_tab" value="Acl.create_dialog">'+tr("Create new ACL")+'</a></br>\
</p>\
<ul>\
<li><a class="action_button" href="#groups_tab" value="Group.create_dialog">'+tr("Create new Group")+'</a></li>\
<li><a class="action_button" href="#users_tab" value="User.create_dialog">'+tr("Create new User")+'</a></li>\
<li><a class="action_button" href="#acls_tab" value="Acl.create_dialog">'+tr("Create new ACL")+'</a></li>\
</ul>\
</div>\
</div>\
</td>\
@ -70,10 +70,11 @@ var system_tab_content =
<p><img src="images/system_icon.png" style="float:right;" alt="user" width="128" height="128" />'+tr("System resources management is only accesible to users of the oneadmin group. It comprises the operations regarding OpenNebula groups, users and ACLs.")+'</p>\
<p>'+tr("You can find further information on the following links:")+'</p>\
<ul>\
<li><a href="http://opennebula.org/documentation:rel3.4:auth_overview" target="_blank">Users & Groups subsystem</a></li>\
<li><a href="http://opennebula.org/documentation:rel3.4:manage_users" target="_blank">Managing users and groups</a></li>\
<li><a href="http://opennebula.org/documentation:rel3.4:chmod" target="_blank">Managing permissions</a></li>\
<li><a href="http://opennebula.org/documentation:rel3.4:manage_acl" target="_blank">Using ACLs</a></li>\
<li><a href="http://opennebula.org/documentation:documentation:auth_overview" target="_blank">Users & Groups subsystem</a></li>\
<li><a href="http://opennebula.org/documentation:documentation:manage_users" target="_blank">Managing users and groups</a></li>\
<li><a href="http://opennebula.org/documentation:documentation:chmod" target="_blank">Managing permissions</a></li>\
<li><a href="http://opennebula.org/documentation:documentation:quota_auth" target="_blank">Managing quotas</a></li>\
<li><a href="http://opennebula.org/documentation:documentation:manage_acl" target="_blank">Using ACLs</a></li>\
</ul>\
</div>\
</div>\

View File

@ -17,7 +17,7 @@
/*Templates tab plugin*/
var templates_tab_content = '\
<h2>'+tr("Templates")+'</h2>\
<h2><i class="icon-file"></i> '+tr("Templates")+'</h2>\
<form id="template_form" action="" action="javascript:alert(\'js error!\');">\
<div class="action_blocks">\
</div>\

View File

@ -22,7 +22,7 @@ var $user_quotas_dialog;
var $update_pw_dialog;
var users_tab_content = '\
<h2>'+tr("Users")+'</h2>\
<h2><i class="icon-user"></i> '+tr("Users")+'</h2>\
<form id="user_form" action="" action="javascript:alert(\'js error!\');">\
<div class="action_blocks">\
</div>\
@ -446,7 +446,7 @@ SunstoneMonitoringConfig['USER'] = {
plot: function(monitoring){
$('#totalUsers', $dashboard).text(monitoring['totalUsers'])
if (!$dashboard.is(':visible')) return;
//if (!$dashboard.is(':visible')) return;
var container = $('div#usersPerGroup',$dashboard);
SunstoneMonitoring.plot('USER',

View File

@ -56,7 +56,7 @@ var netUsage = {
}
var vms_tab_content = '\
<h2>'+tr("Virtual Machines")+'</h2>\
<h2><i class="icon-cloud"></i> '+tr("Virtual Machines")+'</h2>\
<form id="virtualMachine_list" action="javascript:alert(\'js error!\');">\
<div class="action_blocks">\
</div>\
@ -441,15 +441,7 @@ var vm_actions = {
},
error: vmMonitorError
},
"VM.monitor_all" : {
type: "monitor_global",
call: OpenNebula.VM.monitor_all,
callback: function(req,response) {
var info = req.request.data[0].monitor;
plot_global_graph(response,info);
},
error: onError
},
"VM.chown" : {
type: "multiple",
call: OpenNebula.VM.chown,
@ -697,7 +689,7 @@ SunstoneMonitoringConfig['VM'] = {
netUsage.up = monitoring['netUsageBar'][1].data[0][0]
netUsage.down = monitoring['netUsageBar'][0].data[0][0]
if (!$dashboard.is(':visible')) return;
//if (!$dashboard.is(':visible')) return;
var container = $('div#vmStatePie',$dashboard);
SunstoneMonitoring.plot('VM',
@ -1085,7 +1077,8 @@ function updateVMInfo(request,vm){
Sunstone.runAction("VM.monitor",vm_info.ID,vm_graphs[i]);
};
var $hotplugging_tab = $('div#vm_info_panel div#vm_hotplugging_tab');
var $info_panel = $('div#vm_info_panel');
var $hotplugging_tab = $('div#vm_hotplugging_tab', $info_panel);
$('tr.at_volatile',$hotplugging_tab).hide();
$('tr.at_image',$hotplugging_tab).show();
}
@ -1099,7 +1092,7 @@ function printDisks(vm_info){
[tr("DISABLED"),tr("LOCKED"),tr("ERROR")]
);
var html ='\
<form style="display:inline-block;width:80%" id="hotplugging_form" vmid="'+vm_info.ID+'">\
<form style="display:inline-block;width:100%" id="hotplugging_form" vmid="'+vm_info.ID+'">\
<table class="info_table">\
<thead>\
<tr><th colspan="2">'+tr("Disks information")+'</th></tr>\
@ -1146,7 +1139,7 @@ function printDisks(vm_info){
<tbody>\
<tr><td class="key_td"><label>'+tr("Type")+':</label></td>\
<td class="value_td">\
<select id="attach_disk_type">\
<select id="attach_disk_type" style="width:12em;">\
<option value="image">'+tr("Existing image")+'</option>\
<!-- <option value="volatile">'+tr("Volatile disk")+'</option>-->\
</select>\
@ -1154,24 +1147,24 @@ function printDisks(vm_info){
</tr>\
<tr class="at_image"><td class="key_td"><label>'+tr("Select image")+':</label></td>\
<td class="value_td">\
<select name="IMAGE_ID">\
<select name="IMAGE_ID" style="width:12em;">\
'+im_sel+'\
</select>\
</td>\
</tr>\
<tr class="at_volatile"><td class="key_td"><label>'+tr("Size")+':</label></td>\
<td class="value_td">\
<input type="text" name="SIZE"></input>\
<input type="text" name="SIZE" style="width:8em;"></input>\
</td>\
</tr>\
<tr class="at_volatile"><td class="key_td"><label>'+tr("Format")+':</label></td>\
<td class="value_td">\
<input type="text" name="FORMAT"></input>\
<input type="text" name="FORMAT" style="width:8em;"></input>\
</td>\
</tr>\
<tr class="at_volatile"><td class="key_td"><label>'+tr("Type")+':</label></td>\
<td class="value_td">\
<select name="TYPE">\
<select name="TYPE" style="width:12em;">\
<option value="swap">'+tr("swap")+'</option>\
<option value="fs">'+tr("fs")+'</option>\
</select>\
@ -1179,12 +1172,12 @@ function printDisks(vm_info){
</tr>\
<tr class="at_volatile at_image"><td class="key_td"><label>'+tr("Device prefix")+':</label></td>\
<td class="value_td">\
<input type="text" name="DEV_PREFIX" value="sd"></input>\
<input type="text" name="DEV_PREFIX" value="sd" style="width:8em;"></input>\
</td>\
</tr>\
<tr class="at_volatile"><td class="key_td"><label>'+tr("Readonly")+':</label></td>\
<td class="value_td">\
<select name="READONLY">\
<select name="READONLY" style="width:12em;">\
<option value="NO">'+tr("No")+'</option>\
<option value="YES">'+tr("Yes")+'</option>\
</select>\
@ -1192,7 +1185,7 @@ function printDisks(vm_info){
</tr>\
<tr class="at_volatile"><td class="key_td"><label>'+tr("Save")+':</label></td>\
<td class="value_td">\
<select name="SAVE">\
<select name="SAVE" style="width:12em;">\
<option value="NO">'+tr("No")+'</option>\
<option value="YES">'+tr("Yes")+'</option>\
</select>\

View File

@ -17,7 +17,7 @@
/*Virtual networks tab plugin*/
var vnets_tab_content = '\
<h2>'+tr("Virtual Networks")+'</h2>\
<h2><i class="icon-sitemap"></i> '+tr("Virtual Networks")+'</h2>\
<form id="virtualNetworks_form" action="javascript:alert(\'js error!\');">\
<div class="action_blocks">\
</div>\

View File

@ -58,11 +58,11 @@ var vres_tab_content =
<div class="panel">\
<h3>' + tr("Quickstart") + '</h3>\
<div class="panel_info dashboard_p">\
<p></br>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#vms_tab" value="VM.create_dialog">'+tr("Create new Virtual Machine")+'</a></br>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#templates_tab" value="Template.create_dialog">'+tr("Create new VM Template")+'</a></br>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#images_tab" value="Image.create_dialog">'+tr("Create new Image")+'</a></br>\
</p>\
<ul>\
<li><a class="action_button" href="#vms_tab" value="VM.create_dialog">'+tr("Create new Virtual Machine")+'</a></li>\
<li><a class="action_button" href="#templates_tab" value="Template.create_dialog">'+tr("Create new VM Template")+'</a></li>\
<li><a class="action_button" href="#images_tab" value="Image.create_dialog">'+tr("Create new Image")+'</a></li>\
</ul>\
</div>\
</div>\
</td>\
@ -80,9 +80,9 @@ var vres_tab_content =
<p>'+tr("Virtual Machine templates can be instantiated as many times as you want. You can do it from the Templates tab or by creating a new VM in the VM tab. The second method allows you to customize the name and the number of VMs you want to launch.")+'</p>\
<p>'+tr("You can find further information on the following links:")+'</p>\
<ul>\
<li><a href="http://opennebula.org/documentation:rel3.4:vm_guide" target="_blank">Creating Virtual Machines</a></li>\
<li><a href="http://opennebula.org/documentation:rel3.4:vm_guide_2" target="_blank">Managing Virtual Machines</a></li>\
<li><a href="http://opennebula.org/documentation:rel3.4:img_guide" target="_blank">Managing Virtual Machine Images</a></li>\
<li><a href="http://opennebula.org/documentation:documentation:vm_guide" target="_blank">Creating Virtual Machines</a></li>\
<li><a href="http://opennebula.org/documentation:documentation:vm_guide_2" target="_blank">Managing Virtual Machines</a></li>\
<li><a href="http://opennebula.org/documentation:documentation:img_guide" target="_blank">Managing Virtual Machine Images</a></li>\
</ul>\
</div>\
</div>\

View File

@ -603,8 +603,8 @@ function escapeDoubleQuotes(string){
function generateMonitoringDivs(graphs, id_prefix){
var str = "";
//43% of the width of the screen minus
//129px (left menu size)
var width = ($(window).width()-129)*40/100;
//181px (left menu size)
var width = ($(window).width()-181)*40/100;
var id_suffix="";
var label="";
var id="";
@ -618,7 +618,7 @@ function generateMonitoringDivs(graphs, id_prefix){
<thead><tr><th colspan="1">'+this.title+'</th></tr></thead>\
<tr><td id="legend_'+id_suffix+'"></td></tr>\
<tr><td style="border:0">\
<div id="'+id+'" style="width:'+width+'px; height:150px;margin-bottom:10px;position:relative;left:-20px;">'+
<div id="'+id+'" style="width:'+width+'px; height:150px;margin-bottom:10px;position:relative;left:0px;">'+
spinner+
'</div>\
</td></tr></table>';