Home

Adding Undo/Redo and Synchronization to AIR applications

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml"
  xmlns:generated="soup.components.generated.*"
  paddingBottom="8" paddingLeft="8" paddingRight="8" paddingTop="8"
  layout="horizontal" styleName="plain" initialize="init()">
  <mx:Script>
    <![CDATA[
      import air.net.SocketMonitor;
      import org.restfulx.Rx;
      import org.restfulx.controllers.ChangeController;
      import org.restfulx.services.ISyncingServiceProvider;
      import org.restfulx.services.air.AIRServiceProvider;
      import org.restfulx.services.as3http.AS3JSONHTTPServiceProvider;
      import org.restfulx.services.as3http.DirectCouchDBHTTPServiceProvider;

      import soup.controllers.ApplicationController;

      [Bindable]
      private var socketMonitor:SocketMonitor;

      [Bindable]
      private var online:Boolean;

      private function init():void {
        Rx.enableLogging();
        Rx.enableUndoRedo = true;
        Rx.httpRootUrl = "http://localhost:4567/";
        Rx.couchDbDatabaseName = "sinatra";

        socketMonitor = new SocketMonitor("localhost", 4567);
        socketMonitor.pollInterval = 2000; /* miliseconds */
        socketMonitor.addEventListener(StatusEvent.STATUS, onNetworkStatusChange);
        socketMonitor.start();

        ApplicationController.initialize([AIRServiceProvider, AS3JSONHTTPServiceProvider, DirectCouchDBHTTPServiceProvider], 
          AIRServiceProvider.ID, "soup");
        Rx.changes = new ChangeController(ISyncingServiceProvider(Rx.services.getServiceProvider(AIRServiceProvider.ID)),
          Rx.services.getServiceProvider(AS3JSONHTTPServiceProvider.ID));
      }

      private function onNetworkStatusChange(event:StatusEvent):void {
        online = (socketMonitor.available) ? true : false;

        if (online) {
          // replace with Rx.defaultServiceId = DirectCouchDBHTTPServiceProvider.ID if you want to 
          // talk to CouchDB directly instead of via Sinatra
          Rx.defaultServiceId = AS3JSONHTTPServiceProvider.ID;
        } else {
          Rx.defaultServiceId = AIRServiceProvider.ID;
        }
      }

      private function getCurrentProviderName(id:int):String {
        switch (id) {
          case DirectCouchDBHTTPServiceProvider.ID:
            return "DirectCouchDB";
          case AS3JSONHTTPServiceProvider.ID:
            return "Sinatra-CouchDB";
          case AIRServiceProvider.ID:
            return "AIR";
          default :
            return "No idea";
        }
      }
    ]]>
  </mx:Script>
  <mx:LinkBar dataProvider="{mainViewStack}" direction="vertical" borderStyle="solid" backgroundColor="#EEEEEE"/>
  <mx:VBox height="100%">
    <mx:Label text="Current Provider: {getCurrentProviderName(Rx.defaultServiceId)}"/>
    <mx:HBox>
      <mx:Button label="Undo" click="{Rx.undoredo.undo()}" enabled="{Rx.undoredo.canUndo()}"/>
      <mx:Button label="Redo" click="{Rx.undoredo.redo()}" enabled="{Rx.undoredo.canRedo()}"/>
    </mx:HBox>
    <mx:Spacer height="100%"/>
    <mx:Button label="Synchronize" click="{Rx.changes.push()}" enabled="{online}"/>
    <mx:Label text="{online ? 'Online' : 'Offline' }"/>
  </mx:VBox>
  <mx:ViewStack id="mainViewStack" width="100%" height="100%">
    <!-- For a simple demo, put all the components here. -->
    <generated:ProjectBox/>
    <generated:TaskBox/>
  </mx:ViewStack>
</mx:WindowedApplication>