RunestoneComponents uses Wikimedia'a jQuery.i18n Javascript internationalization library.
In the js
subfolder of your component's source folder you should create javascript files for i18n message loading. A mesage loading script file name shoud folow the pattern:
message-bunlde-name.
language-code.js
where message-bunlde-name should start with the component's name and ends with -i18n
. For examle, the english message loading script for the ActiveCode componet is activecode-i18n.en.js
.
Read more about message loading at https://github.com/wikimedia/jquery.i18n#message-loading
Since messages for different components may be loaded in the same web page context, to avoid name conflicts, message keys should folow the pattern:
msg_
component-name_
given-name
For exemple: msg_activecode_play_audio
The default language is English. For each message-bunlde-name there should be English message loading script with all message keys defines. For any other language you may define just a subset of those message keys.
In your component's main script file (component-name.py
):
- import
add_i18n_javascript
fromrunestone.common.runestonedirective
- in the
setup()
function add the call
add_i18n_javascript(app,
supported-languages,
message-bunlde-name)
before adding any other JavaScript that use i18n messages. For instance:
add_i18n_javascript(app, {"sr-Cyrl"}, "activecode-i18n")
Since English language support is mandatory, it is not necessary to specify it in supported-languages.
You may group your messages in different message bundles:
add_i18n_javascript(app,
supported-languages,
message-bunlde-name1,
message-bunlde-name2 ...)
for instance:
add_i18n_javascript(app, {"sr-Cyrl"}, "mycomponent-UI-i18n","mycomponent-compiler-i18n")
Now you may use defined message keys in your component's front-end code (JavaScript and HTML). For more details see https://github.com/wikimedia/jquery.i18n#jqueryi18n-plugin.
In conf.py
of your book project, you should just set the language
variable to an apropriate language code.