Webmaker Workweek - Feb 2014 and right to left localization

It has been a while since my last blog post. I have been really busy working on localization on both Appmaker and Webmaker and figured that I should write some thing to report back as record to myself and share to anyone who is interested in localization.

February 3rd, 2014 we have a Webmaker workweek in Mozilla office Toronto where over 40 people from different team in Webmaker gather on hacking, and talking. We had a lot of great discussion and considered one of the most productive workweek so far!

Mostly in that week I try to focus on localization plan in 2014 for Webmaker and one of the priority for Webmaker localization in 2014 is RTL (Right to left) support. We had a great meeting/discussion with our front-end team (@gvn, @k88hudson), @TheRealPomax and @humphd on how to solve our problem with RTL UI support since our current implementation does not work with RTL languages.

What we came up with the solution to our problem by converting all of the CSS properties that uses directions and make it to the opposite.

Sample:

.className {
    float: right;
}

So what our library will do is creating another CSS file for RTL and change it to:

.className {
    float: left;
}

This is LTR (Left to right)

Now after the conversion we will have something like this:

Now it might look to you that this is pretty much completed and ready to ship on Webmaker, but we still need to work on a lot of polishing and making sure things that we might not know if it's the right way to do in some languages like Arabic, Urdu, or any languages in RTL, so we are going to work with the community to get help on reviewing on work so we can ship this soon :)

So, primary I'm going to be focusing on getting this ready on our testing site in couple of weeks and hoping that we will have this ready on our production site as soon as we have the translation completed on our transifex project.