html -> php for add gettext multilingue

[bencharp]

Hello Michiel,

It's not a pull request, it's just for that you could take a look.
For me, it was mainly to experiment and apply gettext in a real project.
I don't know if that can be useful for you.

thanks of your reply

benoit

[nilclass]

libredocs is a pure client-side app, so I don't see the point of adding PHP as a backend-requirement just for internationalization :). But you could take a look at the various Javascript I18n libraries out there, e.g. http://code.google.com/p/jquery-i18n-properties/

[michielbdejong]

cool stuff!! we need to do this on the client-side, though, because
this is an unhosted web app, so there is no server-side where we can
run any php :)

libredocs.org is hosted on 5apps, it's pure html5 and there is no way
to use php there.

we do run a hosted 'collaboration server' which acts as a proxy to
allow others to cooperate on a pad, and that's running nodejs, but
it's not part of libredocs as such (it runs gh:azul/etherpad-lite)

i'll think about it some more about how we can add translations to libredocs!

On Mon, May 21, 2012 at 1:16 AM, Benoît
[email protected]
wrote:

Hello Michiel,

It's not a pull request, it's just for that you could take a look.
For me, it was mainly to experiment and apply gettext in a real project.
I don't know if that can be useful for you.

thanks of your reply

benoit

You can merge this Pull Request by running:

 git pull https://github.com/bencharp/libredocs master

Or you can view, comment on it, or merge it online at:

 #8

-- Commit Summary --

• French trad & CSS adjutement
• html -> php for Gettext multilingue gestion

-- File Changes --

M .gitignore (4)
A SpecRunner.php (0)
M css/custom.css (15)
R dialog.php (7)
D documents.html (9)
A documents.php (12)
R goToStep.php (9)
R index.php (19)
M js/load.js (2)
M js/welcome.js (2)
A locale/en_US.utf8/LC_MESSAGES/default.mo (0)
A locale/en_US.utf8/LC_MESSAGES/default.po (110)
A locale/fr_FR.utf8/LC_MESSAGES/default.mo (0)
A locale/fr_FR.utf8/LC_MESSAGES/default.po (119)
A localization.php (12)
A menu_lang.php (9)
M old/handler.js (2)
D reset.html (13)
A reset.php (16)
A session.php (8)
R webodf.php (9)
D welcome.html (36)
A welcome.php (39)

-- Patch Links --

 https://github.com/unhosted/libredocs/pull/8.patch
 https://github.com/unhosted/libredocs/pull/8.diff

---

Reply to this email directly or view it on GitHub:
#8

[bencharp]

Niklas, Michiel,
thanks for your comments

I'll take the time to study Javascript I18n libraries and trying to better understand all that stuff...

Thanks again for your attention

[nilclass]

Feel free to drop in #unhosted channel on freenode if you have any questions.

[jancborchardt]

For Libre Projects, @jhuet wrote Javascript powered translation using JSON files with simple "English":"New language" syntax.

[bencharp]

Javascript is still a bit obscure to me, I'll studied the code of LibreProjects carefully.
thanks for sharing

[bencharp]

I've tested the script from "LibreProjects" proposed by @huet.
The translation works for text in the index.html file but not with text in welcome.html file.
I more or less understood how the script works but my Javascript knowledges are too light, I don't find what's missing for take over the texts from all files…

I would need some tracks

Thanks

[nilclass]

Ok, lets see.

1. The translation keys are loaded only once (within initTranslation), which is just called once, when the document is loaded. That means all $('.translatable')s that are loaded / created later via ajax, vodoo or whatever will not work.

2. You are storing the current locale in a cookie. This works, but is not ideal, as there's no reason to send the locale to the server, that is never going to (or supposed to) do anything with that information. That's what localStorage is for.

3. default.js isn't the most ideal name, but you probably know that :)

4. Please wrap your code in an anonymous function, such as this:

(function() {
  // your code here
})();

That way you can declare all kinds of variables within that function without exposing them to any other code. Reduces the risk of name clashes and is presumably going to bring world peace.

However, as we're using jQuery you should use the following variant of the above:

(function($) {

 // your code here

})(jQuery);

that way your code still works, even if jQuery.noConflict() is used.

As for points (1) and (2), see nilclass/libredocs@e5d4656

Hope this helps a bit.

[nilclass]

Oh, another point: you should think about using "real" translation keys instead of just using the original English text as such. That brings the following benefits:
a) Translations don't break if the English text changes (yes, I know there is a separate English translation, but still...)
b) Designated keys can be given structure (e.g. a key like "welcome_page.title" says a lot more about where the translation needs to make sense than "Liberate your ideas" (which could in theory also be used in different places with different meanings, that might require different translations in some languages. bad example, hope you get the point))
c) the translation file will get way shorter.

That way you could also get rid of that whole $element.data('translatable') and .translatable business and instead use $element.attr('data-i18n-key') / $('*[data-i18n-key]') or whatever you see fit.

[jhuet]

Thanks for all your inputs, i really appreciate it as i knew i surely didn't use the best way to do client-side translation since the beginning anyway :)

There's also variable handling that needs to be taken into consideration for having a complete translation process. Like, if i want to translate : Welcome bencharp, how are you doing ? and have bencharp change depending on the connected person. We started to have a look at that on this issue over at Libre Projects and found 2 javascript libraries that could help :

• http://code.google.com/p/gettext-js/
• http://freecode.com/projects/jsgettext

Hopefully it'll help you too !

[nilclass]

Another option for variable handling would be to use a simple template engine, such as _.template or mustache, which would allow conditionals in translations, which might be useful.

[bencharp]

Here some news.
I've tested differents javascript libraries as i18n.js, i18next.js, gettext.js, jQuery.i18n.js and none seems enough simple to implement.

In my dream, I'm looking for a solution easily to graft in any project and where the languages files could be translated with Gettext.
much like the solution I've tried to tinker in PHP.
In the meantime I'll try to see how is working mustache.

[michielbdejong]

cool! let us know how it goes. it would be really nice to have Libre
Docs internationalized. i aim to do a Libre Docs sprint again myself,
maybe in August

On Thu, Jun 7, 2012 at 4:06 PM, Benoît
[email protected]
wrote:

Here some news.
I've tested differents javascript libraries as i18n.js, i18next.js, gettext.js, jQuery.i18n.js  and none seems enough simple to implement.

In my dream, I'm looking for a solution easily to graft in any project and where the languages files could be translated with Gettext.
much like the solution I've tried to tinker in PHP.
In the meantime I'll try to see how is working mustache.

---

Reply to this email directly or view it on GitHub:
#8 (comment)