var koThings = new ko.observableArray();
var allThingsProgress = new ko.observable("0%");
var makeThing = function (file) {
var thing = {};
thing.fileName = file.name;
thing.progress = new ko.observable("0%");
};
$('#filecontainer').fileupload({
url: 'some/url/for/uploads',
dataType: 'json',
singleFileUploads: false,
add: function (e, data) {
//called only once due to singleFileUploads set to false, and due to the way a selection of files uploaded gets handled by the server and the UI.
data.formData = { /*some data for the upload handler on the server*/ };
data.context = data.files;
//add elements via knockout here for each file in data.files
data.files.forEach(function (file) {
koThings.push(makeThing(file));
});
},
progress: function (e, data) {
//this gets called once, for all of the files. Shouldn't it be called several times, once for each file, at a minimum? Possibly even several times per file? Is this even possible?
var progress = parseInt(data.loaded / data.total * 100, 10);
//update an element via knockout - here is where the issue lies, as data.context is an array of the files, and there seems to be no handler for the individual file
//the below code just gets a single "thing" from the koThings array in a quick way.
var thing = ko.utils.arrayFirst(koThings(), function (t) { return t.name == data.name; });
thing.progress(progress + "%");
},
progressall: function (e, data) {
//this gets called once as well.
var progress = parseInt(data.loaded / data.total * 100, 10);
//the below just updates the global progress
allThingsProgress(progress + "%");
}
done: function (e, data) {
//also only called once. if singleFileUploads is changed to true as the basic plugin has by default, this gets called multiple times.
//Due to server and UI restrictions, this cannot be called multiple times.
//process some UI stuff once the selection is done.
}
});