gistfile1.js

function handleFileSelect(event) {
	// upload files
	$uploadForm.submit();

	var requestId = $('#uid').val();
	setTimeout(function () {
		updateProgress(requestId);
	}, 10);

	$feedback.fadeIn();
	$progressInner.width(0)
	    .removeClass('danger');

	var $imagePreviews        = $('#image-previews')
	  , $imagePreviewTemplate = $('#image-preview-template');

	$imagePreviews.show();

	// if we can use file api display files instantly
	if (window.File && window.FileReader && window.FileList && window.Blob) {
		var files;
		if (event.dataTransfer !== undefined) {
			files = e.dataTransfer.files; // files from drag and drop
		} else if (event.target !== undefined) {
			files = event.target.files;
		}

		for (var i = 0, f; f = files[i]; i++) {
			if (f.type.match('image.*') === null) {
				continue;
			}

			var reader = new FileReader();
			reader.onload = (function(file, id) {
				return function(e) {
					var $image = $('<img />').attr('alt', '')
					    .attr('src', e.target.result)
					    .attr('title', file.name);

					$imagePreviews.append(createPreviewImageItem($image, id));
                                        // get the upload status for this specific file.
					updateStatus(requestId, file.name);
				}
			})(f, i);

			// Read in the image file as a data URL.
			reader.readAsDataURL(f);
		}
	}
	// else we have to fall back  to downloading the uploaded images
	else {
		updateStatus(requestId, null, function(data) {
			var target = $imagePreviews.attr('target');
			$.each(data, function(name, rpc) {
				if (rpc.response.loaded === true) {
					var image = $('<img />').attr('alt', '')
					    .attr('src', target + '?file=' + rpc.response.name)
					    .attr('title', rpc.response.data.name);

					image.load(function() {
						$imagePreviews.append(
							createPreviewImageItem($(this), rpc.id)
						);
					});
				}
			});
		});
	}
}