Monday, April 16, 2007

DryerFox - It's like Firefox, but inside a dryer!

Long-time listener, first-time coder! Here's my first Apollo app ...

I was lucky enough to attend the original ApolloCamp event in March, and I've been spending the last while learning the Flex & Apollo environments.

One of the cooler things about the Apollo framework is the addition of an HTML control based on the WebKit engine. This is the HTML engine used for Apple's Safari browsers, and others too, including the Nokia S60 mobile platform.


Since the Apollo mx:HTML component is rendered as part of the Flash display list, this allows any Flash effects to be applied to an active web page. Blurs, tweens, rotations, it all works.

Presenting ... DryerFox!
I knew I wanted to do something fun with HTML, but the question was: do what? Inspriration hit las Thursday, and I decided to create DryerFox - A rotating browser window wrapped by a dryer image.

You can type any URL into the app, and the page will be loaded and rendered. As the page is loading, the dryer's drum turns, and therefore so does the page. You can also manually rotate the drum using push buttons. The page remains fully interactive, no matter what the rotation. You can read your webmail, surf the net, or whatever. There is even a button to reset the drum rotation back to normal, so that you don't strain your neck.

Installing the demo

  1. Install the Apollo runtime framework on your Mac or PC, if you haven't already done so. It is an alpha release, but still pretty solid.
  2. Download the DryerFox demo .AIR file. (.AIR is the extension for Apollo apps, but it is just a ZIP file)
  3. Double-click the downloaded .AIR file, and the Apollo runtime will lead you through the rest of the installation process.
The source for the hack is available here, in case you want to hack it further yourself. You'll need the Flex development environment to do that.

I'll describe the making of DryerFox in a future post, but I wanted to get this out there for feedback.

133 comments: