w00t! 2009 World Champion Flex Bug Quasher!

So I "won" the Flex Bug Quash in Seattle last weekend.

Shouldn't Adobe fix their own bugs? Why work for free?

I don't. Adobe doesn't. I get paid to deliver engaging user experiences for our clients, and most of my development work is Flex based. I have benefitted from the great community of Flex developers and it's time to pay it forward a bit.

I use a fair bit of open source software in my work, and I think contributing to the source code base is a good thing. Plus, I also used the opportunity to fix a couple of bugs that had been causing me pain in past projects. So it was self-serving open source work?

Road Trip!

I help organize the monthly Vancouver Flash Platform Meetup with Ross Ladell. During a recent lunch, nay, drink we realized that the Bug Quash event was being hosted in Seattle, rather than in the Bay area like I had assumed. So we declared it road trip worthy, and I rented a van for the day. Well, EffectiveUI rented the van, aren't corporate cards wonderful?

A bunch of us Vancouver geeks drove down to the Adobe Seattle office to represent Canada. It was a pretty quick drive (border hassles not included) and a fun way (what a geek!) to spend a Saturday. Ross met us down there and the folks from The Active Network were also there. So about 10 of the 30-ish bodies in Seattle were from Vancouver. Nice.

I win!!! Umm ... define "win"

All of this hinges on a very loose & liberal definition of what "win" means. I submitted the most patches that day, 5 in total. So given that metric, I won.

A former boss told me to remember that "fair" and "simple" are at opposite ends of the spectrum. Simple systems usually aren't fair, and fair systems usually are complex.

So counting the number of patches submitted was the easiest thing for the Bug Quash organizers to do, they were already doing it so that we could all watch the big numbers go up as patches were submitted throughout the day.

But submitting a bunch of patches doesn't mean that I'm did a lot of work. I don't think I was the most productive quasher there. I'd much rather see a few really hard problems fixed in the SDK than have some submit a bunch of executable semi-colons.

So what did I fix?

But I really couldn't describe my contributions as huge or high visibility. I just stayed focused in one area of the SDK (DateFormatter and some related classes) and knocked out some low hanging fruit.

1) DateFormatter "HH" shows 24 not 00

SDK-16076 - This didn't even require a code change. It wasn't a bug. The "HH" pattern shows hours in 1-24, the "JJ" pattern shows hours in 0-23.

All the comments said "Not a bug. close it". So I submitted an empty patch with a comment of "then CLOSE it already!". My patch was was rejected as a bit of an abuse of patch submission system, but the bug was closed anyway. I wasn't trying to be a jerk, but there wasn't any other clear way to mark/flag the bug for review. I'm not fond of bug lists that contain a lot of noise.

Total bugs quashed: 1
Total lines of code changed: 0

2) Make DateFormatter.parseDateString() a static public method

SDK-16902 - Yup. All this involved was changing "protected" to "public". +2 for me!

Total bugs quashed: 2
Total lines of code changed: 1

3) Fixed CalendarLayoutChangeEvent ctor

SDK-18567 - I hit this bug a couple of weeks ago, while writing a custom calendar control. The constructor for the CalendarLayoutChangeEvent was ignoring some of its parameters (like the new date, ouch!) so the net effect was that you had to set the date property manually, after the event was constructed. This class was only used once inside the SDK and the flow of control through that method meant that the date property was always being set after the event was created. So the SDK was (inadvertently, I think) working around this bug.

In addition to this two line fix, I also reviewed the SDK code for all the other classes in mx.events.*, just to be sure that this pattern wasn't repeated elsewhere. Nope. That was the only gotcha I could find. Which makes sense, since the other event classes are heavily used within the framework and bugs like that would have been caught early on.

Total bugs quashed: 3
Total lines of code changed: 3

4) Fixed parsing of GMT+x date string

SDK-13650 - This one took a bit more digging, and a whole lot more thinking. The patch I submitted on BugQuash day was rightfully rejected the first time. It actually wasn't until I wrote this post that I noticed that my original patch was rejected.

The original test case was using the AdvancedDataGrid class, which is part of the closed-source data visualization library. That meant I couldn't test the fix with the 3.x branch, since there was no 3.x datavisualization.swc to link in.

So I punted and did a HailMary commit. Which broke. Ugh.

Thankfully, Alex posted a much simpler test case, one that didn't require the closed-source SWC, so I quickly fixed my fix (I had neglected to escape the plus-sign in a regular expression) and submitted a new patch.

Total bugs quashed: 4
Total lines of code changed: 4 (see the method to my madness yet?)

5) Programatic HTML markup of Labels gets lost when truncateToFit() triggers

SDK-14982 - This is a bug I hit and reported about a year ago. When I reported the bug, I also included a fix. If you've set any markup via the htmlText property and the label needs to be truncated, all the formatting gets lost. The fix still isn't 100% but it is better than before and it is not any slower in the success case.

Total bugs quashed: 5
Total lines of code changed: 19

Did I deserve to win? Don't get me wrong. I like trophies!

Oh, I'm keeping the title belt. I'm claiming the (self-assigned) title of "2009 World Champion Flex Bug Quasher", at least until someone else comes along to push me off the top of the hill, attention-whore that I am.

Thanks to all the little people!

Thanks to Adobe for putting on the event.
Thanks to all the fun folks we got to hang out with at the Seattle offices.
Thanks to the Vancouver devs for kicking ass and claiming "first blood" (way to go Myo!).
Thanks to Karl for helping me setup my dev environment so I could finally build the SDK properly.
Thanks to the US Border Patrol officers who joined in our let's-bash-MSoft-fest at the border (nice to get the lads with the sense of humor for a change).

Feed your inner ninja!

Have you registered yet for the Flex SDK Bug Quash on Saturday March 28th? That's just 2 weeks away.

The Vancouver Flash platform user's group is taking a road trip down to Seattle, so we can pwn in person!

You don't have to show up in person, you can also register online. Regardless, once you register, make sure you download the pre-event kit (link sent once you register) so that you are fully prepared and good-to-go when the event starts.


Looking forward to meeting more geeks and squashing some annoying bugs. Oh, and likely consuming a beverage or two.

More info available at http://www.bugquash.com/

Flash Player 10 & AIR for embedded devices - Adobe Open Screen Project FTW!

I recently had a chance to interview Adobe's Anuk Murarka about the Open Screen Project, which aims to deploy Flash Player 10 and AIR 1.5 to a number of embedded platforms: Mobile, set-top-boxes, kiosks, and more.

The interview is available here, at the UI Resource Center site. Enjoy.

Update: John Dowdell wrote a very concise summary of the interview here, for those of you with ADHD. :)

Happy New Year! And welcome back, Zune-sters!

Amazingly, someone has already determined the flaw causing all those Zunes to lock up today.

When I checked this MAKE magazine article describing the bug (part of the free runtime library provided by Freescale), all the code was rendered as left-aligned text in my browser.

year = ORIGINYEAR; /* = 1980 */

while (days > 365)
{
if (IsLeapYear(year))
{
if (days > 366)
{
days -= 366;
year += 1;
}
}
else
{
days -= 365;
year += 1;
}
}

I couldn't see the flaw. Can you?

I reformatted the code in TextMate, and the problem became apparent.

year = ORIGINYEAR; /* = 1980 */

while (days > 365)
{
  if (IsLeapYear(year))
  {
    if (days > 366)
    {
      days -= 366;
    year += 1;
    }
  }
  else
  {
    days -= 365;
    year += 1;
  }
}

Can you see it now? Thought so. I wonder how many people will complain about their Zombie-Zunes on Dec 31, 2012?

Free Flex and AIR resources? We can haz!

Free AIR and Flex training. Bring it on!

Fellow Vancouverite Duane Nickull informed me that the sessions he was running at both MAXen (MAXes? What is that the correct pluralization? Where's RubyOnRails when you need it!) are now available online.

The AIR Boot Camp session is intended to give you an overview of how you can leverage your existing Web developer tools to create desktop apps using the AIR platform, including the recently released AIR 1.5 runtime.

The Building Flex service clients session gives you an overview of consuming web services from a Flex app, with links to preconfigured WAMP and MAMP stacks to test against.

Also, make sure to check out the great Tour De Flex app, available both as a standalone AIR app, and an eclipse/FlexBuilder plugin.

Don't be fooled by the default view in Tour De Flex. At first glance Tour De Flex looks like a less full-featured version of the Flex Style Explorer, but check out that combo box that says "Flex Core Components". Other choices will reveal live apps and sample code for consuming well over a dozen popular clouds APIs like Twitter, Flickr, and Amazon, as well as demos/samples for Google/Yahoo/Mapquest maps.

Got something cool to share? Submit it to the Flex.org form and it may show up in the next publish phase.

Quickly change the font size in Eclipse: Handy for presentations!

The internet fairies were kind to me today.

Over a year ago I whined in this blog about how much time was wasted in conferences / presentations / code walkthroughs while trying to change the font size of the text editor in the IDE so that people at the back could see.

And last night, out of the blue (the interwebs are blue, right?), I received an email from Adrian Kuhn in Switzerland saying "Wish granted!"

Download the jar Adrian has posted here and copy it to your Eclipse/FlexBuilder plugins folder and restart your IDE.

Ta-frickin-da!

Now you can quickly increase/decrease the font size of both the editor and the console window without interrupting the flow of a presentation. It's a small thing, for sure, but it's a beautiful small thing.

Apparently this has been tested on Eclipse 3.3+ and Java 1.5+. Works for me!

C U @ PV3D Vancouver this weekend!

I'm excited to get some Papervision3D training this weekend from John Grden. We might decide to make him an honourary Canadian and buy him an extra vowel or two for his last name.

Obviously, the appropriate Canadian letter would be a 'U', since we have so many of them lying around these days. "Color?" Never heard of it. "Colour?" Yeah, baby. That's more like it!

Anyway, if you're from out-of-town and want to blend in, the correct pronounciation is "Vang-couver". Yup, us locals add a nearly silent "g" into the city's name.

I hope to see you there.

Boo-hoo! I have to miss 360|Flex Milan

Unfortunately (for me, at least), I've had to pull out of my Cowbell Hero session @ 360|Flex Milan. I can't make the conference any longer, and I'm feeling very, very sheepish (as opposed my usual "moose-ish") for canceling so close the conference.

Tom and John have been great about it. They really have the coolest conference going these days.

But just because I can't go, it doesn't mean you shouldn't (my absence might even be *more* of a reason to go!). You simply will not find a better value for your 360 Euros than in Milan, April 7-9.

Cheers,
Doug

PS: Cowbell Hero is still a go, and I'll be posting details on this blog as development progresses.

Come see Cowbell Hero @ 360|Flex Europe!

I'm excited to be presenting at 360|Flex Europe in Milan, Apr 7-9.

When I first talked with Tom & John about the Milan gig last August, I said that I had wanted to present something that integrates hardware and physical interaction with the Flash platform.

So over the past year I've been working on a number of home projects centered around the Arduino, a low-cost open source hardware platform, which fittingly was designed in Italy.

The Arduino is a 16 Mhz Atmel microcontroller with a USB interface and a number of digital I/Os and analog inputs. You can purchase a fully assembled Arduino controller for less than $40. And open source IDE is available for Mac/Windows/Linux.

So $40 plus a few spare LEDs and simple components can yield some interesting stuff.

Cowbell Hero with an Arduino

This Christmas my son got an Xbox 360, and I got Guitar Hero. Now my son (15) and daughter (11) routinely kick my butt at this game (but at least they unlocked Trogdor! for me).

When I was planning for 360 Milan, I was trying to think of a fun way to engage the audience, and I thought it would be fun to create game in AIR. Natuarally, this game had to be Cowbell Hero.

We'll be hooking up my Mac to the projector, the Arduino, and the sound system, and rocking out like Bruce Dickinson would want.


So sign up now for 360 Flex Europe, and I'll see you in Milan!

Pixton revealed at Vancouver Flex/AIR tour

The fine folks at Business Objects hosted the the recent Vancouver stop of the Flex3/AIR Prerelease Tour. Local Adobe Evangelist Duane Nickull was bravely demoing a 4-hour-old build of Flex Builder, showing off the new features to a crowd of of about 60+ developers / designers. About half were new to the Flash platform (welcome to the party!).

Duane's quote of the night came at the Yaletown Brew Pub afterwards: After telling him that I think that Flex is the crack-cocaine of programming languages, Duane quipped "Adobe considers Flex to be the gateway-drug to AIR". Brilliant.

Star of the evening - Pixton

Local developer Clive Goodinson demoed a new online comic site called Pixton. This super awesome site was created by Clive in just two months, and includes a Flash CS3 front end married to a PHP back end. Pixton is incredibly visually appealing, plus it has very immerisive and intuitive editing capabilities. Drag a character's arm to reposition it, and the joints all move correspondingly, in a very natural manner.

You can also remix the content of other Pixton comics, if the original author permits. Duane has already used Pixton to mock co-worker Ted Patrick. Most excellent.

My new mashups book is out!

Please help support this blog and buy this book. It was seconds in the making!

Labels everywhere often means that the design sucks

This blurry picture is a camera-phone snap (scratched lens! grrr!) of the elevator control panel at my previous gig, before I joined EffectiveUI. The pic is blurry, but you can still make out the details.

There is just no affordance or discoverability in this button layout. I was working onsite for a couple of months, and I saw everybody continue to struggle to figure this thing out. I'm not talking just visitors (who also struggled), but people who had been working there for years! I was also tricked by the strange layout a couple of times a week.

Now, to be fair, the building was a little oddly shaped. It was built into a steep hill, and was terraced. An elevation perspective looked like this:

    +---+
    | 2 |
    +---+--+
Gnd | 1    |
----+------+
    |      |     Patio
    +------------------+  Ground level
    | Parking P3       |-------\
    +------------------+        \
    | Parking P2       |
    +------------------+
    | Parking P1       |
    +------------------+

Things I found bad about this design:

"Main" (1)  (2)
       (P3) (M) "Roof Garden"
       (P1) (P2)

1. This panel is ordered right-to-left, instead of left-to-right. The standard layout (at least in North America) is for two-column panels to start with the top floor on the upper-left, and then decrement floor-by-floor in a left-to-right, top-to-bottom sequence.
   
2. Floor 1 (street level entry) is also labeled "Main", but there is an "M" button!
3. The mezzanine floor has the confusing "M" button, which everyone thought was the main level. "M" should only be for main.
4. To fix the above, the mezzanine floor is labeled "Roof Garden". Roof? In the middle of the building? Call it a patio and avoid the confusion already!
5. The parking levels are not ordered according to the standard. Underground parking levels should start with P1 being the level just below the main floor. So P3 should be floor furthest down, not at the top.
   

It's a tough design problem, for sure, but I think that the person responsible for this just gave up and said "This will do", thereby condeming all future occupants to confusion.

How would you solve the layout problem?

(PS: Can you tell I love ASCII art?)

No, I haven't died in a blogging accident

Just in case any of you were wondering. Man, you gotta love XKCD. Too many fluff posts like this are skewing the results.

DryerFox - Updated for Flex 3 Beta 3

I made a few minor tweaks to DryerFox a few weeks ago, but I thought I should post them.

1. Updated the code to resolve breaking changes.
   
   The WebKit control was reworked a fair bit for Beta 3. mx.controls.HTML no longer delegates the heavy lifting to flash.html.HTMLControl. So this meant a code sweep to change snippets like:
   
   
   • html.htmlControl.historyBack() becomes html.historyBack().
     
   • html.htmlControl.window.document.title becomes html.domWindow.window.document.title.
     
   • HTMLUncaughtJavascriptExceptionEvent becomes HTMLUncaughtScriptExceptionEvent.
     
     
2. Updated the -app.xml
   
   Another beta, another -app.xml schema.
   
   All the same values are set, but the precise location and names within the XML have changed again. I can see in the SDK that there is a template for these in sdk/templates/air/descriptor-template.xml. I just wish that Flex Builder provided a config panel interface to set this stuff, just like it does for the HTML wrappers.
   
   
3. Updated the badge installer
   
   This beta included another update to the badge installer, so I have included this in the source update.
   
   
4. Added the new EverythingFlexAIR.SWC library
   
   DryerFox was already using Rich Tretola's UpdateManager class, and Rich has now packaged this (and other useful goodies) in a SWC, available here.
   
   
5. Updated SWFObject to v2 RC1
   
   SWFObject has moved to a release candidate, so I updated my copy. No other changes required.
   

Source for the latest DryerFox can be found here. App can be installed via the "Install Now" button at the top of the sidebar.

I am older than the *nix epoch

This fact dawned on me this week, during a discussion of UTC time handling in particular, and time/date handling in Flex in general.

I don't know why I fixated on it. OK, I do know why. I'm terribly vain, *and* I'm the oldest guy in the company. At least I'm not the most mature!

Random Fun Facts

• The UNIX epoch is defined as midnight, UTC, Jan 1, 1970.
• I'm 42 years old, born just after the Earth finished cooling in July 1965, so that makes me about -4.5 years from the epoch.
• UTC is not technically an acronym, since the letters don't stand for anything. Instead, the letters represent an interesting compromise between the French TUC (temps universel coordonné) and the English CUT (coordinated universal time).
• I think the year 2038 problem is much more likely to be a big issue than the non-event that was Y2K.
• Man, this date/time stuff is a difficult problem to solve precisely.
• Did you know that the Unix epoch of Jan 1, 1970 is not the same as the UTC epoch of Jan 1, 1972?
• Did you know that the official UTC spec includes leap seconds, but Unix time doesn't?
• All of this makes me think of this Chicago song. Which is also older than the Unix epoch.

DryerFox - Moxie Beta 2 Upgrade Completed

This post updates a couple of earlier posts about DryerFox in particular and how to deploy AIR apps with a seamless install from your web page.

Click on the "Install Now" button in the sidebar to get the latest DryerFox executable, or click here for the source.

Updating from AIR Beta 1 to AIR Beta 2

This step was pretty straight forward. The foo-app.xml schema has changed (again!) in FB3B2, so the simplest thing to do (and the sequence recommended in the release notes) was:

1. Create a new AIR project
2. Cut-n-paste the few project descriptors and icon paths from the old project to the new project. The same information exists in both projects, but the location of each XML node has changed.

So far, each public beta of AIR has changed the app.xml schema, so this seems to be an area of churn. Not a biggie though. It took about 3 minutes to do this.

Once DryerFox was compiling in FB3B2, I found that the stage.window property was renamed to stage.nativeWindow, so I have to update the startMove(), minimize(), and close() handlers. That took another 5 minutes, and then DryerFox was up and running again.

Adding UpdateManager

This was quite straightfoward. Kudos to Rich at the EverythingFlex blog for posting this useful class.

1. I copied the com.everythingflex.air.managers.UpdateManager.as class to my project.
2. I created a version.xml that matched the new version in -app.xml
3. Added the following two lines to the onAppInit() method:

import com.everythingflex.air.managers.UpdateManager;
var um:UpdateManager = new UpdateManager("http://www.dryerfox.com/blog/DryerFox/version.xml");

Seamless Installation update (imageurl is gone!)

I followed the instructions in the AIR release notes, and updated my install badge to the latest version bundled in the SDK. This folder can be found at "installRoot/Adobe Flex Builder 3/sdks/3.0.0/samples/badge".
In doing so I found that the new badge.fla no longer attempts to frame a supplied image with the button. I quite liked the embedded, so I just updated my older badge flash project from here, simply replacing older install.as with the newer, more robust version included in FB3B2.

Feel free to steal my backwards-compatible badge.swf if you want something you can just drop in as a replacement. Also note that Adobe now recommends setting Flash 8 as the minimum flash version. Since Flash 9 has well over 90% market penetration, that's a pretty reasonable setting.

SWFObject 2.0

Geoff Stearns and Bobby van der Sluis have been busy improving their individual SWF-hosting efforts into a combined project, just released on Google code. I've updated my "Install Now" button to use the SWFObject 2.0 script, and it seems to be working well. There is a syntax change from the previous use case, but it is still pretty simple to use.

Here's the new syntax:

<script type="text/javascript" src="swfobject.js"/>

<div id="dryerfox_flashcontent">
Whoa. You need to install <a href="http://www.adobe.com/go/flashplayer">Adobe Flash Player</a>.
</div>

<script type="text/javascript">
var flashvars = {
 appname:  "DryerFox",
 appurl:  "DryerFox.air",
 imageurl:  "dryerfox_badge.jpg",
 airversion:  "1.0.M5",
 buttoncolor: "008811",
 messagecolor: "000000"
};
swfobject.embedSWF( "badge.swf", "dryerfox_flashcontent", "217", "180", "8", "expressInstall.swf", flashvars );
</script>

The first two sections are unchanged. Include the swfobject.js script in a <script> tag, and your app's alternate content in a <div> tag. Then use a swfobject.embedSWF() method call to replace the alternate content with your SWF and viola!

DryerFox demoed at Best Buy!

Thanks for reading this far. I just thought I'd send a shout out to the techs at Best Buy (is that still Geek Squad?) for leaving their Vista demo systems wide open. On the weekend I was able to install DryerFox on a sweet HP 19" touchscreen system, and associate DryerFox with the .HTML file extension. Who sets up demo accounts with admin privileges?

Oh well, it was fun to drag the dryer around with my finger.

DryerFox - Maintenance mode

The DryerFox code is getting a wee bit stale, so it's time for an update. Rather than make incremental changes, I thought I'd lump in the following tweaks:

1. Build it with Flex Builder 3 (Moxie) Beta 2
2. Add in Rich Tretola's UpdateManager class
3. Deploy it with the new badge installer (now called Seamless Installation)
4. Wrap the Install Now badge using SWFObject 2.0

Four framework upgrades at once. What could possibly go wrong? ;-)

Stay tuned ...

To Catch A Thief

Or at least, to catch a buyer of hot items. :-)

Mr. Flickr-fied turned the stolen iMac into Victoria police (that's a 2hr ferry ride away from Vancouver), on the advice of his lawyer. He had "bought it from a friend who bought it from someone else". Apparently our friend is "known to police" and the investigation is ongoing.

I think we should chip in and get the iMac tattooed for easy identification next time.

It wasn't me! I didn't do it! You can't prove anything!

OK, so this post is off-topic, but it is too sweet to not blog about.

Our Vancouver office space is at the lovely WorkSpace in Gastown. Last Tuesday night there was a break-in, and the thugs stole some computers, including a public-use iMac that lived near the espresso bar.

That stolen iMac had the great FlickrBooth plugin installed and today someone posted a few interesting pics of themselves to the WorkSpace Flickr account. Nice tats dude!

40 minutes ago, one of the Flickr admins called WorkSpace owner Bill MacEwen with the IP address used to upload today's photos. I sure hope the cops nail this guy.

At the time of the heist, I was in Denver, at the EffectiveUI main office. Since it was international Talk-Like-A-Pirate day, I was required by law to dress up. Today I noticed that my fake tats and bloated face make me look similar to the person of interest.

I'm thankful I have a rock solid alibi.



Now go get him, boys!

I am a Nerd King! How about you?