My colleague David Meeuwis showed me a most useful and non-intuitive tip that explains a subtle difference between using the @ axis and the attribute() axis in E4X. For example, given the following XML fragment…


<names>
<name salutation="Mr">Billy Bob Thorton</name>
<name salutation="Mrs">Angelina Jollie</name>
<name>Brad Pitt</name>
<name salutation="Ms">Jennifer Aniston</name>
<name salutation="Mr">Vince Vaugn</name>
</names>


The AS3 expression below…

myXml.name.(@salutation == 'Mr')

…will find all the names that have a salutation attribute equal to ‘Mr’. However, if there is any name in the xml that doesn’t have a salutation attribute, that query will throw an exception and die. However…

myXml.name.(attribute('salutation') == 'Mr')

Will give back all names that have a salutation attribute equal to ‘Mr’ and ignore any name elements without a salutation attribute.

So unless you are absolutely positive that the attribute you are selecting always exists, you should be using the attribute() axis over the @ axis.

Here is a quick Flex example with view source enabled that you can test with.

Regular readers of my site have probably noticed that I have been an inactive blogger over the past couple of months. There’s a very good reason for this. Since starting my own consultancy, I have been very busy! I think I may actually be working for the first time in my life - and having a helluva time doing it. What’s been keeping me so busy? FLEX! For the past four months I have had my head down in Flex Builder creating a revolutionary RIA (beta coming next month).

It’s my year anniversary working with Flex (save a two month stint with Ruby on Rails) and in that year I’ve learned a great deal. Most of my days are spent writing ActionScript 3 components and I must admit that I think I’m getting very good at it. So to ‘prove’ it and to share with the Flex community, I am offering my first Flex component for download!

ThumbBrowser is a knock off of a new widget found in iPhoto ‘08. It is a small component that will collect all of your image thumnails into one component. When you move your mouse across the component, you get previews of all the thumbs in collection. You can view a demo here and download the source here.

Some quick notes:

• The component’s dataProvider property only accepts an array of URL’s/paths to images (I hope to add XMLList soon)
• You can set 4 styles: borderColor, borderThickness, cornerRadius, and backgroundColor
• Component dispatches only a click event. I would like to add a progress and complete event in the next release
• The full size image is downloaded, but the image is scaled so only a small representation of the images actually stays in memory (I think this is true, please correct me if I am wrong)
• I will add ASDoc style comments over the next few days, and hope to submit it to FlexLib.
• Although there is no open-source license attached to the component, please feel free to use is it as you please.
• ThumbBrowser might make a better Adobe AIR component, as loading a large collection of images over the web could take a while.

I’d love to hear your feedback on the component, and please send suggestions as to how I might be able to make ThumbBrowser better!

Enjoy!

Last night I gave a presentation to a group of about 40 web developers/designers in Victoria, British Columbia. I promised you all a link dump of the sites I visited so here it is…

Samples of Rich Internet Applications developed with Flex:

• Buzzword
• Picnik
• Scrapblog

Flex Resources at the Adobe website:

• Flex Builder
• Flex 2 Software Development Kit
• Flex Labs
• Flex Module for Apache and IIS

A good way to keep up on Flex and AIR related topics:

• MXNA AIR
• MXNA Flex
• MXNA ActionScript

During the session we created a Flex application that grabbed my favorite Flickr Images, and placed them into a Display Shelf component. We published the code as a Flex application and an AIR application. You can download the source code for both projects as well as my presentation slides in this zip package. Here are a couple of links to the Flickr API you might find useful if you decide to modify my source:

• Your favorite photos on Flickr
• Flickr Services

I hope you enjoyed the presentation as much as I enjoyed presenting! Thanks again for showing up!

I will be in Victoria, British Columbia on Wednesday August 22nd speaking to the Better Web Posse. My presentation will be on Flex and AIR and will discuss many things including Flex’s support for open standards, myths surrounding the Flex framework, and a quick introduction to AIR and its support for AJAX development. There will also be a live coding session where I will spin up a quick Flickr mashup using Ely Greenfield’s Display Shelf component. Should be a fun night so if you’re on Vancouver Island and want to learn more about Adobe Flex here are the event details:

WED August 22 | 6:30 pm
Swans Hotel, The Collard Room (map)
Attendance is free!

I arrived in Seattle yesterday for the second Flex 360 Conference.  I’ve been to a few conferences over the past year, and so far this is the one I have been most impresses with.  Upon check-in at the hotel, I was told that registration was being held at 8:00pm and to be immediately followed by free food and FREE BEER!  Awesome!  The nicest part of the first night was being greeted by the conference organizer, Tom Ortega, right at the registration table.  I get the feeling that this will be a very personal conference.

I’m looking forward to seeing as many sessions as possible, and if you are a regular reader of this blog and happen to be at the conference, I would love to meet you.  I will be the guy wearing the navy blue polo shirt with a Braxio Interactive logo on the front.

Wired has a feature article with the man who coined the term “AJAX”,
Jesse James Garrett, where he suggests that  AIR will be another boost for web apps.  It really great to see the HTML/CSS/JS crowd embracing the AIR plaform just as it’s great to see Adobe embracing the same community.

If you are an AJAX developer and are interested in bringing your AJAX apps to the desktop using Adobe AIR, Mike Chambers and crew have made their New Adobe AIR Book Available for Download in PDF format.  The book titled Adobe Integrated Runtime for JavaScript Developers Pocketguide is a very concise quick start type guide that will have your first AJAX desktop app up and running in no time at all!

This news is a bit old, but if you are interested in learning more about the Adobe Integrated Runtime, you should check out Adobe’s on AIR Bus Tour.  The tour is an 18 city road show where you can learn how to bring your AJAX or Flex web applications to the desktop.  Each event is free to attend and include many very cool sessions.  I will be at the event in Vancouver on July 11th, so if you live in the Lower Mainland/Vancouver Island area, I hope to see you there!

It looks like the Aptana: project is now offering their Aptana IDE with Adobe AIR support.  It provides an integrated development environment for creating Adobe AIR (nee Apollo) applications.   Flex developers should not get too excited as it looks like this project is targeted towards HTML, JavaScript, Ajax, and CSS developers, enabling them to build and deploy rich Internet applications (RIA’s) to the desktop.  From what I can see this is not a replacement for Flex Builder - rather a way to make it easier to deploy classic web applications to the desktop.