Translation model in App Maker

Question

I would to make the field descriptions and label texts in my pages multi-lingual. Originally they are in English and I could let the user translate them through Google Translate. In order to avoid translation errors I would like to implement a translation data model that contains

• FieldDisplayName / LabelText
• FieldDisplayName_DE
• FieldDisplayName_FR
• FieldDisplayName_IT
• etc.

All the pages contain a page header fragment that contains a menu button, searchbox etc. like in the Starter App template. I am planning on integrating a dropdown widget in the page header that allows to choose between the languages (DE,EN,FR,IT,...). Is it possible to bind the display name to the user's selection? How would I have to implement that?

Answer 1

The easiest way (to implement/use/maintain) that would provide highest possible translation quality will be introducing Translation data model with the following structure:

+----+--------+------------+------------+------------+-----+
| Id | Locale | FirstName  | LastName   | Age        | ... |
+----+--------+------------+------------+------------+-----+
| 1  | EN     | First name | Last name  | Age        | ... |
+----+--------+------------+------------+------------+-----+
| 2  | RU     | Имя        | Фамилия    | Возраст    | ... |
+----+--------+------------+------------+------------+-----+
| 3  | DE     | Voornaam   | Achternaam | Leeftijd   | ... |
+----+--------+------------+------------+------------+-----+
| 4  | ...    | ...        | ....       | ...        | ... |
+----+--------+------------+------------+------------+-----+

In this model every column represents unique label within your app and every row represents labels's translations for supported languages. This model can be easily used in label bindings:

@datasources.UserTranslations.item.FieldNameToTranslate

Maintaining these translation will be easy as well, just drag and drop editable table on UI.

Here is a query script for the UserTranslations datasource:

// Assuming that you already have robust user settings implementation.
var userSettings = getUserSettings_();

var query = app.models.Translation.newQuery();
query.filters.Locale._equals = userSettings.Locale;

return query.run();

Radically different implementation will be

1. Introducing Calculated Model with the same set of fields as in the previous approach
2. Using Model Metadata API to extract display names from the model's fields
3. Translate fields using Translate API
4. Populate calculated model record with translated values

Here is super high level server pseudo script for that flow:

var userLocale = getUserLocaleFromUserSettings();
var fieldsDisplayNames = getFieldsDisplayNames(app.models.Translation);
var translations = translate(fieldsDisplayNames, 'en', userLocale);

var record = app.models.Translation.newRecord();

mapRecordFieldsToTranslations(record, translations);

return [record];