Internationalization and Right-To-Left Support in VisualEditor

Name and contact information

Name: Moriel Schottlender
Email: moo@smarterthanthat.com
IRC or IM networks/handle(s): mooeypoo
Location: New York City (Originally Israel)

Synopsis

Tracked in Phabricator
Task T35126

I propose working on a series of improvements to VisualEditor concentrating on support for RTL languages like Hebrew, Arabic, Persian and Pashto. There is already a need to add this support and a large part of it is defined in the article "Bidirectional text requirements"

Mentors

Amir E. Aharoni from the Internationalization team and Inez Korczynski from the VisualEditor team.

Deliverables

A toolbar button for changing language direction (similar to OpenOffice, Word and GoogleDocs)
Page-level and paragraph-level support for RTL languages
Inline support for RTL .^[1]
<bidi> element support for element isolation in articles that contain more than one language
(Investigation) Develop a language inspector^[2]
(Investigation) Keyboard support for changing direction with Control-Shift

Roadmap

Stage 1:

Familiarize myself with VisualEditor and its components and plugins
Investigate common RTL issues
- Studying the RTL/Bidirectional issues in Mediawiki Bugzilla Bug 745 - RTL/bidirectional issues
Investigate available RTL solutions in other JavaScript-based editors (if exists)

Stage 2:

Add a toolbar button for directionality
- Add and test page-level RTL/LTR switching support for multiple browsers
Begin work on inline-support and paragraph-support
- Investigate test cases of RTL issues and common problems
- Investigate the implementation of <bdi> tag support^[3]

Stage 3:

Implement paragraph- and inline- support
TEST TEST TEST! Verify RTL works for regular and fringe cases
Produce documentation for future development
(Investigation) Add keyboard-support if possible; Control-Shift to switch directionality

About you

I am originally from Israel, now living in New York City while I get my Masters in Computer Science. My bachelor's is in Physics, and I'm quite passionate about the link between the two!

Being a native Hebrew speaker, RTL support is a recurring issue that's definitely close to my heart and I'd love to contribute to the community and help improving it.

Participation

I'd love to work with the VisualEditor team as well as with the internationalization team, as this is a project that touches both. A huge group that already deals with many of the RTL issues would be the MediaWiki/he.

I plan to update my blog with status reports and my MediaWiki user page with updates, test cases, proposed solutions and walkthroughs.

Past open source experience

I've worked with JavaScript and jQuery before quite extensively. One of the main side-projects I've been working on is a Metro UI Windows 8 app (JavaScript/HTML5) and I've created a couple of small jQuery-based tools. I've also worked with php and programmed a couple of extension to small CMS systems. These are available on my GitHub page.

Any other info

I will be fully available for GSoC work through the summer. I will take a summer course, but it will only be twice a week, and since I work during weekends as well, I will more than compensate for the lost time.

I used to work full-time job with a much higher course-load (during a full semester), so this summer-course should not interfere with the project.

Comment: I am an International Student (work through CPT) and my summer vacation officially ends around September 1st. International students have slightly different work-related laws; we are allowed to work 40-hours a week during semester breaks, but only 20-hours a week during a semester, and only with special approval. I hope this will not be a problem.

Contributions

Tracked in Phabricator
Task T49717
Resolved

Tracked in Phabricator
Task T38032
Resolved

Tracked in Phabricator
Task T47585
Resolved

Tracked in Phabricator
Task T50185
Resolved

Tracked in Phabricator
Task T40546
Resolved

I have started submitting bug fixes to MediaWiki and extensions, including VisualEditor:

Project Updates

Weekly and ongoing project updates are available here.

Monthly Report: June 2013

I've been working on delving into the VisualEditor code and setting up the groundwork for directionality support. I concentrated on two urgent RTL bugs and the fixes ended up being a much more encompassing solutions to RTL issues. A bug with link popup not appearing in RTL gave me some insight into a problem with CSS flipping. While CSSJanus flips directionality inside CSS classes, most of the positioning of VisualEditor elements is done dynamically. I wrote a blog post about this particular confusion. The fix for this involved adding a core helper function to calculate RTL mirrored positions, and to add directionality support in iframes. The second bug involved visual arrangement of grid elements inside panels. I ended up correcting the positions for grids, icons and buttons, which also fixed the problem outside that specific bug. The next step is to begin work on a Language Inspector prototype, and I hope to have that done by the next report.

Monthly Report: July 2013

The Language Inspector prototype is ready and is now in the process of being reviewed, and hopefully be merged before Wikimania next week. The inspector is bsaed off of the Link inspector and is, for the moment, working on inline text only. The language selection is done through the UniversalLanguageSelector interface, where the directionality is automatically detected as 'ltr' or 'rtl'. I've also been working on rtl-related bug fixes in preparation for the deployment of VisualEditor in the hebrew Wikipedia, like corrections to the category autocompleter, category popups positioning, and image insertion so images are aligned based on the Wiki default. Finally, I've developed a TemplateData Generator extension that allows users to edit or generate VisualEditor's <templatedata> json segments with a GUI-driven system. This is especially important for RTL users, since writing json with right-to-left languages is incredibly challenging. The next steps for the project is to extend the functionality of the Language Inspector so it allows for directionality changes in paragraphs, lists and sections.

Monthly Report: August 2013

There's been quite a lot of progress on the Language Inspector development in the past month. First, the inline Language Inspector went live in MediaWiki.org, and is even in use, which is incredibly awesome. I've moved on to a block language inspector, which will add <div> to blocks of text. There are a couple of issues that we need to resolve regarding proper expected behavior and technical approach, but overall it is moving along in a steady pace. The TemplateData Generator extension has become a MediaWiki gadget - using the exact same code - so we can start testing it on live wikis with limited test group. It was also linked through the Hebrew Wikipedia, and a group is testing it there as well. There were quite a number of RTL bugs that were fixed this month, moving us forward to better RTL handling. I've spent a week in San Francisco on the invitation of the VisualEditor team, and I've had an absolute blast! I've met the team, hung out, and, most importantly, worked on the code together and got quite a number of one-on-one lectures (whiteboards are great) abotu the structure of VisualEditor that helped me move on to the next piece of the project. My thanks to the team and everyone I met in San Francisco, you are all awesome!

Finally, I've published a new blog post detailing some of the hardships when dealing with bidirectional string online that may help users understand why this subject can be so tricky, and why we need unique language treatments.

Footnotes

[1] VisualEditor Bidirectional Text Requirements - Examples and Specs for RTL Inline Support

[2] Bug 47759 - VisualEditor: Provide a language inspector to handle blocks and similar

[3] Bugzilla Bug 31817 - The <bdi> tag is sanitized

[1]

[2]

[3]

VisualEditor/RTL support, GSoC 2013

Contents