arif/xcat-core
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Set theme for all elements on UI.

Browse Source 
git-svn-id: https://svn.code.sf.net/p/xcat/code/xcat-core/trunk@10666 8638fb3e-16cb-4fca-ae20-7b5d299a9bcd
This commit is contained in:
phamt
2011-09-28 20:01:24 +00:00
parent e4e977649f
commit a5adea2fd4
6 changed files with 166 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
xCAT-UI/css/style.css
View File

@@ -36,7 +36,6 @@
height: 39px;
width: 1000px;
margin: 0px auto;
background: url(../images/jquery/default/ui-bg_highlight-soft_75_2191c0_1x100.png) 50% 50% repeat-x;
-moz-border-radius: .3em;
-webkit-border-radius: .3em;
border-radius: .3em;
@@ -63,15 +62,10 @@
float: left;
font: 14px verdana, arial, helvetica, sans-serif;
font-weight: bold;
color: white;
padding: 11px 30px;
cursor: pointer;
}
#header ul a:hover {
background-color: #A9D0F5;
}
/* User name and log out */
#header div {
float: right;
@@ -115,6 +109,11 @@ body {
overflow: auto;
}
.ui-widget-content {
background: white;
color: inherit;
}
/*--------------- Groups ---------------*/
#groups {
width: 150px;
@@ -229,7 +228,6 @@ span.ui-icon-info {
.tab a {
cursor: pointer;
color: #0000FF;
}
.tab .ui-icon-close {
@@ -249,19 +247,15 @@ span.ui-icon-info {
.tab th {
font: 12px verdana, arial, helvetica, sans-serif;
color: #424242;
padding: 10px;
background-color: #A9D0F5;
border-width: 1px;
border-style: solid;
border-color: #BDBDBD;
vertical-align: middle;
text-align: center;
}
.tab td {
font: 12px verdana, arial, helvetica, sans-serif;
color: #424242;
padding: 5px 15px;
border-width: 1px;
border-style: solid;
@@ -318,16 +312,27 @@ legend {
/*--------------- menu Div Actions bar ---------------*/
.menuDiv {
background:none repeat scroll 0 0 #79B7E7;
padding: 0.5em;
height: 30px;
}
.sf-menu {
background : none repeat scroll 0 0 #79B7E7;
border :1px solid #f5f5f5;
border-radius :0.3em 0.3em 0.3em 0.3em;
margin-bottom: 0;
background: none;
border: 0px solid;
}
.sf-menu ul li {
width: 99%;
}
.sf-menu .sf-menu {
border: 0px solid;
}
.sf-menu li:hover,.sf-menu li.sfHover {
background: none;
}
.sf-sub-indicator{
@@ -336,7 +341,7 @@ legend {
.actionBar {
display: inline-table;
width:50%;
width: 50%;
}
.actionBar div {
@@ -344,14 +349,9 @@ legend {
}
.actionBar a {
color: #FFFFFF;
font-weight: bold;
}
.actionBar a:hover {
color: #026890;
}
.actionBar li {
list-style: none;
margin: 0;
@@ -409,7 +409,6 @@ legend {
/*** Table ***/
.datatable {
width: 100%;
border: solid 1px #BDBDBD;
border-spacing: 0px;
border-collapse: collapse;
display: inline-table;
@@ -419,7 +418,6 @@ legend {
font: 12px verdana, arial, helvetica, sans-serif;
padding: 5px 0px;
white-space: nowrap; /* Do not use word wrap */
border: solid 1px #BDBDBD;
vertical-align: middle;
text-align: center;
min-width: 30px;
@@ -427,7 +425,6 @@ legend {
.datatable th {
font: bold 12px verdana, arial, helvetica, sans-serif;
background-color: #F2F2F2;
border-width: 0px;
}

6
xCAT-UI/js/custom/zvm.js
View File

@@ -494,7 +494,7 @@ zvmPlugin.prototype.loadInventory = function(data) {
var procFooter = $('<tfoot></tfoot>');
// Table columns - Type, Address, ID, Base, Dedicated, and Affinity
var procTabRow = $('<thead> <th>Type</th> <th>Address</th> <th>ID</th> <th>Base</th> <th>Dedicated</th> <th>Affinity</th> </thead>');
var procTabRow = $('<thead class="ui-widget-header"> <th>Type</th> <th>Address</th> <th>ID</th> <th>Base</th> <th>Dedicated</th> <th>Affinity</th> </thead>');
procTable.append(procTabRow);
var procType, procAddr, procId, procAff;
@@ -631,7 +631,7 @@ zvmPlugin.prototype.loadInventory = function(data) {
}];
// Table columns - Virtual Device, Type, VolID, Type of Access, and Size
var dasdTabRow = $('<thead> <th>Virtual Device #</th> <th>Type</th> <th>VolID</th> <th>Type of Access</th> <th>Size</th> </thead>');
var dasdTabRow = $('<thead class="ui-widget-header"> <th>Virtual Device #</th> <th>Type</th> <th>VolID</th> <th>Type of Access</th> <th>Size</th> </thead>');
dasdTable.append(dasdTabRow);
var dasdVDev, dasdType, dasdVolId, dasdAccess, dasdSize;
@@ -721,7 +721,7 @@ zvmPlugin.prototype.loadInventory = function(data) {
} ];
// Table columns - Virtual device, Adapter Type, Port Name, # of Devices, MAC Address, and LAN Name
var nicTabRow = $('<th>Virtual Device #</th> <th>Adapter Type</th> <th>Port Name</th> <th># of Devices</th> <th>LAN Name</th>');
var nicTabRow = $('<thead class="ui-widget-header"> <th>Virtual Device #</th> <th>Adapter Type</th> <th>Port Name</th> <th># of Devices</th> <th>LAN Name</th></thead>');
nicTable.append(nicTabRow);
var nicVDev, nicType, nicPortName, nicNumOfDevs, nicMacAddr, nicLanName;

43
xCAT-UI/js/nodes/nodes.js
View File

@@ -814,6 +814,49 @@ function loadNodes(data) {
actionsMenu.superfish();
actionsMenu.css('display', 'inline-block');
actionBar.append(actionsMenu);
// 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);
}, function() {
// Change back to normal
$(this).css('background', '');
$(this).find('a:eq(0)').css('color', '');
});
// Insert action bar and nodes datatable
$('#nodesTab').append(nodesTable.object());

43
xCAT-UI/js/nodes/physical.js
View File

@@ -542,6 +542,49 @@ function createActionMenu(){
actionBar.append(actionsMenu);
actionBar.css('margin-top', '10px');
// 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);
}, function() {
// Change back to normal
$(this).css('background', '');
$(this).find('a:eq(0)').css('color', '');
});
return actionBar;
}

73
xCAT-UI/js/ui.js
View File

@@ -149,7 +149,7 @@ var Table = function(tableId) {
Table.prototype.init = function(headers) {
// Create a table
this.table = $('<table id="' + this.tableId + '"></table>');
var thead = $('<thead></thead>');
var thead = $('<thead class="ui-widget-header"></thead>');
var headRow = $('<tr></tr>');
// Append headers
@@ -247,7 +247,7 @@ var DataTable = function(tableId) {
DataTable.prototype.init = function(headers) {
// Create a table
this.dataTable = $('<table class="datatable" id="' + this.dataTableId + '"></table>');
var thead = $('<thead></thead>');
var thead = $('<thead class="ui-widget-header"></thead>');
var headRow = $('<tr></tr>');
// Append headers
@@ -418,7 +418,7 @@ function createButton(name) {
* @return A division containing the menu
*/
function createMenu(items) {
var menu = $('<ul class="sf-menu"></ul>');
var menu = $('<ul class="sf-menu ui-state-default"></ul>');
// Loop through each item
for ( var i in items) {
@@ -434,16 +434,10 @@ function createMenu(items) {
} else {
item.append(items[i]);
}
// Do not add border for 1st item
if (i > 0) {
item.css( {
'border-left' : '1px solid #BDBDBD'
});
}
menu.append(item);
}
return menu;
}
@@ -522,32 +516,77 @@ function initPage() {
$('#xcat_settings').click(function() {
openSettings();
});
// Set header to theme
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';
}
$('#header').addClass('ui-state-default');
$('#header').css('border', '0px');
// Set theme to user span
$('#login_user').css('color', color);
// Style for selected page
var style = {
'background-color': background,
'color': color
};
// Get the page being loaded
var url = window.location.pathname;
var page = url.replace('/xcat/', '');
var headers = $('#header ul li a');
// Show the page
$("#content").children().remove();
if (page == 'configure.php') {
includeJs("js/configure/update.js");
includeJs("js/configure/discover.js");
headers.eq(1).css('background-color', '#A9D0F5');
headers.eq(1).css(style);
loadConfigPage();
} else if (page == 'provision.php') {
includeJs("js/provision/images.js");
headers.eq(2).css('background-color', '#A9D0F5');
headers.eq(2).css(style);
loadProvisionPage();
} else if (page == 'monitor.php') {
includeJs("js/monitor/xcatmon.js");
includeJs("js/monitor/rmcmon.js");
includeJs("js/monitor/gangliamon.js");
headers.eq(3).css('background-color', '#A9D0F5');
headers.eq(3).css(style);
loadMonitorPage();
} else if (page == 'guide.php') {
includeJs("js/guide/guide.js");
headers.eq(4).css('background-color', '#A9D0F5');
headers.eq(4).css(style);
loadGuidePage();
} else {
// Load nodes page by default
@@ -557,7 +596,7 @@ function initPage() {
includeJs("js/nodes/updatenode.js");
includeJs("js/nodes/physical.js");
includeJs("js/nodes/mtm.js");
headers.eq(0).css('background-color', '#A9D0F5');
headers.eq(0).css(style);
loadNodesPage();
}
}

2
xCAT-UI/lib/ui.php
View File

@@ -36,7 +36,7 @@ function loadPage() {
if (isset($_SESSION['username'])){
echo
"<div>
<span style='padding: 0 6px; color: white; font-weight: bold;'>{$_SESSION['username']}</span> | <a id='xcat_settings'>Settings</a> | <a href='lib/logout.php'>Log out</a>
<span id='login_user' style='padding: 0 6px; font-weight: bold;'>{$_SESSION['username']}</span> | <a id='xcat_settings'>Settings</a> | <a href='lib/logout.php'>Log out</a>
</div>";
}