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:
		| @@ -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; | ||||
| } | ||||
|  | ||||
|   | ||||
| @@ -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); | ||||
|   | ||||
| @@ -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>"; | ||||
|   | ||||
| @@ -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(); | ||||
|         }, | ||||
|   | ||||
| @@ -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();} | ||||
| 	}); | ||||
| 	 | ||||
|   | ||||
| @@ -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();}, | ||||
|   | ||||
| @@ -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: { | ||||
|   | ||||
| @@ -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' | ||||
|   | ||||
| @@ -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);			 | ||||
|   | ||||
| @@ -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 | ||||
|   | ||||
| @@ -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; | ||||
|   | ||||
| @@ -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); | ||||
|   | ||||
| @@ -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; | ||||
| 	        } | ||||
|  | ||||
|   | ||||
| @@ -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', ''); | ||||
| } | ||||
		Reference in New Issue
	
	Block a user