ATTENTION : Tutorial en cours d'écriture ! N'hésitez pas à nous signaler toute erreur ou suggestion.
Accès rapide : Les fichiers de ressources Ellipse Incorporation au sein d'une page Web Changement de la langue préférée de votre navigateur Imposer une localisation côté serveur
Certes, Java fournit déjà des mécanismes relatifs à l'internationalisation d'applications Java. Néanmoins, Ellipse fournit ses propres mécanismes ainsi que son propre format de fichiers de ressources. Ce format est pleinement basé sur le format XML (le framework Ellipse n'étant pas prévu pour exploiter les fichiers .properties).
Un fichier de ressources Ellipse est introduit par le tag <ResourceBundle>. Il est, de plus, constitué d'un ensemble de ressources : chacune d'entre elles étant définie via le tag <Resources>. Une ressource peut être déclinée sous plusieurs langues. L'exemple de code ci-dessous vous montre la syntaxe à utiliser pour définir un fichier de ressources Ellipse : encore une fois, cet exemple de code est extrait de l'application de démonstration du framework Ellipse.
01 <?xml version="1.0" encoding="ISO-8859-1" ?> 02 <ResourceBundle supportedLocales="fr,en"> 03 04 <Resource key="title"> 05 <Value locale="fr">Ecran d'authentification</Value> 06 <Value locale="en">Logon screen</Value> 07 </Resource> 08 09 <Resource key="errorMessage"> 10 <Value locale="fr">Une valeur est requise</Value> 11 <Value locale="en">Value is required</Value> 12 </Resource> 13 14 <Resource key="lblLogin"> 15 <Value locale="fr">Nom d'utilisateur :</Value> 16 <Value locale="en">Login: </Value> 17 </Resource> 18 19 <Resource key="lblPassword"> 20 <Value locale="fr">Mot de passe :</Value> 21 <Value locale="en">Password:</Value> 22 </Resource> 23 24 <Resource key="btnConnect"> 25 <Value locale="fr">Se connecter</Value> 26 <Value locale="en">Connect</Value> 27 </Resource> 28 29 </ResourceBundle>
Une fois le fichier de ressources créé, il vous faudra le lier à la page Web considérée. En fait, la technique utilisée est encore une fois le mécanisme de liaison au données du framework Ellipse (Ellipse Data Binding) couplée à l'utilisation du tag <web:ResourceBundle>. A l'initialisation de ce composant Web (méthode component_init), il stocke en session utilisateur une instance de type corelib.runtime.internationalisation.ResourceBundle. C'est cette classe qui est chargée d'extraire les données stockées dans le fichier de ressources. Le composant web possède une propriété id : la valeur de cette propriété servira de nom de clé pour l'enregistrement de l'instance de ResourceBundle dans la session. C'est la ligne 06 de l'exemple ci-dessous qui effectue le chargement du fichier de ressources.
Ensuite, des expressions de liaisons au données sont utilisées pour retrouver une valeur du fichier de ressources en tenant compte de la localisation considérée (pour information, une localisation est représentée par une instance de type java.util.Locale). En ligne 07, on injecte le texte adéquat dans le tag <title> : pour ce faire, l'expression #{resBundle.title} est utilisée. La partie gauche (resBundle) représente l'instance de ResourceBundle stockée en session et la partie droite (title) représente une des ressources présentes dans le fichier de ressources.
01 <?xml version="1.0" encoding="ISO-8859-1" ?> 02 <web:Html xmlns:web="corelib.services.web.components" 03 xmlns:caddy="corelib.services.web.samples.virtualcaddy.webcomponents" 04 codeBehind="corelib.services.web.samples.virtualcaddy.webpages.LoginI18N"> 05 <head> 06 <web:ResourceBundle id="resBundle" filename="LoginI18N.res" /> 07 <title><web:OutputText text="#{resBundle.title}" undecorated="true" /></title> 08 <link rel="stylesheet" type="text/css" href="CssStyles.css" /> 09 </head> 10 <body> 11 <web:Form focus="txtLogin" method="post"> 12 <table border="0" width="100%"> 13 <tr> 14 <td width="25%"> 15 </td> 16 <td valign="top"> 17 <h1><web:OutputText text="#{resBundle.title}" /></h1> 18 </td> 19 <td width="25%" valign="top" align="right"> 20 <caddy:LanguageSelector id="languageSelector" /> 21 </td> 22 </tr> 23 </table> 24 25 <div align="center"> 26 <web:Label text="#{resBundle.lblLogin}" text="txtLogin" /> 27 <web:TextBox id="txtLogin" value="Malone" /> 28 <web:RequiredValidator componentToValidate="txtLogin" 29 errorMessage="#{resBundle.errorMessage}" cssClass="Validator" /> 30 <br/> 31 32 <web:Label text="#{resBundle.lblPassword}" text="txtPassword" /> 33 <web:TextBox id="txtPassword" value="P@ssw0rd" type="password" /> 34 <web:RequiredValidator componentToValidate="txtPassword" 35 errorMessage="#{resBundle.errorMessage}" cssClass="Validator" /> 36 <br /> <br/> 37 38 <web:Button id="btnConnect" value="#{resBundle.btnConnect}" /> <br /> 39 <web:OutputText id="lblResult" /> <hr /> 40 </div> 41 </web:Form> 42 </body> 43 </web:Html>
Le protocole HTTP permet d'envoyer dans la requête HTTP émise par le navigateur, des informations relatives aux langues préférées (il peut y avoir plusieurs langues spécifiées à ce niveau, avec pour chacune une valeur de préférence). Ainsi, le serveur Web, à la réception de la requête pourra retourner une page HTTP dans la langue souhaitée (du moins, pour autant que le site web ait été développé pour supporter l'internationalisation). Bien entendu, les principaux navigateurs supportent cette possibilité.
Si vous utilisez IE, demandez le menu "Tools" et cliquez sur "Internet Options" : une boîte de dialogue apparaît. Sur son premier onglet, un bouton "Languages" vous permettra d'éditer vos préférences en termes de langues. La capture d'écran suivante vous montre un exemple de définition pour IE.
Si vous utilisez Firefox, cliquez aussi sur "Options" à partir du menu "Tools" : une boîte de dialogue doit aussi apparaître. A partir de son dernier onglet "Advanced", cliquez sur le bouton de choix des langues préférées. La capture d'écran suivante vous montre un exemple de définition pour Firefox.
Changez la langue préférée en la montant en tête de liste, fermez le navigateur et réouvrez-le en demandant la page web présentée ci-dessus et vous devriez voir la page HTML utilisant la bonne langue conformément à vos attentes.
Il est possible d'imposer, côté serveur, une localisation. Pour ce faire il faut invoquer la méthode setLocale sur une page Web. Il est à noter que ce changement est mémorisé en session et que pour toutes les futures pages visitées (et pour cette session) la nouvelle localisation sera conservée. Si vous reprennez la page web étudiée ci-dessus vous noterez, en ligne 20, qu'elle utilise un composant web de type LanguageSelector : ce composant change la localisation en fonction de votre sélection : en voici son code. Notez bien la présence de la méthode setCurrentLanguage (à partir de la ligne 16) : c'est elle qui force une nouvelle instance de type java.util.Locale.
01 package corelib.services.web.samples.virtualcaddy.webcomponents; 02 03 import java.io.PrintWriter; 04 import java.util.Locale; 05 06 import corelib.services.web.components.VisualComponent; 07 import corelib.services.web.webapplications.events.WebPageEvent; 08 09 public class LanguageSelector extends VisualComponent { 10 11 public String getCurrentLanguage() { 12 return this.webPage.getLocale().toString(); 13 } 14 15 public void setCurrentLanguage( String currentLanguage ) { 16 if ( currentLanguage == null ) throw new NullPointerException(); 17 String [] localePart = currentLanguage.split( "_" ); 18 Locale locale = null; 19 if ( localePart.length == 1 ) locale = new Locale( localePart[0] ); 20 if ( localePart.length == 2 ) locale = new Locale( localePart[0], localePart[1] ); 21 if ( localePart.length == 3 ) locale = new Locale( localePart[0], localePart[1], localePart[2] ); 22 this.webPage.setLocale( locale ); 23 } 24 25 26 @Override public void component_renderBegin( WebPageEvent webPageEvent ) { 27 PrintWriter out = this.webPage.getOut(); 28 String imageStyle = "style='border: 0px; cursor: pointer;'"; 29 30 out.println( "<div>" ); 31 out.println( " <script language='javascript'>" ); 32 out.println( " function changeLanguage( language ) { " ); 33 out.println( " var inputNode = document.getElementById('" + this.getId() + "');" ); 34 out.println( " inputNode.value = language;" ); 35 out.println( " inputNode.form.submit();" ); 36 out.println( " }" ); 37 out.println( " </script>" ); 38 out.println( " <img src='Images/LocaleFR.png' onclick='changeLanguage(\"fr\");'" ); 39 out.println( " title='Changer le language en français' " + imageStyle + "/> " ); 40 out.println( " <img src='Images/LocaleEN.png' onclick='changeLanguage(\"en\");'" ); 41 out.println( " title='Change language to english' " + imageStyle + "/>" ); 42 out.println( " <input type='hidden' id='" + this.getId() + "'" ); 43 out.println( " name='" + this.getId() + ":currentLanguage'" ); 44 out.println( " value='" + this.getCurrentLanguage() + "' />" ); 45 out.println( "</div>" ); 46 } 47 48 }
Dominique LIARD - © 2007..2010 SARL Infini Software - Tous droits réservés Les autres marques et les noms de produits cités dans ces documents sont la propriété de leurs détenteurs respectifs.