Author: phuong_vu Date: 2011-09-05 07:03:32 -0400 (Mon, 05 Sep 2011) New Revision: 7299 Modified: portal/branches/dom/examples/skins/simpleskin/src/main/webapp/skin/SimpleSkin/UIToolbarContainer/Stylesheet.css portal/branches/dom/examples/skins/simpleskin/src/main/webapp/skin/webPortlet/webui/component/UIPortalNavigationPortlet/Stylesheet.css portal/branches/dom/examples/skins/simpleskin/src/main/webapp/skin/webPortlet/webui/component/UIPortalNavigationPortlet/background/NavDownArrow.gif portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIAdminToolbarPortlet.gtmpl portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIStarToolBarPortlet.gtmpl portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserInfoPortlet.gtmpl portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserToolBarDashboardPortlet.gtmpl portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserToolBarGroupPortlet.gtmpl portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserToolBarSitePortlet.gtmpl portal/branches/dom/portlet/web/src/main/webapp/groovy/portal/webui/component/UIPortalNavigation.gtmpl portal/branches/dom/portlet/web/src/main/webapp/skin/portal/webui/component/UINavigationPortlet/DefaultSkin/background/NavDownArrow.gif portal/branches/dom/portlet/web/src/main/webapp/skin/portal/webui/component/UINavigationPortlet/DefaultSkin/background/NavDownArrowHover.gif portal/branches/dom/portlet/web/src/main/webapp/skin/portal/webui/component/UINavigationPortlet/DefaultStylesheet.css portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/portal/UIAdminToolbar.js portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/portal/UIPortalNavigation.js portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/portal/webui/component/view/UIToolbarContainer/Stylesheet.css portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/portal/webui/component/view/UIToolbarContainer/background/ToolbarContainer.gif Log: [DOM] Admin Toolbar optimization Modified: portal/branches/dom/examples/skins/simpleskin/src/main/webapp/skin/SimpleSkin/UIToolbarContainer/Stylesheet.css =================================================================== --- portal/branches/dom/examples/skins/simpleskin/src/main/webapp/skin/SimpleSkin/UIToolbarContainer/Stylesheet.css 2011-09-05 10:59:49 UTC (rev 7298) +++ portal/branches/dom/examples/skins/simpleskin/src/main/webapp/skin/SimpleSkin/UIToolbarContainer/Stylesheet.css 2011-09-05 11:03:32 UTC (rev 7299) @@ -33,15 +33,7 @@ color: #fff; } -.UIToolbarContainer .UITab a:hover { - color: #9fc5ff; -} -.UIToolbarContainer .UIHorizontalTabs .TabsContainer { - height: 30px; /* orientation=lt */ - height: auto; /* orientation=rt */ -} - .UIToolbarContainer .UIHorizontalTabs .UITab { line-height: 30px; background: none; @@ -64,30 +56,25 @@ } .UIToolbarContainer .MenuItem { - background: none; + /*background: none;*/ } -.UIToolbarContainer .MenuItem .ArrowIcon { +.UIToolbarContainer .ArrowIcon { background: url('background/ToolbarContainer.gif') no-repeat right bottom; /* orientation=lt */ background: url('background/ToolbarContainer-rt.gif') no-repeat -5px bottom; /* orientation=rt */ } .UIToolbarContainer .MenuItem a { - padding: 0px 25px 0px 30px; /* orientation=lt */ - padding: 0px 30px 0px 25px; /* orientation=rt */ + padding: 0px 25px 0px 32px; /* orientation=lt */ + padding: 0px 32px 0px 25px; /* orientation=rt */ color: #232d36; } -.UIToolbarContainer .MenuItem a:hover { +.UIToolbarContainer .MenuItem:hover { color: #000; background-color: #d7d7d7; } -.UIToolbarContainer .ItemIcon { - background-position: 5px center; /* orientation=lt */ - background-position: 95% center; /* orientation=rt */ -} - /**********************************/ .UIToolbarContainer .DashboardIcon { Modified: portal/branches/dom/examples/skins/simpleskin/src/main/webapp/skin/webPortlet/webui/component/UIPortalNavigationPortlet/Stylesheet.css =================================================================== --- portal/branches/dom/examples/skins/simpleskin/src/main/webapp/skin/webPortlet/webui/component/UIPortalNavigationPortlet/Stylesheet.css 2011-09-05 10:59:49 UTC (rev 7298) +++ portal/branches/dom/examples/skins/simpleskin/src/main/webapp/skin/webPortlet/webui/component/UIPortalNavigationPortlet/Stylesheet.css 2011-09-05 11:03:32 UTC (rev 7299) @@ -47,12 +47,13 @@ float:left;/* orientation=lt */ float:right;/* orientation=rt */ text-align:center; + font-weight:normal; } .UINavigationPortlet .UITab a.TabIcon { display: block; - padding-left: 20px;/* orientation=lt */ - padding-right: 20px;/* orientation=rt */ + padding-left: 23px;/* orientation=lt */ + padding-right: 23px;/* orientation=rt */ line-height: 27px; background-position: right ;/* orientation=rt */ } @@ -69,15 +70,15 @@ .UINavigationPortlet .UITab > span { display:block; padding: 0px; - margin-right: 24px;/* orientation=lt */ - margin-left: 24px;/* orientation=rt */ + margin-right: 28px;/* orientation=lt */ + margin-left: 28px;/* orientation=rt */ } .UINavigationPortlet .UITab .DropDownArrowIcon { background: url('background/NavDownArrow.gif') no-repeat right center; /* orientation=lt */ - background: url('background/NavDownArrow.gif') no-repeat left center; /* orientation=rt */ - padding: 0 16px 0 0px; /* orientation=lt */ - padding: 0 0px 0 16px; /* orientation=rt */ + background: url('background/NavDownArrow_ar.gif') no-repeat left center; /* orientation=rt */ + padding: 0 17px 0 0px; /* orientation=lt */ + padding: 0 0px 0 17px; /* orientation=rt */ } .UINavigationPortlet .HighlightNavigationTab > span,.UINavigationPortlet .SelectedNavigationTab > span { @@ -160,7 +161,8 @@ cursor:pointer; float: right; /* orientation=lt */ float: left; /* orientation=rt */ - height: 15px; + height: 15px; + width: 20px; } .UINavigationPortlet .ScrollButtons a { @@ -193,12 +195,12 @@ background: url('background/Button-rt.gif') no-repeat left -30px; /* orientation=rt */ } -.UINavigationPortlet .ScrollLeftButton:hover { +.UINavigationPortlet .HighlightScrollLeftButton ,.UINavigationPortlet .ScrollLeftButton:hover{ background: url('background/Button.gif') no-repeat left top; /* orientation=lt */ background: url('background/Button-rt.gif') no-repeat right top; /* orientation=rt */ } -.UINavigationPortlet .ScrollRightButton:hover { +.UINavigationPortlet .HighlightScrollRightButton ,.UINavigationPortlet .ScrollRightButton:hover{ background: url('background/Button.gif') no-repeat right top; /* orientation=lt */ background: url('background/Button-rt.gif') no-repeat left top; /* orientation=rt */ } @@ -207,5 +209,4 @@ .UINavigationPortlet .GroupNavigation { background: #f9f9f9; -} - +} \ No newline at end of file Modified: portal/branches/dom/examples/skins/simpleskin/src/main/webapp/skin/webPortlet/webui/component/UIPortalNavigationPortlet/background/NavDownArrow.gif =================================================================== (Binary files differ) Modified: portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIAdminToolbarPortlet.gtmpl =================================================================== --- portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIAdminToolbarPortlet.gtmpl 2011-09-05 10:59:49 UTC (rev 7298) +++ portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIAdminToolbarPortlet.gtmpl 2011-09-05 11:03:32 UTC (rev 7299) @@ -27,37 +27,29 @@ if (selectedNav != null) { editorLabel = _ctx.appRes("UIAdminToolbarPortlet.action." + selectedNav.getKey().getTypeName() + ".Editor"); } - String accountSetting = "javascript:if(document.getElementById('UIMaskWorkspace')) ajaxGet(eXo.env.server.createPortalURL('UIPortal', 'AccountSettings', true));" -%> -<div class="UIAdminToolbarPortlet" id="$uicomponent.id" > - <div class="UIHorizontalTabs"> - <div class="TabsContainer" > - <div class="UITab NormalToolbarTab portlet-menu-item"> - <div class=""> - <a class="EditorIcon TBIcon" href="#">$editorLabel</a> - </div> - <div class="MenuItemContainer portlet-menu-cascade" style="display:none;"> - <div class="SubBlock"> - <% if(userCouldEditNavigation){ %> - <div class="MenuItem portlet-menu-cascade-item"> - <a href="javascript:ajaxGet(eXo.env.server.createPortalURL('UIWorkingWorkspace', 'PageCreationWizard', true))" title="" class="ItemIcon AddPageIcon">$addPageLabel</a> - </div> - <% } %> - - <% if(userCouldEditPage){ %> - <div class="MenuItem portlet-menu-cascade-item"> - <a href="javascript:ajaxGet(eXo.env.server.createPortalURL('UIWorkingWorkspace', 'EditCurrentPage', true))" title="" class="ItemIcon EditPageIcon">$editPageLabel</a> - </div> - <% } %> - - <% if(userCouldEditPortal){ %> - <div class="MenuItem portlet-menu-cascade-item"> - <a href="javascript:ajaxGet(eXo.env.server.createPortalURL('UIWorkingWorkspace', 'EditInline', true))" title="" class="ItemIcon EditSiteIcon">$editSiteLayout</a> - </div> - <% } %> - </div> - </div> - </div> - </div> - </div> -</div> + String accountSetting = "javascript:if(document.getElementById('UIMaskWorkspace')) ajaxGet(eXo.env.server.createPortalURL('UIPortal', 'AccountSettings', true));" +%> +<ul class="UIAdminToolbarPortlet UIHorizontalTabs" id="$uicomponent.id" > + <li class="UITab NormalToolbarTab portlet-menu-item"> + <a class="EditorIcon TBIcon" href="#">$editorLabel</a> + <ul class="MenuItemContainer portlet-menu-cascade" style="display:none;"> + <% if(userCouldEditNavigation){ %> + <li class="MenuItem portlet-menu-cascade-item"> + <a href="javascript:ajaxGet(eXo.env.server.createPortalURL('UIWorkingWorkspace', 'PageCreationWizard', true))" title="" class="ItemIcon AddPageIcon">$addPageLabel</a> + </li> + <% } %> + + <% if(userCouldEditPage){ %> + <li class="MenuItem portlet-menu-cascade-item"> + <a href="javascript:ajaxGet(eXo.env.server.createPortalURL('UIWorkingWorkspace', 'EditCurrentPage', true))" title="" class="ItemIcon EditPageIcon">$editPageLabel</a> + </li> + <% } %> + + <% if(userCouldEditPortal){ %> + <li class="MenuItem portlet-menu-cascade-item"> + <a href="javascript:ajaxGet(eXo.env.server.createPortalURL('UIWorkingWorkspace', 'EditInline', true))" title="" class="ItemIcon EditSiteIcon">$editSiteLayout</a> + </li> + <% } %> + </ul> + </li> +</ul> \ No newline at end of file Modified: portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIStarToolBarPortlet.gtmpl =================================================================== --- portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIStarToolBarPortlet.gtmpl 2011-09-05 10:59:49 UTC (rev 7298) +++ portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIStarToolBarPortlet.gtmpl 2011-09-05 11:03:32 UTC (rev 7299) @@ -9,24 +9,19 @@ String changeLanguageAction = "if(document.getElementById('UIMaskWorkspace')) ajaxGet(eXo.env.server.createPortalURL('UIPortal', 'ChangeLanguage', true));"; String accountSetting = "if(document.getElementById('UIMaskWorkspace')) ajaxGet(eXo.env.server.createPortalURL('UIPortal', 'AccountSettings', true));"; String changeSkinAction = "if(document.getElementById('UIMaskWorkspace')) ajaxGet(eXo.env.server.createPortalURL('UIPortal', 'ChangeSkin', true));"; -%> -<div class="UIStarToolBarPortlet" id="$uicomponent.id" > - <div class="UIHorizontalTabs"> - <div class="TabsContainer"> - <div class="UITab portlet-menu-item" style="width: 62px"> - <div class=""></div> - <div class="MenuItemContainer portlet-menu-cascade" style="display:none;"> - <div class="MenuItem portlet-menu-cascade-item" onclick="$changeLanguageAction"> - <a href="#" class="ChangeLanguageIcon"><%=_ctx.appRes("UIStarToolbarPortlet.item.ChangeLanguage")%></a> - </div> - <div class="MenuItem portlet-menu-cascade-item" onclick="$changeSkinAction"> - <a href="#" class="ChangeSkinIcon"><%=_ctx.appRes("UIStarToolbarPortlet.item.ChangeSkin")%></a> - </div> - <div class="MenuItem portlet-menu-cascade-item" onclick="eXo.portal.logout();"> - <a href="#" class="SignOutIcon"><%=_ctx.appRes("UIStarToolbarPortlet.item.Logout")%></a> - </div> - </div> - </div> - </div> - </div> -</div> +%> +<ul class="UIStarToolBarPortlet UIHorizontalTabs" id="$uicomponent.id" > + <li class="UITab portlet-menu-item" style="width: 62px"> + <ul class="MenuItemContainer portlet-menu-cascade" style="display:none;"> + <li class="MenuItem portlet-menu-cascade-item" onclick="$changeLanguageAction"> + <a href="#" class="ChangeLanguageIcon"><%=_ctx.appRes("UIStarToolbarPortlet.item.ChangeLanguage")%></a> + </li> + <li class="MenuItem portlet-menu-cascade-item" onclick="$changeSkinAction"> + <a href="#" class="ChangeSkinIcon"><%=_ctx.appRes("UIStarToolbarPortlet.item.ChangeSkin")%></a> + </li> + <li class="MenuItem portlet-menu-cascade-item" onclick="eXo.portal.logout();"> + <a href="#" class="SignOutIcon"><%=_ctx.appRes("UIStarToolbarPortlet.item.Logout")%></a> + </li> + </ul> + </li> +</ul> Modified: portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserInfoPortlet.gtmpl =================================================================== --- portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserInfoPortlet.gtmpl 2011-09-05 10:59:49 UTC (rev 7298) +++ portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserInfoPortlet.gtmpl 2011-09-05 11:03:32 UTC (rev 7299) @@ -5,16 +5,16 @@ def rcontext = _ctx.getRequestContext(); String accountSetting = "javascript:if(document.getElementById('UIMaskWorkspace')) ajaxGet(eXo.env.server.createPortalURL('UIPortal', 'AccountSettings', true));" -%> -<div class="UIUserInfoPortlet" id="$uicomponent.id"> - <div class="Name"> +%> +<ul class="UIUserInfoPortlet" id="$uicomponent.id"> + <li class="Name"> <% if(rcontext.getRemoteUser() != null) { - EntityEncoder encoder = EntityEncoder.FULL; - fullName = encoder.encode(uicomponent.getUser().getFullName()); + EntityEncoder encoder = EntityEncoder.FULL; + fullName = encoder.encode(uicomponent.getUser().getFullName()); %> <a href="$accountSetting"><%=fullName%></a> <%} else {%> <span></span> <%}%> - </div> -</div> + </li> +</li> Modified: portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserToolBarDashboardPortlet.gtmpl =================================================================== --- portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserToolBarDashboardPortlet.gtmpl 2011-09-05 10:59:49 UTC (rev 7298) +++ portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserToolBarDashboardPortlet.gtmpl 2011-09-05 11:03:32 UTC (rev 7299) @@ -1,3 +1,4 @@ +<<<<<<< HEAD <% import org.exoplatform.web.application.JavascriptManager; import org.exoplatform.portal.webui.util.Util ; @@ -21,15 +22,13 @@ PortalURL nodeURL = nodeurl(); void renderDashboards(PortalURL nodeURL, PortalRequestContext pcontext, Collection nodes) { print """ - <div style="display:none" class="MenuItemContainer"> - <div class="SubBlock"> + <ul style="display:none" class="MenuItemContainer"> """; for(UserNode node : nodes) { renderPageNode(nodeURL, pcontext, node); } print """ - </div> - </div> + </ul> """ ; } @@ -67,33 +66,27 @@ } print """ - <div class="MenuItem $tabStyleNavigation" $getNodeURL> - <div class="$clazz"> + <li class="MenuItem $clazz $tabStyleNavigation" $getNodeURL> """; if(node.pageRef != null) { print """<a class="ItemIcon $icon" href="$href" $title>$label</a>"""; } else { print """<a class="ItemIcon $icon" href="#" $title>$label</a>"""; } - print """ - </div> - """ ; if(hasChild) { print """ - <div class="MenuItemContainer"> - <div class="SubBlock"> + <ul class="MenuItemContainer"> """ ; for(UserNode child : node.getChildren()) { renderPageNode(nodeURL, pcontext, child); } print """ - </div> - </div> + </ul> """ ; } print """ - </div> + </li> """ ; } %> @@ -103,31 +96,19 @@ if(userNodes.size() < 1) { String createDashboardLink = nodeURL.setResource(new NavigationResource(SiteType.USER, rcontext.getRemoteUser(), null)).toString(); %> - <div class="UIUserToolBarDashboardPortlet" id="$uicomponent.id"> - <div class="UIHorizontalTabs"> - <div class="TabsContainer"> - <div class="UITab NormalToolbarTab"> - <div class=""> - <a class="DashboardIcon TBIcon" href="<%= createDashboardLink%>">Dashboard</a> - </div> - </div> - </div> - </div> - </div> + <ul class="UIUserToolBarDashboardPortlet UIHorizontalTabs" id="$uicomponent.id"> + <li class="UITab NormalToolbarTab"> + <a class="DashboardIcon TBIcon" href="<%= createDashboardLink%>">Dashboard</a> + </li> + </ul> <% }else{ String link = nodeURL.setResource(new NavigationResource(SiteType.USER, rcontext.getRemoteUser(), null)).toString(); %> - <div class="UIUserToolBarDashboardPortlet" id="$uicomponent.id" > - <div class="UIHorizontalTabs"> - <div class="TabsContainer" > - <div class="UITab NormalToolbarTab"> - <div class=""> - <a class="DashboardIcon TBIcon" href="<%= link%>">Dashboard</a> - </div> - <% renderDashboards(nodeURL, pcontext, userNodes); %> - </div> - </div> - </div> - </div> + <ul class="UIUserToolBarDashboardPortlet UIHorizontalTabs" id="$uicomponent.id" > + <li class="UITab NormalToolbarTab"> + <a class="DashboardIcon TBIcon" href="<%= link%>">Dashboard</a> + <% renderDashboards(nodeURL, pcontext, userNodes); %> + </li> + </ul> <% } %> Modified: portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserToolBarGroupPortlet.gtmpl =================================================================== --- portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserToolBarGroupPortlet.gtmpl 2011-09-05 10:59:49 UTC (rev 7298) +++ portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserToolBarGroupPortlet.gtmpl 2011-09-05 11:03:32 UTC (rev 7299) @@ -25,20 +25,16 @@ void renderGroupPageNavigation(UserNavigation navigation, PortalURL nodeURL) { def nodes = uicomponent.getNavigationNodes(navigation); - if(nodes.size() < 1) return ; - String navTitle = _ctx.appRes("UIPageNavigation.label.titleBar") ; - def ownerId = navigation.getKey().getName(); - navTitle = navTitle.replace("{0}", OrganizationUtils.getGroupLabel(ownerId)); + if(nodes.size() < 1) return ; + String navTitle = _ctx.appRes("UIPageNavigation.label.titleBar") ; + def ownerId = navigation.getKey().getName(); + navTitle = navTitle.replace("{0}", OrganizationUtils.getGroupLabel(ownerId)); print """ - <div class="TitleBar portlet-menu-description"><div style="width: 99%" title="$ownerId">$navTitle</div></div> - <div class="SubBlock"> - """ ; - for(UserNode node : nodes) { - renderPageNode(node, nodeURL); - } - print """ - </div> - """ ; + <li class="TitleBar portlet-menu-description" title="$ownerId">$navTitle</li> + """ ; + for(UserNode node : nodes) { + renderPageNode(node, nodeURL); + } } void renderPageNode(UserNode node, PortalURL nodeURL) { @@ -66,58 +62,44 @@ MimeResponse res = _ctx.getRequestContext().getResponse(); ResourceURL resourceURL = res.createResourceURL(); resourceURL.setResourceID(groupId + "::" + node.getURI()); - getNodeURL = "exo:getNodeURL='" + resourceURL.toString() + "'"; - } - + getNodeURL = "exo:getNodeURL='" + resourceURL.toString() + "'"; + } + print """ - <div class="MenuItem $tabStyleNavigation portlet-menu-cascade-item" $getNodeURL> - <div class="$clazz"> + <li class="MenuItem $clazz $tabStyleNavigation portlet-menu-cascade-item" $getNodeURL> """; if(node.pageRef != null) { print """<a class="ItemIcon $icon" href="$actionLink" $title>$label</a>"""; } else { print """<a class="ItemIcon $icon" href="#" $title>$label</a>"""; } - print """ - </div> - """ ; if(hasChild) { - print """ - <div class="MenuItemContainer portlet-menu-cascade-separator" style="position: absolute; display:none"> - <div class="SubBlock"> + print """ + <ul class="MenuItemContainer portlet-menu-cascade-separator" style="position: absolute; display:none"> """ ; - for(UserNode child : node.getChildren()) { - renderPageNode(child, nodeURL); - } - print """ - </div> - </div> - """ ; - - } - print """ - </div> - """ ; + for(UserNode child : node.getChildren()) { + renderPageNode(child, nodeURL); + } + print """ + </ul> + """ ; + + } + print """ + </li> + """ ; } - def currentPortal = pcontext.getPortalOwner(); + def currentPortal = pcontext.getPortalOwner(); %> -<div class="UIUserToolBarGroupPortlet" id="$uicomponent.id" > - <div class="UIHorizontalTabs"> - <div class="TabsContainer"> - <div class="UITab NormalToolbarTab portlet-menu-item"> - <div class=""> - <a class="GroupIcon TBIcon" href="<%=nodeURL.setResource(new NavigationResource(SiteType.PORTAL, currentPortal, "groupnavigation")).toString() %>" ><%=_ctx.appRes("UIUserToolBarGroupPortlet.header.group")%></a> - </div> - <% - if (!groupNavigations.isEmpty()) { - %> - <div style="display:none" class="MenuItemContainer portlet-menu-cascade"> - <% for(nav in groupNavigations) { - renderGroupPageNavigation(nav, nodeURL); - } %> - </div> - <% } %> - </div> - </div> - </div> -</div> +<ul class="UIUserToolBarGroupPortlet UIHorizontalTabs" id="$uicomponent.id" > + <li class="UITab NormalToolbarTab portlet-menu-item"> + <a class="GroupIcon TBIcon" href="<%=nodeURL.setResource(new NavigationResource(SiteType.PORTAL, currentPortal, "groupnavigation")).toString() %>"><%=_ctx.appRes("UIUserToolBarGroupPortlet.header.group")%></a> + <% if (!groupNavigations.isEmpty()) { %> + <ul style="display:none" class="MenuItemContainer portlet-menu-cascade"> + <% for(nav in groupNavigations) { + renderGroupPageNavigation(nav, nodeURL); + } %> + </ul> + <% } %> + </li> +</ul> Modified: portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserToolBarSitePortlet.gtmpl =================================================================== --- portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserToolBarSitePortlet.gtmpl 2011-09-05 10:59:49 UTC (rev 7298) +++ portal/branches/dom/portlet/exoadmin/src/main/webapp/groovy/admintoolbar/webui/component/UIUserToolBarSitePortlet.gtmpl 2011-09-05 11:03:32 UTC (rev 7299) @@ -13,7 +13,7 @@ import org.exoplatform.portal.config.model.PortalConfig; def rcontext = _ctx.getRequestContext() ; - JavascriptManager jsmanager = rcontext.getJavascriptManager(); + JavascriptManager jsmanager = rcontext.getJavascriptManager(); jsmanager.importJavascript('eXo.portal.UIPortalNavigation') ; jsmanager.importJavascript('eXo.portal.UIAdminToolbar') ; jsmanager.addCustomizedOnLoadScript('eXo.portal.UIAdminToolbar.onLoad("' + uicomponent.id + '");'); @@ -23,14 +23,13 @@ void renderPortalNavigations(PortalURL nodeURL) { print """ - <div style="position: absolute; display:none" class="MenuItemContainer portlet-menu-cascade"> - <div class="SubBlock"> + <ul style="position: absolute; display:none" class="MenuItemContainer portlet-menu-cascade"> """; boolean isCurrent = false; String clazz = ""; String href = "#"; - for(int i = 0; i < uicomponent.getAllPortalNames().size(); i++) { + for(int i = 0; i < uicomponent.getAllPortalNames().size(); i++) { String portalName = uicomponent.getAllPortalNames().get(i); if(portalName.equals(uicomponent.getCurrentPortal())) { isCurrent = true; @@ -45,37 +44,33 @@ EntityEncoder entityEncoder = EntityEncoder.FULL; label = uicomponent.getPortalLabel(portalName); label = entityEncoder.encode(label); - print """ - <div class="MenuItem portlet-menu-cascade-item"> - <div class="$clazz"> - <a href="$href" class="ItemIcon SiteIcon">$label</a> - </div> + print """ + <li class="MenuItem $clazz portlet-menu-cascade-item"> + <a href="$href" class="ItemIcon SiteIcon">$label</a> """; if(isCurrent) { renderCurrentPortal(nodeURL); } print """ - </div> + </li> """; } print """ - </div> - </div> + + </ul> """; - } + } void renderCurrentPortal(PortalURL nodeURL) { def nodes = _ctx.getRequestContext().getAttribute("nodes"); print """ - <div style="position: absolute; display:none" class="MenuItemContainer portlet-menu-cascade"> - <div class="SubBlock"> + <ul style="position: absolute; display:none" class="MenuItemContainer portlet-menu-cascade"> """; for(UserNode node : nodes) { renderPageNode(nodeURL, node); } print """ - </div> - </div> + </ul> """; } @@ -103,12 +98,11 @@ MimeResponse res = _ctx.getRequestContext().getResponse(); ResourceURL resourceURL = res.createResourceURL(); resourceURL.setResourceID(node.getURI()); - getNodeURL = "exo:getNodeURL='" + resourceURL.toString() + "'"; + getNodeURL = "exo:getNodeURL='" + resourceURL.toString() + "'"; } print """ - <div class="MenuItem $tabStyleNavigation portlet-menu-cascade-item" $getNodeURL> - <div class="$clazz"> + <li class="MenuItem $tabStyleNavigation $clazz portlet-menu-cascade-item" $getNodeURL> """; if(node.pageRef != null) { print """<a class="ItemIcon $icon" href="$href" $title>$label</a>"""; @@ -116,44 +110,35 @@ print """<a class="ItemIcon $icon" href="#" $title>$label</a>"""; } print """ - </div> + """ ; if(hasChild) { - print """ - <div class="MenuItemContainer portlet-menu-indicator" style="position: absolute; display:none"> - <div class="SubBlock"> + print """ + <ul class="MenuItemContainer portlet-menu-indicator" style="position: absolute; display:none"> """ ; for(UserNode child : node.getChildren()) { renderPageNode(nodeURL, child); - } - print """ - </div> - </div> - """ ; - - } + } + print """ + </ul> + """ ; + + } print """ - </div> - """ ; + </li> + """ ; } - def currentPortal = uicomponent.getCurrentPortal(); def navigation = uicomponent.getNavigation(SiteKey.portal(currentPortal)); def nodes = uicomponent.getNavigationNodes(navigation); - _ctx.getRequestContext().setAttribute("nodes", nodes); -%> - -<div class="UIUserToolBarSitePortlet" id="$uicomponent.id" > - <div class="UIHorizontalTabs"> - <div class="TabsContainer"> - <div class="UITab NormalToolbarTab portlet-menu-item"> - <div class=""> - <a class="SitesIcon TBIcon" href="<%= nodeURL.setResource(new NavigationResource(SiteType.PORTAL, currentPortal, "portalnavigation")).toString() %>"> - <%=_ctx.appRes("UIUserToolBarSitePortlet.header.site")%> - </a> - </div> - <% renderPortalNavigations(nodeURL) %> - </div> - </div> - </div> -</div> + _ctx.getRequestContext().setAttribute("nodes", nodes); +%> + +<ul class="UIUserToolBarSitePortlet UIHorizontalTabs" id="$uicomponent.id" > + <li class="UITab NormalToolbarTab portlet-menu-item"> + <a class="SitesIcon TBIcon" href="<%= nodeURL.setResource(new NavigationResource(SiteType.PORTAL, currentPortal, "portalnavigation")).toString() %>"> + <%=_ctx.appRes("UIUserToolBarSitePortlet.header.site")%> + </a> + <% renderPortalNavigations(nodeURL) %> + </li> +</ul> Modified: portal/branches/dom/portlet/web/src/main/webapp/groovy/portal/webui/component/UIPortalNavigation.gtmpl =================================================================== --- portal/branches/dom/portlet/web/src/main/webapp/groovy/portal/webui/component/UIPortalNavigation.gtmpl 2011-09-05 10:59:49 UTC (rev 7298) +++ portal/branches/dom/portlet/web/src/main/webapp/groovy/portal/webui/component/UIPortalNavigation.gtmpl 2011-09-05 11:03:32 UTC (rev 7299) @@ -73,8 +73,8 @@ } print "</li>"; } -%> -<ul class="UINavigationBar <%=uicomponent.getCssClassName()%>" > +%> +<ul class="UINavigationBar UIHorizontalTabs <%=uicomponent.getCssClassName()%>" > <% MimeResponse res = _ctx.getRequestContext().getResponse(); Modified: portal/branches/dom/portlet/web/src/main/webapp/skin/portal/webui/component/UINavigationPortlet/DefaultSkin/background/NavDownArrow.gif =================================================================== (Binary files differ) Modified: portal/branches/dom/portlet/web/src/main/webapp/skin/portal/webui/component/UINavigationPortlet/DefaultSkin/background/NavDownArrowHover.gif =================================================================== (Binary files differ) Modified: portal/branches/dom/portlet/web/src/main/webapp/skin/portal/webui/component/UINavigationPortlet/DefaultStylesheet.css =================================================================== --- portal/branches/dom/portlet/web/src/main/webapp/skin/portal/webui/component/UINavigationPortlet/DefaultStylesheet.css 2011-09-05 10:59:49 UTC (rev 7298) +++ portal/branches/dom/portlet/web/src/main/webapp/skin/portal/webui/component/UINavigationPortlet/DefaultStylesheet.css 2011-09-05 11:03:32 UTC (rev 7299) @@ -52,11 +52,10 @@ .UINavigationPortlet .UINavigationBar .UITab { float:left;/* orientation=lt */ float:right;/* orientation=rt */ - margin: 6px 8px 0 0; + margin: 6px 10px 0 0; font-weight:bold; text-align:center; } - .UINavigationPortlet .UITab > span { padding: 0 6px; color: #f57a00; @@ -75,8 +74,8 @@ .UINavigationPortlet .UITab a.TabIcon { display:block; - padding:0 0 0 20px;/* orientation=lt */ - padding:0 20px 0 0px;/* orientation=rt */ + padding:0 0 0 21px;/* orientation=lt */ + padding:0 21px 0 0px;/* orientation=rt */ background-position: right;/* orientation=rt */ } @@ -124,6 +123,7 @@ .UINavigationPortlet .HighlightNavigationTab > span { background-color:#6D94C8; + margin-bottom: 5px; } @@ -199,7 +199,7 @@ .UINavigationPortlet .MenuItemContainer .ItemIcon { height: 24px; width: auto; - background-position: right;/* orientation=rt */ + background-position: right;/* orientation=rt */ } /*============ Scroll Buttons =====================*/ @@ -210,7 +210,8 @@ cursor:pointer; float: right; /* orientation=lt */ float: left; /* orientation=rt */ - height: 15px; + height: 15px; + width: 20px; } .UINavigationPortlet .ScrollButtons a { @@ -243,12 +244,12 @@ background: url('DefaultSkin/background/Button-rt.gif') no-repeat left -30px; /* orientation=rt */ } -.UINavigationPortlet .ScrollLeftButton:hover { +.UINavigationPortlet .HighlightScrollLeftButton ,.UINavigationPortlet .ScrollLeftButton:hover{ background: url('DefaultSkin/background/Button.gif') no-repeat left top; /* orientation=lt */ background: url('DefaultSkin/background/Button-rt.gif') no-repeat right top; /* orientation=rt */ } -.UINavigationPortlet .ScrollRightButton:hover { +.UINavigationPortlet .HighlightScrollRightButton,.UINavigationPortlet .ScrollRightButton:hover { background: url('DefaultSkin/background/Button.gif') no-repeat right top; /* orientation=lt */ background: url('DefaultSkin/background/Button-rt.gif') no-repeat left top; /* orientation=rt */ } @@ -260,5 +261,10 @@ } .UINavigationPortlet .GroupNavigation .HighlightNavigationTab > span { +<<<<<<< HEAD background-color:#ffcf01; } +======= + background-color:#ffcf01; +} +>>>>>>> 4765c2a... EXOGTN-427 [DOM] Admin Toolbar optimization Modified: portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/portal/UIAdminToolbar.js =================================================================== --- portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/portal/UIAdminToolbar.js 2011-09-05 10:59:49 UTC (rev 7298) +++ portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/portal/UIAdminToolbar.js 2011-09-05 11:03:32 UTC (rev 7299) @@ -19,8 +19,8 @@ function UIAdminToolbar() {} ; UIAdminToolbar.prototype.onLoad = function(baseId) { - var uiNavPortlet = document.getElementById(baseId) ; - var mainContainer = eXo.core.DOMUtil.findFirstDescendantByClass(uiNavPortlet, "div", "TabsContainer"); + var uiNavPortlet = document.getElementById(baseId).parentNode ; + var mainContainer = eXo.core.DOMUtil.findFirstDescendantByClass(uiNavPortlet, "ul", "UIHorizontalTabs"); if(mainContainer) eXo.portal.UIPortalNavigation.init(uiNavPortlet, mainContainer, 0, 0); } ; Modified: portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/portal/UIPortalNavigation.js =================================================================== --- portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/portal/UIPortalNavigation.js 2011-09-05 10:59:49 UTC (rev 7298) +++ portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/portal/UIPortalNavigation.js 2011-09-05 11:03:32 UTC (rev 7299) @@ -50,7 +50,7 @@ var uiWorkingWorkspace = document.getElementById("UIWorkingWorkspace"); var uiNavPortlets = eXo.core.DOMUtil.findDescendantsByClass(uiWorkingWorkspace, "div", "UINavigationPortlet"); if (uiNavPortlets.length) { - var mainContainer = eXo.core.DOMUtil.findFirstDescendantByClass(uiNavPortlets[0], "ul", "UINavigationBar"); + var mainContainer = eXo.core.DOMUtil.findFirstDescendantByClass(uiNavPortlets[0], "ul", "UIHorizontalTabs"); eXo.portal.UIPortalNavigation.init(uiNavPortlets[0], mainContainer, 0, 0); for (var i = 1; i < uiNavPortlets.length; ++i) { uiNavPortlets[i].style.display = "none"; @@ -71,7 +71,7 @@ */ UIPortalNavigation.prototype.buildMenu = function(popupMenu) { var DOMUtil = eXo.core.DOMUtil; - var topContainer = DOMUtil.findFirstDescendantByClass(popupMenu, "ul", "UINavigationBar"); + var topContainer = DOMUtil.findFirstDescendantByClass(popupMenu, "ul", "UIHorizontalTabs"); topContainer.id = "PortalNavigationTopContainer"; // Top menu items var topItems = DOMUtil.findDescendantsByClass(topContainer, "li", "UITab"); @@ -190,7 +190,7 @@ for(var i = 0; i < uicomponents.length; i ++) { var navPortlet = DOMUtil.findFirstDescendantByClass(uicomponents[i], "div", "UINavigationPortlet") ; if(navPortlet && (navAncestor != navPortlet)) { - var tabsContainer = DOMUtil.findFirstDescendantByClass(navPortlet, "ul", "UINavigationBar"); + var tabsContainer = DOMUtil.findFirstDescendantByClass(navPortlet, "ul", "UIHorizontalTabs"); tabsContainer.style.position = "static" ; } } @@ -346,7 +346,7 @@ for(var i = 0; i < uicomponents.length; i ++) { var navPortlet = DOMUtil.findFirstDescendantByClass(uicomponents[i], "div", "UINavigationPortlet") ; if(navPortlet) { - var tabsContainer = DOMUtil.findFirstDescendantByClass(navPortlet, "ul", "UINavigationBar"); + var tabsContainer = DOMUtil.findFirstDescendantByClass(navPortlet, "ul", "UIHorizontalTabs"); tabsContainer.style.position = "relative" ; } } Modified: portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/portal/webui/component/view/UIToolbarContainer/Stylesheet.css =================================================================== --- portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/portal/webui/component/view/UIToolbarContainer/Stylesheet.css 2011-09-05 10:59:49 UTC (rev 7298) +++ portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/portal/webui/component/view/UIToolbarContainer/Stylesheet.css 2011-09-05 11:03:32 UTC (rev 7299) @@ -21,6 +21,11 @@ padding: 0px; height: auto; } +.UIToolbarContainer ul { + padding:0; + margin:0; + list-style:none; +} .UIToolbarContainer .UserInfoPortletTDContainer { float: right; /* orientation=lt */ @@ -69,7 +74,7 @@ color: #058ee6; } -.UIToolbarContainer .UIHorizontalTabs .TabsContainer { +.UIToolbarContainer .UIHorizontalTabs { height: 32px; /* orientation=lt */ height: auto; /* orientation=rt */ float: left; /* orientation=lt */ @@ -115,9 +120,13 @@ position: absolute; border: 1px solid #9e9fa3; display: none; - z-index: 1; + z-index: 1; } + .UIToolbarContainer .MenuItemContainer li{ + display:block; +} + .UIToolbarContainer .TitleBar { background: #cdd7e0; height: 23px; @@ -130,24 +139,29 @@ filter: alpha(opacity=90); } +.UIToolbarContainer .ArrowIcon { + background: url('background/ToolbarContainer.gif') no-repeat right bottom; /* orientation=lt */ + background: url('background/ToolbarContainer-rt.gif') no-repeat -5px bottom; /* orientation=rt */ +} + .UIToolbarContainer .MenuItem { - background: #f5f9fa; - opacity: 0.9; - filter: alpha(opacity=90); + background-color: #f5f9fa; height: 28px; line-height: 28px; width: 100%; + opacity: 0.9; + filter: alpha(opacity=90); } +*+html .UIToolbarContainer .MenuItem { + height: auto; + width: auto; +} + .UIToolbarContainer .MenuItem .MenuItemHover { background-color: #a4a4a4; } -.UIToolbarContainer .MenuItem .ArrowIcon { - background: url('background/ToolbarContainer.gif') no-repeat right bottom; /* orientation=lt */ - background: url('background/ToolbarContainer-rt.gif') no-repeat -5px bottom; /* orientation=rt */ -} - .UIToolbarContainer .MenuItem a { padding-right: 25px; /* orientation=lt */ padding-left: 25px; /* orientation=rt */ @@ -166,8 +180,8 @@ } .UIToolbarContainer .SiteIcon { - background: url('background/ToolbarContainer.gif') no-repeat 5px -96px; /* orientation=lt */ - background: url('background/ToolbarContainer.gif') no-repeat 100% -96px; /* orientation=rt */ + background: url('background/ToolbarContainer.gif') no-repeat 5px -98px; /* orientation=lt */ + background: url('background/ToolbarContainer.gif') no-repeat 100% -98px; /* orientation=rt */ } .UIToolbarContainer .SitesIcon { @@ -257,19 +271,15 @@ color: #3e8df0; } -.UIToolbarContainer .UIAdminToolbarPortlet .UIHorizontalTabs .UITab { +.UIToolbarContainer .UIAdminToolbarPortlet .UITab { background: none; padding: 0px; } -.UIToolbarContainer .UIUserToolbarPortlet .UIHorizontalTabs .TabsContainer { - width: 400px; /* orientation=rt */ +.UIToolbarContainer .UIAdminToolbarPortlet .UIHorizontalTabs .UITab { + float: none; /* orientation=rt */ } -.UIToolbarContainer .UIAdminToolbarPortlet { - width: 200px; /* orientation=rt */ -} - -.UIToolbarContainer .UIAdminToolbarPortlet .UIHorizontalTabs .UITab { - float: none; /* orientation=rt */ +.UIUserToolBarSitePortlet .ItemIcon { + background-position: 97% center; /* orientation=rt */ } \ No newline at end of file Modified: portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/portal/webui/component/view/UIToolbarContainer/background/ToolbarContainer.gif =================================================================== (Binary files differ)