.. | ||
examples | ||
src | ||
.gitignore | ||
build.xml | ||
jquery.i18n.js | ||
jquery.i18n.min.js | ||
LICENSE | ||
README.markdown | ||
VERSION |
About
jQuery-i18n is a jQuery plugin for doing client-side translations in javascript. It is based heavily on javascript i18n that almost doesn't suck by Marko Samastur, and is licensed under the MIT license.
Installation
You'll need to download the jQuery library, and include it before jquery.i18n.js in your HTML source. See the examples folder for examples.
Usage
Before you can do any translation you have to initialise the plugin with a 'dictionary' (basically a property list mapping keys to their translations).
var my_dictionary = {
'some text': 'a translation',
'some more text': 'another translation'
}
$.i18n.setDictionary(my_dictionary);
Once you've initialised it with a dictionary, you can translate strings using the $.i18n._() function, for example:
$('div#example').text($.i18n._('some text'));
or using $('selector')._t() function
$('div#example')._t('some text');
Wildcards
It's straightforward to pass dynamic data into your translations. First, add %s in the translation for each variable you want to swap in :
var my_dictionary = {
"wildcard example" : "We have been passed two values : %s and %s."
}
$.i18n.setDictionary(my_dictionary);
Next, pass an array of values in as the second argument when you perform the translation :
$('div#example').text($.i18n._('wildcard example', [100, 200]));
or
$('div#example')._t('wildcard example', [100, 200]);
This will output We have been passed two values : 100 and 200.
Because some languages will need to order arguments differently to english, you can also specify the order in which the variables appear :
var my_dictionary = {
"wildcard example" : "We have been passed two values : %2$s and %1$s."
}
$.i18n.setDictionary(my_dictionary);
$('div#example').text($.i18n._('wildcard example', [100, 200]));
This will output: We have been passed two values: 200 and 100.
Building From Scratch
You can build the regular, un-minified version simply by running ant:
$ ant
Buildfile: build.xml
jquery.i18n:
[echo] Building ./jquery.i18n.js
[echo] ./jquery.i18n.js built.
BUILD SUCCESSFUL
Total time: 0 seconds
Before you can build the minified version yourself, you'll need to download the Google Closure Compiler and put it in a folder called build:
$ mkdir build
$ cd build
$ wget http://closure-compiler.googlecode.com/files/compiler-latest.zip
$ unzip compiler-latest.zip
Once you have the compiler, you can build the minified version by running ant min:
$ ant min
Buildfile: build.xml
jquery.i18n:
[echo] Building ./jquery.i18n.js
[echo] ./jquery.i18n.js built.
min:
[echo] Building ./jquery.i18n.min.js
[apply] Applied java to 1 file and 0 directories.
[delete] Deleting: /Users/dave/Documents/Code/jquery/jquery-i18n/tmpmin
[echo] ./jquery.i18n.min.js built.
BUILD SUCCESSFUL
Total time: 1 second
Bug Reports
If you come across any problems, please create a ticket and we'll try to get it fixed as soon as possible.
Contributing
Once you've made your commits:
- Fork jquery-i18n
- Create a topic branch -
git checkout -b my_branch
- Push to your branch -
git push origin my_branch
- Create a Pull Request from your branch
- That's it!
Author
Dave Perrett :: mail@recursive-design.com :: @recurser
Copyright
Copyright (c) 2010 Dave Perrett. See License for details.