Distributed Processing With Flex and AIR

Building the Client

To build the client, we start by creating a new Flex Project (File > New Flex Project) called processor and selecting the Desktop Application (runs in Adobe AIR) option. The code for the application is shown in Listing 6:

Listing 6. processor.mxml  
<?xml version="1.0" encoding="utf-8"?>  
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="onStartup()"  
 width="300" height="200">  
<mx:Script>  
<![CDATA[  
import com.distributed.Sequence;  
import com.distributed.ServerEvent;  
import com.distributed.Server;  
 
private var _minDistance:Number = Number.MAX_VALUE;  
private var _minSequence:Sequence = null;  
private var _checkedSequences:int = 0;  
 
private function onStartup() : void {  
 Server.instance.addEventListener( ServerEvent.GET_CITIES, onGetCities );  
 Server.instance.addEventListener( ServerEvent.REQUEST_CITY, onRequestCity );  
 Server.instance.getCities();  
}  
 
private function onGetCities( event:Event ) : void {  
 Server.instance.requestCity();  
}  
 
private function onTimer( event:Event ) : void {  
 var nseq:Sequence = new Sequence( Server.instance.cities, Server.instance.startCity );  
 var dist:Number = nseq.distance;  
 if ( dist < _minDistance ) {  
   _minDistance = dist;  
   _minSequence = nseq;  
 }  
 lblMinDistance.text = _minDistance.toString();  
 lblSequences.text = _checkedSequences.toString();  
 _checkedSequences += 1;  
 if ( _checkedSequences % 10 == 0 )  
   Server.instance.updateProgress( _checkedSequences, _minSequence.sequence );  
}  
 
private function onRequestCity( event:Event ) : void {  
 var t:Timer = new Timer( 10 );  
 t.addEventListener( TimerEvent.TIMER, onTimer );  
 t.start();  
 
 lblStartCity.text = Server.instance.cityById( Server.instance.startCity ).name;  
}  
]]>  
</mx:Script>  
<mx:Form>  
 <mx:FormItem label="Start City">  
   <mx:Label id="lblStartCity" />  
 </mx:FormItem>  
 <mx:FormItem label="Sequences">  
   <mx:Label id="lblSequences" />  
 </mx:FormItem>  
 <mx:FormItem label="Min Distance">  
   <mx:Label id="lblMinDistance" />  
 </mx:FormItem>  
</mx:Form>  
</mx:WindowedApplication>

The file is split in two. At the top of the file is the ActionScript code that uses the Server object to request the cities, request the starting city, and run the sequence creation on a timer. At the bottom of the file is the user interface, which is just a Form that shows the starting city, the number of sequences tested, and the current minimum distance, which is the fastest route around the cities.

Have a look back at the implementation for a second, and you’ll notice that the creation of the sequences is on a timer. That’s because the Flash environment is not multi-threaded. This means that if the application just created sequences continuously, the display would never be updated, since the display is updated when there are idle cycles. We use the timer in this case to do a little bit of processing, then let the display update, then do some more processing, and so on.

You can see the application running in Figure 3.

Every ten cycles the client updates the server with its progress, so that the server knows that some work is being done. In addition, the monitor can then display the current status.

The final step in this simple distributed system is to build an application to monitor what’s going on server-side.