$(document).ready(function() {
	if (window.File && window.FileReader && window.FileList) {
		log("All file APIs supported");

		var fileList = [];

		$("#list ul li").click(function(e) {
			log("File clicked");
			var fileListPosition = $(this).attr("data-fileList-position");
			var contentHolder = $(this).find(".file-content");
			var close = $(this).find(".close");
			$("#list ul li .file-content.selected, #list ul li .close.selected").removeClass("selected");
			if (fileListPosition < fileList.length) {
				var file = fileList[ $(this).attr("data-fileList-position") ];
				var reader = new FileReader();
				var fileOut = $(this);
				reader.onload = (function(aFile) {
					//alert("reader called " + aFile.target.result);
					return function(e) {
						//alert(e.target.result);
						contentHolder.text(e.target.result).addClass("selected");
						close.addClass("selected");
					};
				})(null);

				reader.readAsText(file);
			}
		});

		$(".close").click(function(e) {
			log("Close clicked");
			e.stopPropagation();
			$(this).parent().find(".file-content").removeClass("selected");
			$(this).removeClass("selected");
		});

		$("#files").change(function(e) {
			handleFiles(e.target.files);
		});

		$("#drop-zone").bind('dragover', function(e) {
			e.preventDefault();
			e.stopPropagation();
		});

		$("#drop-zone").bind('drop', function(e) {
			e.preventDefault();
			e.stopPropagation();
			log("File Dropped");
			handleFiles(e.originalEvent.dataTransfer.files);
		});
	} else {
		log("File API not supported by this browser");
		$("#input").text('Sorry, bra. But your browser doesn\'t support this.');
	}

	function handleFiles(files) {
		$("#list ul li").addClass("available");
		$("#list ul li .file-name").text("Empty");
		$("#list ul li .file-type").text("");
		$("#list ul li .file-size").text("0");
		$("#list ul li .file-content").text("");
		var output = [];
		fileList = [];
		
		for (var i = 0; i < files.length; i++) {
			var f = files[i];
			fileList.push(f);
		}

		$("#list ul li").each(function(i) {
			if (i < files.length) {
				var file = files[i];
				$(this).find(".file-name").text(file.name);
				$(this).find(".file-type").text(file.type || 'n/a');
				$(this).find(".file-size").text(file.size);
				$(this).attr("data-fileList-position", i);
				$(this).removeClass("available");
			}
		});
	}

});

var log = function(msg) {
	$("#log .new").removeClass("new");
	$("#log").prepend('<div class="entry new">' + msg + "</div>");
	//$("#status").text(msg);
};