Le Blog du Geek Joyeux

Plus moins vite tu codes, moins plus vite ça plante

Utiliser GetText côté Javascript avec Rails

| Commentaires

En travaillant sur une petite application Rails, j’ai utilisé GetText pour l’internationalisation. Jusque là, pas de problème… Sauf au moment où j’ai voulu traduire un message côté client (autrement dit Javascript).

Je ne voulais pas faire d’appel AJAX pour chaque chaine à traduire.

Tout naturellement, j’ai cherché un plugin simple qui fasse le travail mais n’ai rien trouvé qui me convienne.

J’ai donc créé mon propre plugin, gettext_json.

Voici comment l’utiliser.

Installation

gettext_json s’installe comme n’importe quel plugin Rails. Donc, au choix :

La méthode par gem :

$ gem install gettext_json

Dans config/environment.rb :

1
config.gem "gettext_json", :version => ">= 0.0.2"

Puis, à la racine de votre application :

$ rake gems:install

Le méthode vendor/plugins :

$ ./script/plugin install git://github.com/simonc/gettext_json.git

Utilisation

Initialisation

La première étape est de faire appel au générateur gettext_json :

$ ./script/generate gettext_json

Ceci va créer trois fichiers :

  • gettext_json.js La micro librairie Javascript.
  • lib/js_parser.rb Le parser de fichiers javascript pour GetText.
  • lib/tasks/gettext_json.rake Contient la tâche rake makemo:json

Génération des traductions

Lorsque l’on utilise GetText avec Rails, on se sert en général de deux tâches rake : updatepo et makemo. Pour plus d’informations : Ruby-gettext-howto-rails.

Pour que les chaines à traduire dans les fichiers Javascript soient prises en compte, votre tâche updatepo doit ressembler à ceci :

1
2
3
4
5
6
7
8
9
10
desc "Update pot/po files."
task :updatepo do
  require "gettext_rails/tools"
  require "js_parser"
  GetText.update_pofiles(
    "your_app",
    Dir.glob("{app,lib,bin,public}/**/*.{rb,erb,rjs,js}"),
    "your_app 1.0.0"
  )
end

Il ne reste plus qu’à faire appel à la tâche rake updatepo pour obtenir les nouvelles chaines.

Génération du fichier JSON

Pour générer le fichier de traductions utilisables par Javascript, utilisez la tâche rake suivante :

$ rake makemo:json

Un fichier public/javascripts/gettext_json_translations.js va être créé.

Traduction des chaines

Pour utiliser GetText côté Javascript, il faut inclure deux fichiers dans le layout de l’application :

1
2
<%= javascript_include_tag 'gettext_json.js' %>
<%= javascript_include_tag 'gettext_json_translations.js' %>

Il vous suffit ensuite dans vos scripts d’utiliser la micro librairie :

1
2
3
4
// Définir la locale courante (la valeur par défaut est 'en')
GetText.locale = "fr";
var str = GetText.t("Hello World");
//=> "Bonjour le Monde"

En savoir plus

gettext_json sur Github

Commentaires