AJAX support for markup
Special tags are added to layout JSPs that facilitate the placement of AJAX features on a page. Similarly, renderers are used to interpret the tags and to render AJAX-driven content. The obvious advantage is the in-built support for the auto-creation and control of AJAX components on portal pages.
Layout markup
Layouts provide a structure for the creation and serving of portal pages. Layouts aggregate all of the content generated by the portlet, based on region and order, merge them with some additional content provided by the portal, and serve a response back to the user. By providing support for AJAX in the layout, helps facilitate the easy development and implementation of dynamic functionality in pages, with minimal effort.
Layout markup is implemented using JSP tags. The JBoss JSP tag library, portlet-layout.tld, offers tags that facilitate the implementation of AJAX features in layouts. A JSP layout can be changed to an AJAX-supported page simply by adding references to the tags. Hence, using tags also helps with the easy implementation of features.
The following is the layout page from the default portal generic layout ${JBOSS_PORTAL_HOME}serverdefaultdeployjboss-portal.sarportal-core.warlayoutsgenericindex.jsp, and shows AJAX support implemented as tags:
<%@ page import="org.jboss.portal.server.PortalConstants" %>
<%@ taglib uri="/WEB-INF/theme/portal-layout.tld" prefix="p" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head>
<title><%= PortalConstants.VERSION.toString() %></title>
<meta http-equiv="Content-Type" content="text/html;"/>
<!-- to correct the unsightly Flash of Unstyled Content. -->
<script type="text/javascript"></script>
<!-- inject the theme, default to the Renaissance theme if
nothing is selected for the portal or the page -->
<p:theme themeName="renaissance"/>
<!-- insert header content that was possibly set by portlets
on the page -->
<p:headerContent/>
<%@include file="/layouts/common/modal_head.jsp"%>
</head>
<body id="body">
<p:region regionName='AJAXScripts' regionID='AJAXScripts'/>
<%@include file="/layouts/common/modal_body.jsp"%>
<div id="portal-container">
<div id="sizer">
<div id="expander">
<div id="logoName"></div>
<table border="0"
cellpadding="0"
cellspacing="0"
id="header-container">
<tr>
<td align="center" valign="top" id="header">
<!-- Utility controls -->
<p:region regionName='dashboardnav'
regionID='dashboardnav'/>
<!-- navigation tabs and such -->
<p:region regionName='navigation'
regionID='navigation'/>
<div id="spacer"></div>
</td>
</tr>
</table>
<div id="content-container">
<!-- insert the content of the 'left' region of the page,
and assign the css selector id 'regionA' -->
<p:region regionName='left' regionID='regionA'/>
<!-- insert the content of the 'center' region of the
page, and assign the css selector id 'regionB' -->
<p:region regionName='center' regionID='regionB'/>
<hr class="cleaner"/>
</div>
</div>
</div>
</div>
<div id="footer-container" class="portal-copyright">Powered by
<a class="portal-copyright" href="http://www.jboss.com/products/jbossportal">JBoss Portal</a><br/>
</div>
<p:region regionName='AJAXFooter' regionID='AJAXFooter'/>
</body>
</html>
Renderer markup
The portal combines the renderers and layouts to generate the final content. Enabling support for AJAX in the renderer just requires adding the statement <ajax-enabled>true</ajax-enabled> to the renderer descriptor.
The following example, at {JBOSS_PORTAL_HOME}serverdefaultdeployjbossportal.sarportal-core.warWEB-INFlayoutportal-renderSet.xml, shows the renderer configuration of the emptyRenderer RenderSet for AJAX support:
<renderSet name="emptyRenderer">
<set content-type="text/html">
<ajax-enabled>true</ajax-enabled>
<region-renderer>
org.jboss.portal.theme.impl.render.empty.EmptyRegionRenderer
</region-renderer>
<window-renderer>
org.jboss.portal.theme.impl.render.empty.EmptyWindowRenderer
</window-renderer>
<portlet-renderer>
org.jboss.portal.theme.impl.render.empty.EmptyPortletRenderer
</portlet-renderer>
<decoration-renderer>
org.jboss.portal.theme.impl.render.empty.EmptyDecorationRenderer
</decoration-renderer>
</set>
</renderSet>
AJAX support for content
Whereas the layout and renderer contribute to AJAX behavior at the markup level, JBoss portal’s support for object-level configuration can be leveraged to provide AJAX support at the page level. The object property inherits a configured behavior from its parent. Currently, two features are offered for AJAX-driven content:
- Drag and drop: Facilitates easy movement of portlets to various locations on screen using the mouse.
- Screen Refresh: Allows sub-components of pages or individual portlets to refresh themselves without refreshing the entire page.
Drag-and-Drop
As the name suggests, this feature is triggered by a user action, and allows a portlet to detach itself from a specific location on the page and move to a different location on the page. This allows for the customization of the user interface to a form that is most convenient to the user. The dynamic view behavior comes from a combination of DHTML and asynchronous server-side communication.
Due to the nature of the behavior, drag-and-drop capability is available and effective only in dashboard pages where there are multiple portlets and the page layout can be personalized. The feature is allowed by default on the dashboard, but can be turned off by setting the value in the configuration file to false.
The following is a snippet of the default object configuration file ( jboss-portal.sar/conf/data/default-object.xml ), which illustrates the enabling of the feature. Please note that this can also be configured using the administration console user interface of the JBoss server.
<deployment>
<if-exists>keep</if-exists>
<context>
<context-name>dashboard</context-name>
<properties>
...
<!-- Set the dnd property -->
<property>
<name>theme.dyna.dnd_enabled</name>
<value>true</value>
</property>
...
</properties>
</context>
</deployment>
<name>theme.dyna.dnd_enabled</name> value enables or disables the drag-and-drop behavior.
Partial content refresh
One of the most expensive processes in a portal is the refresh of portlets when the page is generated. For every user action on a page, the portal calls all of the portlet methods in a serial, but non-specific order, which involves a significant amount of time and server-side processing. Partial content refresh support mitigates these issues to a large extent with an effective use of client-server asynchronous communication. When the state of a single portlet changes, a partial content refresh facilitates the update and refresh of only that portlet, instead of for all of the portlets on the page. This prevents the regeneration of the whole page and the initialization of all of the portlets on the page.
The following image illustrates the partial content refresh flow:
The partial refresh capability is compatible with the JSR-168 portlet API, which allows for programmatic update of portlet states during runtime.
Partial refreshes can be enabled through portal object configuration or through configuration at the default server level.
