[uploader] View of /upload.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
	<head>
	<link rel="stylesheet" type="text/css" href="style.css" />
	<title>Upload a file!</title>
	</head>
	<body onload="onLoad();">
	<script type="text/javascript">
	<!--
	var fileForm, fiInputs, inLocal, inRemote, txtStatus, http_request;
	var noTip = false;
	var tipServer = "\-\- Filename on server \-\-";

		function makeRequest(url) {
		http_request = false;
		if (window.XMLHttpRequest) { // Mozilla, Safari,...
		http_request = new XMLHttpRequest();
		if (http_request.overrideMimeType) {
			http_request.overrideMimeType('text/xml');
		}
		} else if (window.ActiveXObject) { // IE
		try {
			http_request = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try {
			http_request = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e) {}
		}
		}
		if (!http_request) {
		alert('Cannot create XMLHTTP instance');
		return false;
		}
		http_request.onreadystatechange = getFileOk;
		http_request.open('GET', url, true);
		http_request.send(null);
	}

	function doTip(e, show) {
		if(e == null) return;

		if(show < 2 && noTip) {
		return true;
		} else {
		noTip = false;
		}

		tipText = tipServer;

		if(show > 0) {
		if(e.value == "") {
			e.value = tipText;
		}
		} else if(show < 1) {
		if(e.value == tipText) {
			e.value = "";
		}
		} 
		if(show == -1) {
		noTip = true;
		}
	}

	function clearStatus() {
		txtStatus.removeAttribute("class");
		txtStatus.innerHTML = "Just browse for a file and click upload.";
		return false;
	}

	function setStatus(message, nobtn) {
		var btn = "";
		txtStatus.setAttribute("class", "red");
		if(nobtn == null) {
		btn = '&nbsp;<a href="#" onclick="return clearStatus();">[ ok ]<\/a>';
		}
		txtStatus.innerHTML = message + btn;
	}

	function disableFields(enabled) {
		var element;
		for(e in fiInputs.childNodes) {
		element = fiInputs.childNodes[e];
		if(element.nodeName == "INPUT" && element.type != "file") {
			element.disabled = enabled;
		}
		}
	}

		function checkFile() {
		var filename;

		doTip(inRemote, -1);
		filename = inRemote.value;
		if(filename == "") { filename = inLocal.value; }
		if(filename == "") {
		checkFailed("Choosing a file to upload would help...");
		return false;
		}

		makeRequest("fileok.php?uploadfile=" + filename);
		return false;
	}

		function getFileOk() {
		var response;
		if (http_request.readyState == 4 && http_request.status == 200) {
		response = http_request.responseText.split(' ');
		if(response[0] == "exists") {
			checkFailed("This file already exist on the server, if you accept the suggested filename,<br/>reclick upload or change it.");
			inRemote.value = response[1];
		} else if(response[0] == "ok") {
			setStatus("Everything is okay, uploading file, please wait...", true);
			fileForm.submit();
		}
		} else {
		setStatus("Checking if filename is valid...");
		}
	}

	function checkFailed(why) {
		disableFields(false);
		doTip(inRemote, 2);
		setStatus(why);
	}

	function onLoad() {
		fileForm  = document.getElementById("fileform");
		fiInputs  = document.getElementById("inputs");
		inLocal   = document.getElementById("uploadfile");
		inRemote  = document.getElementById("remotefile");
		txtStatus = document.getElementById("status");
		doTip(inRemote, 1);
		clearStatus();
	}
	//-->
	</script>
	<div id="status">Just browse for a file and click upload.</div>
	<form id="fileform" enctype="multipart/form-data" action="uploader.php"
	method="post" onsubmit="return checkFile();">
	<div id="inputs"><input type="hidden" name="MAX_FILE_SIZE" value="30000000" />
	<input id="uploadfile" type="file" name="uploadfile" /><br/>
	<input id="remotefile" type="text" name="remotefile" onmouseover="doTip(this, 0);" onblur="doTip(this, 2);"
		onmouseout="doTip(this, 1);" onfocus="doTip(this, -1);" /><br/>
	<input type="submit" value="Upload" /></div>
	</form>
	</body>
</html>