<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
viewSourceURL="@mx-flex-paint.html" xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" 
frameRate="32" creationComplete="initApp()" viewSourceURL="@mx-flex-paint.html"
backgroundColor="0x000000"

    backgroundGradientAlphas="[ 0.5, 0.5 ]"
    backgroundGradientColors="undefined"
    horizontalAlign="center|left|right"
    horizontalGap="8"
    modalTransparency="0.5"
    modalTransparencyBlur="3"
    modalTransparencyColor="#DDDDDD"
    modalTransparencyDuration="100"
    paddingBottom="24"
    paddingTop="24"
    verticalAlign="top|bottom|middle"
    verticalGap="6"

>

	<mx:Script>
		<![CDATA[
			
			/*
			
			Examples_SaveAsJPG
			
			Written by:
			Dustin Andrew
			dustin@flash-dev.com
			www.flash-dev.com
			
			LAST UPDATED:
			10/04/06
			
			*/
			
			import com.flashdev.bitmap.getPixelArray;
			
			import mx.managers.*;
			import mx.events.*;
			import mx.core.*;
			import flash.utils.*;
			import flash.events.*;
			import flash.net.*;
			
			private const _strSaveJPGUrl:String = new String("flex-paint.php");
			
			private var _numColor:Number;
			private var _numSize:Number;
			private var _strTool:String;
			private var _numCursorID:Number;
			private var _booDraw:Boolean;
			private var _bmpDraw:BitmapData;
			private var _bmpDisplay:Bitmap;
			private var _comDraw:UIComponent;
			private var _objGetPixels:getPixelArray;
			private var _winProgress:progress;
			
			// Custom cursors
			[Embed(source="local/icons/pencil.png")] 
			private var curPencil:Class;
			
			[Embed(source="local/icons/paintbrush.png")] 
			private var curPaintbrush:Class;
			
			//[Embed(source="imgs/paintcan.png")] 
			//private var curPaintBucket:Class;
			
			// Initialize
			private function initApp():void {
				_booDraw = new Boolean(false);
				_bmpDraw = new BitmapData(boxDraw.width, boxDraw.height, false, 0xFFFFFF);
				_bmpDisplay = new Bitmap(_bmpDraw);
				_comDraw = new UIComponent();
				boxDraw.addChild(_comDraw);
				_comDraw.addChild(_bmpDisplay);
				changeDrawColor();
				changeDrawSize();
				selectDrawTool("pencil");
			}
			
			// Called when draw color is changed
			private function changeDrawColor():void {
				_numColor = palColor.selectedColor;
			}
			
			// Called when draw size is changed
			private function changeDrawSize():void {
				_numSize = numDrawSize.value;
			}
			
			// Called when selecting a draw tool
			private function selectDrawTool(strTool:String):void {
				_strTool = strTool;
				btnPencil.selected = false;
				btnPaintbrush.selected = false;
				//btnPaintBucket.selected = false;
				switch (strTool) {
					case "pencil" : btnPencil.selected = true; break;
					case "paintbrush" : btnPaintbrush.selected = true; break;
					//case "paintbucket" : btnPaintBucket.selected = true; break;
				}
			}
			
			// Called to change cursor based on draw tool selected
			private function changeCursor():void {
				clearCursor();
				switch (_strTool) {
					case "pencil" : _numCursorID = CursorManager.setCursor(curPencil); break;
					case "paintbrush" : _numCursorID = CursorManager.setCursor(curPaintbrush); break;
					//case "paintbucket" : _numCursorID = CursorManager.setCursor(curPaintBucket); break;
				}
			}
			
			// Called to clear custom cursor
			private function clearCursor():void {
				CursorManager.removeCursor(_numCursorID);
				_booDraw = false;
			}
			
			// Called to draw on canvas
			private function drawToCanvas():void {
				// Draw offset for cursor angle and brush size
				var potOffset:Point;
				switch (_strTool) {
					case "pencil" :
						potOffset = new Point((_numSize / 2) * -1, ((_numSize / 2) * -1) + 5);
						_bmpDraw.fillRect(new Rectangle(boxDraw.mouseX + potOffset.x, boxDraw.mouseY + potOffset.y, _numSize, _numSize), _numColor);
						break;
					case "paintbrush" :
						potOffset = new Point(0, 14);
						var shpCircle:Shape = new Shape();
						shpCircle.graphics.beginFill(_numColor);
						shpCircle.graphics.drawCircle(boxDraw.mouseX + potOffset.x, boxDraw.mouseY + potOffset.y, _numSize);
						_bmpDraw.draw(shpCircle);
						break;
					//case "paintbucket" :
					//	potOffset = new Point(14, 12);
					//	_bmpDraw.floodFill(boxDraw.mouseX + potOffset.x, boxDraw.mouseY + potOffset.y, _numColor);
					//	break;
				}
				_bmpDisplay = new Bitmap(_bmpDraw);
			}
			
			// On enterframe handler
			private function onEnterFrame():void {
				if (_booDraw) {
					drawToCanvas();
				}
			}
			
			// On mousedown handler
			private function onMouseDown():void {
				_booDraw = true;
			}
			
			// On mouseup handler
			private function onMouseUp():void {
				_booDraw = false;
			}
			
			// Clear drawing
			private function clearDraw():void {
				_bmpDraw.fillRect(new Rectangle(0, 0, boxDraw.width, boxDraw.height), 0xFFFFFF);	
			}
			
			// Start to save bitmap, first open progress window
			private function startSave():void {
				_winProgress = progress(PopUpManager.createPopUp(this, progress, true));
				_winProgress.title = "Processing bitmap data...";
				_winProgress.progBar.label = "0%";
				_winProgress.addEventListener("creationComplete",  startProcess);
				PopUpManager.centerPopUp(_winProgress);
			}
			
			// Called when popup progress window is ready to start processing bitmap
			public function startProcess(event:Event):void {
				_objGetPixels = new getPixelArray(_bmpDraw);
				_objGetPixels.addEventListener("progress", onProcessProg);
				_objGetPixels.addEventListener("complete", saveToJPG);
				_objGetPixels.process();
			}
			
			// Get process progress
			public function onProcessProg(event:Event):void {
				_winProgress.progBar.setProgress(event.target.percent, 100);
				_winProgress.progBar.label = event.target.percent + "%";
				_winProgress.progBar.validateNow();
				if (event.target.percent >= 99) {
					_winProgress.title = "Rendering bitmap...";
				}
			}
			
			// Save drawing to JPG
			private function saveToJPG(event:Event):void {
				// Vars to send
				var varSend:URLVariables = new URLVariables();
				varSend.width = _bmpDraw.width;
				varSend.height = _bmpDraw.height;
				varSend.data = event.target.dataString;
				// Send request
				var request:URLRequest = new URLRequest();
				request.data = varSend;
			    request.url = _strSaveJPGUrl;
			    request.method = URLRequestMethod.POST;
			    navigateToURL(request, "_self");
			    
			    PopUpManager.removePopUp(_winProgress);
			}
			
		]]>
	</mx:Script>

	<mx:HBox id="appBox" width="100%" horizontalCenter="0" height="100%" verticalCenter="0">
		
		<mx:Panel width="100%" height="100%" layout="absolute" id="panCanvas" title="">
			
			<mx:Box bottom="0" right="0" id="boxDraw" enterFrame="onEnterFrame()" mouseDown="onMouseDown()" mouseUp="onMouseUp()" mouseOver="changeCursor()" mouseOut="clearCursor()" top="0" left="0"/>
			<mx:ControlBar horizontalAlign="right">
			    <mx:Button label="" id="btnPencil" icon="@Embed('local/icons/pencil.png')" height="30" width="100%" click="selectDrawTool('pencil')"/>
				<mx:Button label="" id="btnPaintbrush" icon="@Embed('local/icons/paintbrush.png')" width="100%" height="30" click="selectDrawTool('paintbrush')"/>
				
				<mx:HRule width="100%" height="0"/>
				<mx:NumericStepper id="numDrawSize" value="10" minimum="1" stepSize="1" maximum="100" width="100%" change="changeDrawSize()"/>
				<mx:HBox width="100%" horizontalAlign="center" verticalAlign="middle" horizontalGap="0">
					<mx:Image source="local/icons/color_swatch.png"/>
					<mx:ColorPicker width="100%" id="palColor" selectedColor="#800000" height="30" change="changeDrawColor()"/>
				</mx:HBox>
				<mx:Button label="clear" height="30" icon="@Embed('local/icons/picture_delete.png')" id="btnClear" click="clearDraw()"/>
				<mx:Button label="save..." id="btnSave" icon="@Embed('local/icons/picture_save.png')" height="30" click="startSave()"/>
			</mx:ControlBar>
		</mx:Panel>
	</mx:HBox>	
</mx:Application>