ControlDepo 3 UI Upload is multiple file uploader via flash, build on top of Prototype.js
CD3.UI.Upload provides the most basic features handling uploads via flash . It's main purpose it to be used as ground for extensions and plugins. The only requirement is Prototype.js (witch can be downloaded from here).
| Name | Default | Description |
| swf | null | [REQUIRED] the path to the uploader.swf used for uploading ( most of the time a working version of uploader.swf could be found here ) |
| overlay | null | element or element id of the element, who's position will be cloned and uploader.swf will be positioned over |
| width | 1 | starting width of the swf button |
| height | 1 | starting height of the swf button |
| insertInto | null | element in witch uploader.swf will be inserted, if not specified it will have to be inserted manually |
| url | null | [REQUIRED] URL to the server-side script |
| data | null | additional data for the upload request ( example: {product_id: 1} ) |
| fileName | 'file' | File name for the upload ( just like name attribute of input type file ) |
| timeLimit | 0 | Timeout, how many seconds to way for server response. |
| minSize | 0 | Min size of a single file |
| maxSize | 0 | Max size of a single file |
| types | null | Filters for the files, all valid types. Can be a string ( '*.jpg; *.jpeg; *.gif; *.png' ) or object ( { 'Images (*.jpg, *.jpeg, *.gif, *.png)': '*.jpg; *.jpeg; *.gif; *.png' } ) |
| allowDuplicates | false | Can one file be uploaded twice |
| trace | false | Debuging option, flash will call console.log |
| Event | Event.memo | Description | |
| cd3:upload:initialize | Fired when swf object is added to the document | ||
| cd3:upload:select | files, queue | Fired when files are selected | |
| cd3:upload:start | id, file, queue | Fired when upload have started | |
| cd3:upload:progress | id, file, queue, percent, percentTotal | Fired as upload progresses | |
| cd3:upload:completed | id, file, queue, responseText | Fired when file upload have completed succesfully | |
| cd3:upload:error | id, file, queue, message, code | Fired when an error occurs on uploading | |
| cd3:upload:empty | Fired when start method called with no files selected | ||
| cd3:upload:removed | queue | Fired after file was removed from the quque | |
| cd3:upload:mouseover | Fired on mouseover | ||
| cd3:upload:mouseout | Fired on mouseover |
| start() | Start uploading all selected files |
| remove(id) | Remove file from upload queue (by its id) |
| stop() | Stops the current upload queue |
| observe(event, callback) | Observe events on the flash, given events are just initialize, select, progress, ... (with no cd3:upload) |
| observe({event: callback, ...}) | Observe can be call with multiple events and callbacks |
| clonePosition(element) | Swf object clones the position of the given element |
| toElement | Returns reference to swf object (primary to be used by Element#insert) |
CD3.UI.Upload currently is alpha version and is only tested on MacOS X in Firefox 3.5 and Safary 4.
var up = new CD3.UI.Upload({
swf: '/flash/uploader.swf',
url: '/upload.php',
types: { 'Images (*.jpg, *.jpeg, *.gif, *.png)': '*.jpg; *.jpeg; *.gif; *.png' },
overlay: 'browse',
insertInto: 'upload_set'
}, {
'select': MyCustomUpload.onSelect,
'progress': MyCustomUpload.onProgress,
'completed': MyCustomUpload.onCompleted,
'error': MyCustomUpload.onError
});
The demo could be found in showcases/basic in this repo. The only requirement is that uploader.fla is compiled to uploader.swf and the path is set in showcases/basic/basic.js
The CD3.UI.Upload source code is hosted on GitHub.
$ http://github.com/RStankov/CD3.UI.Upload/tree/master
You can fork the CD3.UI.Upload project on GitHub, commit your changes, and send me a pull request. All patches are welcomed :)