Your friendly JavaScript languages handler. ORB turns fastly and easily your website/project to multilingual.
MIT License
Your friendly JavaScript languages handler. ORB turns fastly and easily your website/project to multilingual.
Translates the page to given object language.
Syntax
orb.translateTo(Object language);
Example
orb.translateTo(pt_br);
Add orb="" parameter in all tags you want to support and give any names like an ID.
<h1 orb="welcome">Welcome to ORB</h1>
<a href="#" orb="english" onclick="orb.translateTo(en)">English</a>
<a href="#" orb="pt_br" onclick="orb.translateTo(pt_br)">Brazilian Portuguese</a>
Create a language file in src/languages/ folder. (e.g english.js) The _language property is required and must have the same name from the object (e.g en and _language: 'en').
en = {
_language: 'en',
welcome: 'Welcome to ORB',
english: 'English',
pt_br: 'Brazilian Portuguese'
};
The welcome, english and pt_br properties are targets and tells to ORB to switch to this texts in the tags that has this parameteres. That is, ORB will change the texts from orb="welcome", orb="english" and orb="pt_br" in the HTML elements. So, you must use the same names between these properties.
Now, you need to create another language file in src/languages/ folder. (e.g pt-br.js)
pt_br = {
_language: 'pt_br',
welcome: 'Seja bem vindo ao ORB',
english: 'Ingls',
pt_br: 'Portugus'
};
Back to the HTML file and insert before the body closed tag (</body>
) your language files and orb.js after that.
<script src="src/languages/english.js"></script>
<script src="src/languages/pt-br.js"></script>
<script src="src/orb.js"></script>
It's done!
The syntax is { html parameter name: 'value' }. So, put more parameters with values together separating these by commas from the others in your language object.
Putting a text and a title (caption) in a property named button:
button: {text: 'English', title: 'Switch to English'}
Putting a placeholder and a title in a property named inputName:
inputName: {placeholder: 'Type your name', title: 'Click and type your name.'}
For the ORB can be work fine to identify and load automatically the language available based on the user browser language in their first access you need to respect the ISO language code table when you give the name to your language object and _language property. You can check the table here.
Select the language code as you want, replace the - (hyphen) to _ (underscore) and put it in lowercase.
pt-BR to pt_br
pt_br = {
_language: 'pt_br'
};
Contributions are always welcome. Keep the code more simple as you can and indent it using 2 spaces size.
Before you writing anything, feature or bug fix:
So, let's go:
After your pull request is merged, you can safely delete your branch.