CODEWITHSUNDEEP
javascriptlocalization
Daniel Magliola
Daniel Magliola

Reputation: 32412

How to do localizable javascript?

I have a web application that uses TONS of javascript, and as usual, there are a lot of textual constants that will be displayed to the user embedded in the code itself.

What do you think is the best way to make this localizable?
I know I need to take those strings off of the code and replace them with constants, which will be defined into some external place.

For the server side, ASP.Net provides some very neat capabilities for dealing with this.
What's the best to do this in Javascript?

The best idea I have is to have a JS file with ALL the string constants of the JS of the site (i'd have different copies of this, for each language), and then on each page, I include this script first, before all the others.
This seems like the most centralized way, that also wastes the least bandwidth.

Are there any other better approaches?

Thanks!

Upvotes: 0

Views: 757

Answers (5)

Amir E. Aharoni
Amir E. Aharoni

Reputation: 1318

There's a library for localizing JavaScript applications: https://github.com/wikimedia/jquery.i18n

The strings are stored in JSON files, as pretty much everybody else suggests, but it has a few more features:

It can do parameter replacement, supports gender (clever he/she handling), number (clever plural handling, including languages that have more than one plural form), and custom grammar rules that some languages need.

The only requirement is jQuery.

Upvotes: 0

Sachin
Sachin

Reputation: 343

here's how we did it (in ASP.net), pretty much along the lines of what you've mentioned: 1) Created two javascript files: one which defines all javascript functions/DOM manipulations as required by the site, and, second called Messages.js: this defines all the string literals that need to be localized, something like var ALERT_MSG = "Alert message in english".

2) Created different version of the Messages.js, one for each locale that we are supporting and localized the strings. The localized js files were named using messages.locale.js naming convention (for eg. messages.fr-FR.js).

3) Included the js files within the "ScriptManager" and provided the ResourceUICultures for the Messages.js file: this ensures that the correct localized file is embedded in the html output (if you are not using ASP.net you can build this basic functionality by doing some culture sniffing and including the appropriate js file).

4) Voila!

Upvotes: 2

Nosredna
Nosredna

Reputation: 86336

Your approach makes sense. Details:

I'd have the strings for each language in an object.

localized={"cat":"chat","dog":"chien"};

Then in code:

localized["cat"]

The quotations around of the keys and the array notation (rather than the more common object dot notation) are to avoid collisions with JavaScript reserved words.

Upvotes: 2

Sorin Mocanu
Sorin Mocanu

Reputation: 946

Your approach sounds good enough.

If you have lots of strings and you are concerned about the bulkiness of the file you may want to consider a script that creates a single javascript file for each language by concatenating the code javascript and the locale javascript and then applying something like Minify.

You'll waste some CPU cycles on publishing but you'll save some round trips...

Upvotes: 1

Sinan Ünür
Sinan Ünür

Reputation: 118166

There is a gettext library but I haven't used it.

Upvotes: 1

Related Questions