Article
Distributed Processing With Flex and AIR
Building the Monitoring Application
The monitoring application is extremely simple. It gets the list of cities from the server, a list which contains the current processing numbers, and it puts up a list of the city and the current processing value, if there is one. Let’s create the monitoring application by again selecting File > New > Flex Project, entering the project’s name (monitor), and making sure that Desktop Application is selected.
The code for monitoring application is shown in Listing 7:
Listing 7. monitor.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical"
creationComplete="onStartup()">
<mx:Script>
<![CDATA[
import com.distributed.Server;
private function onStartup() : void {
var t:Timer = new Timer( 1000 );
t.addEventListener( TimerEvent.TIMER, onTimer );
t.start();
}
private function onTimer( event:Event ) : void {
var cities:Array = [];
Server.instance.getCities();
for each ( var city:Object in Server.instance.cities ) {
if ( city.processing != null )
cities.push( city );
}
dg.dataProvider = cities;
}
]]>
</mx:Script>
<mx:DataGrid width="100%" height="100%" id="dg">
<mx:columns>
<mx:DataGridColumn dataField="name" headerText="Start City" />
<mx:DataGridColumn dataField="processing" headerText="Progress" />
</mx:columns>
</mx:DataGrid>
</mx:WindowedApplication>
When the application starts up it creates a timer that fires off an event once every second. The application then watches for that event; each time, it first requests the list of cities and displays the current list of cities in the data grid. It uses the dataProvider attribute on the dg grid to provide the list of cities to the DataGrid control defined at the bottom of the file.
The monitoring application, which shows the status of the server to the user, is shown in Figure 4.
![]()
When you have the client running along with the monitoring application you can see it updating the data in real time. And if you want to have some real fun, use the Export Release Build method in Flex Builder 3 to build the production version of the client application. Then install it on a couple of different machines and run them all at the same time. Of course, you’ll have to set up a web server visible to each of the clients, but if you have everything set up the right way, you’ll have your own little distributed processing application.
Where to Go from Here
I used the travelling salesman problem to illustrate something that takes a long time to process. It’s not the sexiest application, I grant you—but it serves the purpose of demonstrating distributed processing.
The potential for this combination of technologies—AIR, Flex, AMFPHP, and PHP—in building distributed processing is very powerful. AMFPHP makes it very easy to create a web server that manages large groups of distributed clients. And AIR and Flex make building cross-platform applications that work consistently across Windows, Macintosh, and Linux simple.
Strangely, however, using AIR for distributed computing doesn’t seem to have caught on yet. I hope that this article, in combination with the obvious potential of the technologies, will help fix that.
Test Your Knowledge!
Now you’ve made it this far, why not test your understanding of this tutorial with this quick quiz? Be in the first 100, and you’ll score a FREE copy of the pocket guide, Adobe AIR For JavaScript Developers, courtesy of Adobe Systems, so get in quick.
Just missed out? You can still download the book in PDF format for free!