Translator |
This API is used for language internationalization of the Process Platform Ajax Toolkit Web pages.
Syntax
HTML |
<div cordysType="wcp.library.util.Translator" id="listID"> <div/> </div> |
The translator component translates the Process Platform Web pages to different languages that are defined in an XML source file called dictionary. The dictionary file is of the type .translation
and contains various HTML tags used in the page and the language equivalents that are supported by the Process Platform Ajax Toolkit.
The component loads the dictionary file for that page from the URL given by the dictionary property. The translator, on becoming active uses the language specifications from the default browser settings to convert the tokens in the HTML page to the language specified in the user settings or by the user.
To translate an HTML page, the tokens in the page that needs to be translated must contain a property translatable whose value can be set to true
as in the following <LABEL>tag.
HTML |
<LABEL translatable=true>This is a text</LABEL> |
If the text to be translated is too long, it can be referenced in the dictionary file using a label ID. In such cases, the tokens have an additional property label_id
set to the label in the dictionary file. The search is based on the label_id
and if it is not found, the default text is considered. The label_id
can contain the text to be translated or the label reference for a particular text. The following example shows how a translator can be used to translate text inside a shortcut menu item:
HTML |
|
The translatable strings can also contain HTML nodes inside them and it must be a valid XHTML string. This support is extended for the DIV and SPAN tags. The following example shows a DIV tag that can be translated to any language using the label_id
attribute:
HTML |
|
Following are the tags and the attributes that are considered by the translator component for translation:
Tags |
Attributes |
---|---|
BUTTON |
Translatable attribute is innerHTML |
INPUT |
Translatable attribute is value. In addition, if type=image, then the image (src attribute) can also be changed according to different languages |
IMAGE |
Translatable attribute is src |
HTML Heading tags (H1, H2, H3, H4, H5 and H6) |
Translatable attribute is innerText |
LABEL |
Translatable attribute is innerText |
OPTION |
Translatable attribute is innerText |
menuitem |
Translatable attribute is innerText |
DIV and SPAN |
Translatable attribute is innerHTML |
common |
Attributes such as |
In addition, the translator is extended to register any dynamic tag that is created by the HTML components. With this feature, a developer can register any HTML tag or attributes that are not specified above. These elements are considered by the translator for translation at the runtime by calling the registerTag()
method.
To dynamically add and initialize this component, you can use the initializeHTMLElements
or addType
methods of the application object.
The various properties, methods, and events that are defined for the translator component are as follows:
Table 1. List of Attributes
Attribute |
Property |
Description |
---|---|---|
active |
active |
String that denotes whether the translator component is loaded and available for use. This is a
|
applicationLanguage |
applicationLanguage |
String that denotes the language in which the application is running. When translator is loaded for the first time, this property ensures that the translator is not run when the languages are the same. This property takes the same values as the |
dictionary |
String that denotes the URL of the dictionary XML file (defined as the page dictionary). |
|
id |
id |
String that denotes the unique identifier of the translator component. By default, this is translator. |
ontranslate |
Pointer to a function that will be executed each time before an element is being translated. |
|
newLanguage |
N/A |
Sets the |
Table 2. List of Methods
Method |
Description |
---|---|
appendDictionary(surl) |
Appends a dictionary to an application. The |
setMessageBundle(bundle) |
Sets the Message Bundle for the translator.The bundle can be a Javascript Message Bundle Path or <Messagebundle> Object. |
translateXML(xmlNode) |
Translates XML.The XML node specified with the translatable=true attribute is replaced with the translation in the current language. Alternatively, the text identifiers can be specified using the |
translateElement(element) | Translates an HTML element.The HTML element specified with the translatable= true attribute is replaced with the translation in the current language. |
Registers the element specified to the translator component |
|
Registers any HTML tag or attribute that are is considered by the translator for translation |
|
getNewLanguage |
Retrieves the value of the |
setNewLanguage |
Sets the |
getCordysTranslatedText(text) Deprecated |
Takes the text to be translated as an input, translates it to the current language the user is in, and returns the translated text. Use this API instead of the Use localization_get() for XForms and localization.get() for web pages. |
translate(text) Deprecated. Use |
Takes text to be translated as an input, translates it to the current language in which the user is in, and returns the translated text. |
Table 3. List of Events
Event |
Description |
---|---|
Fires when the translator component is fully loaded and ready to use |
|
Fires whenever there is a language change, which is when the |
Remarks
Process Platform Ajax Toolkit also comes with translator support enabled for the Explorer page in the Process Platform Site. The default dictionary URL for the daemon page of the Process Platform Site is given by the URL /cordys/wcp/admin/explorer.translation; this does not contain any data in it. The user can translate the Process Platform daemon page (Left tree) by appending the dictionary to the daemon page, which is as follows:
system.windows["Menu"].translator.appendDictionary(surl);
where surl
denotes the URL of the translator document.
Note:
- A dictionary file is stored with an extension .translation.
- To register items that are added dynamically (shortcut menus, tree items and so on), the
registerHTML()
method must be called. For example, while adding a dynamic shortcut menu, retrieve the element returned by theaddItem()
method of thecontextmenu
and call theregisterHTML()
method. - The
label_id
property does not support the translation of the tooltip and toolbar captions. To translate a tooltip or a toolbar caption or description, the text inside the tooltip or the toolbar caption or description itself is used. Tooltips can be defined using thetitle
property of HTML elements, thealt
property of IMG tags, or thetooltip
attribute of the validate component. - To translate an element, which has an attribute that is common to all HTML elements, the
registerTag()
method of the translator component can be called with thetagName
parameter as "" or null . Examples for such attributes arealt
,tooltip
, and so on.
Example
A demo page for the translator library demonstrates the use of this component. In this demo, a dictionary is attached to the page, which is used by the translator component to translate the Menu Item
, tree
, DIV
tags, and so on defined in the page.