Extension:UniversalLanguageSelector

From MediaWiki.org
Jump to: navigation, search
MediaWiki extensions manual - list
Crystal Clear action run.png
UniversalLanguageSelector

Release status: stable

Implementation User interface, Skin, Beta Feature
Description Tool that allows users to select a language and configure its support in an easy way.
Author(s) Wikimedia Language engineering
MediaWiki 1.20.4 or later
Composer mediawiki/universal-language-selector
License GNU General Public Licence 2.0 or later, MIT license
Download Included in Language Extension Bundle

Not compatible with Internet Explorer 7 or lower.

Translate the UniversalLanguageSelector extension if possible

Check usage and version matrix; code metrics
Bugs: list open list all report

The Universal Language Selector is a tool that allows users to select a language and configure its support in an easy way. Where used, it also ships the functionality of both WebFonts and Narayam extensions (both of which have been deprecated in favour of Universal Language Selector). See Universal Language Selector for background and additional information.

Usage[edit | edit source]

The primary aim is to allow users to select a language and configure its support in an easy way.

The extension provides the following features:

  1. Flexible and easy way to select a language from a large set of languages.
    1. Selection can be based on geographical region based browsing, searching.
    2. Search can be based on ISO language code, language name written in current user interface language or in its own script(autonym)
    3. Cross language search - search language names using any script
    4. Autocompletion of language names
    5. Auto correction of spelling mistakes in search strings
    6. Geo IP based language suggestions
    7. Language selection based on users browser/OS language
  2. Input methods
    See Help:Extension:UniversalLanguageSelector/Input methods for complete instructions.
    1. An easily selectable input method collection, readily available in every editable field
    2. Provides a large set of input methods for wide range of languages
    3. Per-language input method preferences
  3. Webfonts
    1. A large collection of fonts to choose for each language to use as embedded font for the page
    2. Per-language font preferences
Universal Language Selector with geoip based language suggestion for a user from Spain
Language settings allow a registered user accessing English Wikipedia to change the UI to his native language.
A Bengali user is able to read content from the Bengali Wikipedia despite the lack of fonts in his computer. Web fonts are provided automatically for non-latin scripts for which an open source font is available. The user can decide to use their system fonts on a per language basis.
A Hindi speaker without a Hindi keyboard configures input methods so that he can type in his language.
When searching a user can switch between English and Hindi.

Adding fonts[edit | edit source]

Supporting more languages is only a matter of including the proper fonts in the code. However, please note that we will add support only for freely licensed fonts, for example fonts licensed under GNU GPL, SIL OFL, etc. An example directory of such free fonts is Google Web Fonts [1] (not yet fully examined/exploited by the authors of this extension); see also the Kernest Wiki and the Open Font Library.

First of all, you need to find or produce such a free font (this is the most important part and you have to do it yourself); then, it has to be converted to the required formats, which are eot, ttf, woff; finally, you can file a request in bugzilla for the font to be added to the extension.

#Preparing webfonts below explains how to convert the fonts: basic knowledge about GNU/Linux based operating system is required; if you have difficulty in doing this, you can skip this step and ask someone else to do it for you on the same bugzilla request (of course this will slow down the process).

Preparing webfonts[edit | edit source]

Sfntly is required for creating web fonts (command line only).

Once installed, following commands can be used.

Creating .woff:

java -jar /path/to/sfnttool.jar -w xyz.ttf xyz.woff

Creating .eot:

java -jar /path/to/sfnttool.jar -e -x xyz.ttf xyz.eot

Note: For some languages, the font size can be very big, with careful testing, we can remove all hinting instructions to reduce the size, by passing -h option to above tool usage. java -jar /path/to/sfnttool.jar -e -h -x xyz.ttf xyz.eot

Create a font.ini file. Here's an example:

[AbyssinicaSIL]
languages=am*, ti*
version=1.200
license=OFL 1.1
licensefile=OFL.txt
url=http://scripts.sil.org/AbyssinicaSIL

An asterisk (*) after a language code means that this font will be the default font for that language. If you just want the option to use this font for that language, don't use the asterisk.

After creating the files, do the following:

  1. Create a directory for the font under data/fontrepo/fonts.
  2. Put the ttf, woff, eot and font.ini files in that directory and add them to the source repository (git add).
  3. Go to data/fontrepo/scripts and run php compile.php.
  4. Commit the changes to the repository (git commit -a) and submit them according to the Git workflow.

Adding support for a new key mapping (input method)[edit | edit source]

Follow the instructions on the jquery.ime github wiki, but file requests in the UniversalLanguageSelector bugzilla component.

Download[edit | edit source]

You can download the extension directly from the MediaWiki source code repository (browse code). You can get:

One of the extensions tags

Not all extensions have tags. Some extensions have tags for each release, in which case those tags have the same stability as the release. To download a tag

  • Go to the tags list
  • Click the name of the tag you want to download
  • Click "snapshot"
The latest version of one of the extensions branches

Each extension has a master branch containing the latest code (might be unstable). Extensions can have further branches as well.

  • Go to the branches list
  • Click the branch name
  • Click "snapshot"
A snapshot made during the release of a MediaWiki version.

This might be unstable and is not guaranteed to work with the associated MediaWiki version.

After you've got the code, save it into the extensions/UniversalLanguageSelector directory of your wiki.

If you are familiar with git and have shell access to your server, you can obtain the extension, with all its tags and branches, as follows:

cd extensions
git clone https://gerrit.wikimedia.org/r/p/mediawiki/extensions/UniversalLanguageSelector.git

Installation[edit | edit source]

  • Download and extract the files in a directory called UniversalLanguageSelector in your extensions/ folder. If you're a developer and this extension is in a Git repository, then instead you should clone the repository.
  • Add the following code at the bottom of your LocalSettings.php:
require_once( "$IP/extensions/UniversalLanguageSelector/UniversalLanguageSelector.php" );
  • Done! Navigate to "Special:Version" on your wiki to verify that the extension is successfully installed.

Updating LanguageNameIndex[edit | edit source]

For performing cross language search, searching autonyms, language data needs to be populated. ULS comes with a pre-populated language name index(data/langnames.ser). In case you want to update it, install Extension:CLDR and update the data with the following command.

php UniversalLanguageSelector/data/LanguageNameIndexer.php

and verify that langnames.ser file gets generated in ULS/data/ folder.

Configuration[edit | edit source]

The following variables are created automatically during initialization and can be used from JavaScript using mw.config.get( NAME ):

  • wgULSLanguages - an associative array where the keys are language codes and the values are language names in English.
  • wgULSAcceptLanguageList - an array of language codes from the user's Accept-Language value. These are the languages selected in the user's browser preferences.

ULS uses jquery.i18n to load translation in JSON format with XHR. If your $wgExtensionAssetsPath is on different server this means it will attempt CORS (which means it is only supported on modern browsers). You need to configure Access-Control-Allow-Origin on your assets domain for this to work.

For serving fonts, you might want to add the following mime types to your webserver if not already there. This guide might help.

  • application/x-font-woff .woff
  • application/vnd.ms-fontobject .eot
  • application/x-font-ttf .ttf

The following variables can also be configured:

  • $wgULSGeoService- ULS can use geolocation services to suggest languages based on the country the user is vising from. Setting this to false will prevent builtin geolocation from being used. You can provide your own geolocation by setting window.Geo to object which has key 'country_code' or 'country'. If set to true, it will query Wikimedia's geoip service. The service should return jsonp that uses the supplied callback parameter. Defaults to http://freegeoip.net/json/ and expects the same format.
  • $wgULSEnable - Enable language selection, input methods and webfonts for everyone, unless the behavior is overridden by the configuration variables below. Even if false the classes and resource loader modules are registered for the use of other extensions. Language changing via cookie or setlang query parameter is not possible.
  • $wgULSAnonCanChangeLanguage - Allow anonymous users to change language with cookie and setlang query param. Do not use if you are caching anonymous page views without taking cookies into account.Does not have any effect if either of $wgULSEnable or $wgULSEnableAnon is set to false.
  • $wgULSIMEEnabled - Disable the input methods feature for all users by default. Can still be enabled manually by the user.
  • $wgULSPosition - The location and the form of the language selection trigger. The possible values are: personal: as a link near the username or the log in link in the personal toolbar (default). interlanguage: as an icon near the header of the list of interlanguage links in the sidebar.
  • $wgULSNoImeSelectors - Array of jQuery selectors of elements on which IME must not be enabled. eg: array( '#wpCaptchaWord' );

Position of ULS trigger[edit | edit source]

  • $wgULSPosition - The location and the form of the language selection trigger. The possible values are: personal: as a link near the username or the log in link in the personal toolbar (default). interlanguage: as an icon near the header of the list of interlanguage links in the sidebar.

It is also possible to have ULS trigger anywhere in the screen. An element with uls-settings-trigger will act as a ULS trigger.

Overriding default fonts[edit | edit source]

ULS has a large font repository to serve as webfonts. Sometimes there are multiple fonts for a language and there is a default font for each language/script. The order of fonts or default font can be overridden as follows using global scripts (MediaWiki:Common.js) or personal scripts (Special:MyPage/common.js):

$.webfonts.repository.languages.languageCode = ["system", "FontA", "FontB"];

Here, languageCode should be a valid language code(eg: en, hi, nl). FontA and FontB are fonts available in font repository. In the above example for languageCode, we set a font available in local computer as default font. ie No default webfont.

Caching configuration[edit | edit source]

To ensure that the web fonts files are cached on the clients' machines, font file types must be added to the web server configuration. In Apache2 this consists of:

  • Adding font file extensions to the FileTimes regex at FilesMatch for the relevant directory, example: <FilesMatch "\.(gif|jpe?g|png|css|js|woff|svg|eot|ttf)$">
  • Adding ExpiresByType values to the relevant MIME types, similarly to image MIME types.
    • Note that there's no standard MIME type for TTF. application/x-font-ttf is used for Wikimedia.
  • Adding the MIME types:
    • AddType application/x-woff .woff
    • AddType application/vnd.ms-fontobject .eot
    • AddType application/x-font-ttf .ttf

For a full example see the caching configuration update done for the Wikimedia cluster.

Page translation[edit | edit source]

UniversalLanguageSelector is one of the dependencies of the Translate extension, which uses it for several language selection features. One of it is the MyLanguage system for links, which depends on the interface language of the user, but more can be configured: see Help:Extension:Translate/Configuration#Page translation feature.

Using Webfonts[edit | edit source]

User can choose webfonts for a language from the Language settings -> Display settings. By default, the first font in that menu will be applied to the wiki. A user can change the font and it will be remembered across the pages. Optionally user can disable the font embedding too by selecting system font.

If the font is available in user's local system, font will not be downloaded from the mediawiki server. It will be taken from the user's computer. Otherwise, font will be downloaded from the server only once. ie when the user selects the font first time. Next time onwards, font will be taken from the local cache.

Alternate ways to load fonts[edit | edit source]

By specifying font-family[edit | edit source]

Inside the wiki text <span style="font-family:'YourFontName';">YourText</span>, webfonts extension will check whether the font is available with the extension, if so it will download it to the client. So the reader will not face any difficulty in reading the text even if the font specified is not available in their computer.

By specifying language[edit | edit source]

Inside the wiki text <span lang="my">YourText</span>, webfonts extension will check whether any font is available for the given language with the extension, if so it will download it to the client. So the reader will not face any difficulty in reading the text even if the font specified is not available in their computer. If there are multiple fonts for the language, the default font will be used. If default font is not preferred, use the font-family approach to specify the font. If the tag has both lang and font-family definitions, font-family get precedence.

Example:

<span lang=sux>π’„–π’‰ˆπ’…π’Œ¨π’…Ž</span>

gives the text rendered in Cuneiform using Akkadian font

π’„–π’‰ˆπ’…π’Œ¨π’…Ž

See also[edit | edit source]