Frontend translations
by Andraž Bajt @edofic
available at
Who am i?
CS student at FRI
developer at Koofr
STaaS provider startup
Scenario
You have a "finished" product
The customer wants it in Svahili
PROBLEMS
- What to translate
- What's the translation(duh!)
- Which language to show
- How to show the text
More problems
Plural(s)
GETTEXT
GNU project
quite good
ANgular.js - nggettext
- angular directive
- grunt extractor
- grunt compiler
USAGE
Simple translation
<a href="/" translate>Home</a>With correct plural
<span translate
translate-n="count"
translate-plural="There are {{count}} messages"
>There is {{count}} message</span>From JavaScript
gettext("Hello");
GRUNT
Extraction
grunt nggettext_extract Compilation
grunt nggettext_compile 
grunting
Extending nggettext
Play Framework 2 templates
plain Scala code
Available on github
Motivation
- Reusing translations
- One tool
- Uniform syntax
Translate("Hello from Scala") Scaposer
MORE PROBLEMS
Interpolation in JS
var textToUse = sprintf(gettext("Welcome to the %s, %s"), place, name);
Maintenance
grunt nggettext_check
WHICH LANGUAGE?
- Available langs in config
- Default lang in config
- User preferences in db
- Detection from browser
- Always return something
The "ALGORITHM"
On startup
- Load config
- Load all PO files
- Build a special dict
Per request
- Detect language
- Do one lookup
How about Js?
- Single page app
- Template generated code
- Angular.js DI
