Status Update 4 of Reader Mode for desktop Firefox

This post covers the previous two weeks of work on the desktop implementation of Reader Mode for Firefox.

Over the past two weeks the bugs that the students have been working on have been reduced in scale in an effort to work more in parallel.

The team has put together an about:reader page, blank for now, that will in the future be the page that is loaded to render the reader-friendly view of the page.

They have also been hard at work on getting the Readability library moved from the Firefox for Android codebase to a shared location where both Android and desktop versions of Firefox can reference it.

Work has begun on getting a button within the location bar that will be shown when a page is considered “reader-friendly”. At this point the students have added a preference named reader.enabled, which when enabled will always show the reader button.

This work hasn’t made it into mozilla-central yet, but it is moving towards it. The students have an alpha presentation coming up for their class where they will demo what they’ve gotten working so far.

If you’d like to follow along on the work, you can CC yourself to the tracking bug for this work, bug 558882.

Status Update 3 of Reader Mode for desktop Firefox

This week’s status update is a guest post written by Michael Anderson, one of the students working on the project.

This week the team worked on diving into the source code and actually progressing through the bugs.  For now the team worked together in order to place a button on the toolbar and make it pop up a window.

The team also created and presented the project proposal to their class which detailed the specs for the project as well as included screen mockups for the implementation.

Looking forward to next week the team is going to change the look and feel of the window that pops up when the reader button is clicked and fill it with the article content.

Notes from our meeting:

• No pre-built JavaScript frameworks should be used, too much maintenance and hassle, more worthwhile to do it yourself.
• Start with navigation approach first, then focus on light-box once that is implemented.
• Either put completely unchanged mode into common area or copy the code into the desktop and adapt it (Separate copies)
• Move Readability.js to a common area (toolkit/components)
• Different parts of firefox: browser, widgets, tabs, mobile, toolkit.
• Get the patch up for our code in the bug for the toolbar button
• Submit more bugs for the different parts of our code

Status Update 2 of Reader Mode for desktop Firefox

I’d like to start this status update off by introducing the team that is working on the project.

The students working on the project, from left to right, are Matt Vorce, Michael Anderson, Chelsea Carr, and Kevin Woodward.

This past week the students put together a roadmap of the semester, outlining their ideal progress and pace for the project.

The roadmap has the project nearing completion before Thanksgiving break, which is around November 22nd.

All four students now have their “first bugs” assigned to them and I believe that all of their bugs have now been fixed and have had their code pushed to mozilla-central.

The meta bug for tracking the work that the students will be doing is bug 558882, “Ship Readability in the browser.” I am planning on giving more bug-filing responsibility to the students this semester.

Here’s the minutes from today’s meeting that Matt typed up:

Things to do going forward:

Get something up and running ASAP. Do not focus on the HTML and CSS for the time being.

Ignore Sync at first until we have the reader mode working the way we want it.

After coming up with a sketch of how the user experience would work for reader mode try to run it by the User Experience team.

Create a user experience interaction diagram

Order of priorities:

Reader Mode > Reading List > Sync > Preferences

Task this week is to break up getting the basic reader mode done. Examples of how we might break it up:

One person get the button in the toolbar and make it create a basic popup

One person work on checking whether a webpage is compatible with the reader mode

One person work on getting a page to display correctly in the reader mode

Reader Mode for desktop Firefox may be here in 16 weeks

This past week started the beginning of another semester-long student project. You may remember that in Spring 2012, there was a similar project to implement in-content preferences for Firefox. There is still a little bit more work to do for in-content preferences, but it’s not too far away from being enabled by default in our Nightly builds [1].

This semester there will be four students from Michigan State University working on implementing a Reader Mode for desktop Firefox. Firefox for Android has a Reader Mode, and it’s something we’d like to bring to the desktop now.

Reader Mode is about bringing a smooth and beautiful reading experience to Firefox Mobile. It removes all the clutter from web pages and shows you only what you want to read in a minimalist UI.

Lucas Rocha of the Firefox for Android team is helping mentor the project with me. I’m very excited to have Lucas’ help, as he implemented Reader Mode once already and will bring to the table his valuable experience. Lucas is also very active in the community, helping new contributors get involved with Mozilla.

I plan to post weekly updates on the progress of the work that the students are doing. The project is running from 29 August to 5 December.

[1] The current work to bring the in-content preferences user interface up to par is being tracked in bug 754344.