Next, define the extension-point and give it an id of “ContactNames”. <extension-point id="ContactNames" />
Next, define an extension for this extension-point. <extension point="com.myco.theme.plugin.ContactNames" id="ContactNames_01" name="names_01">
Use the combination of the ID of the plugin and the ID of the extension-point. The id and name are used during logging. While uniqueness is not enforced, try to create names unique to your plug-in. Next we define items that correspond to the ThemeItem objects used in the theme. For a single extension-point you can have multiple items defined. The item also needs to define the class to be used and an ID. This example lists contacts with a first name, last name, and e-mail ID.
Add a few more contacts and the complete file will look like this:
<extension-point id="ContactNames" /> <extension point="com.myco.theme.plugin.ContactNames" id="ContactNames_01" name="names_01">
Because custom attributes were used, we need to create a class that will read them. In this class, define some constants that define the attribute names and override the setInitializationData method to read these attributes from the IconfigurationElement object. For this example we will extend the DefaultThemeTextItem class and take advantage of the default implementations. Create an interface named IContactNamesItem Add the following constants to identify the attribute names from the item element. public static final String FIRST_NAME = "firstName"; public static final String LAST_NAME = "lastName"; public static final String EMAIL_ID = "email";
Next, define a set of Strings used to store the values of these attributes. private String firstName; private String lastName; private String email;
Our interface will define the following getters and our implementation will set and return the values. public String getEmail(); public String getFirstName(); public String getLastName();
Create a class that extends DefaultThemeTextItem and also implements IContactNamesItem. Next override the setInitialization method to retrieve the data. public void setInitializationData(IConfigurationElement element, String arg1, Object arg2) throws CoreException { super.setInitializationData(element, arg1, arg2); String value = element.getAttribute(FIRST_NAME); if(value != null){ firstName = value; } value = null; value = element.getAttribute(LAST_NAME);
if(value != null){ lastName = value; } value = null; value = element.getAttribute(EMAIL_ID); if(value != null){ email = value; } }
This coding is needed to create the bean that represents the ThemeItem. We could have optionally added another method to generate the markup to e-mail this customer. While defining the getters in the interface works when using a small number of attributes, there is a better solution if there are many more attributes defined. You could use a Map to store all the data, then have one method for retrieving the desired attribute. We could rework the example so that the interface looked like this: public interface IContactNamesItem { public static final String FIRST_NAME = "firstName"; public static final String LAST_NAME = "lastName"; public static final String EMAIL_ID = "email"; public String getAttribute(String key); }
Our implementation would now change to the following: public class ContactNames extends DefaultThemeTextItem implements IContactNamesItem{ private Map attributes = new HashMap(); public void setInitializationData(IConfigurationElement element, String arg1, Object arg2) throws CoreException { super.setInitializationData(element, arg1, arg2); String value = element.getAttribute(FIRST_NAME); if(value != null){ attributes.put(FIRST_NAME, value); } value = null; value = element.getAttribute(LAST_NAME); if(value != null){ attributes.put(LAST_NAME, value); } value = null; value = element.getAttribute(EMAIL_ID); if(value != null){ attributes.put(EMAIL_ID, value); } } public String getAttribute(String key){ if(key !=null){
}
return (String)attributes.get(key); } return null;
}
This implementation provides a cleaner solution, especially when there are a large number of attributes. To display the list of contacts on the top of the page, add this code in the default.jsp. The taglib for the theme extensions is already defined for the IBM provided themes. If you are using a custom theme, add the theme extensions taglib definition. <%@ taglib uri="http://www.ibm.com/xmlns/prod/websphere/portal/v6.0/portal-themeext" prefix="portal-theme-ext"%>
The policies can determine whether theme extensions are enabled or not enabled, so place your theme extension code after the theme policy initialization tag. <portal-theme-ext:initthemepolicy /> <jsp:useBean id="themePolicy" class="com.ibm.portal.theme.policy.ThemePolicyBean" scope="page" /> <%themePolicy.setValuesMap(portalThemePolicyMap);%>
Using the themeExtension tag, specify the extension point to include. We have defined the extension-point to be com.myco.theme.plugin.ContactNames, so this the is value to use in the id attribute. <portal-theme-ext:themeExtension id="com.myco.theme.plugin.ContactNames" >
Next, we iterate through all extension that have this point defined. This is the advantage is using theme extensions. Other portal administrators could create their own plug-in that extends this extension point and provide additions to the contact list. Developers could also create a custom class that implements IcontactNamesItem and defines some custom logic. All this can be done without having to change the theme. While looping through the extension we will cast the implicit themeExtension object that is provided in the themeExtensionLoop tag. <portal-theme-ext:themeExtensionLoop> <% com.ibm.wps.themeext.sample.ContactNames contact = (com.ibm.wps.themeext.sample.IContactNamesItem)themeExtension;
After we have this object, we can use it to create a mailto link to this contact. out.println("" + contact.getAttribute(contact.FIRST_NAME) + " " + contact.getAttribute(contact.LAST_NAME) + "
"); %>
Chapter 5 – Flyouts and context menus Flyouts Flyouts are customizations that take advantage of the theme extensions so that you do not have to modify any theme JSP files. You can drop these JAR files in to your shared app directory, restart the server, and theses extensions are added to the theme as it renders. In this example we create a link to the enable tracing page so that it renders as a flyout. We will need to create a Java project in Rational Application Developer (or your tool of choice). Then, add the portal runtime to the build path, and finally these three jar files: portal_root\shared\app\wp.theme.extensions.api.jar portal_root\shared\app\wp.theme.extensions.impl.jar portal_root\shared\ext\eclipse-runtime.jar For our example, create a class that extends the following, ThemeLinkItem The following methods in that class are doing most of the work. This method creates the URL using a URL generation API. This method makes use of a helper class to do all of the URL creation. More information can be found at Advanced URL
Generation.
public EngineURL newURL() throws StateException { EngineURL result = null; try { result = ServletURLGenerator.generateUrlForFlyout("ibm.portal.Enable Tracing", "wps.p.Enable Tracing", aContext.getRequest(), aContext.getResponse() ); } catch (Exception ex) { System.out.println("There was a problem generating a flyout url"); } return result; }
The following method specifies which graphic to display into the theme for expanding and collapsing this new flyout. This example uses a graphic of a pencil writing. You can use any graphic you want, but keep the size of the graphic to 21 pixels square. We use the helper class to generate the URL for us which makes use of the URL generation API. public DisposableURL newIconURL( State state ) throws StateException DisposableURL url = null; try { url = ServletURLGenerator.getDisposableURL(aContext.getRequest(), aContext.getResponse(), "images/toolBar/tracing.gif"); } catch (Exception ex) { System.out.println("Unable to create the url"); } return url; }
{
This method returns the title to be shown when hovering over the icon. This will also be used if the graphic URL cannot be retrieved. public String getTitle( Locale arg0 ) return "Enable Tracing"; }
{
This method renders in a new window instead of the current one. In a flyout, this will let it actually flyout over the current window instead of trying to be in the window. public boolean isNewWindow() { return true; }
Finally in your Java project at the root level, you need a plugin.xml file. <extension point="com.ibm.portal.theme.plugin.Flyouts" id="WPSToolBaryFlyouts" name="ToolBarFlyouts">
This tells portal where to load your extension from, and where to add it to in the theme extension hierarchy. Because we have not defined any new extension points, we do not have the tag for the extension-point. Instead there is the extension we are adding to the already existing extension points. To deploy this implementation, put the graphic into the theme in use, that will go under app_server_root/profiles/profilename/installedApps/nodename/wps.e ar/wps.war/themes/html/themename/images/toolBar/. Next, export this Java project from your development environment. Note: Make sure you have specified 1.4 as the compiler compliance level, as Rational Application Developer uses 5.0 by default for Java projects. Take this jar file and drop it into portal_server_root/shared/app, and then restart the portal server. Using our example, you should now see the image for tracing in the upper right corner of your theme.
Context menus Several context menus are included by default. At this time do not use the theme extension points to create your own context menu. Use the extension points to add items to the context menus, either for the page, the portlet, or the whole portal. You can selectively enable these menu items at runtime, based upon criteria. To create a context menu item, create a class that extends the following: ThemeLinkItem
In this class, we have overridden the setInitializationData to pull in the properties from our plugin.xml file to parameterize this class. This is discussed in more detail in the theme extensions chapter. public void setInitializationData( IConfigurationElement arg0, String arg1, Object arg2 ) throws CoreException { String titleValue = null; titleValue = arg0.getAttribute( TITLE_ATTRIBUTE ); if ( titleValue != null ) { this.title = titleValue; } String descriptionValue = null; descriptionValue = arg0.getAttribute( DESCR_ATTRIBUTE ); if ( descriptionValue != null ) { this.description = descriptionValue; } String urlValue = null; urlValue = arg0.getAttribute( EXTERNAL_URL_ATTRIBUTE );
}
if ( urlValue != null) { this.externalUrl = urlValue; }
Based upon those values that we pulled in, we create a URL to an external site. public EngineURL newURL() throws StateException return new ExternalURL( this.externalUrl ); }
{
Finally, we tell it to open the page in the existing window. public boolean isNewWindow() return false; }
{
Then, in the plugin.xml file, add the following.
<extension point="com.ibm.portal.theme.plugin.PortletContextMenuItems" id="WPSExternalPortletMenuLinks" name="ExternalPortletMenuLinks">
class="com.ibm.wps.l2.whitepaper.samples.ExternalLinkItem" title="Google" description="Search for relevant items." url="http://www.google.com" />
This code loads these parameters into the class using the setInitializationParameterData method. In this way, you can reuse the code above to create several links to add to the context menu of your choice (page, portal, or portlet). Just by changing it to this example, it is added to the Main Menu instead of the Portlet Context Menu. <extension point="com.ibm.portal.theme.plugin.MainContextMenuItems" id="WPSExternalMainMenuLinks" name="ExternalMainMenuLinks">
It would display in the drop-down control from the launch button instead of anywhere else in portal. Also included in the source code is an example of a Page Context Menu item that points to a portal page. The class is InternalLinkItem and extends the ThemeLinkItem. This link points to a custom Create Page that could exist anywhere inside your portal, but will be accessible from the page context menus of any page, as long as the theme policy to render theme extensions is set to true. The method to create the URL also used the helper class and looks like the following. This helper class could allow you to target a portlet and pass parameters to it. public EngineURL newURL() throws StateException { EngineURL result = null; try { result = ServletURLGenerator.generateUrlStringServlet(page, null, null, context.getRequest(), context.getResponse()); } catch (Exception ex) { System.out.println("This exception in this code = " + ex); } return result; }
In the plugin.xml file, we have the following to describe this new item
<extension point="com.ibm.portal.theme.plugin.PageContextMenuItems" id="WPSExternalPageMenuLinks" name="ExternalPageMenuLinks">
For full source code listing, see the attached code. Several methods that are needed are defined in the source, but we have not modified them in any significant way. More information on these methods is also in the Javadoc for theme extensions, that can be found at: http://www1.ibm.com/support/docview.wss?rs=688&context=SSHRKX&context=SSBRWT&context=SSQ KRQ&context=SS3NNG&context=SSYJ99&context=SSRUWN&context=SS6JVW&q1=theme &uid=swg21247155&loc=en_US&cs=utf-8&lang=en
Chapter 6 – Development tools As the new version contains a significant level of complexity and improvement from previous versions, debugging all these interactions can be quite tricky. Luckily there are tools that make both HTML and JavaScript debugging easier. The tools that we have used the most are plug-ins for Firefox which allow you to make real time changes to the source code and see how it changes the look without requiring you to refresh the browser. Also, you will be able to pinpoint which area needs changing easier. The first of these tools is the Web developer plug-in for Firefox: https://addons.mozilla.org/enUS/firefox/addon/60 . The second of these is called Firebug which is helpful for debugging issues with JavaScript and CSS: https://addons.mozilla.org/en-US/firefox/addon/1843 With these plug-ins both installed, you can inspect the rendered Web site in the following manner. Right-click an element, then choose Inspect Element.
That action will display window at the bottom of the browser that lets you see the HTML source for the current element.
Additionally you can view the stylesheets, the JavaScripts, the DOM, and Net, which shows you the response time for various pieces to load. Next, on the right side, see the stylesheet definitions in use for this element.
You can click to edit one of these or add a new setting to see how it would look in the rendered output. This change only affects this page view and will not be persisted. With the Web developer toolbar you can also validate the HTML and CSS. You can outline all table elements, which can be helpful when the page is failing to load correctly. Line guides are also available to help with positioning of items when using pixels measurements. A ruler is available that you can stretch directly on the page to measure distances between visual objects.
There is a wealth of other options and both of these tools we have found very useful when developing themes and skins.
Chapter 7 – Migrating to version 6.0 from version 5.1 Adding drag and drop When migrating to version 6.0, you will not want to convert all of your skins and themes to full 6.0 style. With these steps you will not have to rebuild your version 5.1 skins to support the drag and drop functionality of version 6.0. See the information center about the necessary tags you will need in your skin JSP files to support this functionality. http://publib.boulder.ibm.com/infocenter/wpdoc/v6r0/index.jsp?topic=/com.ibm.wp.ent.doc/wps/ dgn_dndtags.html The main tags are: - This tag must be in the JSP or else it will not work. This tag loads several JavaScripts that are needed to make the drag and drop work. - Designates which part of the actual content is dragable. - Sets up a drop zone. - Designates a part of the portlet to be used as the handle for drag and drop. First in the control.jsp file, you need to add the following import: <%@ page import="com.ibm.portal.content.LayoutNode"%>
and tag lib declaration: <%@ taglib uri="/WEB-INF/tld/dnd.tld" prefix="dnd" %>
After the wps:constant tag, add the following: <%! private static com.ibm.portal.identification.Identification identification; public void jspInit(){ try{ /* only perform this JNDI lookup once as this is an expensive call performance wise */ javax.naming.Context ctx=new javax.naming.InitialContext(); identification=(com.ibm.portal.identification.Identification) ctx.lookup("portal:service/Identification"); } catch (javax.naming.NamingException ne){ } } %> <% String currentLayoutNodeStr=""; if (pageContext.getAttribute("currentLayoutNode", pageContext.REQUEST_SCOPE) != null) { LayoutNode currLayoutNode=(LayoutNode)pageContext.getAttribute("currentLayoutNode" , pageContext.REQUEST_SCOPE); currentLayoutNodeStr=identification.serialize(currLayoutNode.getObjectI D()); }
else { LayoutNode currLayoutNode=(LayoutNode)pageContext.getRequest().getAttribute("com.i bm.wps.composition.element"); currentLayoutNodeStr=identification.serialize(currLayoutNode.getObjectI D()); } %>
These will set up certain items in the context of the page so that they are available for the later tags for the drag and drop feature. Next, directly after this, add:
Then add a closing drag tag after the end of the portlet content in the control.jsp file.
The next two tags you need to add are:
The easiest place to add them is around the display part for the portlet title.
Drop zones You need to add a drop tag inside some element, either a div or table, so that it is actually large enough to interact with. Start with UnlayeredContainer-H.jsp and first add: <%@ taglib uri="/WEB-INF/tld/dnd.tld" prefix="dnd" %>
This area will be the start area:
Then at the end of the section, add:
The easiest way to do this would be to add the following above your layout node:
<%-- We use these rows to make the vertical drop zones large enough to interact with. There is a problem when trying to get a table to expand to fill an entire region vertically. --%> |
|
|
Then add your layout node loop. Then at the end, add the following: <%-- We use these rows to make the vertical drop zones large enough to interact with. There is a problem when trying to get a table to expand to fill an entire region vertically. --%> | | |
This code lets you drag before or after the portlet in that row. Next, modify the Unlayered-Container-V.jsp file to be able to drag and drop in the columns. Add this tag lib: <%@ taglib uri="/WEB-INF/tld/dnd.tld" prefix="dnd" %>
and this tag:
Then in your layout loop, add this code into a row or div element above where your portlet is called to render.
optionalActionJavascript="DND_MOVE_PORTLET_JS">
Then, after the layout loop you should add a row or div like the following:
These lines will give you the drop zones before and after the portlets in the column.
Theme changes Finally you need to add the stylesheet for the page, These styles give your drop zones visible areas during the drag and drop so that it is easy to see what areas can be dropped into (very helpful when you have removed all portlets from a column). /* DRAG AND DROP */ .dndDropAware{ border: 0px; background-color: #FFEBC5; } .dndDropActive{ border: 0px; background-color: #FF9000; } .dndDragging{ width: 100%; filter: alpha(opacity=40); } .dndDragSelected{ border: 1px; background-color: #DDDDDD; } .dndMoveCursor{
cursor:move; } .dndDropCursor{ cursor: pointer; } .dndNoDropCursor{ cursor: not-allowed; } .layoutRow {width: 100%; } .layoutColumn {width: 100%; }
The easiest way to do the drop zones is to copy the Unlayered-Container-v and h.jsp files to your skin from the IBM one, as this will set up the drag and drop areas easily for you.
Considerations when migrating Default navigational state This setting tells the portal container whether to render navigation nodes either in an expanded or collapsed mode. This setting affects the rendering of the navigation tree as it appears on the left side by default. In version 5, this setting was set to true so that all nodes were shown as expanded on the right side. This setting caused the navigational loop tags to loop through all the child tags and display links to all the child pages. In version 6, this default state is set to false. If you are using any coding to create drop downs or flyouts that rely on the navigation loop tags producing links to all the children, you need to set this value back to false. Otherwise it will generate links to only the top level and your drop down lists will not appear fully populated. To override this setting in version 6 you need to change the setting
navigation.expansion.defaultstate to true in the Configuration Service. For more information on setting properties in version 6, see the Information center on this topic http://publib.boulder.ibm.com/infocenter/wpdoc/v6r0/topic/com.ibm.wp.ent.doc/wps/ads etcfg.html Behavior of Skins When running with your 5.1 skins on 6.0 you will have an issue if your portlet supports the edit mode. In version 6.0 the concept of edit defaults and personalize modes were added. The standard edit mode is not referred to as personalize and those values are stored to the customization database domain. But edit defaults will save the preferences to the release domain. When using any 5.1 theme on 6.0, and clicking on edit this will go to the personalize mode even if it is an administrator or manager doing the editing. To have this feature work correctly you will need to add the edit defaults compatibility mode to your portlet, and add a link to your skin so now have edit show the text as personalize, and the edit defaults as edit shared settings. The following is an example from the 6.0 menu
<portal-navigation:urlGeneration contentNode="<%=pageID%>" layoutNode="<%=windowID%>" portletMode="edit" themeTemplate="" >'<portal-fmt:text bundle="nls.titlebar" key="edit" /> <portal-navigation:urlGeneration contentNode="<%=pageID%>" layoutNode="<%=windowID%>" portletMode="edit_defaults" themeTemplate="" >”><portal-fmt:text bundle="nls.titlebar" key="edit.defaults" />
Appendix A – Changing properties of the flyout IBM provides two flyouts with the base theme: the people palette and the portlet palette. In your implementation, you might have your own directory search portlet that you want to place on the flyout page instead of using the default user People search portlet. If you remove the existing portlet from the people palette, and place your own directory search portlet on the page, you will encounter some problems (such as, the URL is not able to be created and exceptions are listed in the log). When you removed the old portlet from the page, you removed a portlet instance with the unique name of ibm.portal.People Palette Control. The theme code that creates the URL to the flyout uses the URL generation services and targets the original People Search portlet by name. After you remove it, the URL generation services cannot find that portlet instance on the people palette page and it is unable to render the icon. You have two options to fix this problem. The recommended way is to give one of the portlets on that page the unique name as above following only steps 2, 3, and 4 from the technote documented at: http://www1.ibm.com/support/docview.wss?rs=688&uid=swg21220164 Export the page (people palette) with this XML code: <request type="export" xmlns:xsi="http://www.w3.org/2001/XMLSchemainstance" xsi:noNamespaceSchemaLocation="PortalConfig_1.2.xsd"> <portal action="locate">
The result will be similar to the output listed here: <portletinstance action="update" domain="rel" objectid="5_UV9FQLI11O1BF026LUV0FD0884" portletref="3_UV9FQLI11O1BF026LUV0FD00C6"/>
Notice the line uniquename=”ibm.portal.People Palette Control”.
Reading from your output, you need to modify one of the components surrounding the portlet and put the uniquename attribute on it with this exact value ibm.portal.People Palette Control. Another way, which was not tested, to fix the problem is to edit the URL generation tag in the head.jspf file and remove the layoutNode attribute from this line: url:"<portal-navigation:urlGeneration contentNode='ibm.portal.People Palette' layoutNode='ibm.portal.People Palette Control' newWindow='true' portletWindowState='Normal'><% wpsURL.write(out); %>",
If you put more than one portlet on the page, you will also have to change the size of the flyout. To change the width, change the following lines in the file styles_theme.jspf. <%--=================================================== FLYOUT ===================================================--%> .portalFlyout{ position: absolute; left: -390px; width: 382px; background-color: ${colors.bodyBackground}; }
Next, make sure that styles.jsp gets recompiled. If you do not have reloading enabled, you will need to restart the server after editing the file. In our example, we changed it to the following: <%--=================================================== FLYOUT ===================================================--%> .portalFlyout{ position: absolute; left: -600px; width: 600px; background-color: ${colors.bodyBackground}; }
When making these changes, also change the size of the scrollable area for the flyout. <iframe class="portalFlyoutIframe" id="wpsFLY_flyoutIFrame" frameborder="0px" width="380px" name="wpsFLY_flyoutIFrame" src="<portal-logic:urlFindInTheme file="./flyoutInit.html" />" scrolling="auto">
In the flyout.jspf file, the value of 380 px needs to be changed to whatever you had set the flyout site to above. In our example we set it to 600 . Then if you want to change the speed at which the flyout happens, change two parts of the JavaScript. First in the js directory, open the flyout.js file and change these lines: wpsFLY_minFlyout=0;var wpsFLY_move=25;if (wpsFLY_isIE) wpsFLY_move=20;var wpsFLY_scrollSpeed=1;var wpsFLY_timeoutID=1;var wpsFLY_fromTop=100;var wpsFLY_leftResize;var wpsFLY_browserDimensions=new
The move variable needs to be changed if you want to change the speed of the flyout. Then, in the same file farther down, change these two lines: setTimeout('wpsFLY_internalScroll()',1);};function wpsFLY_internalScrollLeft() {
By default it is 20. In the example, it is 1. Then on this line, change these lines: setTimeout('wpsFLY_internalScrollLeft()',1);};function wpsFLY_internalResizeLeft(){
After making these changes, the flyout will move at a faster speed. These methods wait X number of milliseconds (from the timeout above) to move it what you specified above (in the wpsFly_move settings).
Appendix B – Removing unwanted space Other customizations you might want to make on your portal, include: Reducing space between portlets The portlet has several things that control the spacing this is controlled by the style #mainContent { padding:5px; } change it to 0 and most of that space goes away the last bit comes from .wpsPortletBody { background-image:none; margin:5px; } The wpsPortlet CSS has a 0px padding and the rest should go away .wpsPortlet{ margin:5px; border-left: 1px solid; border-right: 1px solid; border-bottom: 1px solid; border-color: #CACACA; background-image:none; } Additionally the drag-and-drop controls take up an amount of space. If you reduce the padding above you can make it hard to interact with these controls. These controls are the drop zones for where you can drop the item you are dragging. If you want to disable drag and drop functionality, you can remove these tags from the portlet skin that is the default for the theme.
Appendix C – Drop down navigation example
Drop-down navigation is a common request for changing the navigational structure of portal. You could replace the table with whatever you wanted from this example. If you want to create a drop-down menu in the new version 6 theme, use the URL generation services and the navigation model API. In the JSP or servlet, find the following: NavigationModelHome home = (NavigationModelHome) ctx.lookup("portal:service/model/NavigationModel"); PortalStateManagerServiceHome serviceHome = (PortalStateManagerServiceHome) ctx.lookup("portal:service/state/PortalStateManager"); PortalStateManagerService service = serviceHome.getPortalStateManagerService(request, response);
Then, add the following: // do something (create URLs etc.) urlFactory = service.getURLFactory(); EngineURL eUrl = urlFactory.newURL(Constants.SMART_COPY); //EngineURL eUrl = urlFactory.newURL(new StateHolder(), false, false, Constants.SMART_COPY); final SelectionAccessorFactory selectionFct = (SelectionAccessorFactory) service.getAccessorFactory(SelectionAccessorFactory.class); // get a selection controller that operates on the URL-specific state final SelectionAccessorController selectionCtrl = selectionFct.getSelectionAccessorController(eUrl.getState());
Then, loop through the navigation model: NavigationModelProvider provider = (NavigationModelProvider) home.getNavigationModelProvider(); NavigationModel model = provider.getNavigationModel(request, response); NavigationNode nodeA = (NavigationNode)model.getRoot(); NavigationNode childNode = null; NavigationNode childNode2ndLevel = null; if(model.hasChildren(nodeA)) { Iterator iter = model.getChildren(nodeA); NavigationNode homeNode = (NavigationNode)iter.next();
Iterator homeIter = model.getChildren(homeNode); while (homeIter.hasNext()) { childNode = (NavigationNode)homeIter.next(); selectionCtrl.setSelection(childNode.getObjectID());
The root node is always ContentRoot, in most all cases, Home is the first node under the Content Root, Iterate through those children to build the URL. The URLs will be built from this piece of code href="<%=eUrl%> and the title comes from childNode.getTitle(localCurrent). In your default.jsp file, remove the sidenav.jsp include because you will not need side navigation any more. The files to update in your theme include: flyoutTop.js, topNav.jsp, spacer.gif, and style.css
You will find these in the zip file that goes along with this document, under the following directory filesforwhitepaper\themes\testDropDown .
Appendix D – Right navigation example
To make this change, change this line in the default.jsp file: From this: <portal-logic:if portletSolo="no"><%@ include file="./sideNav.jspf" %> | <%-- Call the portal engine command to render the portlets for this page --%> <portal-core:screenRender/> |
To this: <%-- Call the portal engine command to render the portlets for this page --%> <portalcore:screenRender/> | <portal-logic:if portletSolo="no"><%@ include file="./sideNav.jspf" %> |
Notices This information was developed for products and services offered in the U.S.A. IBM may not offer the products, services, or features discussed in this document in other countries. Consult your local IBM representative for information on the products and services currently available in your area. Any reference to an IBM product, program, or service is not intended to state or imply that only that IBM product, program, or service may be used. Any functionally equivalent product, program, or service that does not infringe any IBM intellectual property right may be used instead. However, it is the user's responsibility to evaluate and verify the operation of any non-IBM product, program, or service. IBM may have patents or pending patent applications covering subject matter described in this document. The furnishing of this document does not grant you any license to these patents. You can send license inquiries, in writing, to: IBM Director of Licensing IBM Corporation North Castle Drive Armonk, NY 10504-1785 U.S.A. The following paragraph does not apply to the United Kingdom or any other country where such provisions are inconsistent with local law: INTERNATIONAL BUSINESS MACHINES CORPORATION PROVIDES THIS PUBLICATION "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF NONINFRINGEMENT, MERCHANTABILITY OR FITNESS FOR A PARTICULAR PURPOSE. Some states do not allow disclaimer of express or implied warranties in certain transactions, therefore, this statement may not apply to you. This information could include technical inaccuracies or typographical errors. Changes are periodically made to the information herein; these changes will be incorporated in new editions of the publication. IBM may make improvements and/or changes in the product(s) and/or the program(s) described in this publication at any time without notice. Any references in this information to non-IBM Web sites are provided for convenience only and do not in any manner serve as an endorsement of those Web sites. The materials at those Web sites are not part of the materials for this IBM product and use of those Web sites is at your own risk.
IBM may use or distribute any of the information you supply in any way it believes appropriate without incurring any obligation to you. Any performance data contained herein was determined in a controlled environment. Therefore, the results obtained in other operating environments may vary significantly. Some measurements may have been made on development-level systems and there is no guarantee that these measurements will be the same on generally available systems. Furthermore, some measurements may have been estimated through extrapolation. Actual results may vary. Users of this document should verify the applicable data for their specific environment Information concerning non-IBM products was obtained from the suppliers of those products, their published announcements or other publicly available sources. IBM has not tested those products and cannot confirm the accuracy of performance, compatibility or any other claims related to non-IBM products. Questions on the capabilities of non-IBM products should be addressed to the suppliers of those products. All statements regarding IBM's future direction or intent are subject to change or withdrawal without notice, and represent goals and objectives only. All IBM prices shown are IBM's suggested retail prices, are current and are subject to change without notice. Dealer prices may vary. This information is for planning purposes only. The information herein is subject to change before the products described become available. This information contains examples of data and reports used in daily business operations. To illustrate them as completely as possible, the examples include the names of individuals, companies, brands, and products. All of these names are fictitious and any similarity to the names and addresses used by an actual business enterprise is entirely coincidental. This information contains sample application programs in source language, which illustrate programming techniques on various operating platforms. You may copy, modify, and distribute these sample programs in any form without payment to IBM, for the purposes of developing, using, marketing or distributing application programs conforming to the application programming interface for the operating platform for which the sample programs are written. These examples have not been thoroughly tested under all conditions. IBM, therefore, cannot guarantee or imply reliability, serviceability, or function of these programs. If you are viewing this information softcopy, the photographs and color illustrations may not appear.
Alphabetical Index A............................................................................................................................................. AsynchronousContextMenu.js........................................................................................ 7 B............................................................................................................................................. Banner.jspf...................................................................................................................... 5 browserDimensions.js..................................................................................................... 7 C............................................................................................................................................. Control.jsp....................................................................................................... 5, 6, 45, 46 D............................................................................................................................................. Default.jsp..................................................................................... 5, 9, 14, 18, 35, 56, 57 DefaultThemeItem........................................................................................................ 26 Drag And Drop........................................................................6, 7, 45, 46, 47, 48, 49, 54 MetaTagDataItems.................................................................................................... 5, 28 E............................................................................................................................................. ElementJavascriptEventController.js.............................................................................. 7 Extension.........................7, 22, 23, 25, 26, 27, 28, 29, 30, 31, 32, 33, 35, 38, 39, 40, 41 F............................................................................................................................................. description..................................................................................................................... 10 Flyout.......................................................... 5, 7, 8, 13, 22, 27, 29, 37, 38, 49, 51, 52, 53 flyout.js..................................................................................................................7, 8, 53 flyout.jspf.................................................................................................................. 8, 53 Flyouts.....................................................................5, 7, 8, 13, 22, 27, 29, 37, 38, 49, 51 Footer.jspf....................................................................................................................... 5 text.................................................................................................................................10 textParam.......................................................................................................................10 title.................................................................................................................................10 user................................................................................................................................ 10 H............................................................................................................................................. head_pageMenu.jspf....................................................................................................... 8 Head.jspf............................................................................................................. 5, 21, 52 HorizontalPageBarItems............................................................................................... 28 J.............................................................................................................................................. Javascript.................................................................5, 7, 8, 28, 42, 43, 45, 46, 47, 48, 53 js_cacheSettings.jspf....................................................................................................... 7 js_extensions.jspf........................................................................................................ 7, 8 js.jsp............................................................................................................................ 5, 7 L............................................................................................................................................. if.......................................................................................................................... 9, 11, 57 pageMetaData......................................................................................................... 11, 21 unless.............................................................................................................................11 urlFindInSkin................................................................................................................ 11 M............................................................................................................................................ MainContextMenuItems......................................................................................... 29, 40 N............................................................................................................................................. navigation.................................................................................................................. 9, 10
navigationLoop............................................................................................................... 9 navigationShift................................................................................................................ 9 navigationUrl.................................................................................................................10 url............................................................................................................................ 10, 52 urlGeneration...........................................................................................................10, 52 urlParam........................................................................................................................ 10 O............................................................................................................................................. onload.............................................................................................................................. 8 P............................................................................................................................................. pageContextMenu.jsp......................................................................................................8 PageContextMenuItems.......................................................................................... 29, 40 Palette................................................................................ 6, 7, 11, 12, 13, 20, 21, 51, 52 Policy.........................................................5, 6, 11, 12, 13, 14, 15, 16, 17, 18, 19, 35, 40 portletContextMenu.jsp...................................................................................................8 PortletContextMenuItems....................................................................................... 29, 40 S............................................................................................................................................. SideNav.jspf.............................................................................................................. 5, 57 Styles............................................................................. 5, 6, 7, 20, 21, 28, 30, 43, 48, 52 styles_cacheSettings.jspf.............................................................................................6, 7 styles_extensions.jspf..................................................................................................6, 7 styles_help.jspf............................................................................................................6, 7 styles_ibm.jspf............................................................................................................ 6, 7 styles_oob.jspf.............................................................................................................6, 7 styles_portlet.jspf........................................................................................................ 6, 7 styles_rules.jspf..................................................................................................... 6, 7, 21 styles_theme.jspf................................................................................................... 6, 7, 52 Styles.jsp............................................................................................................... 5, 6, 52 T............................................................................................................................................. ThemeContent............................................................................................. 23, 25, 26, 30 ThemeContentDescritporConstants.............................................................................. 25 ThemeContext................................................................................................... 23, 25, 26 themeExtension........................................................................................... 26, 31, 35, 36 themeExtensionItemIconUrl................................................................................... 26, 31 themeExtensionItemText........................................................................................ 26, 31 themeExtensionItemTooltip.................................................................................... 26, 31 themeExtensionItemUrl................................................................................................ 31 themeExtensionLoop...............................................................................................31, 35 themeExtensionRenderInclude..................................................................................... 31 ThemeIncludes.................................................................................................. 23, 24, 31 ThemeItemDescriptorConstants....................................................................................25 ThemeItems.............................................................................................................23, 26 ThemeJspInclude.........................................................................................24, 25, 27, 29 ThemeJspIncludeDescriptorConstants.......................................................................... 25 ThemeLinkItem.........................................................................24, 26, 29, 31, 37, 39, 40 ThemetextItem................................................................................ 24, 26, 27, 28, 33, 34 TopNav.jspf.....................................................................................................................5
U............................................................................................................................................. UnlayeredContainer-H.jsp........................................................................................ 6, 46 UnlayeredContainer-V.jsp.............................................................................................. 6 V............................................................................................................................................. VerticalPageBarItems................................................................................................... 29
Related Documents
|