Localization ( L10N )

with Mozilla's Add-on SDK

Mozcamp EU ( Berlin ) November 12th 2011

Follow along

This talk is a website!

http://talks.canuckistani.ca/mozcampeu/#2

...and on github

For Developers

We use the Gnu 'gettext' convention:  _("text to translate")

Example using strings:

const _ = require("l10n").get;
require("tabs").tabs.on('activate', function(tab) {
  tab.attach({
    contentScript: 'alert("' + _("Hello World!") + '")',
  });
});

French Translation ( fr-FR.json ):
{
  "Hello world!": "Bonjour le monde!"
}

Example using Ids

JS Code:
const _ = require("l10n").get;
require("tabs").tabs.on('activate', function(tab) {
  tab.attach({
    contentScript: 'alert("' + _("hello_world_id") + '")',
  });
});
console.log(_("hello_world_id"));

Default Translation ( en-US.json ):

{
    "str_hello_world": "Hello world!"        
}

File layout

Localizations stored in the locale directory:

data/
doc/
    main.md
lib/
    main.js
locale/
    de-DE.json
    en-US.json
    fr-FR.json
    // ...etc
test/
    test-main.js
package.json
README.md

JSON file format

Strings:

{
  "Mozilla Website": "me traduire!",
  "The add-on is running": "me traduire!",
  "Hello world!": "Bonjour le monde!"
}

Ids:

{
  "moz_website": "me traduire!",
  "addon_running": "me traduire!",
  "str_hello_world": "Bonjour le monde!"
}

Example!

Let's add a German translation for this example right now!

Future plans

Discussion!

Rocketeers!!