Die Intersult Taglib ist eine revolutionäre Facelet-Taglib mit Tags für die Entwicklung von JEE-Applikationen unter JSF, Seam, Facelets, Tomahawk und Richfaces. Während andere Unternehmen ganze Mannschaften beauftragen, produzieren Sie alle denkbaren Tags in extrem hoher Geschwindigkeit. Egal ob Javascript, AJAX, Styles oder Images.
<i:info id="info" value="Dies ist die Infobox"/>
Die Implementierung erfolgt als Facelet in der Datei info.xhtml:
<ui:composition> <i:meta useId="#{id}" var="comp" rendered="#{empty rendered or rendered}"> <s:graphicImage id="#{comp.id}" url="#{empty img ? '/images/information.png' : img}" onmouseover="$('#{comp.clientId}-text').style.display = '';" onmouseout="$('#{comp.clientId}-text').style.display = 'none';"/> <s:span id="#{comp.id}-text" style="display: none; position: fixed; background-color: yellow; padding: 3px;"> <h:outputText value="#{value}"/> </s:span> </i:meta> </ui:composition>
Die *.taglib.xml enthält folgenden Eintrag, um das Facelet zu registrieren:
<tag> <tag-name>info</tag-name> <source>/tag/info.xhtml</source> </tag>
Was kann dieser Tag?
Als Luxus kann noch eine TLD im Verzeichnis META-INF abgelegt werden, sodass z.B. der Content Assist von Eclipse eine Code Completion für die eben gebaute Component vornehmen kann:
<tag> <name>info</name> <tag-class/> <body-content>empty</body-content> <description>Renderes a info icon with popup div.</description> <attribute> <name>id</name> <required>false</required> <rtexprvalue>false</rtexprvalue> <type>java.lang.String</type> </attribute> <attribute> <name>value</name> <required>true</required> <rtexprvalue>false</rtexprvalue> <type>java.lang.String</type> <description>Text for popup.</description> </attribute> <attribute> <name>img</name> <required>false</required> <rtexprvalue>false</rtexprvalue> <type>java.lang.String</type> <description>Optional: Image for the info icon.</description> </attribute> <attribute> <name>rendered</name> <description> Flag indicating whether this component (and its children) should be rendered. Expressions must evaluate to a boolean. </description> </attribute> </tag>
Einschränkungen: Der meta-Tag ist nur mit State-Saving auf dem Server getest, d.h. ohne Serialisierung. Wenn es Probleme gibt, in der web.xml folgende Parameter setzen:
<context-param> <param-name>javax.faces.STATE_SAVING_METHOD</param-name> <param-value>server</param-value> </context-param>
<component name="resource" class="com.intersult.ui.util.ClassPathResource" scope="application"> <property name="resourcePath">/test</property> <property name="classPath">/de/test/ui/resource</property> </component>
Dann der Tage "menu":
<ui:composition> <i:meta var="comp" useId="#{id}" rendered="#{empty rendered or rendered}" stylesheet="#{resource.get('/test.css')}"> <table id="#{comp.clientId}" cellpadding="0" cellspacing="0"> <i:clear var="id,rendered"> <ui:insert/> </i:clear> </table> </i:meta> </ui:composition>
Und schließlich der Tag "menuItem":
<ui:composition> <i:meta var="itemComp" useId="#{id}" rendered="#{empty rendered or rendered}" stylesheet="#{resource.get('/test.css')}"> <tr> <td class="#{itemComp.last ? 'test-menuL' : 'test-menuI'}"/> <td class="test-menuContent"> <i:clear var="id,rendered"> <ui:insert/> </i:clear> </td> </tr> </i:meta> </ui:composition>
Schließlich wird das Ganze wieder in die test.taglib.xml eingetragen, und in die test.tld, sodass der Content-Assist in der Entwicklungsumgebung den Tag auch anzeigen kann. Die die vorkommenden Styles in die test.css eingetragen. Mit diesen Tags können dann einfach eigene Menüs inklusive beliebig verschachtelter Untermenüs gebaut werden:
<o:menu> <o:menuItem> <s:link value="#{msg['menu1']}" action="menu1" propagation="none"/> </o:menuItem> <o:menuItem> <s:link value="#{msg['menu2']}" action="menu2"/> <o:menu> <o:menuItem> <s:link value="#{msg['menu2.1']}" action="home" propagation="none"/> </o:menuItem> </o:menu> </o:menuItem> </o:menu>
Dies findet bei ui:include und ui:param ebenso statt, wie bei der Definition von Tags in der Facelets-Taglib. Um dies zu verhindern, steht der Intersult clear-Tag zur Verfügung:
<i:clear var="id,label"> <ui:insert/> </i:clear>
Was geschieht hier? Der clear-Tag verhindert die weitere Propagierung der UIParameter (also auch Tag-Attribute) "id" und "label".
<i:inputGroup label="Gruppe"> <i:inputText id="test" value="#{test}"/> </i:inputGroup>
Die Implementierung der inputGroup ist wie folgt:
<i:meta var="comp" useId="#{id}" rendered="#{empty rendered or rendered}"> <fieldset id="#{comp.clientId}"> <legend> <h:outputText value="#{label}"/> </legend> <i:clear var="id,label"> <ui:insert/> </i:clear> </fieldset> </i:meta>
Die Implementkerung von inputText:
<i:meta var="comp" useId="#{id}" rendered="#{empty rendered or rendered}"> <h:panelGrid> <h:inputLabel for="#{comp.id"} value="#{empty label ? 'Default' : label}"/> <h:inputText id="#{comp.id}" value="#{value}"/> <i:message id="#{comp.id}-message" for="#{comp.id}"/> </h:panelGrid> </i:meta>
Der Tag inputText enthält wieder eine Referenz auf die Variable Label. Ohne Verwendung des clear-Tag wäre diese nun auf den äußeren Wert gesetzt, da der inputGroup-Tag den Wert nach innen hinein propagiert.
<h:form> <h:commandLink action="redirect">#{index}</h:commandLink> <i:inputHidden value="#{list.firstResult}" from="#{index}"/> </h:form>
Statt dem h:commandLink kann natürlich auch ein a4j:commandLink benutzt werden.
<component name="taglibResource" class="com.intersult.ui.util.ClassPathResource" scope="application"> <property name="resourcePath">/taglib</property> <property name="classPath">/resource</property> </component>
Die Resourcen sind dann zugreifbar mit:
<t:stylesheet path="#{taglibResource.get('/style.css')}"/>
Alle Resources mit Mime-Type text/* werden dabei interpoliert. Insbesondere CSS-Stylesheets und Javascript-Dateien die durch den meta-Tag geladen werden, können dabei mit EL-Expressions versehen werden. Dies ist z.B. interessant beim Styles vom Typ "background-image", da hier über "url(...)" auf eine Resource zugegriffen wird.
Um die Taglib einzubinden, brauchen Sie nur folgende Einträge in Ihrem pom.xml vorzunehmen:
<project> ... <dependencies> ... <dependency> <groupId>com.intersult</groupId> <artifactId>com.intersult.ui</artifactId> <version>1.0-SNAPSHOT</version> </dependency> ... </dependencies> ... <repositories> ... <repository> <id>intersult-repository</id> <name>Intersult Repository</name> <url>http://repository.intersult.com/repository</url> </repository> ... </repositories> ... </project>
Bei dem Arbeiten mit Eclipse, ist die Taglib nach einem "mvn eclipse:eclipse" und einem Refresh des Projekts verfügbar. Ihnen ist unklar, wie der Content-Assist unter Eclipse für Tags korrekt konfiguriert wird? Wir beantworten gerne diese und weiter Fragen. Nehmen Sie Kontakt mit uns auf.