Created
May 31, 2016 09:29
-
-
Save adadgio/e40a5717b93b19ee511dafca56d8f554 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* @namespace \bundles\UploadBundle\Component | |
*/ | |
define(['resumable'], function (Resumable) { | |
'use strict'; | |
var r = null, | |
button = null, | |
uploadedFiles = [], | |
widget = 'ul#upload-widget-list'; // to show each file progress bar in ul > li(s) | |
return { | |
/** | |
* For early initializations | |
*/ | |
init: function (selector, options) { | |
button = selector; | |
r = new Resumable({ | |
target: options.target, | |
//query: { upload_token: 'my_token' }, | |
testChunks: false, | |
fileType: [], | |
}); | |
if(!r.support) { | |
} | |
// callback after file success | |
if (typeof(options.onFileSuccess) !== 'function') { | |
options.onFileSuccess = function () {}; | |
} | |
this.addEventListeners(); | |
}, | |
/** | |
* Show the whole upload widget. | |
*/ | |
showWidget: function () { | |
$(widget).show(); | |
}, | |
/** | |
* Hide the whole upload widget. | |
*/ | |
hideWidget: function () { | |
$(widget).hide(); | |
}, | |
/** | |
* Add event listeners. | |
*/ | |
addEventListeners: function () { | |
var _self = this; | |
// assign browsing to the button | |
r.assignBrowse(document.getElementById(button)); | |
// fired everytime a file upoad prgresses | |
r.on('fileProgress', function (file, event) { | |
// convert file progress (0 to 1) to (0 to 100%) | |
var fid = file.uniqueIdentifier; | |
var progress = Math.round(file.progress() * 100); | |
// add progress to the uploaded item UI | |
var progressUi = uploadedFiles[fid].ui.find('div[data-type="progress-bar"]'); | |
var precentage = progress + '%'; | |
progressUi.text(precentage) | |
progressUi.css({width: precentage}) | |
progressUi.attr('aria-valuenow', parseInt(progress)); | |
}); | |
// fired whenever a file is added via the browser ui | |
r.on('fileAdded', function(file, event) { | |
_self.addUploadedFile(file); | |
r.upload(file.uniqueIdentifier); | |
_self.showWidget(); | |
}); | |
// fired when a file upload is completed | |
r.on('fileSuccess', function (file, event) { | |
// delete uploaded file from out file | |
_self.removeUpoadedFile(file); | |
// _self.options.onFileSuccess(file); // @todo Not working | |
}); | |
}, | |
/** | |
* Add upload file | |
*/ | |
addUploadedFile: function (file) { | |
var fid = file.uniqueIdentifier; | |
var prototype = $(widget).attr('data-prototype'); | |
prototype = prototype.replace(/__filename__/, file.fileName); | |
prototype = prototype.replace(/__filesize__/, file.size); | |
var DOMElement = $(prototype); | |
$(widget).prepend(DOMElement); | |
// add uploaded file to our files list | |
uploadedFiles[fid] = { file: file, ui: DOMElement }; | |
}, | |
/** | |
* Remove uploaded file. | |
* @todo | |
*/ | |
removeUpoadedFile: function (file) { | |
var _self = this; | |
var fid = file.uniqueIdentifier; | |
var ui = uploadedFiles[fid].ui; | |
setTimeout(function () { | |
ui.fadeOut('fast', function () { | |
$(this).remove(); | |
uploadedFiles[fid] = null; | |
delete uploadedFiles[fid]; | |
r.removeFile(fid); | |
if (uploadedFiles.length === 0) { | |
_self.hideWidget(); | |
} | |
}); | |
}, 3500); | |
} | |
}; | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment