<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" 
    width="515"
    verticalGap="8"
    creationComplete="init()">

    <mx:Metadata>
        [Event(name="photoUploaded",type="events.PhotoEvent")]
    </mx:Metadata>
    
    <mx:Script>
        <![CDATA[
            import events.PhotoEvent;
            
            import flash.net.FileFilter;
            import flash.net.FileReference;
            import flash.net.URLRequest;
            
            import mx.collections.ArrayCollection;
            import mx.controls.Alert;
            import mx.validators.Validator;
            
            import valueObjects.Photo;
            
            [Bindable]
            public var categoryData:ArrayCollection;
            private var fileRef:FileReference;
            private var fileBrowsed:Boolean=false;
            
            private function init():void 
            {
                fileRef = new FileReference();
                fileRef.addEventListener(Event.SELECT, browseSelectHandler);
                fileRef.addEventListener(Event.COMPLETE, uploadCompleteHandler);
                resetForm();
            }
            
            public function resetForm():void 
            {
                filename.text='';
                photographerInput.text='';
                descInput.text='';
                fileBrowsed=false;
            }
            
            private function browseForPhoto():void 
            {
                fileRef.browse( [ new FileFilter('Images','*.jpg') ] );
            }
            
            private function browseSelectHandler(event:Event):void 
            {
                fileBrowsed=true;
                filename.text=fileRef.name;
            }
            
            private function uploadFile():void 
            {
                if (validateUpload()) 
                {
                    var request:URLRequest = new URLRequest("ProcessFileUpload.jsp");
                    trace("before upload");
                    fileRef.upload(request);
                    trace("after upload");
                }
            }
            
            private function uploadCompleteHandler(event:Event):void 
            {    
                trace("upload complete");
                var photo:Photo = new Photo();
                photo.photographer=photographerInput.text;
                photo.desc=descInput.text;
                photo.filename=fileRef.name;
                photo.categoryId=categoryList.selectedItem.categoryId;
                var uploadEvent:PhotoEvent = new PhotoEvent(photo, "photoUploaded");
                dispatchEvent(uploadEvent);
            }
            
            private function validateUpload():Boolean 
            {
                if (!fileBrowsed) 
                {
                    Alert.show("Please select an image file to upload", "Error");
                    return false;
                }
                else 
                {
                    var invalidArray:Array = Validator.validateAll([photographerValidator, descValidator]);
                    if (invalidArray.length != 0) 
                    {
                        Alert.show("There are form errors", "Error");
                        return false;   
                    }
                    else 
                    {
                        return true;
                    }
                } 
            }            
        ]]>
    </mx:Script>

    <mx:StringValidator id="photographerValidator"
        source="{photographerInput}"
        property="text"
        triggerEvent=""/>
    <mx:StringValidator id="descValidator"
        source="{descInput}" 
        property="text"
        triggerEvent=""/>

    <mx:Form 
        width="100%"
        paddingBottom="15" 
        paddingLeft="15" 
        paddingRight="15" 
        fontSize="11"
        backgroundColor="#F8E5BB">
        <mx:Label 
            text="Enter your information and upload a file to the gallery." />
        <mx:FormItem 
            label="Photographer:"
            required="true">
            <mx:TextInput id="photographerInput"
                width="284"/>
        </mx:FormItem>
        <mx:FormItem 
            label="Description"
            required="true">
            <mx:TextArea id="descInput"
                width="284"/>
        </mx:FormItem>
        <mx:FormItem 
            label="Category:">
            <mx:ComboBox id="categoryList"
            dataProvider="{categoryData}"
            labelField="category"/>
        </mx:FormItem>
        <mx:FormItem 
            label="Image:"
            direction="horizontal">
            <mx:TextInput 
                id="filename" 
                width="280" 
                editable="false"/>
            <mx:Button id="browseButton"
                label="Browse"
                click="browseForPhoto()"/> 
        </mx:FormItem>
        <mx:FormItem>
            <mx:Button id="uploadButton" 
                label="upload" width="68"
                click="uploadFile()"/>
        </mx:FormItem>
    </mx:Form>
    
    <mx:Image 
        source="assets/fstop/tulips.jpg" />
    
</mx:VBox>