itf/itf/static/js/upload/itfUpload.js
2012-10-11 04:38:55 +05:30

129 lines
3.5 KiB
JavaScript

(function($) {
var ItfFileUpload = function(file, Q) {
this.file = file;
this.Q = Q;
this.$li = this.getLi().appendTo(Q.$ul);
};
ItfFileUpload.prototype.upload = function() {
var that = this;
var Q = that.Q;
var fil = this.file;
// console.log("uploading", fil);
var data = Q.getData(fil);
// var $li = this.getLi(no);
Q.isUploading = true;
var url = Q.options.addURL;
this.showProgress();
// $('#progressbar').show();
// $li.addClass("uploading");
this.chunkUploader = ChunkUploader({
'file': fil,
'url': url,
'data': data,
'callback': function(response) {
var data = JSON.parse(response.responseText);
//console.log("data", data);
if (data.resultUrl) {
that.markDone(data);
} else {
that.$progressStatus.html(response.status);
}
},
'progress': that.doProgress
});
};
ItfFileUpload.prototype.showProgress = function() {
this.$elem.find(".fileProgress").show();
};
ItfFileUpload.prototype.doProgress = function() {
};
ItfFileUpload.prototype.getLi = function() {
var that = this;
var $li = $('<li />').addClass("uploadFileItem");
var $title = $('<div />').addClass("uploadFileTitle").text(that.file.name).appendTo($li);
var $progress = $('<div />').addClass("fileProgress").hide().appendTo($li);
var $progressBar = $('<div />').addClass("progressBar").appendTo($progress);
var $progressStatus = $('<div />').addClass("progressStatus").appendTo($progress);
return $li;
};
var ItfUploadQueue = function(options, $elem) {
var that = this;
this.files = [];
this.isUploading = false;
this.len = function() {
return this.files.length;
}
this.$elem = $elem;
this.$ul = $("<ul />").addClass("uploadFileList").appendTo($elem);
};
ItfUploadQueue.prototype.addFile = function(f) {
var that = this;
var fileUpload = new ItfFileUpload(f, that);
this.files.push(fileUpload);
// this.addToList(f);
if (!this.isUploading) {
fileUpload.upload();
}
};
ItfUploadQueue.prototype.getData = function(f) {
var that = this;
return {
'name' f.name,
'id': that.options.id
}
};
$.fn.uploadQueue = function(options) {
var that = this;
var dataOptions = {
//add data- options
}
var o = $.extend({
'id': '0',
'addURL': '/add'
}, options, dataOptions);
var Q = new ItfUploadQueue(o, that);
var $fileInput = $(this).find('input[type=file]'); //If there are any <input type=file> elements with the file drop container, bind to their change event.
if ($fileInput.length > 0) {
$fileInput.change(function() {
var t = this;
for (var i=0; i<t.files.length;i++) {
var f = t.files[i];
Q.addFile(f);
}
});
}
var f = this.get(0); //get DOM object, not jquery element, enable drag / droppability of files from desktop
f.addEventListener("dragenter", function(e) { e.stopPropagation(); e.preventDefault(); return false; }, false);
f.addEventListener("dragover", function(e) { e.stopPropagation(); e.preventDefault(); return false; }, false);
f.addEventListener("drop", function(e) {
e.preventDefault();
e.stopPropagation();
var files = e.dataTransfer.files;
for (var i=0; i<files.length; i++) {
var fil = files[i];
Q.addFile(fil);
}
}, false);
};
})(jQuery);