Seam + ExtJS, i18n

How to internationalise a Seam + ExtJS application ?

I chose the following solution :
- for server-side generated messages and jsf labels, I need one or more resource bundles (properties file) for each langage

Example :

<messages_en.properties>

org.jboss.seam.loginFailed=Login failed
org.jboss.seam.loginSuccessful=Welcome, #0


<messages_fr.properties>

org.jboss.seam.loginFailed=Echec de la tentative de login
org.jboss.seam.loginSuccessful=Bienvenue, #0


In my Eclipse environment, I set content encoding of these files to ISO-8859-1

Now they can be used within the Seam framework scope (JSF, Pojos, EJBs, and so on). Nothing more to say that is explicitly documented in the Seam documentation.

- now for the client-side messages and labels, I create one javascript object type and an instance of it in a javascript file for each specific langage versions like this one :

<application-lang-en.js>

ApplicationLang = function()
{
// general dictionnary
this.codeIso = "ISO Code";

// helloAction labels and messages
this.helloAction_titreGrille = "Drivers list";
this.helloAction_titreFormulaire = "Driver details";
}

var lang = new ApplicationLang();


<application-lang-fr.js>

ApplicationLang = function()
{
// dictionnaire général
this.codeIso = "Code ISO";

// helloAction
this.helloAction_titreGrille = "Liste des chauffeurs";
this.helloAction_titreFormulaire = "Détail du chauffeur";
}

var lang = new ApplicationLang();


The lang variable can then be used in ExtJS object declarations :

var countryFieldSet = new Ext.form.FieldSet(
{
id: 'formulaireFields',
columnWidth: 0.3,
labelWidth: 50,
title: lang.helloAction_titreFormulaire,
...
}



To use the right javascript langage file, add these lines to the xhtml file :


<script type="text/javascript" src="ext/locale/ext-lang-#{localeSelector.localeString}.js"></script>
<script type="text/javascript" src="ext/locale/application-lang-#{localeSelector.localeString}.js"></script>


And to tell Seam which langages are supported, modify faces-config.xml :

<application>
      <locale-config>
      <default-locale>en</default-locale>
        <supported-locale>fr</supported-locale>
      </locale-config>
      <view-handler>com.sun.facelets.FaceletViewHandler</view-handler>
</application>

Finally, I set the carset encoding for xhtml and javascript files to UTF-8. To be sure that the browser knows that my javascript files are UTF-8 I just had these lines to web.xml :

<mime-mapping>
 <extension>js</extension>
 <mime-type>text/javascript;charset=UTF-8</mime-type>
</mime-mapping>