Skip to content

15 Translations

CraigD edited this page Aug 29, 2023 · 3 revisions

MaterialSkin's translation files are split across 3 different file formats; the main UI translation (JSON files), server-side (LMS specific text files), and a simple HTML file for help text.

WebApp / Javascript translations

For the WebApp MaterialSkin loads language specific JSON files from LMS, and these map from the English used in the source code to the language specific translations. With the MaterialSkin/HTML/material/html/lang folder you will find .json file for each currently translated language.

{
"color":"translated version of 'color'",
...
}

Server-side settings

The translation of MaterialSkin's server-side settings (e.g. those that are shown from Settings / Server / Plugins / MaterialSkin) uses LMS's strings.txttranslation system. WithinMaterialSkinyou will find astrings.txtfile that contains the MaterialSkin specific strings to translate. In this file each 'string' is represented by an uppercase 'key' followed by a line for each language. Each line has a specficTAB-LANG-TAB-Translated text` format (and you must use a tab character, not spaces). e.g.

SOME_STRING_KEY
    EN    English translation of 'some string'
    FR    French translation

'Help' menu item

The 'Help' entry in MaterialSkin's main menu shows a help page detailing basic usage, long-press items, etc. To simplify coding this is simply another HTML file, with a unique file per language. Within MaterialSkin/HTML/EN/html/material-skin/ you will find various index.html files, with language specific extensions - e.g. index.html.fr for French. These are not 100% plain HTML files, but contain some LMS HTML templating code. The format of these files is:

[% PROCESS materialhelpheader.html %]
<h1>Introduction</h1>
...
[% PROCESS materialhelpfooter.html %]

The lines between materialhelpheader.html and materialhelpfooter.html are what need to be translated, and any translations should (try to at least) keep the same styling for formatting.

Steps to create a new translation

Using GitHub

  1. Use GitHub to fork the MaterialSkin repo
  2. Clone your forked repo
  3. Create a branch for your changes (e.g. 'xxx-translation' ('xxx' being your language))
  4. Copy MaterialSkin/HTML/material/html/lang/blank.json to MaterialSkin/HTML/material/html/lang/<iso-lang-code>.json (e.g. en-gb.json for British English). The 'iso-lang-code' will depend upon which language you are translating into. If this is not one of LMS's supported language, you will probably also need to have LMS updated to support your language. Language codes need to be all lowercase, and separated by a dash.
  5. Update each entry in your <iso-lang-code>.json to translate the English into your language
  6. Update MaterialSkin/strings.txt to add new language specific translations of each item (remember the 'tab' spacing)
  7. Copy MaterialSkin/HTML/EN/html/material-skin/index.html to MaterialSkin/HTML/EN/html/material-skin/index.html.<iso-lang-code> Language codes need to be all lowercase, and separated by an underscore - e.g. index.html.en_gb
  8. Translate the strings in this index.html.<iso-lang-code> file
  9. git add your new <iso-lang-code>.json and index.html.<iso-lang-code> files
  10. git commit all your changes
  11. Push all your changes to your github repo
  12. Use github to request a merge of your branch into the master branch of this repo

Via Email

If you are not familiar with git, or find the above too technical, you can simply send your new (or updated) translation files via email. Yoi will find my email address in the LICENSE file.

The basic steps for translating will then be:

  1. Download blank.json
  2. Rename blank.json to <iso-lang-code>.json (e.g. en-gb.json for British English). The 'iso-lang-code' will depend upon which language you are translating into. If this is not one of LMS's supported language, you will probably also need to have LMS updated to support your language. Language codes need to be all lowercase, and separated by a dash.
  3. Update each entry in your <iso-lang-code>.json to translate the English into your language
  4. Download strings.txt
  5. Update strings.txt to add new language specific translations of each item (remember the 'tab' spacing)
  6. Download index.html
  7. Rename index.html to index.html.<iso-lang-code> Language codes need to be all lowercase, and separated by an underscore - e.g. index.html.en_gb
  8. Translate strings in index.html.<iso-lang-code>
  9. Send me an email with your updated files, and I will add to the MaterialSkin repo