Cubed Mail

Lately I’ve been working a lot on the Thunderbird add-ons developers user experience.  Often times designers don’t get to work on developer experiences because developers tend to do those pieces themselves without much design.  With a lot of others I’ve spent a good amount of time working on the whole experience of development, docs, and extension types so hopefully the Thunderbird 3 add-on developer experience will be significantly better.

To get into the user experience of an add-on developer I recently made a Jetpack, Bugzilla Air Traffic Control, to examine what it is like to develop inside Jetpack.  I’ve also been creating a number of example extensions that take advantage of the new code that has landed in Thunderbird recently and learn the pitfalls of extension development.

So in honor of the hacks.mozilla.org recent article called 3D transforms in Firefox 3.5 – the isocube I added a similar hack to my tabbed message example extension.  I give you…

Cubed Email Messages

messages-in-a-cube

To demonstrate the awesome interactiveness that I didn’t add to my email extension I also have a pure HTML demo available.   Try out the email cube test demo for yourself.  This demo requires Firefox 3.5, go get it if you don’t have it.

If you’re asking “why email in a cube,?” then I’ll ask you why not?  This demo reminds me that Thunderbird has all the same Firefox goodness that’s coming out in 3.5 but we have yet to take advantage of much of it.  Hopefully as we make more progress in the coming months we’ll do just that.

And if you’re asking yourself… Is this what Bryan gets paid to do?  Well then we’re asking ourselves the same question; though I don’t think I’m referring to myself in the third person.

The pattern is not full

This past Friday I made my first Jetpack and on Sunday while lazily waiting for chores to finish themselves I posted my Jetpack on userscripts.org.

Bugzilla – Air Traffic Control

For Jetpackers a mid-air collision is an especially scary thing.

Mid-air collision!

So this Jetpack does a pretty simple thing to help you avoid the mid-air collision by notifying you before it’s about to happen.

Mid-air collision warning

For every tab you have with a bug open this Jetpack does a simple check in the background to see if someone else has modified the bug while you were looking at it.

Code

The code for this is pretty simple and in total it probably took me only an hour to get up and running and then a bunch more time polishing things off.  Here’s the break down.

I have a simple regex to find urls that are showing a bug:

var show_bug_regex = /^https:\/\/bugzilla\.mozilla\.org\/show_bug\.cgi\?id=(\d+)/;

Then I check if the url matches whenever a new page is loaded in a tab:

jetpack.tabs.onReady(function(doc) {
  // here we setup our persistent check
  var match = this.url.match(show_bug_regex);
  if (match) {
    init(this);
    this.bug_id = match[1];
    startCheckingTab(this);
  }
});

Also for good measure I do a similar check when a tab is focused, in case the Jetpack wasn’t installed or running during the original load.

jetpack.tabs.onFocus(function() {
  // here we just double check out status
  var match = this.url.match(show_bug_regex);
  if (match) {

    /* if we've already notified then we aren't checking anymore */
    if ( alreadyNotifiedTab(this) )
      return;

    if ( ! areCheckingTab(this) ) {
      // they focused a url match that we haven't been checking!
      init(this);
      this.bug_id = match[1];
      startCheckingTab(this);
    } else {
      resetCheckingTabInterval(this);
    }
  }
});

The start checking function simply runs an ajax request against the bug on an interval.  All that was needed for this was to know if the bug had changed from the last time we looked so we build a url that only retrieves the delta_ts field to create a Date object.

"https://bugzilla.mozilla.org/show_bug.cgi?id=" + bug_id +  "&ctype=xml&field=delta_ts";

That’s about it.  If you want to check out the source or install it yourself you can go to the Bugzilla – Air Traffic Control page at userscripts.

aboot

This is the blog personality of Bryan Clark. I'm a designer in a world of open source. This blog reflects mostly writing about Design, Open Source, Economics, Beer, Wine, and Dogs. There's more information about me on this site or you can contact me directly at clarkbw@gmail.com.

scategories