- Restyling and update of the UI

git-svn-id: http://svn.code.sf.net/p/itop/code/trunk@478 a333f486-631f-4898-b8df-5754b55c2be0

application/cmdbabstract.class.inc.php

@@ -733,7 +733,7 @@ abstract class cmdbAbstractObject extends CMDBObject
 		}
 		$oUnlimitedFilter = new DBObjectSearch($sClassName);
 		$sHtml .= "<form id=\"form{$iSearchFormId}\">\n";
-		$sHtml .= "<h1>".Dict::Format('UI:SearchFor_Class_Objects', $sClassesCombo)."</h1>\n";
+		$sHtml .= "<h2>".Dict::Format('UI:SearchFor_Class_Objects', $sClassesCombo)."</h2>\n";
 		$index = 0;
 		$sHtml .= "<table>\n";
 		$aFilterCriteria = $oSet->GetFilter()->GetCriteria();
@@ -904,7 +904,7 @@ abstract class cmdbAbstractObject extends CMDBObject
 				case 'Text':
 					$aEventsList[] ='keypress';
 					$aEventsList[] ='change';
-					$sHTMLValue = "<textarea title=\"$sHelpText\" name=\"attr_{$sAttCode}{$sNameSuffix}\" rows=\"8\" cols=\"40\" id=\"$iId\">$value</textarea>&nbsp;{$sValidationField}";
+					$sHTMLValue = "<textarea class=\"resizable\" title=\"$sHelpText\" name=\"attr_{$sAttCode}{$sNameSuffix}\" rows=\"8\" cols=\"40\" id=\"$iId\">$value</textarea>&nbsp;{$sValidationField}";
 				break;
 	
 				case 'List':

application/itopwebpage.class.inc.php

@@ -46,11 +46,14 @@ class iTopWebPage extends NiceWebPage
 		$this->m_sMenu = "";
 		$oAppContext = new ApplicationContext();
 		$sExtraParams = $oAppContext->GetForLink();
+		$this->m_currentOrganization = $currentOrganization;
 		$this->add_header("Content-type: text/html; charset=utf-8");
 		$this->add_header("Cache-control: no-cache");
-		$this->m_currentOrganization = $currentOrganization;
-		$this->add_linked_script("../js/jquery.dimensions.js");
-		$this->add_linked_script("../js/splitter.js");
+		$this->add_linked_stylesheet("../css/jquery.treeview.css");
+		$this->add_linked_stylesheet("../css/jquery.autocomplete.css");
+//		$this->add_linked_stylesheet("../css/date.picker.css");
+		$this->add_linked_script('../js/jquery.layout.min.js');
+//		$this->add_linked_script("../js/jquery.dimensions.js");
 		$this->add_linked_script("../js/jquery.tablehover.js");
 		$this->add_linked_script("../js/jquery.treeview.js");
 		$this->add_linked_script("../js/jquery.autocomplete.js");
@@ -58,15 +61,11 @@ class iTopWebPage extends NiceWebPage
 		$this->add_linked_script("../js/jquery.positionBy.js");
 		$this->add_linked_script("../js/jquery.popupmenu.js");
 		$this->add_linked_script("../js/date.js");
-		$this->add_linked_script("../js/jquery.date.picker.js");
+//		$this->add_linked_script("../js/jquery.date.picker.js");
 		$this->add_linked_script("../js/jquery.tablesorter.min.js");
 		$this->add_linked_script("../js/jquery.blockUI.js");
 		$this->add_linked_script("../js/utils.js");
-		//$this->add_linked_script("../js/jquery-ui-personalized-1.5.3.js");
 		$this->add_linked_script("../js/swfobject.js");
-		$this->add_linked_stylesheet("../css/jquery.treeview.css");
-		$this->add_linked_stylesheet("../css/jquery.autocomplete.css");
-		$this->add_linked_stylesheet("../css/date.picker.css");
 		$this->add_ready_script(
 <<<EOF
 	//add new widget called TruncatedList to properly display truncated lists when they are sorted
@@ -90,55 +89,46 @@ class iTopWebPage extends NiceWebPage
 	    } 
 	});
 	
-	// Vertical splitter. The min/max/starting sizes for the left (A) pane
-	// are set here. All values are in pixels.
-	$("#MySplitter").splitter({
-		type: "v", 
-		minA: 100, initA: 250, maxA: 500,
-		accessKey: "|"
-	});
-
-	// Horizontal splitter, nested in the right pane of the vertical splitter.
-	if ( $("#TopPane").length > 0)
+	try
 	{
-		$("#RightPane").splitter({
-			type: "h" //,
-			//minA: 100, initA: 150, maxA: 500,
-			//accessKey: "_"
+	var myLayout; // a var is required because this page utilizes: myLayout.allowOverflow() method
+
+	$(document).ready(function () {
+		// Layout
+		myLayout = $('body').layout({
+			west : { minSize: 200, size: 300 /* TO DO: read from a cookie ?*/, spacing_open: 16, spacing_close: 16, slideTrigger_open: "mouseover", hideTogglerOnSlide: true }
 		});
-	}
-	
-	// Manually set the outer splitter's height to fill the browser window.
-	// This must be re-done any time the browser window is resized.
-	$(window).bind("resize", function(){
-		var ms = $("#MySplitter");
-		var top = ms.offset().top;		// from dimensions.js
-		var wh = $(window).height();
-		// Account for margin or border on the splitter container
-		var mrg = parseInt(ms.css("marginBottom")) || 0;
-		var brd = parseInt(ms.css("borderBottomWidth")) || 0;
-		ms.css("height", (wh-top-mrg-brd)+"px");
-
-		// IE fires resize for splitter; others don't so do it here
-		if ( !jQuery.browser.msie )
-			ms.trigger("resize");
+		myLayout.addPinBtn( "#tPinMenu", "west" );
+		//myLayout.open( "west" );
+		$('.ui-layout-resizer-west').html('<img src="../images/splitter-top-corner.png"/>');
 
+		// Accordion Menu
+		$("#accordion").accordion({ header: "h3", navigation: true, autoHeight: false });
+ 	});
 		
-	}).trigger("resize");
-	
-	var ms = $("#MySplitter");
-	ms.trigger("resize");
-
-	if ( $("#TopPane").length > 0)
-	{
-		$("#RightPane").trigger("resize");
-	}
-	
-	$("div[id^=tabbedContent] > ul").tabs( 1, { fxFade: true, fxSpeed: 'fast' } ); // tabs
+	//$("div[id^=tabbedContent] > ul").tabs( 1, { fxFade: true, fxSpeed: 'fast' } ); // tabs
+	$("div[id^=tabbedContent]").tabs(); // tabs
 	$("table.listResults").tableHover(); // hover tables
 	$(".listResults").tablesorter( { headers: { 0:{sorter: false }}, widgets: ['zebra', 'truncatedList']} ); // sortable and zebra tables
-	$(".date-pick").datePicker( {clickInput: false, createButton: true, startDate: '1900-01-01'} ); // Date picker
-	$('#ModalDlg').jqm({ajax: '@href', trigger: 'a.jqmTrigger', overlay:70, modal:true, toTop:true}); // jqModal Window
+	$(".date-pick").datepicker({
+			showOn: 'button',
+			buttonImage: '../images/calendar.png',
+			buttonImageOnly: true,
+			dateFormat: 'yy-mm-dd',
+			constrainInput: false,
+			changeMonth: true,
+			changeYear: true
+		});
+	$('.resizable').resizable(); // Make resizable everything that claims to be resizable !
+	docWidth = $(document).width();
+	$('#ModalDlg').dialog({ autoOpen: false, modal: true, width: 0.8*docWidth }); // JQuery UI dialogs
+	ShowDebug();
+	$('#logOffBtn>ul').popupmenu();
+	}
+	catch(err)
+	{
+		// Do something with the error !
+	}
 	
 	//$('.display_block').draggable(); // make the blocks draggable
 EOF
@@ -161,6 +151,7 @@ EOF
 			findValue(li);
 		}
 		
+		
 		function formatItem(row) {
 			return row[0];
 		}
@@ -174,6 +165,14 @@ EOF
 		{
 			window.location.href = './UI.php?operation=details&class='+sClass+'&id='+id;
 		}
+
+		function ShowDebug()
+		{
+			if ($('#rawOutput > div').html() != '')
+			{
+				$('#rawOutput').dialog( {autoOpen: true, modal:false});
+			}
+		}
 		");
 		$this->DisplayMenu();
 	}
@@ -183,17 +182,16 @@ EOF
 		$this->m_sMenu .= $sHtml;
 	}
 
-    public function DisplayMenu()
-    {
-        // Combo box to select the organization
-		$this->AddToMenu("<div id=\"OrganizationSelection\">
-			  <form style=\"display:inline\" action=\"{$_SERVER['PHP_SELF']}\"><select style=\"width:150px;font-size:x-small\" name=\"org_id\" title=\"Pick an organization\" onChange=\"this.form.submit();\">\n");
+	public function GetSiloSelectionForm()
+	{
+		$sHtml = '<div id="SiloSelection">';
+		$sHtml .= '<form style="display:inline" action="'.$_SERVER['PHP_SELF'].'"><select style="width:150px;font-size:x-small" name="org_id" title="Pick an organization" onChange="this.form.submit();">';
 		// List of visible Organizations
 		$oContext = new UserContext();
 		$oSearchFilter = $oContext->NewFilter("bizOrganization");
 		$oSet = new CMDBObjectSet($oSearchFilter);
 		$sSelected = ($this->m_currentOrganization == '') ? ' selected' : '';
-		$this->AddToMenu("<option value=\"\"$sSelected>".Dict::S('UI:AllOrganizations')."</option>");
+		$sHtml .= '<option value="">'.Dict::S('UI:AllOrganizations').'</option>';
 		if ($oSet->Count() > 0)
 		while($oOrg = $oSet->Fetch())
 		{
@@ -201,24 +199,32 @@ EOF
 			{
 				$oCurrentOrganization = $oOrg;
 				$sSelected = " selected";
+		
 			}
 			else
 			{
 				$sSelected = "";
 			}
-			$this->AddToMenu("<option value=\"".$oOrg->GetKey()."\"$sSelected>".$oOrg->Get('name')."</option>\n");
+			$sHtml .= '<option value="'.$oOrg->GetKey().'"'.$sSelected.'>'.$oOrg->Get('name').'</option>';
 		}
-		$this->AddToMenu("</select>\n");
+		$sHtml .= '</select>';
 		// Add other dimensions/context information to this form
 		$oAppContext = new ApplicationContext();
 		$oAppContext->Reset('org_id'); // Org id is handled above and we want to be able to change it here !
-		$this->AddToMenu($oAppContext->GetForForm());		
-		$this->AddToMenu("</form>\n");
-		$this->AddToMenu("</div>\n");
-		$this->AddToMenu("<ul id=\"browser\" class=\"dir\">\n");
-
+		$sHtml .= $oAppContext->GetForForm();		
+		$sHtml .= '</form>';
+		$sHtml .= '</div>';
+		return $sHtml;		
+	}
+	
+    public function DisplayMenu()
+    {
+		$oContext = new UserContext();
 		// Display the menu
 		$oAppContext = new ApplicationContext();
+		$iActiveNodeId = utils::ReadParam('menu', '');
+		$iAccordionIndex = 0;
+		
 		// 1) Application defined menus
 		$oSearchFilter = $oContext->NewFilter("menuNode");
 		$oSearchFilter->AddCondition('parent_id', 0, '=');
@@ -227,8 +233,14 @@ EOF
 		$oSet = new CMDBObjectSet($oSearchFilter, array('rank' => true));
 		while ($oRootMenuNode = $oSet->Fetch())
 		{
-			$oRootMenuNode->DisplayMenu($this, 'application', $oAppContext->GetAsHash());
+			$bResult = $oRootMenuNode->DisplayMenu($this, 'application', $oAppContext->GetAsHash(), true, $iActiveNodeId);
+			if ($bResult)
+			{
+				$this->add_ready_script("$('#accordion').accordion('activate', $iAccordionIndex)");
+			}
+			$iAccordionIndex++;
 		}
+		
 		// 2) User defined menus (Bookmarks)
 		$oSearchFilter = $oContext->NewFilter("menuNode");
 		$oSearchFilter->AddCondition('parent_id', 0, '=');
@@ -238,8 +250,14 @@ EOF
 		$oSet = new CMDBObjectSet($oSearchFilter, array('rank' => true));
 		while ($oRootMenuNode = $oSet->Fetch())
 		{
-			$oRootMenuNode->DisplayMenu($this, 'user', $oAppContext->GetAsHash());
+			$oRootMenuNode->DisplayMenu($this, 'user', $oAppContext->GetAsHash(), true, $iActiveNodeId);
+			if ($bResult)
+			{
+				$this->add_ready_script("$('#accordion').accordion('activate', $iAccordionIndex)");
+			}
+			$iAccordionIndex++;
 		}
+		
 		// 3) Administrator menu
 		if (userRights::IsAdministrator())
 		{
@@ -250,7 +268,12 @@ EOF
 			$oSet = new CMDBObjectSet($oSearchFilter, array('rank' => true));
 			while ($oRootMenuNode = $oSet->Fetch())
 			{
-				$oRootMenuNode->DisplayMenu($this, 'administrator', $oAppContext->GetAsHash());
+				$oRootMenuNode->DisplayMenu($this, 'administrator', $oAppContext->GetAsHash(), true, $iActiveNodeId);
+				if ($bResult)
+				{
+					$this->add_ready_script("$('#accordion').accordion('activate', $iAccordionIndex)");
+				}
+				$iAccordionIndex++;
 			}
 		}
 
@@ -319,7 +342,14 @@ EOF
         echo "</head>\n";
         echo "<body>\n";
 
-		// Display the header
+
+
+
+
+
+
+
+		// Render the revision number
 		if (ITOP_REVISION == '$WCREV$')
 		{
 			// This is NOT a version built using the buil system, just display the main version
@@ -330,7 +360,104 @@ EOF
 			// This is a build made from SVN, let display the full information
 			$sVersionString = "iTop Version ".ITOP_VERSION." revision ".ITOP_REVISION.", built on: ".ITOP_BUILD_DATE;
 		}
-		echo "<div id=\"Header\">\n";
+
+		// Render the text of the global search form
+		$sText = Utils::ReadParam('text', '');
+		$sOnClick = "";
+		if (empty($sText))
+		{
+			// if no search text is supplied then
+			// 1) the search text is filled with "your search"
+			// 2) clicking on it will erase it
+			$sText = Dict::S("UI:YourSearch");
+			$sOnClick = " onclick=\"this.value='';this.onclick=null;\"";
+		}
+
+		$sForm = $this->GetSiloSelectionForm();
+		
+		// Render the tabs in the page (if any)
+		foreach($this->m_aTabs as $sTabContainerName => $m_aTabs)
+		{
+			$sTabs = '';
+			$container_index = 0;
+			if (count($m_aTabs) > 0)
+			{
+			  $sTabs = "<!-- tabs -->\n<div id=\"tabbedContent_{$container_index}\" class=\"light\">\n";
+			  $sTabs .= "<ul>\n";
+			  // Display the unordered list that will be rendered as the tabs
+	          $i = 0;
+			  foreach($m_aTabs as $sTabName => $sTabContent)
+			  {
+			      $sTabs .= "<li><a href=\"#fragment_$i\" class=\"tab\"><span>".htmlentities($sTabName, ENT_QUOTES, 'UTF-8')."</span></a></li>\n";
+			      $i++;
+	          }
+			  $sTabs .= "</ul>\n";
+			  // Now add the content of the tabs themselves
+			  $i = 0;
+			  foreach($m_aTabs as $sTabName => $sTabContent)
+			  {
+			      $sTabs .= "<div id=\"fragment_$i\">".$sTabContent."</div>\n";
+			      $i++;
+	          }
+			  $sTabs .= "</div>\n<!-- end of tabs-->\n";
+	        }
+			$this->s_content = str_replace("\$Tabs:$sTabContainerName\$", $sTabs, $this->s_content);
+			$container_index++;
+		}
+		$sUserName = UserRights::GetUser();
+		$sIsAdmin = UserRights::IsAdministrator() ? '(Administrator)' : '';
+		if (UserRights::IsAdministrator())
+		{
+			$sLogonMessage = Dict::Format('UI:LoggedAsMessage+Admin', $sUserName);
+		}
+		else
+		{
+			$sLogonMessage = Dict::Format('UI:LoggedAsMessage', $sUserName);		
+		}
+		$sLogOffMenu = "<span id=\"logOffBtn\"><ul><li><img src=\"../images/onOffBtn.png\"><ul>";
+		$sLogOffMenu .= "<li><span>$sLogonMessage</span></li>\n";
+		$sLogOffMenu .= "<li><a href=\"#\">Log Off</a></li>\n";
+		$sLogOffMenu .= "<li><a href=\"#\">Change password...</a></li>\n";
+		$sLogOffMenu .= "</ul>\n</li>\n</ul></span>\n";
+
+		//$sLogOffMenu = "<span id=\"logOffBtn\" style=\"height:55px;padding:0;margin:0;\"><img src=\"../images/onOffBtn.png\"></span>";
+
+		echo '<div id="left-pane" class="ui-layout-west">';
+		echo '<!-- Beginning of the left pane -->';
+		echo '	<div id="header-logo">';
+		echo '	<div id="top-left"></div><div id="logo"><img src="../images/itop-logo.png" style="margin-top:16px; margin-right:40px;"/></div>';
+		echo '	</div>';
+		echo '	<div class="header-menu">';
+		echo '		<div class="icon ui-state-default ui-corner-all"><span id="tPinMenu" class="ui-icon ui-icon-pin-w">pin</span></div>';
+		echo '		<div style="width:100%; text-align:center;">'.$sForm.'</div>';
+		echo '	</div>';
+		echo '	<div id="menu" class="ui-layout-content">';
+		echo '		<div id="inner_menu">';
+		echo '			<div id="accordion">';
+		echo $this->m_sMenu;
+		echo '			<!-- Beginning of the accordion menu -->';
+		echo '			<!-- End of the accordion menu-->';
+		echo '			</div>';
+		echo '		</div> <!-- /inner menu -->';
+		echo '	</div> <!-- /menu -->';
+		echo '	<div class="footer"><span>iTop by Combodo</span></div>';
+		echo '<!-- End of the left pane -->';
+		echo '</div>';
+
+		echo '<div class="ui-layout-center">';
+		echo '	<div id="top-bar" style="width:100%">';
+		echo '		<div id="global-search"><form><table><tr><td id="g-search-input"><input type="text" name="text" value="'.$sText.'"'.$sOnClick.'/></td>';
+		echo '<td><input type="image" src="../images/searchBtn.png"/></td>';
+		echo '<td style="padding-right:20px;padding-left:20px;">'.$sLogOffMenu.'</td><td><input type="hidden" name="operation" value="full_text"/></td></tr></table></form></div>';
+		//echo '<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="hidden" name="operation" value="full_text"/></td></tr></table></form></div>';
+		echo '	</div>';
+		echo '	<div class="ui-layout-content">';
+		echo '	<!-- Beginning of page content -->';
+		echo $this->s_content;
+		echo '	<!-- End of page content -->';
+		echo '	</div>';
+		echo '</div>';
+/*		
 		echo "<div class=\"iTopLogo\" title=\"$sVersionString\"><span>iTop</span></div>\n";
 		//echo "<div id=\"GlobalSearch\"><div style=\"border: 1px solid #999; padding:1px; background-color:#fff;\"><img src=\"../images/magnifier.gif\"/><input style=\"border:0\" type=\"text\" size=\"15\" title=\"Global Search\"></input></div></div>\n";
 		$sText = Utils::ReadParam('text', '');
@@ -373,50 +500,21 @@ EOF
 		echo "  </div> <!-- LeftPane -->\n";
 		
 		echo "<div id=\"RightPane\">\n";
-        
-		// Render the tabs in the page (if any)
-		foreach($this->m_aTabs as $sTabContainerName => $m_aTabs)
-		{
-			$sTabs = '';
-			$container_index = 0;
-			if (count($m_aTabs) > 0)
-			{
-			  $sTabs = "<!-- tabs -->\n<div id=\"tabbedContent_{$container_index}\" class=\"light\">\n";
-			  $sTabs .= "<ul>\n";
-			  // Display the unordered list that will be rendered as the tabs
-	          $i = 0;
-			  foreach($m_aTabs as $sTabName => $sTabContent)
-			  {
-			      $sTabs .= "<li><a href=\"#fragment_$i\" class=\"tab\"><span>".htmlentities($sTabName, ENT_QUOTES, 'UTF-8')."</span></a></li>\n";
-			      $i++;
-	          }
-			  $sTabs .= "</ul>\n";
-			  // Now add the content of the tabs themselves
-			  $i = 0;
-			  foreach($m_aTabs as $sTabName => $sTabContent)
-			  {
-			      $sTabs .= "<div id=\"fragment_$i\">".$sTabContent."</div>\n";
-			      $i++;
-	          }
-			  $sTabs .= "</div>\n<!-- end of tabs-->\n";
-	        }
-			$this->s_content = str_replace("\$Tabs:$sTabContainerName\$", $sTabs, $this->s_content);
-			$container_index++;
-		}
+    
         
 		// Display the page's content
         echo $this->s_content;
 
+*/
         // Add the captured output
         if (trim($s_captured_output) != "")
         {
-            echo "<div class=\"raw_output\">$s_captured_output</div>\n";
+            echo "<div id=\"rawOutput\" title=\"Debug Output\"><div style=\"height:500px; overflow-y:auto;\">$s_captured_output</div></div>\n";
         }
         echo $this->s_deferred_content;
-		echo "<div class=\"jqmWindow\" id=\"ex2\">Please wait...</div>\n"; // jqModal Window
-		echo "</div> <!-- RightPane -->\n";
-		echo "</div> <!-- Splitter -->\n";
-		echo "<div class=\"jqmWindow\" id=\"ModalDlg\"></div>";
+		echo "<div style=\"display:none\" title=\"ex2\" id=\"ex2\">Please wait...</div>\n"; // jqModal Window
+		echo "<div style=\"display:none\" title=\"dialog\" id=\"ModalDlg\"></div>";
+
 		echo "</body>\n";
         echo "</html>\n";
     }

application/menunode.class.inc.php

@@ -136,20 +136,43 @@ class menuNode extends DBObject
 		//$this->ProcessTemplate($sTemplate, $oPage, $aExtraParams);
 	}
 	
-	public function DisplayMenu(iTopWebPage $oP, $sType, $aExtraParams)
+	public function DisplayMenu(iTopWebPage $oP, $sType, $aExtraParams, $bRootLevel = true, $iActiveNodeId = -1)
 	{
-		$oP->AddToMenu("<li><a href=\"".$this->GetMenuLink($aExtraParams)."\" title=\"".$this->GetMenuLabel()."\">".$this->GetMenuName()."</a>");
-		$oSet = $this->GetChildNodesSet($sType);
-		if ($oSet->Count() > 0)
+		$bActive = false;
+		if ($bRootLevel)
 		{
-			$oP->AddToMenu("\n<ul>\n");
-			while($oChildNode = $oSet->Fetch())
+			$oP->AddToMenu("<h3><a href=\"".$this->GetMenuLink($aExtraParams)."\" title=\"".$this->GetMenuLabel()."\">".$this->GetMenuName()."</a></h3>\n");
+			$oP->AddToMenu("\n<div>\n");
+			$oP->AddToMenu("<p><a href=\"".$this->GetMenuLink($aExtraParams)."\" title=\"".$this->GetMenuLabel()."\">".$this->GetMenuLabel()."</a></p>\n");
+			$oSet = $this->GetChildNodesSet($sType);
+			if ($oSet->Count() > 0)
 			{
-				$oChildNode->DisplayMenu($oP, $sType, $aExtraParams);
+				$oP->AddToMenu("\n<ul>\n");
+				while($oChildNode = $oSet->Fetch())
+				{
+					$bActive |= $oChildNode->DisplayMenu($oP, $sType, $aExtraParams, false /* ! RootLevel */, $iActiveNodeId);
+				}
+				$oP->AddToMenu("</ul>\n");
+			}
+			$oP->AddToMenu("\n</div>\n");
+		}
+		else
+		{
+			$oP->AddToMenu("<li><a href=\"".$this->GetMenuLink($aExtraParams)."\" title=\"".$this->GetMenuLabel()."\">".$this->GetMenuName()."</a>");
+			$oSet = $this->GetChildNodesSet($sType);
+			if ($oSet->Count() > 0)
+			{
+				$oP->AddToMenu("\n<ul>\n");
+				while($oChildNode = $oSet->Fetch())
+				{
+					$bActive |= $oChildNode->DisplayMenu($oP, $sType, $aExtraParams, false /* ! RootLevel */, $iActiveNodeId);
+				}
+				$oP->AddToMenu("</ul>\n");
 			}
-			$oP->AddToMenu("</ul>\n");
+			$oP->AddToMenu("</li>\n");
 		}
-		$oP->AddToMenu("</li>\n");
+		$bResult = ($iActiveNodeId == $this->GetKey()) | $bActive;
+		return $bResult;
 	}
 	static public function DisplayCreationForm(WebPage $oP, $sClass, $sFilter, $aExtraParams = array())
 	{

application/nicewebpage.class.inc.php

@@ -35,16 +35,18 @@ class NiceWebPage extends WebPage
     {
         parent::__construct($s_title);
 		$this->m_aReadyScripts = array();
-		$this->add_linked_script("../js/jquery.latest.js");
+		$this->add_linked_script("../js/jquery-1.4.2.min.js");
 		$this->add_linked_script("../js/jquery.history_remote.pack.js");
+		$this->add_linked_stylesheet('../css/ui-lightness/jquery-ui-1.8.2.custom.css');
+		$this->add_linked_script('../js/jquery-ui-1.8.2.custom.min.js');
 		//$this->add_linked_script("../js/ui.resizable.js");
-		$this->add_linked_script("../js/ui.tabs.js");
+//		$this->add_linked_script("../js/ui.tabs.js");
 		$this->add_linked_script("../js/hovertip.js");
-		$this->add_linked_script("../js/jqModal.js");
+//		$this->add_linked_script("../js/jqModal.js");
 		$this->add_linked_stylesheet("../css/light-grey.css");
-		$this->add_linked_stylesheet("../js/themes/light/light.tabs.css");
+//		$this->add_linked_stylesheet("../js/themes/light/light.tabs.css");
 		//$this->add_linked_stylesheet("../css/jquery.tabs-ie.css", "lte IE 7");
-		$this->add_linked_stylesheet("../css/jqModal.css");
+//		$this->add_linked_stylesheet("../css/jqModal.css");
 		$this->add_ready_script('    window.setTimeout(hovertipInit, 1);');
     }
 	

application/ui.linkswidget.class.inc.php

@@ -255,6 +255,7 @@ class UILinksWidget
 	
 	protected function GetObjectPickerDialog($oPage, $sTargetClass, $sOkFunction)
 	{
+		$sDialogTitle = Dict::S('UI:ManageObjectsDlg');
 		$sOkBtnLabel = Dict::S('UI:Button:Ok');
 		$sCancelBtnLabel = Dict::S('UI:Button:Cancel');
 		$sAddBtnLabel = Dict::S('UI:Button:AddToList');
@@ -263,9 +264,8 @@ class UILinksWidget
 		$sLabelSelectedObjects = Dict::S('UI:Label:SelectedObjects');
 		$sLabelAvailableObjects = Dict::S('UI:Label:AvailableObjects');
 		$sHTML = <<< EOF
-		<div class="jqmWindow" id="ManageObjectsDlg_{$this->m_iInputId}">
+		<div style="display:none" title="$sDialogTitle" id="ManageObjectsDlg_{$this->m_iInputId}">
 		<div class="wizContainer">
-		<div class="page_header"><h1 id="Manage_DlgTitle_{$this->m_iInputId}">Selected Objects</h1></div>
 		<table width="100%">
 			<tr>
 				<td>
@@ -287,14 +287,14 @@ class UILinksWidget
 			</tr>
 			<tr>
 				<td colspan="3">
-				<input type="submit" class="jqmClose" onClick="$('#ManageObjectsDlg_{$this->m_iInputId}').jqmHide(); $sOkFunction('$sTargetClass', 'selected_objects')" value="$sOkBtnLabel" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button type="button" class="jqmClose">$sCancelBtnLabel</button>
+				<input type="submit" onClick="$('#ManageObjectsDlg_{$this->m_iInputId}').dialog('close'); $sOkFunction('$sTargetClass', 'selected_objects'); return false;" value="$sOkBtnLabel" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button type="button" onClick="$('#ManageObjectsDlg_{$this->m_iInputId}').dialog('close');">$sCancelBtnLabel</button>
 				</td>
 			</tr>
 		</table>
 		</div>
 		</div>
 EOF;
-		$oPage->add_ready_script("$('#ManageObjectsDlg_$this->m_iInputId').jqm({overlay:70, modal:true, toTop:true});"); // jqModal Window
+		$oPage->add_ready_script("$('#ManageObjectsDlg_$this->m_iInputId').dialog( {autoOpen: false, modal: true, width: 750, height: 350} );"); // JQuery UI dialog
 		//$oPage->add_ready_script("UpdateObjectList('$sClass');");
 		return $sHTML;
 	}
@@ -309,9 +309,8 @@ EOF;
 		$sExtKeyToMe = $oAttDef->GetExtKeyToMe();
 		$sExtKeyToRemote = $oAttDef->GetExtKeyToRemote();
 		
-		$sHTML = "<div class=\"jqmWindow\" id=\"LinkDlg_$sId\">\n";
+		$sHTML = "<div style=\"display:none\" title=\"".Dict::Format('UI:Link_Class_Attributes', MetaModel::GetName($sLinkedClass))."\" id=\"LinkDlg_$sId\">\n";
 		$sHTML .= "<div class=\"wizContainer\">\n";
-		$sHTML .= "<div class=\"page_header\"><h1>".Dict::Format('UI:Link_Class_Attributes', MetaModel::GetName($sLinkedClass))."</h1></div>\n";
 		$sHTML .= "<form action=\"./UI.php\" onSubmit=\"return oLinkWidget$sId.OnLinkOk();\">\n";
 		$index = 0;
 		$aAttrsMap = array();
@@ -352,11 +351,11 @@ EOF;
 			}
 		}
 		$sHTML .= $oPage->GetDetails($aDetails);
-		$sHTML .= "<input type=\"submit\" class=\"jqmClose\" onClick=\"oLinkWidget$sId.OnLinkOk()\" value=\"".Dict::S('UI:Button:Ok')."\" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button type=\"button\" class=\"jqmClose\"  onClick=\"oLinkWidget$sId.OnLinkCancel()\">".Dict::S('UI:Button:Cancel')."</button>\n";
+		$sHTML .= "<input type=\"submit\" onClick=\"oLinkWidget$sId.OnLinkOk(); return false;\" value=\"".Dict::S('UI:Button:Ok')."\" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button type=\"button\" onClick=\"oLinkWidget$sId.OnLinkCancel()\">".Dict::S('UI:Button:Cancel')."</button>\n";
 		$sHTML .= "</form>\n";
 		$sHTML .= "</div>\n";
 		$sHTML .= "</div>\n";
-		$oPage->add_ready_script("$('#LinkDlg_$sId').jqm({overlay:70, modal:true, toTop:true});"); // jqModal Window
+		$oPage->add_ready_script("$('#LinkDlg_$sId').dialog( {autoOpen: false, modal: true, width: 300 } );"); // jQuery UI dialog
 		//$oPage->add_ready_script("UpdateObjectList('$sClass');");
 		return $sHTML;
 	}

application/uilinkswizard.class.inc.php

@@ -145,7 +145,7 @@ class UILinksWizard
 					$('#ModalDlg').css('width', dlgWidth);
 					$('#ModalDlg').css('left', 50);
 					$('#ModalDlg').css('top', 50);
-					$('#ModalDlg').jqmShow();
+					$('#ModalDlg').dialog( 'open' );
 				},
 				'html'
 			);
@@ -179,18 +179,7 @@ class UILinksWizard
 				function(data)
 				{
 					$('#SearchResultsToAdd').html(data);
-					nb_rows = $('#SearchResultsToAdd table.listResults tr').length;
-					if(nb_rows > 10)
-					{
-						yOffset = $('#ModalDlg').height() - $('#SearchResultsToAdd table.listResults tbody').height();
-						tbodyHeight = $(document).height() - 100 - yOffset;
-						if ($('#ModalDlg').height() > ($(document).height() - 100))
-						{
-							$('#SearchResultsToAdd table.listResults tbody').attr('height', tbodyHeight);
-							$('#SearchResultsToAdd .listResults tbody').css('overflow', 'auto');
-							$('#SearchResultsToAdd .listResults').tablesorter( { headers: { 0:{sorter: false }}, widgets: ['zebra']} ); // sortable and zebra tables
-						}
-					}
+					$('#SearchResultsToAdd .listResults').tablesorter( { headers: { 0:{sorter: false }}, widgets: ['zebra']} ); // sortable and zebra tables
 					
 				},
 				'html'
@@ -248,7 +237,7 @@ class UILinksWizard
 				},
 				'html'
 			);
-			$('#ModalDlg').jqmHide();
+			$('#ModalDlg').dialog('close');
 			return false;
 		}
 		
@@ -287,7 +276,7 @@ EOF
 		$this->DisplayFormTable($oP, $this->m_aTableConfig, $aForm);
 		$oP->add("<span style=\"float:left;\">&nbsp;&nbsp;&nbsp;<img src=\"../images/tv-item-last.gif\">&nbsp;&nbsp;<input id=\"btnRemove\" type=\"button\" value=\"".Dict::S('UI:RemoveLinkedObjectsOf_Class')."\" onClick=\"RemoveSelected();\" >");
 		$oP->add("&nbsp;&nbsp;&nbsp;<input id=\"btnAdd\" type=\"button\" value=\"".Dict::Format('UI:AddLinkedObjectsOf_Class', MetaModel::GetName($this->m_sLinkedClass))."\" onClick=\"AddObjects();\"></span>\n");
-		$oP->add("<span style=\"float:right;\"><input id=\"btnCancel\" type=\"button\" value=\"".Dict::S('UI:Button:Cancel')."\" onClick=\"goBack();\">");
+		$oP->add("<span style=\"float:right;\"><input id=\"btnCancel\" type=\"button\" value=\"".Dict::S('UI:Button:Cancel')."\" onClick=\"BackToDetails('".$sTargetClass."', ".$this->m_iObjectId.");\">");
 		$oP->add("&nbsp;&nbsp;&nbsp;<input id=\"btnOk\" type=\"submit\" value=\"".Dict::S('UI:Button:Ok')."\"></span>\n");
 		$oP->add("<span style=\"clear:both;\"><p>&nbsp;</p></span>\n");
 		$oP->add("</div>\n");
@@ -380,9 +369,9 @@ EOF
 		$sTargetClass = $oAttDef->GetTargetClass();
 		$oTargetObj = $oContext->GetObject($sTargetClass, $this->m_iObjectId);
 		$oP->add("<div class=\"wizContainer\">\n");
-		$oP->add("<div class=\"page_header\">\n");
-		$oP->add("<h1>".Dict::Format('UI:AddObjectsOf_Class_LinkedWith_Class_Instance', MetaModel::GetName($this->m_sLinkedClass), MetaModel::GetName(get_class($oTargetObj)), "<span class=\"hilite\">".$oTargetObj->GetHyperlink()."</span>")."</h1>\n");
-		$oP->add("</div>\n");
+		//$oP->add("<div class=\"page_header\">\n");
+		//$oP->add("<h1>".Dict::Format('UI:AddObjectsOf_Class_LinkedWith_Class_Instance', MetaModel::GetName($this->m_sLinkedClass), MetaModel::GetName(get_class($oTargetObj)), "<span class=\"hilite\">".$oTargetObj->GetHyperlink()."</span>")."</h1>\n");
+		//$oP->add("</div>\n");
 
 		$oFilter = $oContext->NewFilter($this->m_sLinkedClass);
 		$oSet = new CMDBObjectSet($oFilter);
@@ -392,9 +381,10 @@ EOF
 		$oP->Add("<div id=\"SearchResultsToAdd\">\n");
 		$oP->Add("<div style=\"height: 100px; background: #fff;border-color:#F6F6F1 #E6E6E1 #E6E6E1 #F6F6F1; border-style:solid; border-width:3px; text-align: center; vertical-align: center;\"><p>".Dict::S('UI:Message:EmptyList:UseSearchForm')."</p></div>\n");
 		$oP->Add("</div>\n");
-		$oP->add("<input type=\"button\" value=\"".Dict::S('UI:Button:Cancel')."\" onClick=\"$('#ModalDlg').jqmHide();\">&nbsp;&nbsp;<input type=\"submit\" value=\"".Dict::S('UI:Button:Add')."\">");
+		$oP->add("<input type=\"button\" value=\"".Dict::S('UI:Button:Cancel')."\" onClick=\"$('#ModalDlg').dialog('close');\">&nbsp;&nbsp;<input type=\"submit\" value=\"".Dict::S('UI:Button:Add')."\">");
 		$oP->Add("</div>\n");
 		$oP->Add("</form>\n");
+		$oP->add_ready_script("$('#ModalDlg').dialog('option', {title:'".Dict::Format('UI:AddObjectsOf_Class_LinkedWith_Class_Instance', MetaModel::GetName($this->m_sLinkedClass), MetaModel::GetName(get_class($oTargetObj)), "<span class=\"hilite\">".$oTargetObj->GetHyperlink()."</span>")."'});");
 		$oP->add_ready_script("$('div#SearchFormToAdd form').bind('submit.uilinksWizard', SubmitHook);");
 	}
 

pages/ajax.render.php

@@ -241,6 +241,8 @@ switch($operation)
 	$sExtKeyToRemote = utils::ReadParam('sextkeytoremote', '');
 	$iObjectId = utils::ReadParam('id', -1);
 	UILinksWidget::RenderSet($oPage, $sClass, $sJSONSet, $sExtKeyToMe, $sExtKeyToRemote, $iObjectId);
+	$iFieldId = utils::ReadParam('myid', '-1');
+	$oPage->add_ready_script("$('#{$iFieldId}').trigger('validate');");
 	break;
 	
 	case 'autocomplete':

pages/csvimport.php

@@ -864,7 +864,7 @@ function SelectOptions(WebPage $oPage)
 	
 	$oPage->add('<h2>'.Dict::S('UI:Title:CSVImportStep2').'</h2>');
 	$oPage->add('<div class="wizContainer">');
-	$oPage->add('<table><tr><td style="vertical-align:top;padding-right:50px;background:#E8F3CF">');
+	$oPage->add('<table><tr><td style="vertical-align:top;padding-right:50px;">');
 	$oPage->add('<form enctype="multipart/form-data" id="wizForm" method="post" id="csv_options">');
 	$oPage->add('<h3>'.Dict::S('UI:CSVImport:SeparatorCharacter').'</h3>');
 	$oPage->add('<p><input type="radio" name="separator" value="," onChange="DoPreview()"'.IsChecked($sSeparator, ',').'/> '.Dict::S('UI:CSVImport:SeparatorComma+').'<br/>');
@@ -872,13 +872,13 @@ function SelectOptions(WebPage $oPage)
 	$oPage->add('<input type="radio" name="separator" value="tab" onChange="DoPreview()"'.IsChecked($sSeparator, "\t").'/> '.Dict::S('UI:CSVImport:SeparatorTab+').'<br/>');
 	$oPage->add('<input type="radio" name="separator" value="other"  onChange="DoPreview()"'.IsChecked($sOtherSeparator, '', true).'/> '.Dict::S('UI:CSVImport:SeparatorOther').' <input type="text" size="3" maxlength="1" name="other_separator" id="other_separator" value="'.$sOtherSeparator.'" onChange="DoPreview()"/>');
 	$oPage->add('</p>');
-	$oPage->add('</td><td style="vertical-align:top;padding-right:50px;background:#E8F3CF">');
+	$oPage->add('</td><td style="vertical-align:top;padding-right:50px;">');
 	$oPage->add('<h3>'.Dict::S('UI:CSVImport:TextQualifierCharacter').'</h3>');
 	$oPage->add('<p><input type="radio" name="text_qualifier" value="&#34;" onChange="DoPreview()"'.IsChecked($sTextQualifier, '"').'/> '.Dict::S('UI:CSVImport:QualifierDoubleQuote+').'<br/>');
 	$oPage->add('<input type="radio" name="text_qualifier" value="&#39;"  onChange="DoPreview()"'.IsChecked($sTextQualifier, "'").'/> '.Dict::S('UI:CSVImport:QualifierSimpleQuote+').'<br/>');
 	$oPage->add('<input type="radio" name="text_qualifier" value="other"  onChange="DoPreview()"'.IsChecked($sOtherTextQualifier, '', true).'/> '.Dict::S('UI:CSVImport:QualifierOther').' <input type="text" size="3" maxlength="1" name="other_qualifier"  value="'.htmlentities($sOtherTextQualifier, ENT_QUOTES, 'UTF-8').'" onChange="DoPreview()"/>');
 	$oPage->add('</p>');
-	$oPage->add('</td><td style="vertical-align:top;background:#E8F3CF">');
+	$oPage->add('</td><td style="vertical-align:top;">');
 	$oPage->add('<h3>'.Dict::S('UI:CSVImport:CommentsAndHeader').'</h3>');
 	$oPage->add('<p><input type="checkbox" name="header_line" id="box_header" value="1" onChange="DoPreview()"'.IsChecked($bHeaderLine, 1).'/> '.Dict::S('UI:CSVImport:TreatFirstLineAsHeader').'<p>');
 	$oPage->add('<p><input type="checkbox" name="box_skiplines" value="1" id="box_skiplines" onChange="DoPreview()"'.IsChecked($bBoxSkipLines, 1).'/> '.Dict::Format('UI:CSVImport:Skip_N_LinesAtTheBeginning', '<input type="text" size=2 name="nb_skipped_lines" id="nb_skipped_lines" onChange="DoPreview()" value="'.$iSkippedLines.'">').'<p>');