Contains locales. You can extend locales by using {L.ALS.Locales.addLocaleProperties} method.
Structure is following:
{
"locale name that will be presented to the user, i.e. 'English'": {
key1: "Value 1", // These keys will be used in app itself. We'll call those "locale properties" for the rest of the documentation.
key2: "Value 2",
...
},
"Русский": {
"key1": "Значение 1",
"key2": "Значение 2",
...
},
...
}
To localize elements created by strings or JSX, put these attributes to localizable elements:
data-als-locale-property="property in L.ALS.locale" -- Value points to property in L.ALS.Locale.
data-als-locale-property-to-localize="text" -- Value says which element's property to localize. This attribute is optional.
You can also use these properties to additionally alter element's value, for example, add a value to a label.
Usage note: You must put all your custom locale's properties to L.ALS.English
. If you don't care about English localization, just copy all your properties to it.
Example
Create two localized labels for a couple of widgets and localized about section // Prepare locales // Require System and add additional locales except English before doing anything. require("./path/to/ALS/System.js"); L.ALS.Locales.AdditionalLocales.Russian(); // Add additional Russian locale to ALS. Add additional locales BEFORE defining your custom properties! // Define custom locale properties for English. You can do this in external script and require it instead of doing everything at your entry point. L.ALS.Locales.addLocaleProperties("English", { labelForNumberWidget: "Enter number", // Label for number widget labelForColorWidget: "Choose color", // Label for color widget aboutText: "This is my program!", // Text displayed at "About" settings section }); // Define custom locale properties for Russian L.ALS.Locales.addLocaleProperties("Русский", { labelForNumberWidget: "Введите число", labelForColorWidget: "Выберите цвет", aboutText: "Это моя программа!", }); L.ALS.System.initializeSystem(); // Initialize system after all locales has been set up let map = ... // Create map // Create system let layerSystem = new L.ALS.System(map, { aboutHtml: require("./about.js) // Add custom "About" section }); // Do your other stuff... // Localise widgets // Imagine code below being at some custom L.ALS.Widgetable where we add our widgets // Pass our new locale properties names as labels to widgets' constructors. // You can pass those names to everything that can be localised. this.addWidgets( new L.ALS.Widgets.Number("myNumberId", "labelForNumberWidget"), new L.ALS.Widgets.Color("myColorId", "labelForColorWidget") ); // Localize about section // Code below is at "./about.js" script module.exports = ` <h1>MyProgram</h1> <!-- Program's name --> <div data-als-locale-property="aboutText"></div> <!-- Program's description localized by "data-als-locale-property" attribute --> `;
Members
-
<static> "English" :Object
-
English locale
Type:
- Object
-
<static> AdditionalLocales
-
Contains additional locales. Here all locales are functions. Call one of them to add it to ALS. You must add additional locales BEFORE adding your own locale properties!
Methods
-
<static> addLocaleProperties(name, properties)
-
Adds new locale properties to given locale.
Parameters:
Name Type Description name
string Name of the locale to add properties to. For example, if you wan't to update English locale
properties
Object Object in format
{key: "value"}
-
<static> changeLocale(localeName)
-
Changes current locale
Parameters:
Name Type Description localeName
string Locale name
-
<static> getLocalePropertyOrValue(element)
-
Returns either locale property bound to given element (if set) or property's value
Parameters:
Name Type Description element
Element Element to find property of
Returns:
Found locale property or element's value
- Type
- string
-
<static> localizeElement(element, localeProperty, elementPropertyToLocalize)
-
Localizes HTML element
Parameters:
Name Type Description element
Element Element to localize
localeProperty
string Property name of L.ALS.locale. For example, there's L.ALS.locale.myProperty property which contains your text. You need to pass "myProperty" string here.
elementPropertyToLocalize
string Element's property to output localized text to. If not supplied, will use either textContent, innerText or innerHTML
-
<static> localizeOrSetValue(element, localeProperty, elementPropertyToLocalize)
-
Either localizes element by calling localizeElement() or sets localeProperty as element's value if it doesn't exist in L.ALS.locale
Parameters:
Name Type Description element
Element Element to localize
localeProperty
string Property name of L.ALS.locale. For example, there's L.ALS.locale.myProperty property which contains your text. You need to pass "myProperty" string here.
elementPropertyToLocalize
string Element's property to output localized text to. If not supplied, will use either textContent, innerText or innerHTML