shaba/one
1
0
Fork 0
mirror of https://github.com/OpenNebula/one.git synced 2025-03-20 10:50:08 +03:00
Code Releases Wiki Activity

Merge remote-tracking branch 'hector/feature-1112' into feature-1112

Browse Source 
Conflicts:
	src/sunstone/public/js/plugins/dashboard-tab.js
	src/sunstone/public/js/plugins/dashboard-users-tab.js
	src/sunstone/public/js/sunstone-util.js
This commit is contained in:
Ruben S. Montero 2012-03-15 12:34:13 +01:00
commit 0ac510e9b9
26 changed files with 1106 additions and 254 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
install.sh
View File

@ -1152,6 +1152,8 @@ SUNSTONE_PUBLIC_JS_PLUGINS_FILES="\
src/sunstone/public/js/plugins/hosts-tab.js \
src/sunstone/public/js/plugins/clusters-tab.js \
src/sunstone/public/js/plugins/datastores-tab.js \
src/sunstone/public/js/plugins/system-tab.js \
src/sunstone/public/js/plugins/vresources-tab.js \
src/sunstone/public/js/plugins/groups-tab.js \
src/sunstone/public/js/plugins/images-tab.js \
src/sunstone/public/js/plugins/templates-tab.js \

87
src/cloud/occi/lib/ui/public/css/layout.css
View File

@ -125,14 +125,44 @@ background-image: -moz-linear-gradient(
padding: 0;
}
#navigation li {
.navigation li.topTab {
line-height: 2em;
text-align: right;
padding-right: 10px;
text-align: left;
padding-left: 15px;
}
#navigation li a {
.navigation li.subTab {
line-height: 1.8em;
font-size: 12px;
text-align: left;
padding-left: 30px;
}
.navigation li.subsubTab {
line-height: 1.7em;
font-size: 11px;
text-align: left;
padding-left: 40px;
}
.navigation li.topTab span.plusIcon,
.navigation li.subTab span.plusIcon {
display : none;
float: right;
margin-right: 1em;
}
.navigation li.topTab span.plusIcon {
margin-top: 5px;
}
.navigation li.subTab span.plusIcon {
margin-top: 3px;
}
#navigation li {
color: #ffffff;
cursor: pointer;
}
#navigation li:hover, .navigation-active-li {
@ -163,10 +193,10 @@ background-image: -moz-linear-gradient(
);
*/
}
.navigation-active-li-a {
.navigation-active-li {
font-weight: bold;
}
#navigation li:hover a, .navigation-active-li-a {
#navigation li:hover {
color: #ffffff !important;
}
@ -181,3 +211,48 @@ background-image: -moz-linear-gradient(
width: 100px;
height: 22px;
}
/* top menu css */
#menutop_container{
margin:0px 171px;
color:#FFFFFF;
font-size:13px;
font-weight:bold;
}
#menutop_navbar{
float:left;
height:25px;
font-size:13px;
}
#menutop_navbar ul{
float:left;
height:25px;
color:#000000;
margin: 0 0;
padding-left: 1px;
}
#menutop_navbar ul{
background-color: #353735;
}
#menutop_navbar ul li{
float:left;
min-width:72px;
margin:0px 0 0 0;
height:22px;
display: inline;
text-align:center;
padding-left:5px;
padding-right: 5px;
padding-top: 4px;
padding-bottom: 4px;
border-left:1px solid white;
cursor:pointer;
color: white;
}
#menutop_navbar ul li:hover {
background-color: #E69138;
}
/* end top menu css */

116
src/cloud/occi/lib/ui/public/js/layout.js
View File

@ -14,16 +14,21 @@
/* limitations under the License. */
/* -------------------------------------------------------------------------- */
//This file is mostly a copy of layout.js from Sunstone.
//Instead of opening a south panel, it opens an east panel.
//Apart from document.ready() modifications, the rest of different lines are
//makerd with MODIFIED
var activeTab;
var outerLayout, innerLayout;
function hideDialog(){
innerLayout.close("east");
innerLayout.close("east");//MODIFIED
}
function popDialog(content){
$("#dialog").html(content);
innerLayout.open("east");
innerLayout.open("east");//MODIFIED
}
function popDialogLoading(){
@ -31,45 +36,98 @@ function popDialogLoading(){
popDialog(loading);
}
function showTab(tabname){
activeTab = tabname;
function showTab(tabname,highlight_tab){
//Since menu items no longer have an <a> element
//we no longer expect #tab_id here, but simply tab_id
//So safety check - remove # from #tab_id if present to ensure compatibility
if (tabname.indexOf('#') == 0)
tabname = tabname.substring(1);
if (highlight_tab && highlight_tab.indexOf('#') == 0)
highlight_tab == highlight.substring(1);
var activeTab = tabname;
if (!highlight_tab) highlight_tab = activeTab;
//clean selected menu
$("#navigation li").removeClass("navigation-active-li");
$("#navigation li a").removeClass("navigation-active-li-a");
$("div#header ul#menutop_ul li").removeClass("navigation-active-li");
//select menu
var li = $("#navigation li:has(a[href='"+activeTab+"'])")
var li_a = $("#navigation li a[href='"+activeTab+"']")
//select tab in left menu
var li = $("#navigation li#li_"+highlight_tab)
li.addClass("navigation-active-li");
li_a.addClass("navigation-active-li-a");
//select tab in top menu
var top_li = $("div#header ul#menutop_ul li#top_"+highlight_tab);
top_li.addClass("navigation-active-li");
//show tab
$(".tab").hide();
$(activeTab).show();
//~ if (activeTab == '#dashboard') {
//~ emptyDashboard();
//~ preloadTables();
//~ }
innerLayout.close("south");
}
$('#'+activeTab).show();
// innerLayout.close("south");//MODIFIED commented
};
function setupTabs(){
var topTabs = $(".outer-west ul li.topTab");
var subTabs = $(".outer-west ul li.subTab");
subTabs.live("click",function(){
//leave floor to topTab listener in case of tabs with both classes
if ($(this).hasClass('topTab')) return false;
var tab = $(this).attr('id').substring(3);
showTab(tab);
return false;
});
topTabs.live("click",function(e){
var tab = $(this).attr('id').substring(3);
//Subtabs have a class with the name of this tab
var subtabs = $('div#menu li.'+tab);
//toggle subtabs only when clicking on the icon or when clicking on an
//already selected menu
if ($(e.target).is('span') ||
$(this).hasClass("navigation-active-li")){
//for each subtab, we hide the subsubtabs
subtabs.each(function(){
//for each subtab, hide its subtabs
var subsubtabs = $(this).attr('id').substr(3);
//subsubtabs class
subsubtabs = $('div#menu li.'+subsubtabs);
subsubtabs.hide();
});
//hide subtabs and reset icon to + position, since all subsubtabs
//are hidden
subtabs.fadeToggle('fast');
$('span',subtabs).removeClass('ui-icon-circle-minus');
$('span',subtabs).addClass('ui-icon-circle-plus');
//toggle icon on this tab
$('span',this).toggleClass('ui-icon-circle-plus ui-icon-circle-minus');
};
//if we are clicking on the icon only, do not show the tab
if ($(e.target).is('span')) return false;
showTab(tab);
return false;
});
};
function setupTopMenu(){
$('div#header ul#menutop_ul li').live('click',function(){
var tab = "#" + $(this).attr('id').substring(4);
showTab(tab);
});
};
$(document).ready(function () {
$(".tab").hide();
$(".outer-west ul li.subTab").live("click",function(){
var tab = $('a',this).attr('href');
showTab(tab);
return false;
});
$(".outer-west ul li.topTab").live("click",function(){
var tab = $('a',this).attr('href');
//toggle subtabs trick
$('li.'+tab.substr(1)).toggle();
showTab(tab);
return false;
});
setupTabs();
//setupTopMenu();
outerLayout = $('body').layout({
applyDefaultStyles: false

73
src/ozones/Server/public/css/layout.css
View File

@ -136,9 +136,31 @@ background-image: -moz-linear-gradient(
padding-left: 30px;
}
.navigation li.subsubTab {
line-height: 1.7em;
font-size: 11px;
text-align: left;
padding-left: 40px;
}
.navigation li a {
.navigation li.topTab span.plusIcon,
.navigation li.subTab span.plusIcon {
display : none;
float: right;
margin-right: 1em;
}
.navigation li.topTab span.plusIcon {
margin-top: 5px;
}
.navigation li.subTab span.plusIcon {
margin-top: 3px;
}
.navigation li {
color: #ffffff;
cursor: pointer;
}
.navigation li:hover, .navigation-active-li {
@ -169,9 +191,54 @@ background-image: -moz-linear-gradient(
);
*/
}
.navigation-active-li-a {
.navigation-active-li {
font-weight: bold;
}
.navigation li:hover a, .navigation-active-li-a {
.navigation li:hover {
color: #ffffff !important;
}
/* top menu css */
#menutop_container{
margin:0px 171px;
color:#FFFFFF;
font-size:13px;
font-weight:bold;
}
#menutop_navbar{
float:left;
height:25px;
font-size:13px;
}
#menutop_navbar ul{
float:left;
height:25px;
color:#000000;
margin: 0 0;
padding-left: 1px;
}
#menutop_navbar ul{
background-color: #353735;
}
#menutop_navbar ul li{
float:left;
min-width:72px;
margin:0px 0 0 0;
height:22px;
display: inline;
text-align:center;
padding-left:5px;
padding-right: 5px;
padding-top: 4px;
padding-bottom: 4px;
border-left:1px solid white;
cursor:pointer;
color: white;
}
#menutop_navbar ul li:hover {
background-color: #E69138;
}
/* end top menu css */

64
src/sunstone/etc/sunstone-plugins.yaml
View File

@ -9,36 +9,15 @@
:user:
:group:
oneadmin: false
- plugins/hosts-tab.js:
- plugins/config-tab.js:
:ALL: true
:user:
:group:
- plugins/system-tab.js:
:ALL: false
:user:
:group:
oneadmin: true
- plugins/clusters-tab.js:
:ALL: false
:user:
:group:
oneadmin: true
- plugins/vms-tab.js:
:ALL: true
:user:
:group:
- plugins/datastores-tab.js:
:ALL: true
:user:
:group:
- plugins/templates-tab.js:
:ALL: true
:user:
:group:
- plugins/vnets-tab.js:
:ALL: true
:user:
:group:
- plugins/images-tab.js:
:ALL: true
:user:
:group:
- plugins/users-tab.js:
:ALL: false
:user:
@ -54,7 +33,38 @@
:user:
:group:
oneadmin: true
- plugins/config-tab.js:
- plugins/vresources-tab.js:
:ALL: true
:user:
:group:
- plugins/vms-tab.js:
:ALL: true
:user:
:group:
- plugins/templates-tab.js:
:ALL: true
:user:
:group:
- plugins/images-tab.js:
:ALL: true
:user:
:group:
- plugins/hosts-tab.js:
:ALL: false
:user:
:group:
oneadmin: true
- plugins/datastores-tab.js:
:ALL: true
:user:
:group:
- plugins/vnets-tab.js:
:ALL: true
:user:
:group:
- plugins/clusters-tab.js:
:ALL: false
:user:
:group:
oneadmin: true

26
src/sunstone/public/css/application.css
View File

@ -31,6 +31,11 @@ select, button {
padding: 2px;
}
.inline-icon {
display:inline-block;
vertical-align:middle;
}
h2 {
float:left;
font-size:20px;
@ -46,19 +51,34 @@ h3 {
margin: 0 0;
}
table#dashboard_table{
table.dashboard_table{
width:100%;
margin: 0;
}
table#dashboard_table tr {
table.dashboard_table tr {
vertical-align: top;
}
table#dashboard_table > tbody > tr > td{
table.dashboard_table > tbody > tr > td{
width:50%;
}
table.dashboard_table .inline-icon {
margin-left: 40px;
}
.dashboard_p {
color: #353735;
text-align:justify;
}
.clusterElemLi {
list-style: circle;
}
div.panel {
background-color: #ffffff;
padding:0;

95
src/sunstone/public/css/layout.css
View File

@ -38,6 +38,10 @@ body {
padding: 5px 10px 0 10px;
}
.hidden {
display:none;
}
body {
font-family: Arial, Verdana, Geneva, Helvetica, sans-serif;
font-size: 13px;
@ -120,19 +124,50 @@ background-image: -moz-linear-gradient(
rgb(53,55,53) 100%
);
}
#navigation {
.navigation {
list-style: none;
padding: 0;
}
#navigation li {
.navigation li.topTab {
line-height: 2em;
text-align: right;
padding-right: 10px;
text-align: left;
padding-left: 15px;
}
#navigation li a {
.navigation li.subTab {
line-height: 1.8em;
font-size: 12px;
text-align: left;
padding-left: 30px;
}
.navigation li.subsubTab {
line-height: 1.7em;
font-size: 11px;
text-align: left;
padding-left: 40px;
}
.navigation li.topTab span.plusIcon,
.navigation li.subTab span.plusIcon {
display : none;
float: right;
margin-right: 1em;
}
.navigation li.topTab span.plusIcon {
margin-top: 5px;
}
.navigation li.subTab span.plusIcon {
margin-top: 3px;
}
#navigation li {
color: #ffffff;
cursor: pointer;
}
#navigation li:hover, .navigation-active-li {
@ -163,9 +198,55 @@ background-image: -moz-linear-gradient(
);
*/
}
.navigation-active-li-a {
.navigation-active-li {
font-weight: bold;
}
#navigation li:hover a, .navigation-active-li-a {
#navigation li:hover {
color: #ffffff !important;
}
/* top menu css */
#menutop_container{
margin:0px 171px;
color:#FFFFFF;
font-size:13px;
font-weight:bold;
}
#menutop_navbar{
float:left;
height:25px;
font-size:13px;
}
#menutop_navbar ul{
float:left;
height:25px;
color:#000000;
margin: 0 0;
padding-left: 1px;
}
#menutop_navbar ul{
background-color: #353735;
}
#menutop_navbar ul li{
float:left;
min-width:72px;
margin:0px 0 0 0;
height:22px;
display: inline;
text-align:center;
padding-left:5px;
padding-right: 5px;
padding-top: 4px;
padding-bottom: 4px;
border-left:1px solid white;
cursor:pointer;
color: white;
}
#menutop_navbar ul li:hover {
background-color: #E69138;
}
/* end top menu css */

106
src/sunstone/public/js/layout.js
View File

@ -31,51 +31,104 @@ function popDialogLoading(){
popDialog(loading);
}
function showTab(tabname){
activeTab = tabname;
function showTab(tabname,highlight_tab){
//Since menu items no longer have an <a> element
//we no longer expect #tab_id here, but simply tab_id
//So safety check - remove # from #tab_id if present to ensure compatibility
if (tabname.indexOf('#') == 0)
tabname = tabname.substring(1);
if (highlight_tab && highlight_tab.indexOf('#') == 0)
highlight_tab == highlight.substring(1);
var activeTab = tabname;
if (!highlight_tab) highlight_tab = activeTab;
//clean selected menu
$("#navigation li").removeClass("navigation-active-li");
$("#navigation li a").removeClass("navigation-active-li-a");
$("div#header ul#menutop_ul li").removeClass("navigation-active-li");
//select menu
var li = $("#navigation li:has(a[href='"+activeTab+"'])")
var li_a = $("#navigation li a[href='"+activeTab+"']")
//select tab in left menu
var li = $("#navigation li#li_"+highlight_tab)
li.addClass("navigation-active-li");
li_a.addClass("navigation-active-li-a");
//select tab in top menu
var top_li = $("div#header ul#menutop_ul li#top_"+highlight_tab);
top_li.addClass("navigation-active-li");
//show tab
$(".tab").hide();
$(activeTab).show();
//~ if (activeTab == '#dashboard') {
//~ emptyDashboard();
//~ preloadTables();
//~ }
$('#'+activeTab).show();
innerLayout.close("south");
}
function setupTabs(){
var topTabs = $(".outer-west ul li.topTab");
var subTabs = $(".outer-west ul li.subTab");
subTabs.live("click",function(){
//leave floor to topTab listener in case of tabs with both classes
if ($(this).hasClass('topTab')) return false;
var tab = $(this).attr('id').substring(3);
showTab(tab);
return false;
});
topTabs.live("click",function(e){
var tab = $(this).attr('id').substring(3);
//Subtabs have a class with the name of this tab
var subtabs = $('div#menu li.'+tab);
//toggle subtabs only when clicking on the icon or when clicking on an
//already selected menu
if ($(e.target).is('span') ||
$(this).hasClass("navigation-active-li")){
//for each subtab, we hide the subsubtabs
subtabs.each(function(){
//for each subtab, hide its subtabs
var subsubtabs = $(this).attr('id').substr(3);
//subsubtabs class
subsubtabs = $('div#menu li.'+subsubtabs);
subsubtabs.hide();
});
//hide subtabs and reset icon to + position, since all subsubtabs
//are hidden
subtabs.fadeToggle('fast');
$('span',subtabs).removeClass('ui-icon-circle-minus');
$('span',subtabs).addClass('ui-icon-circle-plus');
//toggle icon on this tab
$('span',this).toggleClass('ui-icon-circle-plus ui-icon-circle-minus');
};
//if we are clicking on the icon only, do not show the tab
if ($(e.target).is('span')) return false;
showTab(tab);
return false;
});
};
function setupTopMenu(){
$('div#header ul#menutop_ul li').live('click',function(){
var tab = "#" + $(this).attr('id').substring(4);
showTab(tab);
});
};
$(document).ready(function () {
$(".tab").hide();
$(".outer-west ul li.subTab").live("click",function(){
var tab = $('a',this).attr('href');
showTab(tab);
return false;
});
$(".outer-west ul li.topTab").live("click",function(){
var tab = $('a',this).attr('href');
//toggle subtabs trick
$('li.'+tab.substr(1)).toggle();
showTab(tab);
return false;
});
setupTabs();
setupTopMenu();
outerLayout = $('body').layout({
applyDefaultStyles: false
, center__paneSelector: ".outer-center"
, west__paneSelector: ".outer-west"
, west__size: 133
, west__size: 181
, north__size: 26
, south__size: 26
, spacing_open: 0 // ALL panes
@ -106,4 +159,3 @@ $(document).ready(function () {
});
});

5
src/sunstone/public/js/plugins/acls-tab.js
View File

@ -156,7 +156,9 @@ var acl_buttons = {
var acls_tab = {
title: tr("ACLs"),
content: acls_tab_content,
buttons: acl_buttons
buttons: acl_buttons,
tabClass: 'subTab',
parentTab: 'system_tab'
}
Sunstone.addActions(acl_actions);
@ -303,6 +305,7 @@ function updateAclsView(request,list){
});
updateView(list_array,dataTable_acls);
updateDashboard("acls",list);
updateSystemDashboard("acls",list);
}
function setupCreateAclDialog(){

233
src/sunstone/public/js/plugins/clusters-tab.js
View File

@ -212,7 +212,8 @@ var host_info_panel = {
var clusters_tab = {
title: tr("Clusters"),
content: clusters_tab_content,
buttons: cluster_buttons
buttons: cluster_buttons,
showOnTopMenu: true,
}
Sunstone.addActions(cluster_actions);
@ -296,11 +297,232 @@ function updateClustersView (request,list){
list_array.push(clusterElementArray(this));
});
removeClusterMenus();
updateView(list_array,dataTable_clusters);
updateClusterSelect();
//dependency with the dashboard plugin
updateDashboard("clusters",list);
}
newClusterMenu(list);
};
function clusterTabContent(cluster_json) {
var cluster = cluster_json.CLUSTER;
var dss_list = '<li class="clusterElemLi">'+tr("No datastores in this cluster")+'</li>';
if (cluster.DATASTORES.ID &&
cluster.DATASTORES.ID.constructor == Array){
dss_list = '';
for (var i=0; i<cluster.DATASTORES.ID.length;i++){
dss_list += '<li class="clusterElemLi">'+cluster.DATASTORES.ID[i]+' - '+getDatastoreName(cluster.DATASTORES.ID[i])+'</li>';
};
} else if (cluster.DATASTORES.ID)
dss_list = '<li class="clusterElemLi">'+cluster.DATASTORES.ID+' - '+getDatastoreName(cluster.DATASTORES.ID)+'</li>';
var hosts_list = '<li class="clusterElemLi">'+tr("No hosts in this cluster")+'</li>';
if (cluster.HOSTS.ID &&
cluster.HOSTS.ID.constructor == Array){
hosts_list = '';
for (var i=0; i<cluster.HOSTS.ID.length;i++){
hosts_list += '<li class="clusterElemLi">'+cluster.HOSTS.ID[i]+' - '+getHostName(cluster.HOSTS.ID[i])+'</li>';
};
} else if (cluster.HOSTS.ID)
hosts_list = '<li class="clusterElemLi">'+cluster.HOSTS.ID+' - '+getHostName(cluster.HOSTS.ID)+'</li>';
var vnets_list = '<li class="clusterElemLi">'+tr("No virtual networks in this cluster")+'</li>';
if (cluster.VNETS.ID &&
cluster.VNETS.ID.constructor == Array){
vnets_list = '';
for (var i=0; i<cluster.VNETS.ID.length;i++){
vnets_list += '<li class="clusterElemLi">'+cluster.VNETS.ID[i]+' - '+getVNetName(cluster.VNETS.ID[i])+'</li>';
};
} else if (cluster.VNETS.ID)
vnets_list = '<li class="clusterElemLi">'+cluster.VNETS.ID+' - '+getVNetName(cluster.VNETS.ID)+'</li>';
var html_code = '\
<table class="dashboard_table">\
<tr>\
<td style="width:50%">\
<table style="width:100%">\
<tr>\
<td>\
<div class="panel">\
<h3>' + tr("Cluster information") + '</h3>\
<div class="panel_info">\
\
<table class="info_table">\
<tr>\
<td class="key_td">' + tr("ID") + '</td>\
<td class="value_td">'+cluster.ID+'</td>\
</tr>\
<tr>\
<td class="key_td">' + tr("Name") + '</td>\
<td class="value_td">'+cluster.NAME+'</td>\
</tr>\
</table>\
\
</div>\
</div>\
</td>\
</tr>\
<tr>\
<td>\
<div class="panel">\
<h3>' + tr("Hosts in this cluster") + '</h3>\
<div class="panel_info">\
\
<ul>'+hosts_list+'\
</ul>\
\
</div>\
</td>\
</tr>\
</table>\
</td>\
<td style="width:50%">\
<table style="width:100%">\
<tr>\
<td>\
<div class="panel">\
<h3>' + tr("Datastores in this cluster") + '</h3>\
<div class="panel_info">\
\
<ul>'+dss_list+'\
</ul>\
\
</div>\
</div>\
</td>\
</tr>\
<tr>\
<td>\
<div class="panel">\
<h3>' + tr("Virtual Networks in this cluster") + '</h3>\
<div class="panel_info">\
\
<ul>'+vnets_list+'\
</ul>\
\
</div>\
</div>\
</td>\
</tr>\
</table>\
</td>\
</tr></table>\
';
return html_code;
};
function removeClusterMenus(){
var data = dataTable_clusters.fnGetData();
Sunstone.removeMainTab('cluster_vnets_tab_n',true);
Sunstone.removeMainTab('cluster_datastores_tab_n',true);
Sunstone.removeMainTab('cluster_hosts_tab_n',true);
Sunstone.removeMainTab('cluster_tab_n',true);
for (var i=0; i < data.length; i++){
var id = data[i][1];
Sunstone.removeMainTab('cluster_vnets_tab_'+id,true);
Sunstone.removeMainTab('cluster_datastores_tab_'+id,true);
Sunstone.removeMainTab('cluster_hosts_tab_'+id,true);
Sunstone.removeMainTab('cluster_tab_'+id,true);
};
};
function newClusterMenu(list){
var cluster_none = {
'CLUSTER' : {
'NAME' : 'None',
'ID' : 'n',
'DATASTORES' : [],
'HOSTS' : [],
'VNETS' : []
}
};
newClusterMenuElement(cluster_none);
for (var i=0; i < list.length; i++){
newClusterMenuElement(list[i]);
};
$('div#menu li#li_clusters_tab span').removeClass('ui-icon-circle-minus');
$('div#menu li#li_clusters_tab span').addClass('ui-icon-circle-plus');
};
function newClusterMenuElement(element){
var cluster = element.CLUSTER;
var menu_name = cluster.NAME.length > 10 ?
cluster.NAME.substring(0,9)+'...' : cluster.NAME;
var menu_cluster = {
title: menu_name + ' (id ' + cluster.ID + ')',
content: clusterTabContent(element),
tabClass: 'topTab subTab',
parentTab: 'clusters_tab'
// buttons: null
};
var submenu_hosts = {
title: tr("Hosts"),
content: '',
tabClass: "subTab clusterHosts subsubTab",
parentTab: "cluster_tab_" + cluster.ID
};
var submenu_datastores = {
title: tr("Datastores"),
content: '',
tabClass: "subTab clusterDatastores subsubTab",
parentTab: "cluster_tab_" + cluster.ID
};
var submenu_vnets = {
title: tr("Virtual Networks"),
content: '',
tabClass: "subTab clusterVnets subsubTab",
parentTab: "cluster_tab_" + cluster.ID
};
Sunstone.addMainTab('cluster_tab_'+cluster.ID,menu_cluster,true);
Sunstone.addMainTab('cluster_hosts_tab_'+cluster.ID,submenu_hosts,true);
Sunstone.addMainTab('cluster_datastores_tab_'+cluster.ID,submenu_datastores,true);
Sunstone.addMainTab('cluster_vnets_tab_'+cluster.ID,submenu_vnets,true);
};
function clusterSubmenusListeners(){
//hack the menu selection
$('div#menu li.clusterHosts').live('click',function(){
var id = $(this).attr('id');
id = id.split('_');
id = id[id.length-1];
dataTable_hosts.fnFilter(getClusterName(id),3,false,true,false,true);
showTab('#hosts_tab',$(this).attr('id').substring(3));
return false;
});
$('div#menu li.clusterDatastores').live('click',function(){
var id = $(this).attr('id');
id = id.split('_');
id = id[id.length-1];
dataTable_datastores.fnFilter(getClusterName(id),5,false,true,false,true);
showTab('#datastores_tab',$(this).attr('id').substring(3));
return false;
});
$('div#menu li.clusterVnets').live('click',function(){
var id = $(this).attr('id');
id = id.split('_');
id = id[id.length-1];
dataTable_vNetworks.fnFilter(getClusterName(id),5,false,true,false,true);
showTab('#vnets_tab',$(this).attr('id').substring(3));
return false;
});
};
/*
//Updates the host info panel tab's content and pops it up
@ -459,9 +681,12 @@ function popUpCreateClusterDialog(){
//Prepares the autorefresh for hosts
function setClusterAutorefresh() {
setInterval(function(){
var selected_menu = $('div#menu li.navigation-active-li');
var inSubMenu = selected_menu.attr('id').indexOf('cluster') > 0;
var checked = $('input.check_item:checked',dataTable_clusters);
var filter = $("#datatable_clusters_filter input",dataTable_clusters.parents('#datatable_clusters_wrapper')).attr('value');
if (!checked.length && !filter.length){
if (!checked.length && !filter.length && !inSubMenu){
Sunstone.runAction("Cluster.autorefresh");
}
},INTERVAL+someTime());
@ -505,6 +730,8 @@ $(document).ready(function(){
setClusterAutorefresh();
clusterSubmenusListeners();
initCheckAllBoxes(dataTable_clusters);
tableCheckboxesListener(dataTable_clusters);
// clusterInfoListener();

6
src/sunstone/public/js/plugins/config-tab.js
View File

@ -58,8 +58,10 @@ var config_actions = {
var config_tab = {
title: tr("Configuration"),
content: config_tab_content
}
content: config_tab_content,
tabClass: "subTab",
parentTab: "dashboard_tab",
};
Sunstone.addActions(config_actions);
Sunstone.addMainTab('config_tab',config_tab);

92
src/sunstone/public/js/plugins/dashboard-tab.js
View File

@ -43,7 +43,7 @@ var graph4 = {
};
var dashboard_tab_content =
'<table id="dashboard_table">\
'<table class="dashboard_table">\
<tr>\
<td style="width:40%">\
<table id="information_table" style="width:100%">\
@ -67,28 +67,28 @@ var dashboard_tab_content =
<td class="value_td"><span id="total_groups"></span></td>\
</tr>\
<tr>\
<td class="key_td">' + tr("VM Templates (total/public)") + '</td>\
<td class="value_td"><span id="total_templates"></span><span id="public_templates"></span></td>\
<td class="key_td">' + tr("VM Templates") + '</td>\
<td class="value_td"><span id="total_templates"></span></td>\
</tr>\
<tr>\
<td class="key_td">' +
tr("VM Instances")+ ' (' +
tr("VM Instances")+ ' (' +
tr("total") + '/<span class="green">' +
tr("running") + '</span>/<span class="red">' +
tr("running") + '</span>/<span class="red">' +
tr("failed") + '</span>)</td>\
<td class="value_td"><span id="total_vms"></span><span id="running_vms" class="green"></span><span id="failed_vms" class="red"></span></td>\
</tr>\
<tr>\
<td class="key_td">' + tr("Virtual Networks (total/public)") + '</td>\
<td class="value_td"><span id="total_vnets"></span><span id="public_vnets"></span></td>\
<td class="key_td">' + tr("Virtual Networks") + '</td>\
<td class="value_td"><span id="total_vnets"></span></td>\
</tr>\
<tr>\
<td class="key_td">' + tr("Datastores") + '</td>\
<td class="value_td"><span id="total_datastores"></span></td>\
</tr>\
<tr>\
<td class="key_td">' + tr("Images (total/public)") + '</td>\
<td class="value_td"><span id="total_images"></span><span id="public_images"></span></td>\
<td class="key_td">' + tr("Images") + '</td>\
<td class="value_td"><span id="total_images"></span></td>\
</tr>\
<tr>\
<td class="key_td">' + tr("Users")+'</td>\
@ -108,20 +108,20 @@ var dashboard_tab_content =
<td>\
<div class="panel">\
<h3>' + tr("Quickstart") + '</h3>\
<form id="quickstart_form"><fieldset>\
<table style="width:100%;"><tr style="vertical-align:middle;"><td style="width:70%">\
<label style="font-weight:bold;width:40px;height:12em;">' + tr("New")+': </label>\
<input type="radio" name="quickstart" value="Host.create_dialog">' + tr("Host") + '</input><br />\
<input type="radio" name="quickstart" value="Cluster.create_dialog">' + tr("Cluster") + '</input><br />\
<input type="radio" name="quickstart" value="VM.create_dialog">' + tr("VM Instance") + '</input><br />\
<input type="radio" name="quickstart" value="Template.create_dialog">' + tr("VM Template") + '</input><br />\
<input type="radio" name="quickstart" value="Network.create_dialog">' + tr("Virtual Network") + '</iput><br />\
<input type="radio" name="quickstart" value="Datastore.create_dialog">' + tr("Datastore") + '</input><br />\
<input type="radio" name="quickstart" value="Image.create_dialog">' + tr("Image") + '</input><br />\
<input type="radio" name="quickstart" value="User.create_dialog">' + tr("User") + '</input><br />\
<input type="radio" name="quickstart" value="Group.create_dialog">' + tr("Group") + '</input><br />\
<input type="radio" name="quickstart" value="Acl.create_dialog">' + tr("Acl") + '</input><br />\
</td></tr></table>\
<div class="panel_info">\
<p><br/>'+tr("Create new")+':<br/>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#hosts_tab" value="Host.create_dialog">'+tr("Host")+'</a></br>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#clusters_tab" value="Cluster.create_dialog">'+tr("Cluster")+'</a></br>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#vms_tab" value="VM.create_dialog">'+tr("VM Instance")+'</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("VM Template")+'</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("Virtual Network")+'</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("Datastore")+'</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("Image")+'</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("User")+'</a></br>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#groups_tab" value="Group.create_dialog">'+tr("Group")+'</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("ACL")+'</a></br>\
</p>\
</div>\
</div>\
</td>\
</tr>\
@ -158,7 +158,8 @@ var dashboard_tab_content =
var dashboard_tab = {
title: tr("Dashboard"),
content: dashboard_tab_content
content: dashboard_tab_content,
showOnTopMenu: true,
}
Sunstone.addMainTab('dashboard_tab',dashboard_tab);
@ -209,13 +210,6 @@ function plot_global_graph(data,info){
$.plot($('#'+id+'_graph',context),series,options);
}
function quickstart_setup(){
$('#dashboard_table #quickstart_form input',main_tabs_context).click(function(){
Sunstone.runAction($(this).val());
});
}
function graph_autorefresh(){
setInterval(function(){
refresh_graphs();
@ -231,17 +225,8 @@ function refresh_graphs(){
}
$(document).ready(function(){
//Dashboard link listener
$("#dashboard_table h3 a",main_tabs_context).live("click", function (){
var tab = $(this).attr('href');
showTab(tab);
return false;
});
emptyDashboard();
quickstart_setup();
refresh_graphs();
graph_autorefresh();
@ -288,14 +273,8 @@ function updateDashboard(what,json_info){
$('#failed_vms',db).html(failed_vms);
break;
case "vnets":
var public_vnets=0;
var total_vnets=json_info.length;
$.each(json_info,function(){
if (parseInt(this.VNET.PUBLIC)){
public_vnets++;}
});
$('#total_vnets',db).html(total_vnets+'&nbsp;/&nbsp;');
$('#public_vnets',db).html(public_vnets);
$('#total_vnets',db).html(total_vnets);
break;
case "users":
var total_users=json_info.length;
@ -303,24 +282,11 @@ function updateDashboard(what,json_info){
break;
case "images":
var total_images=json_info.length;
var public_images=0;
$.each(json_info,function(){
if (parseInt(this.IMAGE.PUBLIC)){
public_images++;}
});
$('#total_images',db).html(total_images+'&nbsp;/&nbsp;');
$('#public_images',db).html(public_images);
$('#total_images',db).html(total_images);
break;
case "templates":
var total_templates=json_info.length;
var public_templates=0;
$.each(json_info,function(){
if (parseInt(this.VMTEMPLATE.PUBLIC)){
public_templates++;
}
});
$('#total_templates',db).html(total_templates+'&nbsp;/&nbsp;');
$('#public_templates',db).html(public_templates);
$('#total_templates',db).html(total_templates);
break;
case "acls":
var total_acls=json_info.length;
@ -335,4 +301,4 @@ function updateDashboard(what,json_info){
$('#total_datastores',db).html(total_datastores);
break;
}
}
};

76
src/sunstone/public/js/plugins/dashboard-users-tab.js
View File

@ -43,7 +43,7 @@ var graph4 = {
};
var dashboard_tab_content =
'<table id="dashboard_table">\
'<table class="dashboard_table">\
<tr>\
<td style="width:40%">\
<table id="information_table" style="width:100%;">\
@ -55,8 +55,8 @@ var dashboard_tab_content =
\
<table class="info_table">\
<tr>\
<td class="key_td">'+tr("VM Templates (total/public)")+'</td>\
<td class="value_td"><span id="total_templates"></span><span id="public_templates"></span></td>\
<td class="key_td">'+tr("VM Templates")+'</td>\
<td class="value_td"><span id="total_templates"></span></td>\
</tr>\
<tr>\
<td class="key_td">'+tr("VM Instances")+' ('+
@ -66,16 +66,16 @@ var dashboard_tab_content =
<td class="value_td"><span id="total_vms"></span><span id="running_vms" class="green"></span><span id="failed_vms" class="red"></span></td>\
</tr>\
<tr>\
<td class="key_td">'+tr("Virtual Networks (total/public)")+'</td>\
<td class="value_td"><span id="total_vnets"></span><span id="public_vnets"></span></td>\
<td class="key_td">'+tr("Virtual Networks")+'</td>\
<td class="value_td"><span id="total_vnets"></span></td>\
</tr>\
<tr>\
<td class="key_td">' + tr("Datastores") + '</td>\
<td class="value_td"><span id="total_datastores"></span></td>\
</tr>\
<tr>\
<td class="key_td">'+tr("Images (total/public)")+'</td>\
<td class="value_td"><span id="total_images"></span><span id="public_images"></span></td>\
<td class="key_td">'+tr("Images")+'</td>\
<td class="value_td"><span id="total_images"></span></td>\
</tr>\
</table>\
\
@ -87,14 +87,14 @@ var dashboard_tab_content =
<td>\
<div class="panel">\
<h3>'+tr("Quickstart")+'</h3>\
<form id="quickstart_form"><fieldset>\
<table style="width:100%;"><tr style="vertical-align:middle;"><td style="width:70%">\
<label style="font-weight:bold;width:40px;height:6em;">New:</label>\
<input type="radio" name="quickstart" value="Template.create_dialog">'+tr("VM Template")+'</input><br />\
<input type="radio" name="quickstart" value="VM.create_dialog">'+tr("VM Instance")+'</input><br />\
<input type="radio" name="quickstart" value="Network.create_dialog">'+tr("Virtual Network")+'</input><br />\
<input type="radio" name="quickstart" value="Image.create_dialog">'+tr("Image")+'</input><br />\
</td></tr></table>\
<div class="panel_info">\
<p><br/>'+tr("Create new")+':<br/>\
<span class="ui-icon ui-icon-arrowreturnthick-1-e inline-icon" /><a class="action_button" href="#vms_tab" value="VM.create_dialog">'+tr("VM Instance")+'</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("VM Template")+'</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("Virtual Network")+'</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("Image")+'</a></br>\
</p>\
</div>\
</div>\
</td>\
</tr>\
@ -131,7 +131,8 @@ var dashboard_tab_content =
var dashboard_tab = {
title: tr("Dashboard"),
content: dashboard_tab_content
content: dashboard_tab_content,
showOnTopMenu: true,
}
Sunstone.addMainTab('dashboard_tab',dashboard_tab);
@ -183,13 +184,6 @@ function plot_global_graph(data,info){
$.plot($('#'+id+'_graph',context),series,options);
}
function quickstart_setup(){
$('#dashboard_table #quickstart_form input',main_tabs_context).click(function(){
Sunstone.runAction($(this).val());
});
}
function graph_autorefresh(){
setInterval(function(){
refresh_graphs();
@ -205,17 +199,8 @@ function refresh_graphs(){
}
$(document).ready(function(){
//Dashboard link listener
$("#dashboard_table h3 a",main_tabs_context).live("click", function (){
var tab = $(this).attr('href');
showTab(tab);
return false;
});
emptyDashboard();
quickstart_setup();
refresh_graphs();
graph_autorefresh();
@ -262,14 +247,8 @@ function updateDashboard(what,json_info){
$('#failed_vms',db).html(failed_vms);
break;
case "vnets":
var public_vnets=0;
var total_vnets=json_info.length;
$.each(json_info,function(){
if (parseInt(this.VNET.PUBLIC)){
public_vnets++;}
});
$('#total_vnets',db).html(total_vnets+'&nbsp;/&nbsp;');
$('#public_vnets',db).html(public_vnets);
$('#total_vnets',db).html(total_vnets);
break;
case "users":
var total_users=json_info.length;
@ -277,24 +256,11 @@ function updateDashboard(what,json_info){
break;
case "images":
var total_images=json_info.length;
var public_images=0;
$.each(json_info,function(){
if (parseInt(this.IMAGE.PUBLIC)){
public_images++;}
});
$('#total_images',db).html(total_images+'&nbsp;/&nbsp;');
$('#public_images',db).html(public_images);
$('#total_images',db).html(total_images);
break;
case "templates":
var total_templates=json_info.length;
var public_templates=0;
$.each(json_info,function(){
if (parseInt(this.VMTEMPLATE.PUBLIC)){
public_templates++;
}
});
$('#total_templates',db).html(total_templates+'&nbsp;/&nbsp;');
$('#public_templates',db).html(public_templates);
$('#total_templates',db).html(total_templates);
break;
case "acls":
var total_acls=json_info.length;
@ -309,4 +275,4 @@ function updateDashboard(what,json_info){
$('#total_datastores',db).html(total_datastores);
break;
}
}
};

8
src/sunstone/public/js/plugins/datastores-tab.js
View File

@ -314,7 +314,9 @@ var datastore_info_panel = {
var datastores_tab = {
title: tr("Datastores"),
content: datastores_tab_content,
buttons: datastore_buttons
buttons: datastore_buttons,
tabClass: "hidden",
showOnTopMenu: true,
}
Sunstone.addActions(datastore_actions);
@ -683,4 +685,8 @@ $(document).ready(function(){
initCheckAllBoxes(dataTable_datastores);
tableCheckboxesListener(dataTable_datastores);
datastoreInfoListener();
$('div#header ul#menutop_ul li#top_datastores_tab').live('click',function(){
dataTable_datastores.fnFilter('',5);
});
})

7
src/sunstone/public/js/plugins/groups-tab.js
View File

@ -142,8 +142,10 @@ var group_buttons = {
var groups_tab = {
title: tr("Groups"),
content: groups_tab_content,
buttons: group_buttons
}
buttons: group_buttons,
tabClass: 'subTab',
parentTab: 'system_tab'
};
Sunstone.addActions(group_actions);
Sunstone.addMainTab('groups_tab',groups_tab);
@ -224,6 +226,7 @@ function updateGroupsView(request, group_list){
updateView(group_list_array,dataTable_groups);
updateGroupSelect(group_list);
updateDashboard("groups",group_list);
updateSystemDashboard("groups",group_list);
}
//Prepares the dialog to create

10
src/sunstone/public/js/plugins/hosts-tab.js
View File

@ -318,8 +318,10 @@ var host_info_panel = {
var hosts_tab = {
title: tr("Hosts"),
content: hosts_tab_content,
buttons: host_buttons
}
buttons: host_buttons,
tabClass: "hidden",
showOnTopMenu: true,
};
Sunstone.addActions(host_actions);
Sunstone.addMainTab('hosts_tab',hosts_tab);
@ -665,4 +667,8 @@ $(document).ready(function(){
initCheckAllBoxes(dataTable_hosts);
tableCheckboxesListener(dataTable_hosts);
hostInfoListener();
$('div#header ul#menutop_ul li#top_hosts_tab').live('click',function(){
dataTable_hosts.fnFilter('',3);
});
});

5
src/sunstone/public/js/plugins/images-tab.js
View File

@ -496,7 +496,9 @@ var image_info_panel = {
var images_tab = {
title: tr("Images"),
content: images_tab_content,
buttons: image_buttons
buttons: image_buttons,
tabClass: 'subTab',
parentTab: 'vres_tab'
}
Sunstone.addActions(image_actions);
@ -586,6 +588,7 @@ function updateImagesView(request, images_list){
updateView(image_list_array,dataTable_images);
updateDashboard("images",images_list);
updateVResDashboard("images",images_list);
}
// Callback to update the information panel tabs and pop it up

113
src/sunstone/public/js/plugins/system-tab.js Normal file
View File

@ -0,0 +1,113 @@
/* -------------------------------------------------------------------------- */
/* Copyright 2002-2012, OpenNebula Project Leads (OpenNebula.org) */
/* */
/* Licensed under the Apache License, Version 2.0 (the "License"); you may */
/* not use this file except in compliance with the License. You may obtain */
/* a copy of the License at */
/* */
/* http://www.apache.org/licenses/LICENSE-2.0 */
/* */
/* Unless required by applicable law or agreed to in writing, software */
/* distributed under the License is distributed on an "AS IS" BASIS, */
/* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. */
/* See the License for the specific language governing permissions and */
/* limitations under the License. */
/* -------------------------------------------------------------------------- */
var system_tab_content =
'<table class="dashboard_table" style=>\
<tr>\
<td style="width:50%">\
<table id="system_information_table" style="width:100%">\
<tr>\
<td>\
<div class="panel">\
<h3>' + tr("Summary of system resources") + '</h3>\
<div class="panel_info">\
\
<table class="info_table">\
<tr>\
<td class="key_td">' + tr("Groups") + '</td>\
<td class="value_td"><span id="system_total_groups"></span></td>\
</tr>\
<tr>\
<td class="key_td">' + tr("Users")+'</td>\
<td class="value_td"><span id="system_total_users"></span></td>\
</tr>\
<tr>\
<td class="key_td">' + tr("ACL Rules") + '</td>\
<td class="value_td"><span id="system_total_acls"></span></td>\
</tr>\
</table>\
\
</div>\
</div>\
</td>\
</tr>\
<tr>\
<td>\
<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>\
</div>\
</div>\
</td>\
</tr>\
</table>\
</td>\
<td style="width:50%">\
<table id="table_right" style="width:100%">\
<tr>\
<td>\
<div class="panel">\
<h3>' + tr("System Resources") + '</h3>\
<div class="panel_info">\
<p>'+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>\
</ul>\
</div>\
</div>\
</td>\
</tr>\
</table>\
</td>\
</tr></table>';
var system_tab = {
title: tr("System"),
content: system_tab_content
}
Sunstone.addMainTab('system_tab',system_tab);
function updateSystemDashboard(what, json_info){
var db = $('#system_tab',main_tabs_context);
switch (what){
case "groups":
var total_groups=json_info.length;
$('#system_total_groups',db).html(total_groups);
break;
case "users":
var total_users=json_info.length;
$('#system_total_users',db).html(total_users);
break;
case "acls":
var total_acls=json_info.length;
$('#system_total_acls',db).html(total_acls);
break;
};
}
$(document).ready(function(){
});

6
src/sunstone/public/js/plugins/templates-tab.js
View File

@ -830,7 +830,9 @@ var template_info_panel = {
var templates_tab = {
title: tr("Templates"),
content: templates_tab_content,
buttons: template_buttons
buttons: template_buttons,
tabClass: 'subTab',
parentTab: 'vres_tab'
}
Sunstone.addActions(template_actions);
@ -922,7 +924,7 @@ function updateTemplatesView(request, templates_list){
updateView(template_list_array,dataTable_templates);
updateTemplateSelect();
updateDashboard("templates",templates_list);
updateVResDashboard("templates",templates_list);
}
// Callback to update the information panel tabs and pop it up

7
src/sunstone/public/js/plugins/users-tab.js
View File

@ -306,8 +306,10 @@ var user_info_panel = {
var users_tab = {
title: tr("Users"),
content: users_tab_content,
buttons: user_buttons
}
buttons: user_buttons,
tabClass: 'subTab',
parentTab: 'system_tab'
};
Sunstone.addActions(user_actions);
Sunstone.addMainTab('users_tab',users_tab);
@ -383,6 +385,7 @@ function updateUsersView(request,users_list){
});
updateView(user_list_array,dataTable_users);
updateDashboard("users",users_list);
updateSystemDashboard("users",users_list);
updateUserSelect();
};

5
src/sunstone/public/js/plugins/vms-tab.js
View File

@ -598,7 +598,9 @@ var vm_info_panel = {
var vms_tab = {
title: tr("Virtual Machines"),
content: vms_tab_content,
buttons: vm_buttons
buttons: vm_buttons,
tabClass: 'subTab',
parentTab: 'vres_tab'
}
Sunstone.addActions(vm_actions);
@ -700,6 +702,7 @@ function updateVMachinesView(request, vmachine_list){
updateView(vmachine_list_array,dataTable_vMachines);
updateDashboard("vms",vmachine_list);
updateVResDashboard("vms",vmachine_list);
}

8
src/sunstone/public/js/plugins/vnets-tab.js
View File

@ -457,7 +457,9 @@ var vnet_info_panel = {
var vnets_tab = {
title: tr("Virtual Networks"),
content: vnets_tab_content,
buttons: vnet_buttons
buttons: vnet_buttons,
tabClass: "hidden",
showOnTopMenu: true,
}
Sunstone.addActions(vnet_actions);
@ -1197,4 +1199,8 @@ $(document).ready(function(){
initCheckAllBoxes(dataTable_vNetworks);
tableCheckboxesListener(dataTable_vNetworks);
vNetworkInfoListener();
$('div#header ul#menutop_ul li#top_vnets_tab').live('click',function(){
dataTable_vNetworks.fnFilter('',5);
});
});

137
src/sunstone/public/js/plugins/vresources-tab.js Normal file
View File

@ -0,0 +1,137 @@
/* -------------------------------------------------------------------------- */
/* Copyright 2002-2012, OpenNebula Project Leads (OpenNebula.org) */
/* */
/* Licensed under the Apache License, Version 2.0 (the "License"); you may */
/* not use this file except in compliance with the License. You may obtain */
/* a copy of the License at */
/* */
/* http://www.apache.org/licenses/LICENSE-2.0 */
/* */
/* Unless required by applicable law or agreed to in writing, software */
/* distributed under the License is distributed on an "AS IS" BASIS, */
/* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. */
/* See the License for the specific language governing permissions and */
/* limitations under the License. */
/* -------------------------------------------------------------------------- */
var vres_tab_content =
'<table class="dashboard_table" style=>\
<tr>\
<td style="width:50%">\
<table style="width:100%">\
<tr>\
<td>\
<div class="panel">\
<h3>' + tr("Summary of virtual resources") + '</h3>\
<div class="panel_info">\
\
<table class="info_table">\
<tr>\
<td class="key_td">' + tr("VM Templates") + '</td>\
<td class="value_td"><span id="vres_total_templates"></span></td>\
</tr>\
<tr>\
<td class="key_td">' +
tr("VM Instances")+ ' (' +
tr("total") + '/<span class="green">' +
tr("running") + '</span>/<span class="red">' +
tr("failed") + '</span>)</td>\
<td class="value_td"><span id="vres_total_vms"></span><span id="vres_running_vms" class="green"></span><span id="vres_failed_vms" class="red"></span></td>\
</tr>\
<!--\
<tr>\
<td class="key_td">' + tr("Virtual Networks") + '</td>\
<td class="value_td"><span id="vres_total_vnets"></span></td>\
</tr>-->\
<tr>\
<td class="key_td">' + tr("Images") + '</td>\
<td class="value_td"><span id="vres_total_images"></span></td>\
</table>\
\
</div>\
</div>\
</td>\
</tr>\
<tr>\
<td>\
<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>\
</div>\
</div>\
</td>\
</tr>\
</table>\
</td>\
<td style="width:50%">\
<table id="table_right" style="width:100%">\
<tr>\
<td>\
<div class="panel">\
<h3>' + tr("Virtual Resources") + '</h3>\
<div class="panel_info">\
<p>'+tr("The Virtual Resources menu allows management of Virtual Machine Templates, Instances and Images.")+'</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>\
</ul>\
</div>\
</div>\
</td>\
</tr>\
</table>\
</td>\
</tr></table>';
var vres_tab = {
title: tr("Virtual Resources"),
content: vres_tab_content
}
Sunstone.addMainTab('vres_tab',vres_tab);
function updateVResDashboard(what,json_info){
var db = $('#vres_tab',main_tabs_context);
switch (what){
case "vms":
var total_vms=json_info.length;
var running_vms=0;
failed_vms=0;
$.each(json_info,function(){
vm_state = parseInt(this.VM.STATE);
if (vm_state == 3){
running_vms++;
}
else if (vm_state == 7) {
failed_vms++;
}
});
$('#vres_total_vms',db).html(total_vms+'&nbsp;/&nbsp;');
$('#vres_running_vms',db).html(running_vms+'&nbsp;/&nbsp;');
$('#vres_failed_vms',db).html(failed_vms);
break;
case "vnets":
var total_vnets=json_info.length;
$('#vres_total_vnets',db).html(total_vnets);
break;
case "images":
var total_images=json_info.length;
$('#vres_total_images',db).html(total_images);
break;
case "templates":
var total_templates=json_info.length;
$('#vres_total_templates',db).html(total_templates);
break;
};
};
$(document).ready(function(){
});

28
src/sunstone/public/js/sunstone-util.js
View File

@ -422,6 +422,34 @@ function getImageName(id){
return id;
};
function getClusterName(id){
if (typeof(dataTable_clusters) != "undefined"){
return getName(id,dataTable_clusters,2);
}
return id;
};
function getDatastoreName(id){
if (typeof(dataTable_datastores) != "undefined"){
return getName(id,dataTable_datastores,4);
}
return id;
};
function getVNetName(id){
if (typeof(dataTable_vNetworks) != "undefined"){
return getName(id,dataTable_vNetworks,4);
}
return id;
};
function getHostName(id){
if (typeof(dataTable_hosts) != "undefined"){
return getName(id,dataTable_hosts,2);
}
return id;
};
function getName(id,dataTable,name_col){
var name = id;
if (typeof(dataTable) == "undefined") {

34
src/sunstone/public/js/sunstone.js
View File

@ -296,7 +296,7 @@ $(document).ready(function(){
//Insert the tabs in the DOM and their buttons.
insertTabs();
//hideSubTabs();
// hideSubTabs();
insertButtons();
//Enhace the look of select buttons
@ -373,7 +373,7 @@ $(document).ready(function(){
});
//Start with the dashboard (supposing we have one).
showTab('#dashboard_tab');
showTab('dashboard_tab');
});
@ -452,26 +452,30 @@ function insertTabs(){
//adding the content to the proper div and by adding a list item
//link to the navigation menu
function insertTab(tab_name){
var tab_info = SunstoneCfg["tabs"][tab_name];
var condition = tab_info["condition"];
var tabClass = tab_info["tabClass"];
var parent = "";
if (!tabClass) {
tabClass="topTab";
} else if (tabClass=="subTab") {
parent = tab_info["parentTab"];
};
var tab_info = SunstoneCfg['tabs'][tab_name];
var condition = tab_info['condition'];
var tabClass = tab_info['tabClass'] ? tab_info['tabClass'] : 'topTab';
var parent = tab_info['parentTab'] ? tab_info['parentTab'] : '';
var showOnTop = tab_info['showOnTopMenu'];
//skip this tab if we do not meet the condition
if (condition && !condition()) {return;}
main_tabs_context.append('<div id="'+tab_name+'" class="tab"></div>');
main_tabs_context.append('<div id="'+tab_name+'" class="tab" style="display:none;"></div>');
$('div#'+tab_name,main_tabs_context).html(tab_info.content);
$('div#menu ul#navigation').append('<li id="li_'+tab_name+'" class="'+tabClass+' '+parent+'"><a href="#'+tab_name+'">'+tab_info.title+'</a></li>');
}
$('div#menu ul#navigation').append('<li id="li_'+tab_name+'" class="'+tabClass+' '+parent+'">'+tab_info.title+'<span class="ui-icon ui-icon-circle-plus plusIcon"></span></li>');
if (parent){ //this is a subtab
$('div#menu li#li_'+tab_name).hide();//hide by default
$('div#menu li#li_'+parent+' span').css("display","inline-block");
};
if (showOnTop){
$('div#header ul#menutop_ul').append('<li id="top_'+tab_name+'">'+tab_info.title+'</li>');
};
};
function hideSubTabs(){
for (tab in SunstoneCfg["tabs"]){

11
src/sunstone/views/index.erb
View File

@ -58,7 +58,7 @@
</div>
<div id="menu" class="outer-west">
<ul id="navigation">
<ul id="navigation" class="navigation">
</ul>
</div>
@ -66,6 +66,15 @@
<div id="logo">
<img src="images/opennebula-sunstone-small.png"/>
</div>
<div id="menutop_container">
<div id="menutop_navbar">
<ul id="menutop_ul">
</ul>
</div>
</div>
<div id="login-info">
<span id="welcome">Welcome</span>&nbsp;<span id="user"></span>&nbsp;|&nbsp;<a href="#" id="logout">Sign Out</a>
</div>