diff --git a/public/js/upload_queue.js b/public/js/upload_queue.js
index dcec3356..75b237de 100644
--- a/public/js/upload_queue.js
+++ b/public/js/upload_queue.js
@@ -45,9 +45,8 @@ UploadQueue.prototype.addPreviewForFile = function(file, index, callback) {
 		return false;
 	}
 
-	var preview = document.createElement('img');
+	var preview = document.createElement('canvas');
 	preview.title = file.name;
-	preview.style.maxHeight = '150px';
 
 	var preview_box = document.getElementById('upload_preview_' + index);
 	preview_box.appendChild(preview);
@@ -55,12 +54,34 @@ UploadQueue.prototype.addPreviewForFile = function(file, index, callback) {
 	var reader = new FileReader();
 	var that = this;
 	reader.addEventListener('load', function() {
-		preview.src = reader.result;
-		if (callback) {
-			preview.addEventListener('load', function() {
+		var original = document.createElement('img');
+		original.src = reader.result;
+
+		original.addEventListener('load', function() {
+			// Preparation: make canvas size proportional to the original image.
+			preview.height = 150;
+			preview.width = preview.height * (original.width / original.height);
+
+			// First pass: resize to 50% on temp canvas.
+			var temp = document.createElement('canvas'),
+				tempCtx = temp.getContext('2d');
+
+			temp.width = original.width * 0.5;
+			temp.height = original.height * 0.5;
+			tempCtx.drawImage(original, 0, 0, temp.width, temp.height);
+
+			// Second pass: resize again on temp canvas.
+			tempCtx.drawImage(temp, 0, 0, temp.width * 0.5, temp.height * 0.5);
+
+			// Final pass: resize to desired size on preview canvas.
+			var context = preview.getContext('2d');
+			context.drawImage(temp, 0, 0, temp.width * 0.5, temp.height * 0.5,
+				0, 0, preview.width, preview.height);
+
+			if (callback) {
 				callback();
-			});
-		}
+			}
+		});
 	}, false);
 	reader.readAsDataURL(file);
 };