Class Pot.Signal.DropFile
Defined in: <pot.js>.
Constructor Attributes | Constructor Name and Description |
---|---|
Pot.Signal.DropFile(target, (options))
Drop file constructor.
|
Method Attributes | Method Name and Description |
---|---|
Clear drop events.
|
|
upload(url, (options))
Upload the dropped files with specified options.
|
Class Detail
Pot.Signal.DropFile(target, (options))
Drop file constructor.
// This example using jQuery. var panel = $('<div/>') .css({ position : 'fixed', left : '10%', top : '10%', width : '80%', height : '80%', minHeight : 200, background : '#ccc', border : '2px solid #999', zIndex : 9999999 }) .hide() .text('Drop here') .appendTo('body'); var dropFile = new Pot.DropFile(panel, { onShow : function() { panel.show() }, onHide : function() { panel.hide() }, onDrop : function(files) { panel.text('dropped'); }, onLoadImage : function(data, name, size) { $('<img/>').attr('src', data).appendTo('body'); }, onLoadText : function(data, name, size) { $('<textarea/>').val(data).appendTo('body'); }, onLoadUnknown : function(data, name, size) { $('<textarea/>').val(data).appendTo('body'); }, onLoadEnd : function(files) { this.upload( 'http://www.example.com/', 'dropfiles' ).then(function() { alert('finish upload.'); }); } }); alert("Let's try drag and drop any file from your desktop.");
- Parameters:
- {Element|String} target
- Target element or id.
- {Object|String} (options)
- Options for drop file: ------------------------------------- - onShow : {Function} Should display a message that is able to dropped. - onHide : {Function} Should hide a message that is not able to dropped. - onDrop : {Function} Called when a file is dropped. - onLoadImage : {Function} Called when a file is loaded as image. - onLoadText : {Function} Called when a file is loaded as text. - onLoadUnknown : {Function} Called when a file is loaded as unknown type. - onLoadEnd : {Function} Called when a file is loaded. (i.e. enable to upload). -------------------------------------
- Returns:
- {DropFile} Return an instance of Pot.DropFile.
Method Detail
clearDropEvents()
Clear drop events.
{Function}
upload(url, (options))
Upload the dropped files with specified options.
// This example using jQuery. var panel = $('<div/>') .css({ position : 'fixed', left : '10%', top : '10%', width : '80%', height : '80%', minHeight : 200, background : '#ccc', border : '2px solid #999', zIndex : 9999999 }) .hide() .text('Drop here') .appendTo('body'); var dropFile = new Pot.DropFile(panel, { onShow : function() { panel.show() }, onHide : function() { panel.hide() }, onDrop : function(files) { panel.text('dropped'); }, onLoadImage : function(data, name, size) { $('<img/>').attr('src', data).appendTo('body'); }, onLoadText : function(data, name, size) { $('<textarea/>').val(data).appendTo('body'); }, onLoadUnknown : function(data, name, size) { $('<textarea/>').val(data).appendTo('body'); }, onLoadEnd : function(files) { this.upload( 'http://www.example.com/', 'dropfiles' ).then(function() { alert('finish upload.'); }); } }); alert("Let's try drag and drop any file from your desktop.");
- Parameters:
- {String} url
- Target url to upload.
- {Object|String|*} (options)
- Upload options. Available parameters: ----------------------------------- - key : {String} The file data key name in query string if specify. (default = 'file'). - sendContent : {Object|Array} Other parameters if you need. -----------------------------------
- Returns:
- {Deferred} Return the Pot.Deferred instance.