Come learn about FirefoxOS at MobiDevDay Detroit

I’m excited to announce that I will be presenting at MobiDevDay Detroit on May 4th on the topic of Firefox OS.

FirefoxOS is Mozilla’s new mobile operating system, based entirely on web technology. FirefoxOS will bring full device capabilities to the web stack, allowing web developers to create immersive experiences in a cross-platform and device agnostic manner.

This talk will briefly cover the motivations of FirefoxOS and then dive in to the new technology and APIs that are being opened up to developers who are looking to create apps for FirefoxOS.

MobiDevDay Detroit was the first conference of its kind. Now in its third year, MobiDevDay is dedicated to bringing the world of Mobile to Michigan’s Software Developer Community. We hope to grow MobiDevDay Detroit into the most important polyglot Mobile Developer conference in the world.

MobiDevDay Detroit 2013 will be held at the Cobo Conference Center on May 4th.

Breakfast, Lunch and Free Parking will be provided.

Register today for the conference before it sells out. I’ll share more details about my talk as the date gets closer.

Ludicrous Speed, GO!

There’s another new feature in today’s build of Firefox Nightly that I want to call attention to.

In Firefox Aurora, web developers can adjust the speed that HTML5 videos are playing at using the mediaElement.playbackRate API. This API lets websites control the speed that videos play at, whether they are in slow-motion, normal, or high-speed.

Starting today in Firefox Nightly, you can adjust the speed that videos play without needing to know JavaScript. To try this out, right-click on a video and enter the Play Speed menu:

The menu, implemented by darkowlzz, allows the user to change the playback to one of four speeds:

• Slow Motion (0.5×)
• Normal Speed
• High Speed (1.5×)
• and … Ludicrous Speed (2×)

I should note that there is still one remaining bug with the feature. Videos that are switched to the non-default playback speed will not switch back to Normal Speed using the context menu. This bug is on file and will need to be fixed before we can ship this feature on our Release channel. A simple workaround is to seek the video, as that will reset the playback speed.

Improved plain-text handling in Firefox

If you’ve ever tried to read a plain-text file in Firefox, you may have noticed that we didn’t have an option to apply word wrapping to the text. New in today’s Firefox Nightly build, we are now applying word wrap to plain text documents by default.

For example, this file is very hard to read when the lines aren’t wrapped. The lines scroll offscreen horizontally, and the user has to use the horizontal scrollbar on the bottom of the screen to read the file (yuck!). Here’s a screenshot of what I’m talking about:

Long lines are not wrapped

With word wrapping applied, the text is much easier to read and the line length will adapt to the size of the browser window:

With long lines wrapped

Some documents aren’t ideal for word wrapping, and to aid that we have made it easy to disable the feature. To toggle whether the document is wrapped on a case-by-case basis, you can change between the “Wrap Long Lines” stylesheet and “No Style”.

If you’d like to disable the feature entirely, you can go to about:config and set the plain_text.wrap_long_lines preference to false.

Theme changes for Mozilla developers

Within the past couple weeks there have been two significant changes to the theme structure within the mozilla-central repository.

First, Matthew Noorenberghe landed a change to add a shared theme directory under /browser/themes/. This theme directory has files with a .inc.css extension, and are included by all three of our tier-1 themes.

This change will greatly reduce code duplication in our front-end CSS files. For many developers, it was too easy to make a change to one of the platforms without remembering to make the same changes to other platforms.

This change should also allow us to move faster when updating our theme as we have less code to touch and don’t have to double- and triple-check our changes to make sure we replicated everything correctly.

The second change landed a few days ago and was written by myself. This change renamed our themes to better match their target platforms. The previous names of the themes were pinstripe, winstripe, gnomestripe. The new names are osx, windows, linux, respectively. This change applied to the themes in /toolkit/themes and /browser/themes.

This change should make approaching theme developer easier for new contributors. The pinstripe name correlates to the pinstripes from the Aqua user interface in early versions of OS X. The winstripe and gnomestripe names were really just a play on the pinstripe name. A pun based on an obscure history isn’t great for newcomers (or old-timers ), so hopefully this change will help make it clearer.

A couple changes (potentially) coming down the pipeline:

Dão Gottwald is working on renaming the linux theme to linux_gtk to better clarify that it applies to gtk builds.

Justin Dolske is working on bringing Matthew Noorenberghe’s /browser changes to /toolkit. This will create shared theme resources for /toolkit/themes. Another change being worked on by Justin will move all children of /toolkit/themes/*/global/* to /toolkit/themes/*/*, since the “global” subdirectory doesn’t bring much benefits.

Some of these changes will help us implement the Australis redesign faster, but more importantly they will help new contributors who are approaching front-end development.

By golly, we’re getting somewhere… (cross-post)

Raymond Heldt wrote up a great, and funny, blog post covering the current progress of the MSU Capstone project to implement Safari-style pinch-to-zoom for desktop Firefox. While working on the project, the students learned that there are similar plans to implement this feature for Firefox on Windows Metro.

The Windows Metro implementation is planning to use off-main-thread compositing and B2G’s AsyncPanZoomController implementation. The students are pushing ahead on their <canvas> based approach, since OMTC and AsyncZoomPanController are not fully ported to desktop builds.

Below is a snippet of Raymond’s post.

Well, the day started out with another abandon-my-attempt-at-implementing-something-because-it-already-got-it-taken-care-of-without-me moment, but beyond that, I was happy with my contributions today.

A scaling screenshot on pinch-to-zoom has been implemented (no thanks to myself), but for some absolutely insane reason, sometimes that screenshot gets drawn over the webpage’s content, sometimes not (although you can see animation through the “holes” of a webpage where they put advertisement boxes). Michigan State’s website scales fine, mxr.mozilla.org scales fine, Yahoo! sometimes scales fine DEPENDING ON WHICH CURRENT EVENT STORY IS CURRENTLY BEING DISPLAYED!!!, and then there’s websites that don’t hide the content and cover up the animation, like Amazon and Google and our CSE498 page on Michigan State’s website. Weird, I know.

But anyway, back to what I did. Figuring out some algorithms for x- and y- offset, I was able to get zooming relative to the center of the screen (adjusting for scrolling) instead of from the top-left corner. …

Head over to Raymond’s blog to read the full post.

February 2013 Firefox Desktop Work Week

Firefox Work Weeks Rock!

Last week I was in Toronto, ON with the rest of the Firefox Desktop team. We met for a week and discussed a number of topics that we want to get moving in Q1 and Q2 of 2013.

On Monday we had a 2013 overview by Johnath where he gave a similar talk that he has been doing at the MozCamps around the world. This was nice for us because it is not often that we get to see how Firefox and Mozilla are talked about at these events (I was lucky enough to attend the MozCamp in Poland in 2012 though).

We also got a deep dive in to the various personas of Firefox users in a presentation given by Bill Selman. Bill talked about there being seven distinct groups that users fall into. These range from “evergreens” to “wizards”, and we talked about what features to add/remove to help these users, as well as how to go about making changes to the software so as not to adversely affect these users.

Photo by DoNotLick, and used under a CC license.

On Tuesday we did an “ideation” activity, also known as brain storming , where we wrote down ideas of things that we would like to change with Firefox. After writing these down on post-it notes, we then grouped them together with other like-minded ideas on the wall and named the groups. On Tuesday afternoon we paired up in small teams to try to tackle some of these issues.

I spent Wednesday, Thursday, and Friday focusing on three small projects.

On Wednesday I worked with Dão Gottwald and Felipe Gomes on a simple slow start-up feature. The feature works by keeping track of the previous 5 start-up times. If the average startup time is greater than our threshold (currently 1 minute, with plans to lower it), then we will show a notification bar at the bottom of the browser window.

With help from Matej Novak, we got some nice whimsical text for the notification bar. When the user clicks on the “Learn how to speed it up” button, they are taken to a page on SUMO that can guide them towards a faster start-up time. Not pictured in the below screenshot, but part of the feature, is a second button that says “Don’t tell me again”. Stephen Horlander created the turtle icon.

On Thursday I worked with Stephen Horlander to see what parts of our user interface can have animation added to them. I wanted to work on a feature that is toggled often, thus having higher visibility. Stephen spent some time looking at transitioning the site-identity information in our location bar, and I spent some time working on adding a transition for the Find toolbar. You can follow along with my work in bug 836867.

A project that I had started a while ago but never finished was a refresh of Firefox’ in-content error pages. I got a few requests to resume that work and on Friday I unbitrotted Blair’s patch for bug 676795. That work is now awaiting Blair’s feedback and I’ll keep working on the bug when I get time.

On Friday night, I went with Paolo Amadini and Marco Bonardo to see the Johnson Report’s concert (starring the Firefox desktop team’s own Mike Conley on the guitar). The concert was at Lee’s Palace on Bloor St, and I must say that Mike and his band had an amazing performance. A funny kicker to the story is that each attendee to the show got a raffle ticket. Paolo, Marco, and I left early to catch the midnight subway back to the hotel and gave our raffle tickets to Mike’s girlfriend. We found out on Monday that she won the guitar!

Customization panel, where are you?

As a hat tip towards Matthew Noorenberghe who has been working on implementing the Australis tabs for Firefox, I decided it would be a good idea to give an update on the progress of the new customization panel for desktop Firefox.

Back in July 2012, Blair McBride starting working on the new customization panel in bug 770135. This task is a major rewrite of Firefox’ customization and application menu interaction. It is by no means a small feat. From July to today, Blair has made amazing progress on the customization panel.

Zhenshuo Fang and others on the Firefox UX team have put together an overview of the goals of the Australis Customization features if you would like to learn more background about them.

Blake Winton of the Firefox UX team has built an interactive mockup of the new menu and customization interactions that runs right in Firefox.

Last week Is started helping Blair bring the implementation of the new customization and menu to completion. Blair’s availability has been extremely limited for the past couple months, so it will be good to get some extra hands on deck.

I updated Blair’s patches to work against the latest mozilla-central code and have pushed them to the try server to get builds out to people that want to play with it. I only generated builds for Windows and Mac for this first pass.