Planning issue to revive JavaScript i18n-js translation

[jywarren]

Re #3262, we have pure js translation set up here:

plots2/app/assets/javascripts/application/i18n/translations.js

Line 2 in 5c0d962

I18n.translations["en"] = I18n.extend((I18n.translations["en"] || {}), {"js":{"dashboard":{"all_updates":"All updates","none":"None","selected_updates":"Selected updates"}}});

I'm wondering if we can compile our Ruby translations into this file too? This will help with user generated content like features, which will soon include the navbar and other key areas of the site.

[jywarren]

It seems that this gem (already installed) can autogenerate the translations.js file on the fly?

https://github.com/fnando/i18n-js/blob/master/README.md#rails-app-with-asset-pipeline

Bears some testing!

[jywarren]

This is cool and can build on @gauravano's work!

[jywarren]

OK, I found that we can:

1. delete /app/assets/javascript/application/i18n/translations.js
2. delete the "only JS" line from /config/i18n-js.yml so that all translations are automatically copied from Ruby locale files in /config/locales/ into an autogenerated translations.js file which is already loaded into the client side environment
3. use I18n.missingBehaviour='guess'; to make I18n try really hard to find a translation (although this isn't perfect!)
4. replace items on the page with their translations, using this schema:

// for h1 elements:
$('h1').each(function(i, e) {
  $(e).html(I18n.t($(e).html())); 
});

We can adapt this to make any element with class translate get auto-translated, or all sub-elements, if it has them.

And we could also have a data-translation="tags.index.follow" style attribute so we can use HTML attributes to require a very specific translation in the I18n namespace. But if it doesn't exist, it'll just guess.

This will make our translations nice and robust for feature-based content!

[NitinBhasneria]

@jywarren Are this tasks still need to be done. If yes, may I try please?