Contact us Create app

Directory

← Back

udes-language-mixin

A simple mixin to be aware of the current language application

Author

Rating

Links

Popularity

<100

[ This description is mirrored from README.md at github.com/UdeSElements/udes-language-mixin on 2019-05-10 ]

UdeS.LanguageMixin

Published on webcomponents.org

A simple mixin to be aware of the current language application.

The language property is computed from supported languages and from the browser languages.

It implements the observer pattern. You should call the updateLanguage function if you want to update the language of all observers. When the language is changed, the lang attribute of html element is update automatically.

<html lang="en"></html>

The mixin also provide some read-only properties to your component:

  • defaultLanguage: Default language defined globally.
  • language: Current language.
  • navigatorLanguage: Navigator language (see window.navigator.language).
  • navigatorLanguages: Navigator languages (see window.navigator.languages).
  • supportedLanguages: Supported languages defined globally.

Demo

<udes-language-demo></udes-language-demo>

Usage

As the primary language at our organisation, Université de Sherbrooke, is French, you may want to change the defaultLanguage and the supportedLanguages properties.

To do so, add the following code inside your index.html BEFORE you import any HTML component using this mixin.

UdeS.Language = {
    defaultLanguage: 'en',
    supportedLanguages: ['en', 'fr'],
  };

Localized files with UdeS.LocalizeMixin

If you want also to load some localized files, you should take a look on UdeS.LocalizeMixin instead (not published yet).

Compatibility

(Loading compatibility data...)

Last updated: 2017-10-31

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Dependencies

  • polymer#Polymer/polymer#^2.0.0
Released
2017-10-31
Maturity
IMPORTED
License
MIT License

Compatibility

Framework
Polymer 2.0+
Browser
Browser Independent

udes-language-mixin - Vaadin Add-on Directory

A simple mixin to be aware of the current language application udes-language-mixin - Vaadin Add-on Directory
**[ This description is mirrored from README.md at [github.com/UdeSElements/udes-language-mixin](https://github.com//UdeSElements/udes-language-mixin/blob/v2.2.2/README.md) on 2019-05-10 ]** # UdeS.LanguageMixin [![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/UdeSElements/udes-language-mixin) A simple mixin to be aware of the current language application. The `language` property is computed from supported languages and from the browser languages. It implements the observer pattern. You should call the `updateLanguage` function if you want to update the language of all observers. When the language is changed, the lang attribute of html element is update automatically. ```html ``` The mixin also provide some read-only properties to your component: - `defaultLanguage`: Default language defined globally. - `language`: Current language. - `navigatorLanguage`: Navigator language (see window.navigator.language). - `navigatorLanguages`: Navigator languages (see window.navigator.languages). - `supportedLanguages`: Supported languages defined globally. ## Demo ```html ``` ## Usage As the primary language at our organisation, `Université de Sherbrooke`, is French, you may want to change the `defaultLanguage` and the `supportedLanguages` properties. To do so, add the following code inside your `index.html` BEFORE you import any HTML component using this mixin. ```javascript UdeS.Language = { defaultLanguage: 'en', supportedLanguages: ['en', 'fr'], }; ``` ## Localized files with UdeS.LocalizeMixin If you want also to load some localized files, you should take a look on `UdeS.LocalizeMixin` instead (not published yet).
Online