My first Atlas-powered mashup
A couple of days ago I've completed the first release of an Atlas-based mashup that you can find here (and a big "thank you!" goes to Sonu Kapoor and its DotNetSlackers site for hosting it and providing the resources). I've developed it in my spare time, trying to implement in a real application context what I've been learning about the framework. This means that I've developed it mainly to explore the Atlas framework's features and capabilities and to understand if the framework makes easier the development of such web applications. Basically my goal was to explore the provided client-centric and server-centric programming models, using both declarative and imperative code.
On the other hand, I wanted to code a little web application that would involve some stuff that I use everyday. Since I spend hours reading RSS feeds, tagging my resources and since I really like to see stuff displayed on maps, I decided to code a Geotag viewer with a builtin RSS reader :)
Atlas usage
The client-centric programming model is based on using the framework to "upgrade" static HTML to dynamic HTML. This is done by "wrapping" one or a whole set of static HTML elements with some builtin Atlas controls, or custom controls. For example, the mashup's UI is entirely built using the client-centric programming model.
To do this, I've first created the page layout using static HTML (think of it as a "screenshot" of the page), then transformed the panels into sliding panels, the banner into a sliding banner, a DIV into a VirtualEarth map, added popups and visual effects like transparency and so on.
To implement the UI client logic I've used declarative code. The framework provides a declarative coding style that hides Javascript from the user and allows to add the DHTML functionality by writing XML-script code.
The server-centric programming model deals with the concept of server controls provided by the ASP.NET technology. This programming model makes possible, through the use of extenders and markup capabilities, to add client side functionality to ASP.NET server controls, and to transform the traditional ASP.NET's postback model into an asynchronous postback model thanks to the UpdatePanel, an Atlas server control that allows to selectively update only pre-defined regions of the page, by doing a so called "partial postback".
By using the UpdatePanel server control and the great RSSToolkit by Dmitryr, I've built the RSS reader integrated with the mashup. Two UpdatePanels are responsible to update the posts list and the current post detail. All happens in an asnychronous way, without the need to post the whole page back to the server. The client side functionality is totally implemented using declarative code, and this makes possible to build a reader like this in about a hour. What I like about the RSS reader is its feed search engine, that is powered by the "feed" query operator of the MSNSearch service and that I've implemented in a sort of templated drop-down list (I've used a ListView, my Pager control and a couple of bindings to realize it).
Regarding the imperative code, i.e. the pure Javascript, I've used it basically to handle the interaction with web services through the Atlas service proxies, and to build a couple of new components, specifically a ClipAnimation (that I used to realize the sliding panels), an ItemsSlideshow control (yes, ugly names) that handles the collection visualization and a Pager control that I've used to implement client-side pagination (you can see the Pager in action in the collection search panel or the feed search drop-down list).
Since this is a mashup, services play the main role. I decided to use the service APIs provided by Flickr (for the photos), del.icio.us (for the bookmarks), Yahoo and ZeeMaps (for geocoding) and MSNSearch (with the use of the "feed" query operator) to perform feed search. These services are all accessed from server side by using wrapper classes (I've done this because I needed to encapsulate data in complex types), but are all invoked from client side thanks to the Atlas proxy feature.
Finally, it would be great to have your feedback and know your thoughts and suggestions about it. My future posts will address in detail the relevant parts of the code, and I'm going to release the source code in the next days.
Have fun!