diff --git a/xCAT-UI/css/style.css b/xCAT-UI/css/style.css index 19420bbe1..f40a28c39 100644 --- a/xCAT-UI/css/style.css +++ b/xCAT-UI/css/style.css @@ -4,7 +4,7 @@ font: 12px verdana, arial, helvetica, sans-serif; } -.ui-dialog label,.ui-dialog input,.ui-dialog p,.ui-dialog button { +.ui-dialog label,.ui-dialog input,.ui-dialog p,.ui-dialog button,.ui-dialog td { font: 12px verdana, arial, helvetica, sans-serif; } @@ -31,6 +31,46 @@ margin: 0px; } +/*--------------- login dialog ---------*/ +#logdialog { + width: 600px; +} + +#logdialog td{ + width: 110px; + height: 30px; + color: #0078AE; + font-size: 14px; + font-weight: bold; +} + +#logdialog input{ + width: 219px; + border: solid 1px #0078AE; + font-size: 14px; +} + +#logdialog p{ + + font-size: 18px; +} + +#logdialog button{ + font-weight: bold; + width: 90px; +} + +#loginput { + background-color: #f5f5f5; + height: 260px; +} + +#loginfo{ + text-align:right; + color: #f5f5f5; + font-weight:bold; +} + /*--------------- Header ---------------*/ #header { height: 40px; @@ -123,45 +163,73 @@ body { overflow: auto; } +#content .ui-widget-header { + border-color: #4297D7 #4297D7 #7BB642; + border-width: 1px 1px 4px; +} + /*--------------- Groups ---------------*/ #groups { width: 150px; vertical-align: top; float: left; position: relative; - margin: 15px 0px 15px 15px; -} - -#groups ul { - list-style: none; + margin-top: 10px; } #groups ul h3 { text-transform: uppercase; - font: 12px verdana, arial, helvetica, sans-serif; - font-weight: bold; color: #424242; display: inline-table; } #groups a { - font: 12px verdana, arial, helvetica, sans-serif; color: #0000FF; display: inline-table; - padding: 5px 15px 5px 15px; /* Top right bottom left */ + padding: 5px 0px 5px 20px; /* Top right bottom left */ text-decoration: none; cursor: pointer; } -#groups a:hover { - color: #FF0000; +#groups .grouplabel { + padding: 5px 0px 5px 10px; + font-weight: bold; + font-size: 15px; +} + +#groups .groupdiv{ + padding-left: 10px; +} + +#groups .groupdiv div:hover { + background: #E7EBFF; + cursor: pointer; +} + +#groups .selectgroup { + background: #E6E6F2; + font-weight: bold; +} + +#groups .actionDiv{ + text-align: right; + padding-right: 5px; + border-top: thin solid #E7EBFF; } /*--------------- Nodes section ---------------*/ #nodes { - width: 700px; - margin: 20px; - display: inline-table; + width: 790px; + min-height: 570px; + margin: 10px 0px 0px 0px; + padding: 0px 0px 0px 5px; + display: inline-block; + border-left: medium solid #E6E6F2; +} + +#nodes .summarypie { + width: 370px; + height: 280px; } /*--------------- Info/warning bar ---------------*/ @@ -205,6 +273,7 @@ span.ui-icon-info { .tab a { cursor: pointer; + color: #0000FF; } .tab .ui-icon-close { @@ -279,7 +348,7 @@ legend { .tab li { list-style: none; padding: 5px; - margin: 0; + margin: 1; } .tab textarea { @@ -291,36 +360,56 @@ legend { height: 300px; } -/*--------------- Actions bar ---------------*/ +/*--------------- menu Div Actions bar ---------------*/ +.menuDiv { + background:none repeat scroll 0 0 #79B7E7; + padding: 0.5em; +} + +.sf-menu { + background : none repeat scroll 0 0 #79B7E7; + border :1px solid #f5f5f5; + border-radius :0.5em 0.5em 0.5em 0.5em; + margin-bottom: 0; +} + +.sf-sub-indicator{ + right:0; +} + .actionBar { display: inline-table; + width:50%; } .actionBar div { padding: 10px 0px; } -.actionBar span { - padding: 0px 10px; +.actionBar a { + color: #FFFFFF; + font-weight: bold; } -.actionBar a { - color: #2E6E9E; - font-weight: bold; - cursor: pointer; +.actionBar a:hover { + color: #026890; } .actionBar li { list-style: none; - padding: 5px; + padding: 2px; margin: 0; } /*--------------- jQuery datatable ---------------*/ .dataTables_wrapper { overflow: auto; - width: 700px; - margin: 0px auto; + width: auto; + margin: 10px auto; + -moz-border-radius:5px; + -webkit-border-radius:5px; + border-radius:5px; + background-color: #f5f5f5; } /*** Show X entries ***/ @@ -333,11 +422,10 @@ legend { /*** Search ***/ .dataTables_filter { - width: 50%; + width: 40%; display: block; float: right; text-align: right; - padding: 10px 10px; } .tab input,select { @@ -364,7 +452,7 @@ legend { /*** Table ***/ .datatable { - width: 660px; + width: 100%; border-width: 1px; border-spacing: 0px; border-style: solid; @@ -595,6 +683,47 @@ table a:hover { } /*--------------- Provision and monitor forms ---------------*/ +.rmcnormal { + border: 2px outset #7FFFD4; + background: #66CD00; + cursor: pointer; +} + +.rmcwarning { + background: #FFD700; + border: 2px outset #EEEE00; + cursor: pointer; +} + +.rmcerror { + background: #FF3030; + border: 2px outset #FF4040; +} + +.rmcunknown { + background: #8B8B7A; + border: 2px outset #858585; +} + +.rmcnodeli { + width: 16px; + height: 16px; + float: left; +} + +.rmcsumdiv { + width: 300px; + height: 150px; + float: left; + margin: 0px 0px 10px 0px; +} + +.rmcnodediv { + width: 240px; + height: 120px; + margin: 0px 0px 15px 0px; +} + .provision div,.monitor div { margin: 10px 0; display: block; @@ -609,19 +738,6 @@ table a:hover { height: 150px; } -.monitorsumdiv { - width: 300px; - height: 150px; - float: left; - margin: 0px 0px 10px 0px; -} - -.monitornodediv { - width: 240px; - height: 120px; - margin: 0px 0px 15px 0px; -} - /*--------------- Physical layout section ---------------*/ .frameDiv { width: 179px; @@ -685,28 +801,25 @@ table a:hover { /*--------------- Discovery section ---------------*/ .discoverstep { - width: 220px; + width: 960px; vertical-align: top; - float: left; - position: relative; - overflow: auto; background-color: #A9D0F5; - padding: 5px 0px; + padding: 0px 0px 0px 5px; -moz-border-radius: .5em; -webkit-border-radius: .5em; border-radius: .5em; } -.discoverstep span { +.discovercurrentstep{ + background-color: yellow; font: normal bold 12px/ 35px verdana, arial, helvetica, sans-serif; padding: 5px; - margin: 0px 5px; /* Top right left bottom*/ } .discovercontent { - width: 700px; + width: 960px; display: inline-table; - padding: 0 0 0 20px; + padding: 0; } .discovercontent table{ diff --git a/xCAT-UI/guide.php b/xCAT-UI/guide.php new file mode 100644 index 000000000..8529d430a --- /dev/null +++ b/xCAT-UI/guide.php @@ -0,0 +1,17 @@ + \ No newline at end of file diff --git a/xCAT-UI/images/logo.png b/xCAT-UI/images/logo.png new file mode 100644 index 000000000..a4dd30cb9 Binary files /dev/null and b/xCAT-UI/images/logo.png differ diff --git a/xCAT-UI/js/configure/discover.js b/xCAT-UI/js/configure/discover.js index 96f14b51d..18a96f32d 100644 --- a/xCAT-UI/js/configure/discover.js +++ b/xCAT-UI/js/configure/discover.js @@ -1,13 +1,13 @@ /*associate the step name with step number*/ -var steps = ['Discover hardware', - 'Cluster patterns', - 'Supernode numbers', - 'More cluster patterns', +var steps = ['Platform', + 'Patterns', + 'Supernode', + 'More patterns', 'Power on hardware', 'Discover frames', - 'Prepare management node', - 'Update definitions', - 'Create LPARs', + 'Management node', + 'Update', + 'LPARs', 'Complete']; /*associate the function with step number*/ @@ -70,10 +70,11 @@ function updateDiscoverStep(){ for (var index in steps){ showString += '
'; + showString += '>' + steps[index] + '->'; } + showString = showString.substr(0, showString.length - 2); $('#discoverStepDiv').html(showString); } @@ -183,7 +184,7 @@ function createBackButton(){ function getDiscoverEnv(envName){ if (discoverEnv[envName]){ return discoverEnv[envName]; - } + } else{ return ''; } @@ -330,7 +331,6 @@ function initSelectPlatform(){ temp += '

This wizard will guide you through the process of defining the naming conventions within' + 'your cluster, discovering the hardware on your network, and automatically defining it in the xCAT' + 'database.
Choose which type of hardware you want to discover, and then click Next.

'; - temp += ' System x hardware (not implemented yet)
'; temp += ' System p hardware (P7 IH)
'; temp += ' System p hardware (Non P7 IH)
'; @@ -358,9 +358,9 @@ function initSelectPlatform(){ function getPlatform(){ var radioValue = $('#discoverContentDiv :checked').attr('id'); setDiscoverEnv('machineType', radioValue); - return true; } + /** * Step 2: Cluster basic patterns * users can input the switches' name range, the number of port, start ip and port prefix @@ -412,7 +412,6 @@ function initBasicPattern(){ showString += ''; $('#discoverContentDiv').append(showString); - $('#discoverContentDiv [title]').tooltip({ position: "center right", offset: [-2, 10], @@ -639,6 +638,7 @@ function checkSupernode(operType){ cmd : 'echo -e "' + args + '" > /tmp/websupernode.txt' } }); + return true; } @@ -671,7 +671,7 @@ function initSiteTable(operType){ $('.tooltip').remove(); var showDiv = $('

' + steps[currentStep] + '(Site info)

'); var statBar = createStatusBar('siteTableStat'); - statBar.append(createLoader()); + statBar.find('div').append(createLoader()); showDiv.append(statBar); $('#discoverContentDiv').append(showDiv); @@ -770,7 +770,7 @@ function showSiteArea(){ }, success : function(data){ - $('#discoverContentDiv #siteTableStat').html('Current network interface configuration:
' + 
+			$('#discoverContentDiv #siteTableStat div').html('Current network interface configuration:
' + 
 						data.rsp + '
');
 		}
 	});
@@ -810,6 +810,7 @@ function calcEndIp(ipStart, num){
 	ipArray[0] = ipArray[0] + parseInt(sum / 255);
 	return (ipArray.join('.'));
 }
+
 /**
  * Step 4: check the input are all filled 
  *          
@@ -887,7 +888,7 @@ function initDiscoverFrames(){
 			+ '');
 	
 	if (getDiscoverEnv('framemtmsmap')){
-		$('#framedisc').html('Mapping the frame name and mtms which discovered by lsslp.' + 
+		$('#framedisc div').html('Mapping the frame name and mtms which discovered by lsslp.' + 
 							 'Select the frame name, then select the mtms.');
 		var mapArray = getDiscoverEnv('framemtmsmap').split(':');
 		for(var i in mapArray){
@@ -899,7 +900,7 @@ function initDiscoverFrames(){
 		return;
 	}
 	
-	statBar.append('Discovering all Frames by lsslp.').append(createLoader());
+	statBar.find('div').append('Discovering all Frames by lsslp.').append(createLoader());
 	//use lsslp to find all bpas in cluster
 	$.ajax({
 		url : 'lib/cmd.php',
@@ -914,7 +915,7 @@ function initDiscoverFrames(){
 		success : function(data){
 			var tempInfo = data.rsp[0];
 			if (-1 != tempInfo.indexOf('Error')){
-				$('#framedisc').html(tempInfo);
+				$('#framedisc div').html(tempInfo);
 				createDiscoverButtons();
 				return;
 			}
@@ -923,19 +924,18 @@ function initDiscoverFrames(){
 			var frameArray = expandNR(getDiscoverEnv('frameName'));
 			//chech the defined number and discovered number
 			if (mtmsArray.length != frameArray.length){
-				$('#framedisc').html('Error: Definded Number is ' + frameArray.length + 
+				$('#framedisc div').html('Error: Definded Number is ' + frameArray.length + 
 									', but lsslp discovered Number is ' + mtmsArray.length + ', please check your configure!');
 				createDiscoverButtons();
 				return;
 			}
 			
-			$('#framedisc').html('Mapping the frame name and mtms which discovered by lsslp.' + 
+			$('#framedisc div').html('Mapping the frame name and mtms which discovered by lsslp.' + 
 			 		'Select the frame name, then select the mtms.');
 			
 			for (var i in frameArray){
 				$('#frameTd').append('
' +
 						frameArray[i] + '
');
-				
 			}
 			
 			for (var i in mtmsArray){
@@ -1081,6 +1081,7 @@ function initConfig(operType){
 	
 	createSetupFile();
 }
+
 /**
  * Step 7: create the xcat configure file
  *          
@@ -1174,6 +1175,7 @@ function runSetup(){
 		}
 	});
 }
+
 /**
  * Step 7: create the dhcp configure file
  *          
@@ -1340,9 +1342,9 @@ function lsslpWriteHMC(){
 							tempSpan.addClass('ui-icon-check');
 							lsslpWriteCec();
 						}
-				});
+					});
 				}
-		});
+			});
 		}
 	});
 }
diff --git a/xCAT-UI/js/configure/update.js b/xCAT-UI/js/configure/update.js
index 240de1fbe..f64199516 100644
--- a/xCAT-UI/js/configure/update.js
+++ b/xCAT-UI/js/configure/update.js
@@ -241,9 +241,9 @@ function updateRpm() {
 	});
 
 	$('#update').show();
-	$('#update').empty();
-	$('#update').append("
Updating " + rpms + " from " + rpmPath + "
");
-	$('#update').append("");
+	$('#update div').empty();
+	$('#update div').append("
Updating " + rpms + " from " + rpmPath + "
");
+	$('#update div').append("");
 	$('#rpm button').attr('disabled', 'true');
 
 	// Send the update command to server
@@ -276,29 +276,29 @@ function showUpdateResult(data) {
 	if (0 < resArray.length) {
 		// Show last lines
 		if (('' == resArray[resArray.length - 1]) && (resArray.length > 1)) {
-			$('#update').append('
' + resArray[resArray.length - 2] + '
');
+			$('#update div').append('
' + resArray[resArray.length - 2] + '
');
 		} else {
-			$('#update').append('
' + resArray[resArray.length - 1] + '
');
+			$('#update div').append('
' + resArray[resArray.length - 1] + '
');
 		}
 
 		// Create link to show details
-		$('#update').append('
Show details');
-		$('#update a').css( {
+		$('#update div').append('
Show details');
+		$('#update div a').css( {
 			'color' : '#0000FF',
 			'cursor' : 'pointer'
 		}).bind('click', function() {
 			// Toggle details and change text
 			$('#resDetail').toggle();
-			if ($('#update a').text() == 'Show details') {
-				$('#update a').text('Hide details');
+			if ($('#update div a').text() == 'Show details') {
+				$('#update div a').text('Hide details');
 			} else {
-				$('#update a').text('Show details');
+				$('#update div a').text('Show details');
 			}
 		});
 
 		var resDetail = $('
');
 		resDetail.hide();
-		$('#update').append(resDetail);
+		$('#update div').append(resDetail);
 		for (temp = 0; temp < resArray.length; temp++) {
 			resDetail.append(resArray[temp] + '
');
 		}
diff --git a/xCAT-UI/js/custom/blade.js b/xCAT-UI/js/custom/blade.js
index 404a2f9f0..968126daf 100644
--- a/xCAT-UI/js/custom/blade.js
+++ b/xCAT-UI/js/custom/blade.js
@@ -126,7 +126,7 @@ bladePlugin.prototype.loadProvisionPage = function(tabId) {
 
 	// Create loader
 	var loader = createLoader('bladeProvisionLoader' + inst).hide();
-	statBar.append(loader);
+	statBar.find('div').append(loader);
 
 	// Create info bar
 	var infoBar = createInfoBar('Provision a node on BladeCenter.');
@@ -201,5 +201,184 @@ bladePlugin.prototype.loadResources = function() {
  * @return Nothing
  */
 bladePlugin.prototype.addNode = function() {
-	openDialog('info', 'Under construction');
-};
\ No newline at end of file
+    var nodeTypeSelectDia = $('
');
+    nodeTypeSelectDia.append('
');
+    //append the mm div
+    var mmStr = '
' +
+                   '

' +
+                   '' +
+                   '
';
+    
+    //append the blade div
+    var bladeStr = '