Subversion Repositories linkit

[/] [trunk/] [fileUploadApp/] [src/] [main/] [flex/] [com/] [flashdev/] [file/] [FileUpload.mxml] - Rev 1

Compare with Previous | Blame | View Log

<?xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:com="*"
        layout="vertical" width="100%" minWidth="400" height="100%" minHeight="200"
        title="{Localizator.getInstance().getText('msg.welcome')}" creationComplete="initCom()">
        
        <mx:Metadata>
                [Event(name="uploadComplete", type="flash.events.Event")]
                [Event(name="uploadProgress", type="flash.events.ProgressEvent")]
                [Event(name="uploadCancel", type="flash.events.Event")]
                [Event(name="uploadIOError", type="flash.events.IOErrorEvent")]
                [Event(name="uploadSecurityError", type="flash.events.SecurityErrorEvent")]
        </mx:Metadata>

        <mx:Script>
                <![CDATA[
                        
                        /*
                                
                        Written by:
                        Dustin Andrew
                        dustin@flash-dev.com
                        www.flash-dev.com
                        
                        FileUpload
                        
                        Panel component for uploading files.
                        (Icons from http://www.famfamfam.com)
                        
                        LAST UPDATED:
                        12/15/06
                        
                        */
                        
                        import mx.controls.*;
                        import mx.managers.*;
            import mx.events.*;
                        import flash.events.*;
                        import flash.net.*;
            import com.flashdev.utils.Localizator;
                        
            [Bindable]
                        private var _strUploadUrl:String;
            [Bindable]
            private var _maxLeftSpace:Number;
            [Bindable]
            private var _maxFileSize:Number;
            [Bindable]
            private var _showSendButton:Boolean;

                        private var _refAddFiles:FileReferenceList;     
                        private var _refUploadFile:FileReference;
                        private var _arrUploadFiles:Array;
                        private var _numCurrentUpload:Number = 0;                       

            private var _methodHasBeenCalled:Boolean = false;
                        
                        // Set uploadUrl
                        public function set uploadUrl(strUploadUrl:String):void {
                _methodHasBeenCalled = true;
                                _strUploadUrl = strUploadUrl;
                        }

            // Set leftSpace
            public function set leftSpace(leftSpace:Number):void {
                _maxLeftSpace = leftSpace;
            }

            // Set maxFileSize
            public function set maxFileSize(maxFileSize:Number):void {
                _maxFileSize = maxFileSize;
            }

            // Set showSendButton
            public function set showSendButton(showSendButton:String):void {
                _showSendButton = ("true" == showSendButton);
            }
                        
                        // Initalize
                        private function initCom():void {
                ExternalInterface.addCallback("sendFiles", sendFiles);
                                _arrUploadFiles = new Array();                          
                                enableUI();
                                uploadCheck();
                        }
                        
            private function sendFiles():Boolean {
                if (_refAddFiles != null && _refAddFiles.fileList != null &&_refAddFiles.fileList.length > 0) {
                    return  startUpload();
                } else {
                    Alert.show(Localizator.getInstance().getText("msg.upload.nofile"));
                    return false;
                }
            }

                        // Called to add file(s) for upload
                        private function addFiles():void {
                                _refAddFiles = new FileReferenceList();
                                _refAddFiles.addEventListener(Event.SELECT, onSelectFile);
                                _refAddFiles.browse();
                        }
                        
                        // Called when a file is selected
                        private function onSelectFile(event:Event):void {
                                var arrFoundList:Array = new Array();
                                // Get list of files from fileList, make list of files already on upload list
                                for (var i:Number = 0; i < _arrUploadFiles.length; i++) {
                                        for (var j:Number = 0; j < _refAddFiles.fileList.length; j++) {
                                                if (_arrUploadFiles[i].name == _refAddFiles.fileList[j].name) {
                                                        arrFoundList.push(_refAddFiles.fileList[j].name);
                                                        _refAddFiles.fileList.splice(j, 1);
                                                        j--;
                                                }
                                        }
                                }
                                if (_refAddFiles.fileList.length >= 1) {                                
                                        for (var k:Number = 0; k < _refAddFiles.fileList.length; k++) {
                        // check if the file size is > maxFileSize
                        if (_refAddFiles.fileList[k].size > _maxFileSize) {
                            var message:String = Localizator.getInstance().getText("msg.add.fileTooLarge");
                            message += " : ";
                            message += _refAddFiles.fileList[k].name;
                            message += " (";
                            message += formatFileSize(_refAddFiles.fileList[k].size);
                            message += ")\n";
                            message += Localizator.getInstance().getText("msg.add.maxFileSize");
                            message += " : ";
                            message += formatFileSize(_maxFileSize);
                            Alert.show(message);
                        } else {
                            _arrUploadFiles.push({
                                name:_refAddFiles.fileList[k].name,
                                size:formatFileSize(_refAddFiles.fileList[k].size),
                                file:_refAddFiles.fileList[k]});
                        }
                                        }
                                        listFiles.dataProvider = _arrUploadFiles;
                                        listFiles.selectedIndex = _arrUploadFiles.length - 1;
                                }                               
                                if (arrFoundList.length >= 1) {
                    var message:String = Localizator.getInstance().getText("msg.add.duplicate.file");
                    message += " : \n\n";
                    message += arrFoundList.join("\n• ");
                    message += "\n\n";
                    message += Localizator.getInstance().getText("msg.add.duplicate.main");
                                        Alert.show(message, Localizator.getInstance().getText("msg.add.duplicate.topic"));
                                }
                                updateProgBar();
                                scrollFiles();
                                uploadCheck();
                        }
                        
                        // Called to format number to file size
                        private function formatFileSize(numSize:Number):String {
                                var strReturn:String;
                                numSize = Number(numSize / 1024);
                                strReturn = String(numSize.toFixed(1) + " KB");
                                if (numSize > 1024) {
                                        numSize = numSize / 1024;
                                        strReturn = String(numSize.toFixed(1) + " MB");
                                        if (numSize > 1024) {
                                                numSize = numSize / 1024;
                                                strReturn = String(numSize.toFixed(1) + " GB");
                                        }
                                }                               
                                return strReturn;
                        }
                        
                        // Called to remove selected file(s) for upload
                        private function removeFiles():void {
                                var arrSelected:Array = listFiles.selectedIndices;
                                if (arrSelected.length >= 1) {
                                        for (var i:Number = 0; i < arrSelected.length; i++) {
                                                _arrUploadFiles[Number(arrSelected[i])] = null;
                                        }
                                        for (var j:Number = 0; j < _arrUploadFiles.length; j++) {
                                                if (_arrUploadFiles[j] == null) {
                                                        _arrUploadFiles.splice(j, 1);
                                                        j--;
                                                }
                                        }
                                        listFiles.dataProvider = _arrUploadFiles;
                                        listFiles.selectedIndex = 0;                                    
                                }
                                updateProgBar();
                                scrollFiles();
                                uploadCheck();
                        }
                        
                        // Called to check if there is at least one file to upload
                        private function uploadCheck():void {
                                if (_arrUploadFiles.length == 0) {
                                        btnUpload.enabled = false;
                                        listFiles.verticalScrollPolicy = "off";
                                } else {
                                        btnUpload.enabled = true;
                                        listFiles.verticalScrollPolicy = "on";
                                }
                        }
                        
                        // Disable UI control
                        private function disableUI():void {
                                btnAdd.enabled = false;
                                btnRemove.enabled = false;
                                btnUpload.enabled = false;
                                btnCancel.enabled = true;
                                listFiles.enabled = false;
                                listFiles.verticalScrollPolicy = "off";
                        }
                        
                        // Enable UI control
                        private function enableUI():void {
                                btnAdd.enabled = true;
                                btnRemove.enabled = true;
                                btnUpload.enabled = true;
                                btnCancel.enabled = false;
                                listFiles.enabled = true;
                                listFiles.verticalScrollPolicy = "on";
                        }
                        
                        // Scroll listFiles to selected row
                        private function scrollFiles():void {
                                listFiles.verticalScrollPosition = listFiles.selectedIndex;
                                listFiles.validateNow();
                        }
                        
                        // Called to upload file based on current upload number
                        public function startUpload():Boolean {
                                if (_arrUploadFiles.length > 0) {
                    var totalSize:Number = sumFileSize();
                    if (totalSize < _maxLeftSpace) {
                        disableUI();

                        listFiles.selectedIndex = _numCurrentUpload;
                        scrollFiles();

                        // Variables to send along with upload
                        var sendVars:URLVariables = new URLVariables();
                        sendVars.action = "upload";

                        var request:URLRequest = new URLRequest();
                        request.data = sendVars;
                        request.url = _strUploadUrl;
                        request.method = URLRequestMethod.POST;
                        _refUploadFile = new FileReference();
                        _refUploadFile = listFiles.selectedItem.file;
                        _refUploadFile.addEventListener(ProgressEvent.PROGRESS, onUploadProgress);
                        _refUploadFile.addEventListener(Event.COMPLETE, onUploadComplete);
                        _refUploadFile.addEventListener(IOErrorEvent.IO_ERROR, onUploadIoError);
                        _refUploadFile.addEventListener(SecurityErrorEvent.SECURITY_ERROR, onUploadSecurityError);
                        _refUploadFile.upload(request, "file", false);
                        return true;
                    } else {
                        var message:String = Localizator.getInstance().getText("msg.upload.notEnoughSpace");
                        message += "\n";
                        message += Localizator.getInstance().getText("msg.upload.totalSize");
                        message += " : ";
                        message += formatFileSize(totalSize);
                        message += "\n";
                        message += Localizator.getInstance().getText("msg.upload.leftSpace");
                        message += " : ";
                        message += formatFileSize(_maxLeftSpace);
                        Alert.show(message);
                        return false;
                    }
                } else {
                    return false;
                }
            }

            private function doNothing():void { }

            private function sumFileSize():Number {
                var totalSize:Number = 0;
                for (var i:Number = 0; i < _arrUploadFiles.length; i++) {
                    totalSize += _arrUploadFiles[i].file.size;
                }
                return totalSize;
            }
                        
                        // Cancel and clear eventlisteners on last upload
                        private function clearUpload():void {
                                _refUploadFile.removeEventListener(ProgressEvent.PROGRESS, onUploadProgress);
                                _refUploadFile.removeEventListener(Event.COMPLETE, onUploadComplete);
                                _refUploadFile.removeEventListener(IOErrorEvent.IO_ERROR, onUploadIoError);
                                _refUploadFile.removeEventListener(SecurityErrorEvent.SECURITY_ERROR, onUploadSecurityError);
                                _refUploadFile.cancel();
                                _numCurrentUpload = 0;
                                updateProgBar();
                                enableUI();
                        }
                        
                        // Called on upload cancel
                        private function onUploadCanceled():void {
                                clearUpload();
                                dispatchEvent(new Event("uploadCancel"));
                        }
                        
                        // Get upload progress
                        private function onUploadProgress(event:ProgressEvent):void {
                                var numPerc:Number = Math.round((event.bytesLoaded / event.bytesTotal) * 100);
                                updateProgBar(numPerc);
                                var evt:ProgressEvent = new ProgressEvent("uploadProgress", false, false, event.bytesLoaded, event.bytesTotal);
                                dispatchEvent(evt);
                        }
                        
                        // Update progBar
                        private function updateProgBar(numPerc:Number = 0):void {
                                var strLabel:String = (_numCurrentUpload + 1) + "/" + _arrUploadFiles.length;
                                strLabel = (_numCurrentUpload + 1 <= _arrUploadFiles.length && numPerc > 0 && numPerc < 100) ? numPerc + "% - " + strLabel : strLabel;
                                strLabel = (_numCurrentUpload + 1 == _arrUploadFiles.length && numPerc == 100) ? Localizator.getInstance().getText("msg.upload.complete") + " - " + strLabel : strLabel;
                                strLabel = (_arrUploadFiles.length == 0) ? "" : strLabel;
                                progBar.label = strLabel;
                                progBar.setProgress(numPerc, 100);
                                progBar.validateNow();
                        }
                        
                        // Called on upload complete
                        private function onUploadComplete(event:Event):void {
                                _numCurrentUpload++;                            
                                if (_numCurrentUpload < _arrUploadFiles.length) {
                                        startUpload();
                                } else {
                    resetFilesList();
                                        enableUI();
                                        clearUpload();
                    dispatchEvent(new Event("uploadComplete"));
                    notifyUploadComplete();
                                }
                        }

            /** Call javascript method processUploadCompleteEvent()
             */
            private function notifyUploadComplete():void {
                if (ExternalInterface.available) {
                    ExternalInterface.call("processUploadCompleteEvent", "Upload complete !");
                }
            }


            // reset files list :
            private function resetFilesList():void {
                _arrUploadFiles = new Array();                          
                listFiles.dataProvider = _arrUploadFiles;
                listFiles.selectedIndex = 0;
                scrollFiles();
            }
                        
                        // Called on upload io error
                        private function onUploadIoError(event:IOErrorEvent):void {
                                clearUpload();
                                var evt:IOErrorEvent = new IOErrorEvent("uploadIoError", false, false, event.text);
                                dispatchEvent(evt);
                        }
                        
                        // Called on upload security error
                        private function onUploadSecurityError(event:SecurityErrorEvent):void {
                                clearUpload();
                                var evt:SecurityErrorEvent = new SecurityErrorEvent("uploadSecurityError", false, false, event.text);
                                dispatchEvent(evt);
                        }
                        
                        // Change view state
                        private function changeView():void {
                                currentState = (currentState == "mini") ? "" : "mini";
                        }
                        
                ]]>
        </mx:Script>
        
        <mx:states>
                <mx:State name="mini">
                        <mx:SetProperty name="height" value="60"/>
                        <mx:SetProperty name="minHeight" value="60"/>
                        <!--mx:SetStyle target="{btnView}" name="icon" value="@Embed('assets/application_put.png')"/-->
                </mx:State>
        </mx:states>
        
        <mx:transitions>
                <mx:Transition fromState="*" toState="*">
                        <mx:Resize target="{this}" duration="1000"/>
                </mx:Transition>
        </mx:transitions>

    <!-- This is a test !!!>
    <mx:Label id="uploadUrl2" text=" send to {_strUploadUrl}"/>
    <mx:Label id="testI18n" text="{Localizator.getInstance().getText('test')}"/>
    < END of test -->

        <mx:Canvas width="100%" height="100%">
        <mx:Label text="plop"/>
                <mx:DataGrid id="listFiles" left="0" top="0" bottom="0" right="0"
                        allowMultipleSelection="true" verticalScrollPolicy="on"
                        draggableColumns="false" resizableColumns="false" sortableColumns="false">
                        <mx:columns>
                                <mx:DataGridColumn headerText="{Localizator.getInstance().getText('tab.file')}" dataField="name" wordWrap="true"/>
                                <mx:DataGridColumn headerText="{Localizator.getInstance().getText('tab.size')}" dataField="size" width="75" textAlign="right"/>
                        </mx:columns>
                </mx:DataGrid>
        </mx:Canvas>
        <mx:ControlBar horizontalAlign="center" verticalAlign="middle">
                <mx:Button id="btnAdd" toolTip="{Localizator.getInstance().getText('button.add.tooltip')}" click="addFiles()" icon="@Embed('assets/add.png')" width="26"/>
                <mx:Button id="btnRemove" toolTip="{Localizator.getInstance().getText('button.remove.tooltip')}" click="removeFiles()" icon="@Embed('assets/delete.png')" width="26"/>
                <mx:ProgressBar id="progBar" mode="manual" label="" labelPlacement="center" width="100%"/>
                <mx:Button id="btnCancel" toolTip="{Localizator.getInstance().getText('button.cancel.tooltip')}" icon="@Embed('assets/cancel2.png')" width="26" click="onUploadCanceled()"/>
        <mx:Button label="{Localizator.getInstance().getText('button.upload')}" toolTip="{Localizator.getInstance().getText('button.upload.tooltip')}" 
            id="btnUpload" click="startUpload()" icon="@Embed('assets/bullet_go.png')" visible="{_showSendButton}"/>
        </mx:ControlBar>        
</mx:Panel>

Compare with Previous | Blame | View Log