| Remarque |
|---|
Bon pour relecture |
| Sommaire |
|---|
Introduction
Avec ESUP-Commons V2 nous utilisons facelet (Cf. 1.7.2 Facelet). Les pages sont suffixées en .xhtml. Elle sont écrites en XML ce qui permet d'utiliser des espaces de noms et des commentaires XML.
JSF 1.2 ou JSF 2.0 ?
ESUP-Commons V2 permet d'utiliser JSF 1.2 ou JSF 2.0 !
JSF 2.0 apporte de nombreuse améliorations par rapport à JSF 1.2. De plus, en JSF 2.0 il sera, a priori, beaucoup plus facile de faire cohabiter différentes librairies de composants. Les dernières librairies (notamment celles qui offrent des composants de hauts niveau et permettent un fonctionnement en Ajax) évoluent beaucoup plus en JSF 2.0 qu'en JSF 1.2.
Malheureusement, JSF 2.0 n'est pas compatible avec le mode portlet ! Pour utiliser JSF 2.0 en mode portlet il faut utiliser un portlet bridge non normalisé et ce dernier ne fonctionne qu'en mode portlet 2.0 alors que uPortal 3.2 ne supporte que le mode portlet 1.0 (uPortal 3.3 devant supporter le mode portlet 2.0). De plus, certaines librairies sont encore en version beta pour JSF 2.0 (ex de Trinidad à l'heure à laquelle nous écrivons cette page).
C'est la raison pour laquelle ESUP-Commons V2 propose d'utiliser JSF 1.2 ou JSF 2.0 suivant le contexte cible :
- JSF 1.2 pour le développement d'une portlet
- JSF 2.0 pour le développement d'une servlet (typiquement une application importante contenant beaucoup d'écrans et pour laquelle on souhaite avoir un bon niveau de productivité lors de l'écriture des pages)
Exemple de page
| Bloc de code |
|---|
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:t="http://myfaces.apache.org/tomahawk"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.prime.com.tr/ui">
<f:view locale="#{sessionController.locale}">
<t:htmlTag value="head">
<!-- Commentaire -->
<title><h:outputText value="#{applicationService.name}" /></title>
<ui:repeat value="#{tagsConfigurator.stylesheets}" var="path">
<t:stylesheet path="#{path}" />
</ui:repeat>
<ui:repeat value="#{tagsConfigurator.scripts}" var="path">
<script type="text/javascript" src="#{path}" />
</ui:repeat>
</t:htmlTag>
<t:htmlTag value="body" styleClass="fl-theme-app">
<ui:include src="_include/_header.xhtml" />
<t:div id="welcomepages">
<t:div id="navigationHeader" styleClass="app-pagebar">
<h:form id="nav_header" styleClass="app-form" />
</t:div>
<t:div styleClass="app-body">
<t:div styleClass="app-navigation">
</t:div>
<t:div styleClass="app-content">
<t:htmlTag value="br" />
<ui:insert name="allContent" />
</t:div>
<t:div style="clear:both;" />
</t:div>
<t:div id="navigationFooter"
styleClass="fl-container-flex app-pagebar">
<h:form id="nav_footer" styleClass="app-form" />
</t:div>
</t:div>
<t:div styleClass="app-footer">
<h:outputText value="#{applicationService.name} " />
<h:outputText value="v#{applicationService.version} - " />
<h:outputText value="#{applicationService.copyright}" />
</t:div>
</t:htmlTag>
</f:view>
</html>
|
Dans la page ci-dessus :
- la balise <html> est l'élément racine de la page. Il contient aussi la définition des espaces de noms qui permettent de définir les composants JSF que l'on va utiliser. Ici :
- xmlns:f="http://java.sun.com/jsf/core" et xmlns:h="http://java.sun.com/jsf/html" sont les 2 librairies de base de JSF
- xmlns:ui="http://java.sun.com/jsf/facelets" est la librairie facelet (NB : En JSF 2.0 facelet est aussi une librairie de base de JSF alors qu'elle est optionnelle en JSF 1.2)
- xmlns:t="http://myfaces.apache.org/tomahawk" est une librairie proposée par la fondation Apache qui propose quelques utilitaires (notamment de manipulation du html)
- xmlns:p="http://primefaces.prime.com.tr/ui" est la librairie PrimeFaces qui va apporter des composants de haut niveaux (interface riche et support de Ajax). Elle est donnée ici à titre d'exemple car, suivant les besoins, on utilisera telle ou telle librairie (EichFaces, Trinidad, OpenFaces, etc.)
- la balise JSP <%@include file="_include.jsp"%> permet d'inclure toutes les librairies nécessaires (voir plus loin).
- La balise JSF <e:page> se charge de la mise en forme globale, que l'on soit en servlet ou en portlet.
- La balise JSP <%@include file="_navigation.jsp"%> permet d'inclure la barre de navigation, commune à toutes les pages.
- La balise JSF <e:section> affiche le titre de la page.
- La balise JSF <h:form> encadre un formulaire.
- La balise JSF <e:outputLabel> affiche le label d'un formulaire, celui qui possède l'identifiant locale.
- La balise JSF <e:selectOneMenu> propose un choix simple de valeurs dans une boite déroulante.
- La balise JSF <f:selectItems> renseigne la balise précédente sur les choix possibles, fournis par la méthode getLocaleItems() du bean preferencesController.
- La balise JSF <e:commandButton> est un bouton de soumission du formulaire. Lors de la soumission du formulaire, la méthode setLocale() du bean preferencesController est appelée avec la valeur sélectionnée dans la boite déroulante.
...
| Bloc de code |
|---|
<security-constraint>
<display-name>Protect the raw JSP pages</display-name>
<web-resource-collection>
<web-resource-name>Raw JSF JSP Pages</web-resource-name>
<url-pattern>/stylesheets/administrators.jsp</url-pattern>
<url-pattern>/stylesheets/administratorsAdd.jsp</url-pattern>
<url-pattern>/stylesheets/administratorsDelete.jsp</url-pattern>
</web-resource-collection>
<auth-constraint>
<description>No roles, so no direct access</description>
</auth-constraint>
</security-constraint>\\
|
Bibliothèques utilisées
esup-commons utilise très communément les deux tabligs prévues par la spécification JSF (jsf/core et jsf/html) ainsi que les bibliothèques JSF esup-commons (cf. ci-dessous) et Tomahawk (http://myfaces.apache.org/tomahawk/).
...