Skip to content

Ideas for an i18n module

Vildan Softic edited this page Apr 6, 2015 · 13 revisions

Lets gather here some ideas how we'd like to structure an I18N module for use in Aurelia. Just add your thoughts down here and try to categorize them. Also add different options if you can think of them

Example

Here is a first example to start work with I18N support. This way we can see what works and where problems might occur. https://github.com/zewa666/aurelia-i18next

The example now includes additional tests to verify whether the features listed below can be achieved with the current approach. Additionally the Intl. API is going to be used, alongside a Polyfill if needed, for Number- and Date-Formats

General Development

  • Use an existing module (e.g. i18next.com)
  • Custom module but built using small helper modules (e.g. MomentJS for Dates, Intl. API for Number/Date formats)
  • Custom, everything done by ourselves

Area of use

  • independent ES6 module, also to be used outside of Aurelia (e.g. I18N-Core)
  • Separate Plugin to work with I18N-Core (Aurelia-I18N)
  • Pure Aurelia solution

Features

  • translation
  • number formats (separators, etc)
  • dates
  • currency
  • pluralization
  • placeholders --> Hello {name}!
  • Route generation (prefix all routes with the language except routes for the default language)
  • Route localization (http://aurelia.io/#welcome vs http://aurelia.io/#bienvenue vs http://aurelia.io/#dobro-pozhalovat)
  • User locale detection
  • relative time (x days ago, in x days)

Aurelia specific features

  • Translation via code (e.g. i18n.tr('KEY') --> returns translated version)
  • Filters aka ValueConverters for declarative translations
  • Live-switch of current language
  • Default widgets --> e.g. Flag list, DatePicker, Validator ...

Resource location

  • Local files (e.g. JSON, xliff, or PO files)
  • Load via Ajax from Backend --> define a specific interface
  • In code setup --> e.g. if you render the translations into the index.html from the backend
  • Resource file bundles
  • Caching of i18n variables to local storage or other means (perhaps a general caching system can be used here, not only for i18n variables ex: aurelia.cache(key,value,lang))

Editing Translations

  • The application can be put in edit mode where editable text will be highlighted and clickable to edit in various languages, maybe similar to createjs using RDFa attributes
  • cache changes in case backend server is unresponsive (to avoid losing changes, can be synched later)
  • automatic code scanner (https://github.com/i18next/i18next-parser)