Jusqu’à aujourd’hui les erreurs possibles lors du remplissage des trois formulaires de l’application étaient gérées ‘manuellement’. Le contrôleur vérifiait les paramètres renseignés, et construisait un message d’erreur ainsi qu’un booléen ‘erreur’ en attribut. Puis on vérifiait, dans la page xhtml, la valeur du booléen ‘erreur’ : si il était ‘vrai’ on affichait le message en rouge.

Tout ceci a été modifié afin d’utiliser les fonctionnalités offertes par JSF. Grâce à cela, la méthode du contrôleur qui vérifie les champs est moins complexe car elle contient moins de boucle ‘if’ imbriquées (nécessaires à la construction d’un message d’erreur présentable dans une seule ‘String’) et la page xhtml voit ces trois lignes de code (contenant la condition d’affichage du message d’erreur dans un attribut ‘rendered’) nécessaire au message d’erreur simplifiées en une seule, très courte. De plus le contrôleur n’a plus besoin d’avoir les variables ‘String message’ et ‘boolean erreur’ en attribut car la page xhtml n’a plus besoin d’y accéder.

Voici un exemple du code obtenu pour un formulaire simple (1 seul champ):

La méthode du contrôleur :

public String chercher() { String message = “”; if (codetu != null && !codetu.equals(“”)) { String codindetu = service.getCodIndFromCodEtu(codetu); if (codindetu != null) { return etatcivilcontroller.lienEnterNumero(codindetu); } message = “Etudiant ” + codetu + ” inexistant”; FacesMessage messageX = new FacesMessage(FacesMessage.SEVERITY_ERROR, message, message); FacesContext.getCurrentInstance().addMessage(null, messageX); } else { message = “Veuillez rentrer un identifiant.”; FacesMessage messageX = new FacesMessage(FacesMessage.SEVERITY_ERROR, message, message); FacesContext.getCurrentInstance().addMessage(null, messageX); } return View.CHERCHE_NUM; }

L’affichage du message d’erreur dans page xhtml :

<h:form id=”formRechDossierWeb”> <h:messages id=”champMessages” errorStyle=”color: red” /> …

Et voici le résultat pour un formulaire un peu plus complexe (3 champs) :

MonDossierWeb doit proposé de télécharger des fichier excel et pdf : trombinoscope d’une liste d’étudiants en pdf, une liste d’inscrits en excel, etc.

Ces fichiers doivent être générés ( par un ‘controller’ par exemple) au moment du téléchargement.

Au départ nous avions réussi à faire un téléchargement pour le fonctionnement en servlet. Il fonctionnait de la manière suivante :

Evidemment cette méthode de fonctionne pas en portlet car on ne peut récupérer l’objet ‘HttpServletResponse’. Il a donc fallu trouver une autre solution.

Il s’avère en fait que le téléchargement de fichiers placés dans la ‘response’ est impossible en portlet. La solution est donc de passer par une servlet. Nous avons l’avantage d’utiliser esup-commons, qui propose une telle servlet : « DownloadServlet ». Voici comment cela fonctionne en portlet :

Evidemment il faut auparavant déclarer la servlet dans le web.xml :

Voici maintenant le fonctionnement de la servlet :

Vous remarquerez que cette servlet utilise la méthode getSessionAttribute(HttpServletRequest request, String name)

de la classe HttpUtils. Voici son fonctionnement :

En fait, cette méthode va aller chercher l’attribut de session souhaité dans la request placée en paramètre.

Nous avons donc utilisé cette technique pour les deux types de contexte. Ainsi, le code décrit en début de Post pour le fonctionnement servlet devient :

Et voila. Il ne reste qu’à déterminer le ‘context’ (servlet ou portlet) au moment du téléchargement pour exécuter le bon bout de code.

ATTENTION : pour que cela fonctionne en portlet il faut impérativement penser à indiquer :

emptySessionPath=”true” dans la déclaration du ‘Connector’ dans le server.xml de Tomcat. Ex:

Sans cela la portlet et la servlet auront une Session différente et le code ne fonctionnera, générant probablement une erreur du type “can not download data is null” (voir code de la DownloadServlet) ou “prepare method was not called”

Après les tests pour générer du pdf, MonDossierWeb doit générer des fichier excel, nous avons testé POI. Apres quelques essais nous avons réussi à obtenir le résultat voulu grâce à la librairie POI. Voici comment sont implantées les choses :

Tout d’abord il faut penser à importer la librairie poi-2.5.1-final-20040804.jar disponible ici dans le projet.

Puis, dans notre Controller qui contient (en attribut : nne, nom, dossier, annee etc.) les informations affichées à l’écran, nous ajoutons la méthode exportExcel():

public String exportExcel(){

FacesContext context = FacesContext.getCurrentInstance();
ExternalContext external = context.getExternalContext();
HttpServletResponse response = (HttpServletResponse) external.getResponse();

//formatage de la réponse
response.setContentType(“application/octet-stream”);
response.setHeader (“Content-Disposition”, “attachment; filename=\”test.xls\”" );
ByteArrayOutputStream baos = new ByteArrayOutputStream(1024);

//creation du fichier excel
HSSFWorkbook wb = new HSSFWorkbook();
HSSFSheet sheet = wb.createSheet(“etat-civil” );

//formatage taille de la premiere colonne
sheet.setColumnWidth((short)0,(short)(20*256));

// Creation des colonnes
HSSFRow row = sheet.createRow((short)0);
HSSFRow row1 = sheet.createRow((short)1);
HSSFRow row2 = sheet.createRow((short)2);
HSSFRow row3 = sheet.createRow((short)3);
HSSFRow row4 = sheet.createRow((short)4);
HSSFRow row5 = sheet.createRow((short)5);
HSSFRow row6 = sheet.createRow((short)6);
HSSFRow row7 = sheet.createRow((short)7);

//CREATION DES STYLES:
//STYLE1:
HSSFCellStyle headerStyle = wb.createCellStyle();
headerStyle.setFillBackgroundColor((short) HSSFColor.DARK_RED.index);
headerStyle.setFillForegroundColor(HSSFColor.DARK_RED.index);
headerStyle.setFillPattern(HSSFCellStyle.SOLID_FOREGROUND);
HSSFFont font = wb.createFont();
font.setColor(HSSFColor.WHITE.index);
font.setBoldweight((short) 10);
headerStyle.setFont(font);
//bordure style1
headerStyle.setBorderBottom(HSSFCellStyle.BORDER_MEDIUM);
headerStyle.setBottomBorderColor(HSSFColor.BLACK.index);
headerStyle.setBorderLeft(HSSFCellStyle.BORDER_MEDIUM);
headerStyle.setLeftBorderColor(HSSFColor.BLACK.index);
headerStyle.setBorderRight(HSSFCellStyle.BORDER_MEDIUM);
headerStyle.setRightBorderColor(HSSFColor.BLACK.index);
headerStyle.setBorderTop(HSSFCellStyle.BORDER_MEDIUM);
headerStyle.setTopBorderColor(HSSFColor.BLACK.index);

//STYLE2:
HSSFCellStyle headerStyle2 = wb.createCellStyle();
headerStyle2.setFillBackgroundColor((short) HSSFColor.BLUE.index);
headerStyle2.setFillForegroundColor(HSSFColor.BLUE.index);
headerStyle2.setFillPattern(HSSFCellStyle.SOLID_FOREGROUND);
headerStyle2.setFont(font);
//bordure style2
headerStyle2.setBorderBottom(HSSFCellStyle.BORDER_MEDIUM);
headerStyle2.setBottomBorderColor(HSSFColor.BLACK.index);
headerStyle2.setBorderLeft(HSSFCellStyle.BORDER_MEDIUM);
headerStyle2.setLeftBorderColor(HSSFColor.BLACK.index);
headerStyle2.setBorderRight(HSSFCellStyle.BORDER_MEDIUM);
headerStyle2.setRightBorderColor(HSSFColor.BLACK.index);
headerStyle2.setBorderTop(HSSFCellStyle.BORDER_MEDIUM);
headerStyle2.setTopBorderColor(HSSFColor.BLACK.index);

//Creation des cellules
HSSFCell cellLib = row.createCell((short) 0);
cellLib.setCellStyle(headerStyle);
cellLib.setCellValue(“ETAT-CIVIL” );

HSSFCell cellLib2 = row1.createCell((short) 0);
cellLib2.setCellStyle(headerStyle2);
cellLib2.setCellValue(“GENERALITES” );

row2.createCell((short)0).setCellValue(“Dossier “);
row2.createCell((short)1).setCellValue(dossier);
row3.createCell((short)0).setCellValue(“NNE “);
row3.createCell((short)1).setCellValue(nne);
row4.createCell((short)0).setCellValue(“Nom “);
row4.createCell((short)1).setCellValue(nom);

HSSFCell cellLib3 = row5.createCell((short) 0);
cellLib3.setCellStyle(headerStyle2);
cellLib3.setCellValue(“INSCRIPTION UNIVERSITAIRE” );

row6.createCell((short)0).setCellValue(“Anee “);
row6.createCell((short)1).setCellValue(annee);
row7.createCell((short)0).setCellValue(“Etablissement “);
row7.createCell((short)1).setCellValue(etablissement);

//FUSION des CELLULES:
Region reg=new Region(0,(short)0,0,(short)2);
Region reg2=new Region(1,(short)0,1,(short)2);
Region reg3=new Region(5,(short)0,5,(short)2);
sheet.addMergedRegion(reg);
sheet.addMergedRegion(reg2);
sheet.addMergedRegion(reg3);

// Ecriture dans l’output
ServletOutputStream out;
try {
out = response.getOutputStream();
wb.write(baos);
baos.writeTo(out);
baos.flush();
context.responseComplete();
} catch (IOException e) {

e.printStackTrace();
}
return null;
}

Enfin, il ne reste plus qu’à ajouter un lien dans notre page xhtml, qui va nous proposer d’enregistrer le pdf généré:

<h:commandLink id=”link” action=”#{controller.exportExcel}”>
EXCEL

</h:commandLink>

Ainsi, en cliquant sur le lien ‘EXCEL’ vous aurez l’invitation suivante :

Il ne reste plus qu’à enregistrer le fichier. Voir le resultat

Le futur MonDossierWeb (Facelets) aura besoin de reprendre les fonctionnalités de l’ancien canal MonDossierWeb ; comme la génération en pdf des informations affichées à l’écran. Apres quelques essais nous avons réussi à obtenir le résultat voulu grâce à la librairie iText. Voici comment sont implantées les choses :

Tout d’abord il faut penser à importer la librairie itext-2.0.1.jar disponible ici dans le projet.

Puis, dans notre Controller qui contient (en attribut : nne, nom, dossier, annee etc.) les informations affichées à l’écran, nous ajoutons la méthode export() :

public String export() {

try {

FacesContext context = FacesContext.getCurrentInstance();

ExternalContext external = context.getExternalContext();

HttpServletResponse response = (HttpServletResponse) external.getResponse();

response = configureResponse(response , “TEST PDF”);

// création du document.

Document document = new Document(PageSize.A4,10,10,20,20);

// Document d = new Document(PageSize.A4); //portrait

// Document d = new Document(PageSize.A4.rotate()); //paysage

// configuration du document

document = configureDocument(11.5f, 14f, 0.5f);

// redirection du pdf.

ByteArrayOutputStream baos = new ByteArrayOutputStream(1024);

PdfWriter writer = PdfWriter.getInstance(document, baos);

writer.setStrictImageSequence(true);

// ouverture du document.

document.open();

// configuration des fonts

Font normal = FontFactory.getFont(FontFactory.TIMES_ROMAN, 8, Font.NORMAL);

Font titre = FontFactory.getFont(FontFactory.TIMES_ROMAN, 10, Font.NORMAL);

Font header = FontFactory.getFont(FontFactory.TIMES_ROMAN, 12, Font.BOLD);

//ajout image test

Image image1 = Image.getInstance(“http://www.univ-nancy2.fr/images/logo_nu_n2.gif”);

image1.scaleAbsolute(100, 20);

document.add(image1);

//nouveau paragraphe

Paragraph p=new Paragraph(“ETAT CIVIL\n\n”,header);

p.indentationLeft();

document.add(p);

//paragraphe GENERALITES

Chunk c1=new Chunk(“GENERALITES: “, titre);

c1.setBackground(Color.cyan);

Chunk c2=new Chunk(“\nDossier : “+dossier,normal);

Chunk c3=new Chunk(“\nNNE : “+nne,normal);

Chunk c4=new Chunk(“\nNom : “+nom,normal);

Paragraph p1=new Paragraph();

p1.add(c1);p1.add(c2);p1.add(c3);p1.add(c4);

document.add(p1);

//paragraphe INSCRIPTION UNIVERSITAIRE

Chunk c5=new Chunk(“INSCRIPTION UNIVERSITAIRE: “, titre);

c5.setBackground(Color.cyan);

Chunk c6=new Chunk(“\nAnnee : “+annee,normal);

Chunk c7=new Chunk(“\nEtablissement : “+etablissement,normal);

Paragraph p2=new Paragraph();

p2.add(c5);p2.add(c6);p2.add(c7);

document.add(p2);

//paragraphe BAC

Chunk c8=new Chunk(“BAC: “, titre);

c8.setBackground(Color.cyan);

Chunk c9=new Chunk(“\nBac : “+bac,normal);

Chunk c10=new Chunk(“\nObtenu en : “+anneeobtentionbac,normal);

Paragraph p3=new Paragraph();

p3.add(c8);p3.add(c9);p3.add(c10);

document.add(p3);

// fermeture du document.

document.close();

// préparation de la reponse

response.setContentLength(baos.size());

// retour du ByteArrayOutputStream en ServletOutputStream

ServletOutputStream out = response.getOutputStream();

baos.writeTo(out);

baos.flush();

context.responseComplete();

} catch (Exception e) {

e.printStackTrace();

}

return null;

}

Vous aurez remarqué que la méthode export appelle les deux méthodes suivantes, qu’il faut donc implémenter dans le Controller:

private HttpServletResponse configureResponse(HttpServletResponse response, String fileName) {

response.setHeader(“Expires”, “0″);

response.setHeader(“Cache-Control”, “must-revalidate, post-check=0, pre-check=0″);

response.setHeader(“Pragma”, “public”);

response.setContentType(“application/pdf”);

response.addHeader(“Content-disposition”, “attachment; filename=\”" + fileName +”.pdf\”");

return response;

}

private Document configureDocument(float width, float height, float margin) {

Document document = new Document();

float widhtPage = (width / 2.54f) * 72f;

float heightPage = (height / 2.54f) * 72f;

document.setPageSize(new Rectangle(widhtPage,heightPage));

float marginPage = (margin / 2.54f) * 72f;

document.setMargins(marginPage, marginPage, marginPage, marginPage);

return document;

}

Enfin, il ne reste plus qu’à ajouter un lien dans notre page xhtml, qui va nous proposer d’enregistrer le pdf généré:

<h:commandLink id=”pdfLink” action=”#{Controller.export}”>

PDF

</h:commandLink>

Ainsi, en cliquant sur le lien ‘PDF’ vous aurez l’invitation suivante :

Il ne reste plus qu’à enregistrer le pdf et voilà, le tour et joué. Voir le résultat.

Il reste maintenant à obtenir le même résultat en mode portlet, car vous aurez remarqué qu’on le sert de l’objet HttpServletResponse pour retourner le pdf.

Pour mener à terme le développement de MonDossierWeb en portlet , plusieurs questions se posent:

-Est-il possible de faire marcher les tags ADF (la librairie de tag d’Oracle) en facelets?

-Comment avoir un système de template qui fonctionne pour portlet et servlet?

-Peut-on faire sans les tags esup utilisés dans esup-example ?

-Peut-on faire un Look-and-feel proche de l’original?

-Comment peut-on générer des fichiers pdf et excel sans passer par le xsl comme c’était le cas dans MonDossierWeb jusqu’ici?

Voici, pour l’instant, où en est notre réflexion :

-Est-il possible de faire marcher les tags ADF (la librairie de tag d’Oracle) en facelets ?

Sur ce point, il n’y a aucun problème car il existe une librairie (adf-facelets.jar) qui fournie les tags ADF pour facelets. Nous ne l’avons pas encore testée mais nous le ferons d’ici peu. Voici un lien qui en explique rapidement le fonctionnement : lien

-Comment avoir un système de template qui fonctionne pour portlet et servlet?

Cette question est primordiale et voici comment nous avons pensé la résoudre : Chaque page xhtml se compose de la manière suivante :

<div xmlns:h=”http://java.sun.com/jsf/html”

xmlns:e=”http://commons.esup-portail.org”

xmlns:ui=”http://java.sun.com/jsf/facelets”>

<ui:composition template=”template.xhtml”>

<ui:define name=”body”>

[CODE DE LA PAGE]

</ui:define>

</ui:composition>

</div>

De cette façon il suffit de modifier le ‘template.xhtml’ pour qu’il corresponde aux servlets (avec balise <html>) ou aux portlets (sans balise <html>). Nous avons donc créé deux templates (template-servlet.xhtml et template-portlet.xhtml) et il suffit de copier celui désiré en ‘template.xhtml’.

Voici un exemple basique (ce n’est pas le template final qui affiche le menu de la portlet) du template-servlet.xhmtl :

<!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:ui=”http://java.sun.com/jsf/facelets”

xmlns:h=”http://java.sun.com/jsf/html”

xmlns:f=”http://java.sun.com/jsf/core”>

<head>

<title><ui:insert name=”pageTitle”>MonDossierWeb</ui:insert></title>

</head>

<body>

<p><ui:insert name=”body”>Page Body</ui:insert></p>

</body>

</html>

Et voici maintenant un exemple de template-portlet.xhtml

<div xmlns:h=”http://java.sun.com/jsf/html”

xmlns:e=”http://commons.esup-portail.org”

xmlns:ui=”http://java.sun.com/jsf/facelets”>

<h1><ui:insert name=”pageHeader”>MonDossierWeb</ui:insert></h1>

<p><ui:insert name=”body”>Page Body</ui:insert></p>

</div>

-Peut-on faire sans les tags esup utilisés dans esup-example ?

Pour savoir si il était possible de faire sans les tags esup (qui sont des tag jsf, donc difficilement utilisables en facelets) nous les avons listés et pour chacun d’eux, nous avons défini son rôle afin de déterminer si il nous était utile et si c’était le cas, si nous pouvions nous arranger pour obtenir le même résultat par un moyen détourné.

Il s’est avéré que la plupart d’entre eux sont effectivement utiles mais qu’il est possible d’obtenir le même résultat avec des tags ‘normaux’ html. Le seul qui soit vraiment compliqué est le tag ‘page’ qui initialise un certain nombre de paramètres. Peut-être devrons nous créer notre tag facelets qui fait la même chose…

-Peut-on faire un Look-and-feel proche de l’original?

Comme MonDossierWeb est à l’origine basé sur du xsl, il est tout à fait possible de récupérer les tags html de ces fichiers, et comme le css de uportal ne change pas cela fonctionne très bien. On peut donc, en changeant quelques tags qui ne fonctionnent pas en facelets bien sur, notamment pour afficher les attributs d’une classe, obtenir un rendu quasi identique à l’application de départ. En voici la preuve après une après midi de test de mise au point des templates :

Le rendu est effectivement très proche de l’original.

-Comment peut-on générer des fichiers pdf et excel sans passer par le xsl comme c’était le cas dans la MonDossierWeb jusqu’ici?

Sur ce point rien n’est encore défini car s’il est vrai que l’on peut facilement créer des fichiers excel et pdf en java, est-il possible de le faire depuis le rendu html de notre page pour le retourner ensuite à l’utilisateur. Nous allons nous pencher sur JFree qui est une librairie java qui permet de faire des sorties pdf et excel en se basant sur du xml.