<?xml version="1.0" encoding="utf-8" ?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" horizontalAlign="left" pageTitle="TUve White Board" creationComplete="initApp()">
 <mx:Script>
 <![CDATA[ 
   import mx.utils.ObjectUtil;
   import mx.controls.Alert;
   import flash.events.NetStatusEvent;
   import flash.events.SyncEvent;
   import flash.net.NetConnection;
   import flash.net.SharedObject;
   import mx.rpc.events.ResultEvent;

   private var isDrawing:Boolean=false;

   private var x1:int;
   private var y1:int;
   private var x2:int;
   private var y2:int;
   private var drawColor:uint;
      
   private var myID:Number;

   [Bindable] private var connected:Boolean = false;
   private var nc:NetConnection = null;
   private var so:SharedObject = null;
   
   private function initApp():void {
   	 myID = new Date().getTime() + Math.random();
     if (!nc) {
       nc = new NetConnection();
       // set the encoding to AMF0 - still waiting for AMF3 to be implemented on Red5
	   nc.objectEncoding = ObjectEncoding.AMF0;
       nc.addEventListener(NetStatusEvent.NET_STATUS,onConnectHandler);
       nc.addEventListener(SecurityErrorEvent.SECURITY_ERROR,onConnectErrorHandler);
       nc.client = this;
       nc.connect("rtmp://utopia.ubixonline.com/SOSample");
       }            
     }

    public function onBWDone():void  {
	  // have to have this for an RTMP connection
	  }

    public function onBoardUpdate(gotData:Object):void {
      var cID:Number;
      
      if (gotData == null)
        return;
        
      if (!gotData.hasOwnProperty("id"))
        return;

      if (gotData.id ==  myID)
          return;
      
      switch (gotData.cmd) {
      	case 1:
      	  doErase();
      	  break;
      	case 2:
         canvas.graphics.lineStyle(2, gotData.drawColor);
         canvas.graphics.moveTo(gotData.x1,gotData.y1);
         canvas.graphics.lineTo(gotData.x2,gotData.y2);
      	 break;
      	default:
      	  Alert.show("Error");
      	  break;
        }
      }

    private function onConnectErrorHandler(event:SecurityErrorEvent):void {
      Alert.show(event.text,"Error on Connect");
      }
    private function onConnectHandler(event:Event):void {
      so = SharedObject.getRemote("tuveWhiteBoard",nc.uri, false);
      so.addEventListener(SyncEvent.SYNC,onBoardUpdate,false,0,true);
      so.client = this;
      so.connect(nc);
      }
     
     /* Paint Funcs */
     private function doErase():void {
       canvas.graphics.clear();
       so.send('onBoardUpdate',{id:myID,cmd:1});
       }

     private function doMouseDown():void {
       x1 = canvas.mouseX;
       y1 = canvas.mouseY;
       isDrawing = true;
       }
       
     private function doMouseMove():void {
       x2 = canvas.mouseX;
       y2 = canvas.mouseY;
       if (isDrawing) {
         canvas.graphics.lineStyle(2, drawColor);
         canvas.graphics.moveTo(x1, y1);
         canvas.graphics.lineTo(x2, y2);
         //so.setProperty("boardInfo",{id:myID,cmd:2,x1:x1,y1:y1,x2:x2,y2:y2,drawColor:drawColor});
         so.send('onBoardUpdate',{id:myID,cmd:2,x1:x1,y1:y1,x2:x2,y2:y2,drawColor:drawColor});
         x1 = x2;
         y1 = y2;
         }
       }

      private function doMouseUp():void {
        isDrawing = false;
        }
      private function doColor():void {
      	drawColor = pC.selectedColor;
        }

  ]]> 
  </mx:Script>

  <mx:Panel width="100%" height="100%" headerHeight="0">
    <mx:Canvas id="canvas" width="100%" height="100%" horizontalScrollPolicy="off" verticalScrollPolicy="off" mouseDown="doMouseDown()" mouseMove="doMouseMove()" mouseUp="doMouseUp()" />
    <mx:ControlBar>
      <mx:ColorPicker id="pC" change="doColor()"/>
      <mx:Button label="Erase" click="doErase()"/>
    </mx:ControlBar>
  </mx:Panel>
</mx:Application>