Responding to my own question but it seems like I was messing around with this keyword in an inappropriate way. Correct code for sequential async file uploader goes like this:
function XMLHttpUploader(place, targetPHP)
{
upload = function (currentArray, arrayTotalSize) {
var currentFile = currentArray.shift();
if (currentFile) {
var xhr = new XMLHttpRequest();
xhr.open('POST', targetPHP, true);
xhr.setRequestHeader('UP-FILENAME', currentFile.name);
xhr.setRequestHeader('UP-SIZE', currentFile.size);
xhr.setRequestHeader('UP-TYPE', currentFile.type);
xhr.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
var progressBar = document.querySelector('progress');
if (progressBar) {
progressBar.value = Math.round(((arrayTotalSize - currentArray.length) \* 100) / arrayTotalSize);
}
upload(currentArray, arrayTotalSize);
}
}
xhr.onerror = function () {
alert('File transfer failed!');
}
xhr.send(currentFile);
}
else {
var progressBar = document.querySelector('progress');
if (progressBar) {
progressBar.value = 100;
setTimeout("location.reload(true);", 2000);
}
}
}
// Function drop file
this.drop = function(event)
{
event.preventDefault();
var currentArray = new Array();
for (var i = 0; i < event.dataTransfer.files.length; i++) {
currentArray.push(event.dataTransfer.files\[i\]);
}
upload(currentArray, currentArray.length);
}
// The inclusion of the event listeners (DragOver and drop)
this.uploadPlace = document.getElementById(place);
this.uploadPlace.addEventListener("dragover", function(event)
{
event.stopPropagation();
event.preventDefault();
}, true);
this.uploadPlace.addEventListener("drop", this.drop, false);
}
011011010110000101100011011010000110100101101110 0110010101110011