Set theme for all elements on UI.

git-svn-id: https://svn.code.sf.net/p/xcat/code/xcat-core/trunk@10669 8638fb3e-16cb-4fca-ae20-7b5d299a9bcd
This commit is contained in:
phamt 2011-09-28 21:38:12 +00:00
parent c268671a9e
commit 1fd84b148d
14 changed files with 99 additions and 93 deletions

View File

@ -246,7 +246,7 @@ span.ui-icon-info {
}
.tab th {
font: 12px verdana, arial, helvetica, sans-serif;
font: bold 12px verdana, arial, helvetica, sans-serif;
padding: 10px;
border-width: 1px;
border-style: solid;
@ -263,6 +263,10 @@ span.ui-icon-info {
vertical-align: middle;
}
.tab table a {
color: blue;
}
.tab span a,.tab li a {
text-decoration: none;
cursor: pointer;
@ -448,7 +452,7 @@ legend {
.datatable a {
text-decoration: none;
color: #000FF;
color: blue;
cursor: pointer;
}

View File

@ -126,7 +126,7 @@ function loadTableNames(data) {
for ( var i = 0; i < tables.length; i++) {
// Create a link for each table
var args = tables[i].split(':');
var link = $('<a id="' + args[0] + '">' + args[0] + '</a>');
var link = $('<a style="color: blue;" id="' + args[0] + '">' + args[0] + '</a>');
// Open table on click
link.bind('click', function(e) {
@ -438,6 +438,13 @@ function loadTable(data) {
actionsMenu.css('display', 'inline-block');
actionBar.append(actionsMenu);
// Set correct theme for action menu
actionsMenu.find('li').hover(function() {
setMenu2Theme($(this));
}, function() {
setMenu2Normal($(this));
});
// Create a division to hold actions menu
var menuDiv = $('<div id="' + id + 'Datatable_menuDiv" class="menuDiv"></div>');
$('#' + id + 'Datatable_wrapper').prepend(menuDiv);

View File

@ -126,7 +126,7 @@ function showRpmInfo(data) {
$('#rpm fieldset').children().remove();
$('#rpm fieldset').append("<legend>xCAT RPMs</legend>");
show = "<table id=rpmtable >";
show += "<thead><tr>";
show += "<thead class='ui-widget-header'><tr>";
show += "<th><input type='checkbox' id='selectall' value='' onclick='updateSelectAll()'></th>";
show += "<th><b>Package Name</b></th><th><b>Version</b></th>";
show += "</tr></thead>";

View File

@ -279,7 +279,7 @@ bladePlugin.prototype.addNode = function() {
nodeTypeSelectDia.dialog( {
modal : true,
width : 400,
title : 'Select Node Type',
title : 'Add node',
open : function(event, ui) {
$(".ui-dialog-titlebar-close").hide();
},

View File

@ -170,7 +170,7 @@ hmcPlugin.prototype.addNode = function() {
diaDiv.dialog({
modal : true,
width : 400,
title : 'Add System p Node',
title : 'Add node',
close : function(){$('#addpnodeDiv').remove();}
});

View File

@ -171,7 +171,7 @@ ipmiPlugin.prototype.loadResources = function() {
* @return Nothing
*/
ipmiPlugin.prototype.addNode = function() {
var diag = $('<div id="addIdplx" class="form" title="Add iDataPlex"></div>');
var diag = $('<div id="addIdplx" class="form"></div>');
var info = createInfoBar('Add a node range');
diag.append(info);
@ -199,6 +199,7 @@ ipmiPlugin.prototype.addNode = function() {
bmcFieldSet.append(bmcInputs);
diag.dialog({
title: 'Add node',
modal: true,
width: 400,
close: function(){$(this).remove();},

View File

@ -343,7 +343,7 @@ zvmPlugin.prototype.loadInventory = function(data) {
* Show user entry
*/
var toggleLinkId = node + 'ToggleLink';
var toggleLink = $('<a id="' + toggleLinkId + '">Show directory entry</a>');
var toggleLink = $('<a style="color: blue;" id="' + toggleLinkId + '">Show directory entry</a>');
toggleLink.one('click', function(event) {
// Toggle inventory division
$('#' + invDivId).toggle();
@ -928,6 +928,7 @@ zvmPlugin.prototype.addNode = function() {
// Open form as a dialog
addNodeForm.dialog({
title: 'Add node',
modal: true,
width: 400,
buttons: {

View File

@ -2276,7 +2276,7 @@ function createZProvisionNew(inst) {
var diskDiv = $('<div class="provision"></div>');
var diskLabel = $('<label>Disks:</label>');
var diskTable = $('<table></table>');
var diskHeader = $('<thead> <th></th> <th>Type</th> <th>Address</th> <th>Size</th> <th>Mode</th> <th>Pool</th> <th>Password</th> </thead>');
var diskHeader = $('<thead class="ui-widget-header"> <th></th> <th>Type</th> <th>Address</th> <th>Size</th> <th>Mode</th> <th>Pool</th> <th>Password</th> </thead>');
// Adjust header width
diskHeader.find('th').css( {
'width' : '80px'

View File

@ -118,9 +118,9 @@ function loadMonitorPage() {
// Turn on or off monitoring tool when clicked
statusButton.find('input["' + name + '"]:radio').change(toggleMonitor);
}
var monTable = $('<table></table>');
monTable.append($('<thead><tr><th><b>Tool</b></th><th><b>Status</b></th><th><b>Description</b></th></tr></thead>'));
monTable.append($('<thead class="ui-widget-header"><tr><th><b>Tool</b></th><th><b>Status</b></th><th><b>Description</b></th></tr></thead>'));
var monTableBody = $('<tbody></tbody>');
monTable.append(monTableBody);

View File

@ -409,7 +409,7 @@ function mkAddNodeLink() {
addNodeForm.dialog({
modal: true,
width: 400,
title:'Add Node',
title:'Add node',
close: function(){$(this).remove();},
buttons: {
'Ok': function(){
@ -817,45 +817,9 @@ function loadNodes(data) {
// Set correct theme for action menu
actionsMenu.find('li').hover(function() {
// On hover
var background = '', color = '';
var theme = $.cookie('xcat_theme');
if (theme) {
switch (theme) {
case 'cupertino':
background = '#3BAAE3';
color = 'white';
break;
case 'dark_hive':
background = '#0972A5';
break;
case 'redmond':
background = '#F5F8F9';
color = '#E17009';
break;
case 'start':
background = '#6EAC2C';
break;
case 'sunny':
background = 'white';
color = '#0074C7';
break;
case 'ui_dark':
background = '#F58400';
break;
default:
background = '#6EAC2C';
}
} else {
background = '#6EAC2C';
}
$(this).css('background', background);
$(this).find('a:eq(0)').css('color', color);
setMenu2Theme($(this));
}, function() {
// Change back to normal
$(this).css('background', '');
$(this).find('a:eq(0)').css('color', '');
setMenu2Normal($(this));
});
// Insert action bar and nodes datatable

View File

@ -544,45 +544,9 @@ function createActionMenu(){
// Set correct theme for action menu
actionsMenu.find('li').hover(function() {
// On hover
var background = '', color = '';
var theme = $.cookie('xcat_theme');
if (theme) {
switch (theme) {
case 'cupertino':
background = '#3BAAE3';
color = 'white';
break;
case 'dark_hive':
background = '#0972A5';
break;
case 'redmond':
background = '#F5F8F9';
color = '#E17009';
break;
case 'start':
background = '#6EAC2C';
break;
case 'sunny':
background = 'white';
color = '#0074C7';
break;
case 'ui_dark':
background = '#F58400';
break;
default:
background = '#6EAC2C';
}
} else {
background = '#6EAC2C';
}
$(this).css('background', background);
$(this).find('a:eq(0)').css('color', color);
setMenu2Theme($(this));
}, function() {
// Change back to normal
$(this).css('background', '');
$(this).find('a:eq(0)').css('color', '');
setMenu2Normal($(this));
});
return actionBar;

View File

@ -188,6 +188,13 @@ function loadImages(data) {
actionsMenu.css('display', 'inline-block');
actionBar.append(actionsMenu);
// Set correct theme for action menu
actionsMenu.find('li').hover(function() {
setMenu2Theme($(this));
}, function() {
setMenu2Normal($(this));
});
// Create a division to hold actions menu
var menuDiv = $('<div id="' + imgTableId + '_menuDiv" class="menuDiv"></div>');
$('#' + imgTableId + '_wrapper').prepend(menuDiv);

View File

@ -109,24 +109,24 @@ function loadProvisionPage() {
else{
var tabtitle = '';
// Create an instance of the plugin
// Create an instance of the plugin
var plugin;
switch (hw) {
case "blade":
plugin = new bladePlugin();
tabtitle = 'Blade';
tabtitle = 'BladeCenter';
break;
case "hmc":
plugin = new hmcPlugin();
tabtitle = 'System P';
tabtitle = 'System p';
break;
case "ipmi":
plugin = new ipmiPlugin();
tabtitle = 'System X';
tabtitle = 'iDataPlex';
break;
case "zvm":
plugin = new zvmPlugin();
tabtitle = 'zVM';
tabtitle = 'System z';
break;
}

View File

@ -813,4 +813,62 @@ function openSettings() {
}
}
});
}
/**
* Set menu theme
*
* @param menu
* Menu object
* @return Nothing
*/
function setMenu2Theme(menu) {
// On hover
var background = '', color = '';
var theme = $.cookie('xcat_theme');
if (theme) {
switch (theme) {
case 'cupertino':
background = '#3BAAE3';
color = 'white';
break;
case 'dark_hive':
background = '#0972A5';
break;
case 'redmond':
background = '#F5F8F9';
color = '#E17009';
break;
case 'start':
background = '#6EAC2C';
break;
case 'sunny':
background = 'white';
color = '#0074C7';
break;
case 'ui_dark':
background = '#F58400';
break;
default:
background = '#6EAC2C';
}
} else {
background = '#6EAC2C';
}
menu.css('background', background);
menu.find('a:eq(0)').css('color', color);
}
/**
* Set menu back to normal before applying theme
*
* @param menu
* Menu object
* @return Nothing
*/
function setMenu2Normal(menu) {
// Change back to normal
menu.css('background', '');
menu.find('a:eq(0)').css('color', '');
}