Uploading of new photos now fully working.

public/js/upload_queue.js

@@ -2,6 +2,7 @@ function UploadQueue(options) {
 	this.queue = options.queue_element;
 	this.preview_area = options.preview_area;
 	this.upload_progress = [];
+	this.upload_url = options.upload_url;
 	this.submit = options.submit_button;
 	this.addEvents();
 }
@@ -69,13 +70,45 @@ UploadQueue.prototype.process = function() {
 	var files = this.queue.files;
 	for (var i = 0; i < files.length; i++) {
 		this.setSpinnerLabel("Uploading file " + (i + 1) + " out of " + files.length);
-		this.updateProgress(i, 0.5);
 		var callback = (i !== files.length - 1) ? null : function() {
 			this.hideSpinner();
 		};
+		this.sendFile(files[i], i, callback);
 	};
 };
 
+
+UploadQueue.prototype.sendFile = function(file, index, callback) {
+	// Prepare the request.
+	var that = this;
+	var request = new XMLHttpRequest();
+	request.addEventListener('error', function(event) {
+		that.updateProgress(index, -1);
+	});
+	request.addEventListener('progress', function(event) {
+		that.updateProgress(index, event.loaded / event.total);
+	});
+	request.addEventListener('load', function(event) {
+		that.updateProgress(index, 1);
+		if (request.responseText !== null && request.status === 200) {
+			var obj = JSON.parse(request.responseText);
+			if (obj.error) {
+				alert(obj.error);
+				return;
+			}
+			else if (callback) {
+				callback.call(that, obj);
+			}
+		}
+	});
+
+	var data = new FormData();
+	data.append('uploads', file, file.name);
+
+	request.open('POST', this.upload_url, true);
+	request.send(data);
+};
+
 UploadQueue.prototype.addProgressBar = function(index) {
 	if (index in this.upload_progress) {
 		return;
@@ -99,7 +132,15 @@ UploadQueue.prototype.updateProgress = function(index, progress) {
 	}
 
 	var bar = this.upload_progress[index];
-	bar.style.width = Math.ceil(progress * 100) + '%';
+
+	if (progress >= 0) {
+		bar.style.width = Math.ceil(progress * 100) + '%';
+	} else {
+		bar.style.width = "";
+		if (progress === -1) {
+			bar.className = "error";
+		}
+	}
 };
 
 UploadQueue.prototype.showSpinner = function(sibling, label) {