I18n counterpart to DOM bindings for L20n

[zbran...@mozilla.com]

Hi all,

While refactoring Gaia to use Intl API I noticed that there's a split between i18n that goes through l10n and the rest goes "raw" into designated HTML elements.

Formatting i18n inside localization is a separate topic but I started wondering how it would work if we could just use data-i18n-* similarly to how we use data-l10n-* for localization.

Here's the first POC: https://github.com/zbraniecki/i28n

There are two examples - raw and mozintl. raw has no dependencies, mozIntl depends on l20n.

The simplest way to explain how it works is this:

<span data-i18n-format="datetime"></span>

navigator.mozI18n.setValue(span, Date.now());

This will format the element's textContent (and maybe aria values?) according to DateTimeFormat with Date.now() as a value.

If you need to set options, you can either do this in HTML:

<span data-i18n-format="datetime" data-i18n-options='{"weekday": "long", "day": "numeric", "year": "numeric"}'></span>

or in JS:

navigator.mozI18n.setOptions(span, {
weekday: "long",
day: "numeric",
year: "numeric"
});

I think it looks very promising and it could nicely replace most of what we need IntlHelper now for. I could even imagine it doing something smart in the future (refresh the element every minute for clock).

What do you think?

zb.