Arlo

Internationalisation

The Arlo Web Controls javascript application has internationalisation support. By providing a translation in JSON format, you can convert all default texts and error messages into whatever language is required.

You have two options when providing this translation JSON. Both support partial internationalization.

  • Host a translation file on a server, and provide a url.
  • Embed the translation JSON directly into your app configuration.

Provide a translation

Host the translation file

If you choose to host the translation file on a web server, you need to set this url in your app config in the following way. If there is a problem retrieving your translation file, the default will be used instead.

                                    var applicationConfiguration = {
                                        "platformID": platformID,
                                        "modules": [myModule],
                                        i18n: {
                                            url: "http://www.example.com/mytranslationfile.json"
                                        }
                                    };
                                    
                                    new window.ArloWebControls().start(applicationConfiguration);  
                    
Embed the translation JSON

If you choose to embed the translation JSON directly into your application configuration, you can do this in the following way.

                                    var applicationConfiguration = {
                                        "platformID": platformID,
                                        "modules": [myModule],
                                        i18n: {
                                            translationJson: {
                                                "app": {
                                                    "errors": {
                                                      "unknownmoduletype": "Unknown module type: __moduleType__."
                                                    }
                                                },
                                                //Rest of translation
                                            }
                                        }
                                    };
                                    
                                    new window.ArloWebControls().start(applicationConfiguration);  
                    

Create a translation

In order to create a translation for the required language, you should take the english (default) translation file and translate each of the property values into the required language.

Important note: You will find placeholders inside the translation where values from the application will be placed. Include these placeholder in the translations and do not translate them. You should also not modify any of the property keys, as the system uses these to look up the translation values.

Example

Before translation
                        {
                            app": {
                                "errors": {
                                    "unknownmoduletype": "Unknown module type: __moduleType__."
                                }
                            },
                            //Rest of translation
                        }
                    
After translation
                        {
                            app": {
                                "errors": {
                                    "unknownmoduletype": "Unbekannte Modultyp: __moduleType__."
                                }
                            },
                            //Rest of translation
                        }
                    

Set the language for the control

Set the language to be used for all deafult texts and dates displayed in the control using the 'lanugage' configuration option. Note: if you have specified a custom language set this value to "user".

                                    var applicationConfiguration = {
                                        "platformID": platformID,
                                        "modules": [myModule],
                                        i18n: {
                                            language: "en"
                                        }
                                    };
                                    
                                    new window.ArloWebControls().start(applicationConfiguration);