The eXo Platform uses groovy templates to create HTML pages or components.
Other expressions :
You can now edit your template file.
This example shows that uicomponent can be used to make Ajax calls, thanks to the event method. See AJAX in e Xo Framework for more details.
Another variable that you can use is _ctx. It gives access to the context in which the template is processed. Hence, you can get some elements like the request, the JS manager, or the resource resolver.
Examples :
If you use your template to define the UI of a component that includes a form, you can access the instance of UIForm in a variable named uiform. The UIForm class contains 2 methods, begin() and end(), that write the HTML tags of the form. The uiform object also contains specific attributes and methods defined in your form class, which contains the different input elements and so on.
Examples :
Basic structure
The structure of a template is very easy :- the HTML code
- zero or more groovy language code blocks, defined by <% … %>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<%
import org.exoplatform.webui.core.UIComponent;
def currentPage = uicomponent.getCurrentPage();
...
%>
...
<div class="$uicomponent.skin" id="UIPortalApplication">
<%uicomponent.renderChildren();%>Groovy language
Groovy is a scripting language for Java. Here are a few examples on how to use it, but you can find more information on the full documentation. This language looks like Java a lot, so it's very easy to use. Examples : Variables definition :int min = 1; def totalPage = uicomponent.getAvailablePage(); String name = "uiPortlet"; categories = uicomponent.getItemCategories(); String [] columns = uicomponent.getColumns();
for(category in categories) { ... } // easy to use for loop for(i in min..max) { ... } // min and max are int variables println "</div>" ; println """ <div class="Item"> <div class="OverflowContainer"> """; <%=uicomponent.getToolbarStyle();%> // <%= to avoid a call of println method import org.exoplatform.portal.config.model.PageNode;
Linking a portlet with a template
Portlet configuration
The configuration of a portlet is partly made with ComponentConfig annotations (others are ComponentConfigs, EventConfig, etc). One of the parameter of this annotation is template, where you can define the path to the template file associated with this portlet. To specify this parameter to your portlet, just add this to your configuration annotation :template = "path/to/TemplateFile.gtmpl"The template file
As we said before, the template file is composed of HTML code and groovy code blocks. There are a few things more that you need to know to fully link your portlet with your template. If your template defines the UI of a component, you have an access to this component instance (the java object) using the variable uicomponent. This should be the case almost all the time, but we recommend that you check that your java class inherits from UIComponent before you use this variable. With this uicomponent variable, you can access all the attributes and functions of your component, to use them in your template. Example : UIPageIterator.gtmpl<% def currentPage = uicomponent.getCurrentPage(); %> ... <a href="<%=uicomponent.event("ShowPage","$currentPage")%>" class="Icon LastTopPageIcon"><span></span></a>
<%
def rcontext = _ctx.getRequestContext() ;
rcontext.getJavascriptManager().importJavascript('eXo.webui.UIPopupWindow');
_ctx.appRes(popupId + ".title."+ title);
%><div class="UISearchForm"> <%uiform.begin()%> ... <% QuickSearchInputSet = uiform.getQuickSearchInputSet(); for(field in QuickSearchInputSet.getChildren()) { uiform.renderField(field) } %> <%uiform.end()%> </div>
on 21/08/2007 at 05:26