darcyliu/gist:926659

## gistfile1.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

	<title>upload5</title>
	<script src="jquery-1.4.3.js"></script>
</head>

<body>
	<input id="the-file" type="file" multiple="multiple" name="file" />
	<p id="upload-status"></p>
	<p id="progress"></p>
	<div id="result"></div>
	<script>
	document.getElementById('the-file').onchange = function () {
		var fileInput = document.getElementById('the-file');
		var len = fileInput.files.length;
		for(var i=0; i < len; ++i){
			var file = fileInput.files[i];

			var xhr = new XMLHttpRequest();
			xhr.upload.addEventListener('loadstart', onloadstartHandler, false);
			xhr.upload.addEventListener('progress', onprogressHandler, false);
			xhr.upload.addEventListener('load', onloadHandler, false);
			xhr.addEventListener('readystatechange', onreadystatechangeHandler, false);
			xhr.open('POST', 'upload5.php', true);
			//xhr.setRequestHeader("Content-Type", "application/octet-stream");
			xhr.setRequestHeader("Content-Type", file.type);
			xhr.setRequestHeader("X-File-Name", file.name);
			xhr.setRequestHeader('X-File-Size', file.fileSize);
			xhr.send(file); // Simple!
		}

		function onloadstartHandler(evt) {
			$('#upload-status').html('Upload started!');
		}

		function onloadHandler(evt) {
		    $('#upload-status').html('Upload successful!');
		}

		function onprogressHandler(evt) {
			var percent = evt.loaded/evt.total*100;
			$('#progress').html('Progress: ' + percent + '%');
		}

		function onreadystatechangeHandler(evt) {
			var status = null;

			try {
				status = evt.target.status;
			}
			catch(e) {
				return;
			}

			if (status == '200' && evt.target.responseText) {
				$('#progress').html('Progress: 100%');
				$('#result').html('<p>The server saw it as:</p><pre>' + evt.target.responseText + '</pre>');
			}
		}
	}
	</script>

</body>
</html>

## gistfile2.php
<?php
$filename = $_SERVER['HTTP_X_FILE_NAME'];
$filecontent = file_get_contents("php://input");

$t = time();
date_default_timezone_set('Asia/Chongqing');
$times = split(' ', microtime());
//echo strftime("%Y%m%d%H%M%s",$t);//."-".$times[1]."\n";
$pos = strrpos($filename,'.');
if ($pos){
		$file_ext = substr($filename, $pos-strlen($filename));
		$filename = strftime("%Y-%m/%d/%H%M%s",$t).$file_ext;
		$filepath = "upload/".$filename;
		echo $filepath."\n";
		$fp = fopen($filepath, "w");
		fwrite($fp, $filecontent);
		fclose($fp);

		echo "<img src=\"upload/".$filename."\">";
}else{
	echo "Error\n";
}
?>
	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

	<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

	<title>upload5</title>
	<script src="jquery-1.4.3.js"></script>
	</head>

	<body>
	<input id="the-file" type="file" multiple="multiple" name="file" />
	<p id="upload-status"></p>
	<p id="progress"></p>
	<div id="result"></div>
	<script>
	document.getElementById('the-file').onchange = function () {
	var fileInput = document.getElementById('the-file');
	var len = fileInput.files.length;
	for(var i=0; i < len; ++i){
	var file = fileInput.files[i];

	var xhr = new XMLHttpRequest();
	xhr.upload.addEventListener('loadstart', onloadstartHandler, false);
	xhr.upload.addEventListener('progress', onprogressHandler, false);
	xhr.upload.addEventListener('load', onloadHandler, false);
	xhr.addEventListener('readystatechange', onreadystatechangeHandler, false);
	xhr.open('POST', 'upload5.php', true);
	//xhr.setRequestHeader("Content-Type", "application/octet-stream");
	xhr.setRequestHeader("Content-Type", file.type);
	xhr.setRequestHeader("X-File-Name", file.name);
	xhr.setRequestHeader('X-File-Size', file.fileSize);
	xhr.send(file); // Simple!
	}

	function onloadstartHandler(evt) {
	$('#upload-status').html('Upload started!');
	}

	function onloadHandler(evt) {
	$('#upload-status').html('Upload successful!');
	}

	function onprogressHandler(evt) {
	var percent = evt.loaded/evt.total*100;
	$('#progress').html('Progress: ' + percent + '%');
	}

	function onreadystatechangeHandler(evt) {
	var status = null;

	try {
	status = evt.target.status;
	}
	catch(e) {
	return;
	}

	if (status == '200' && evt.target.responseText) {
	$('#progress').html('Progress: 100%');
	$('#result').html('<p>The server saw it as:</p><pre>' + evt.target.responseText + '</pre>');
	}
	}
	}
	</script>

	</body>
	</html>
	<?php
	$filename = $_SERVER['HTTP_X_FILE_NAME'];
	$filecontent = file_get_contents("php://input");

	$t = time();
	date_default_timezone_set('Asia/Chongqing');
	$times = split(' ', microtime());
	//echo strftime("%Y%m%d%H%M%s",$t);//."-".$times[1]."\n";
	$pos = strrpos($filename,'.');
	if ($pos){
	$file_ext = substr($filename, $pos-strlen($filename));
	$filename = strftime("%Y-%m/%d/%H%M%s",$t).$file_ext;
	$filepath = "upload/".$filename;
	echo $filepath."\n";
	$fp = fopen($filepath, "w");
	fwrite($fp, $filecontent);
	fclose($fp);

	echo "<img src=\"upload/".$filename."\">";
	}else{
	echo "Error\n";
	}
	?>