binoculars/awsm-s3tokenvendor_frontend.html

## awsm-s3tokenvendor_frontend.html
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>awsm-s3tokenvendor Example</title>
</head>
<body>

<input id="fileInput" type="file">

<script>
	function uploadFile(accessKey, token, file) {
		var form = new FormData();

		form.append('key', token.s3Key);
		form.append('AWSAccessKeyId', accessKey);
		form.append('acl', 'private');
		form.append('policy', token.policy_b64);
		form.append('signature', token.signature);
		form.append('file', file);

		var xhr = new XMLHttpRequest();

		xhr.onload = function(e) {
			console.log('onload', e);
		};

		xhr.upload.onprogress = function(e) {
			console.log('progress', e);
		};

		xhr.open('POST', 'https://REPLACE_ME.s3.amazonaws.com/', true);
		xhr.send(form);
	}

	var endPoint = 'https://REPLACE_ME.execute-api.us-east-1.amazonaws.com/dev/awsm-s3tokenvendor/vendtoken';

	document.querySelector('#fileInput').onchange = function(e) {
		var files = e.target.files;

		var data = JSON.stringify({
			files: [].map.call(files, function(file) {
				return {
					name: file.name,
					size: file.size
				};
			})
		});

		var xhr = new XMLHttpRequest();

		xhr.onload = function(e) {
			var resp = JSON.parse(e.target.response);
			console.log(resp);

			resp.tokens.forEach(function(token, i) {
				uploadFile(resp.AWS_ACCESS_KEY_ID, token, files[i]);
			});
		};

		xhr.open('POST', endPoint, true);
		xhr.send(data);
	}
</script>

</body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>awsm-s3tokenvendor Example</title>
	</head>
	<body>

	<input id="fileInput" type="file">

	<script>
	function uploadFile(accessKey, token, file) {
	var form = new FormData();

	form.append('key', token.s3Key);
	form.append('AWSAccessKeyId', accessKey);
	form.append('acl', 'private');
	form.append('policy', token.policy_b64);
	form.append('signature', token.signature);
	form.append('file', file);

	var xhr = new XMLHttpRequest();

	xhr.onload = function(e) {
	console.log('onload', e);
	};

	xhr.upload.onprogress = function(e) {
	console.log('progress', e);
	};

	xhr.open('POST', 'https://REPLACE_ME.s3.amazonaws.com/', true);
	xhr.send(form);
	}

	var endPoint = 'https://REPLACE_ME.execute-api.us-east-1.amazonaws.com/dev/awsm-s3tokenvendor/vendtoken';

	document.querySelector('#fileInput').onchange = function(e) {
	var files = e.target.files;

	var data = JSON.stringify({
	files: [].map.call(files, function(file) {
	return {
	name: file.name,
	size: file.size
	};
	})
	});

	var xhr = new XMLHttpRequest();

	xhr.onload = function(e) {
	var resp = JSON.parse(e.target.response);
	console.log(resp);

	resp.tokens.forEach(function(token, i) {
	uploadFile(resp.AWS_ACCESS_KEY_ID, token, files[i]);
	});
	};

	xhr.open('POST', endPoint, true);
	xhr.send(data);
	}
	</script>

	</body>
	</html>