Dissecting a Mashup: NoteTag’s Reusable Flex Components

Whenever I come across a new Flex 2.0 project, my first two questions are:

  • "How do I try it out?"
  • "Can I see the source?"

(Short answers: "Go to the NoteTag Labs page!" and "Yes, go to the NoteTag Labs page!")  After that, my next question is usually:

  • Is there anything here I can reuse?

In NoteTag’s case, the answer is a resounding "Yes!"  Interested in publishing to a blog server that supports the Atom Publishing Protocol?  Take a look at our AtomProtocol library.  Interested in working with a read/write Feed object model that supports the various flavors of RSS and Atom?  Try the Feeds library.  In this post I’ll give a brief overview of each reusable library that’s included with NoteTag.

Below is a rough diagram of the NoteTag architecture.  In future posts I’ll talk about the NoteTag specific components, but today I’ll focus on the lower part of the diagram.

notetag arch.jpg

 

From bottom to top:

corelib

The corelib library is an ActionScript 3.0 library developed by the Adobe Developer Relations team, and made available on the Adobe Labs site.  The Kiwi team didn’t develop this library, but we use it heavily (for URI support, date parsing,and WSSE authentication), and I expect that most Flex developers will want to add it to their arsenal of tools.

Connections

The Connections library provides basic support for connection management. Read/write web applications typically make calls to multiple web services, often authenticating with different credentials for each service — NoteTag is a good example of this, using del.icio.us to store metadata relating to notes and tasks, and Blogger or TypePad to store the note content.  The Connections library provides an object model for user-specific Connections to an Endpoint (e.g. Blogger) that supports a specific Protocol (e.g. the Atom Publishing Protocol).

Feeds

The Feeds library provides a format-independent Feed object model for Atom 0.3, Atom 1.0, RSS 1.0, and RSS 2.0.  The Feeds library is similar in spirit to the existing RSS and Atom libraries, but provides a few key additions:

  • support for Atom 0.3 (required by Blogger and TypePad)
  • support for reading from and writing to Feed objects
  • support for feed extensions

Let’s take a look at the second bullet point.  Here’s how you might create a new Atom 1.0 entry from scratch:

// Create an empty entry.

var factory:IFeedElementFactory = new Atom10FeedFactory();

var entry:IEntry = factory.createEntry();

 

// Assign a title to the entry.

var title:IContent = factory.createTitle();

title.value = "My Latest Entry"; // assign the content to the title

entry.title = title; // assign the title to the entry

 

// Assign an id to the entry.

entry.id = "id:1234567890";

 

// The entry is being published "right now".

entry.published = new Date();

 

// Display the XML for the entry.

trace(entry.xml);

What’s nice about this approach is that you only have to change one of line of code if you’re working with a different feed format:

var factory:IFeedElementFactory = new RSS20FeedFactory(); // switch to RSS2.0!

TagServerProtocol

The TagServerProtocol library provides a generic interface for a tag server protocol, and one specific implementation: del.icio.us.  There are a variety of tag servers (more commonly referred to as social bookmarking services) out in the wild, most of which provide different flavors of the same API.  The ITagServerProtocol interface is a "least-common denominator" interface that should work for most of these services.  We’d love to see someone try to implement it for Simpy or Shadows and then plug it in to NoteTag…

AtomProtocol

The AtomProtocol library provides a generic interface for the Atom Publishing Protocol, and two specific implementations: Blogger and TypePad.  The protocol interface  and introspection document object model conform as closely as possible to the current draft (08) of the APP specification, though there are some features (such as collection paging and media collections) which we punted on.  Still, it ought to be possible to create a plugin for Google’s GData