Jenny Gray: Internationalized Jquery – how?

… my next challenge!  If there are any JQuery / JavaScript experts reading this, I could do with some advice.

In OU Annotate the Manager part of the system uses the SilverStripe language pack system so that we could potentially offer the user interface in other languages if we wanted to – or if we ever open-source it.

The toolbar javascript up until recently had a fairly limited number of language strings and so they were all gathered in the definitions.js file.  But when I started integrating the code for the history pane and the search feature I realised that we’re now scattering language strings in a number of places in the system:

  • in the definitions file
  • in the views
  • in the controllers

The first two are arguably OK, but the latter really got me.  So I’d like to do something a bit more consistent about internationalization support for the toolbar.   I’d like to have a language file and use code like _t(‘thing’) in the views and controllers to display the appropriately translated text.

Which leads me to my dilemma.

The OU Annotate toolbar is based on JQuery, which doesn’t include language pack support by default beyond number formats, as far as I can tell.  There are a number of candidate plug-ins available that would add this functionality but I have very little JavaScript experience and don’t feel confident working out which one to choose.

There’s only one in the JQuery plugins register.  It’s only a couple of months old so its hard to tell if it is a flash in the pan, buggy etc.

I thought jquery-i18n-properties  looked good at first.  But the issues list has some nasties in it with problems like support in IE and on Android not resolved.  

I did some more searching and found a handful of other libraries and DIY instructions that might be useful but I haven’t dug into in any detail yet.

So, if you have experience with JavaScript internationalisation and JQuery, I’d love to hear your thoughts and experiences on this.

Jenny Gray: Internationalized Jquery – how?

Read more