This repository has been archived on 2025-02-20. You can view files and clone it, but cannot push or open issues or pull requests.
Files
cavecomm/templates/TEST_UPLOAD.html
2023-09-20 13:40:24 +02:00

68 lines
2.0 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
{{> templateIncludes/style.css.html}}
<script type="text/javascript">
function _(el) {
return document.getElementById(el);
}
function upload() {
var file = _("FILE_SUBMISSION").files[0];
var formdata = new FormData();
formdata.append("FILE_SUBMISSION", file);
var ajax = new XMLHttpRequest();
ajax.upload.addEventListener("progress", progressHandler, false);
ajax.addEventListener("load", completeHandler, false);
ajax.addEventListener("error", errorHandler, false);
ajax.addEventListener("abort", abortHandler, false);
ajax.open("POST", "/fileuploadtestExecution");
ajax.send(formdata);
}
function progressHandler(event) {
_("loadedtotal").innerHTML = "Uploaded " + event.loaded + " bytes of " + event.total;
var percent = (event.loaded / event.total) * 100;
_("progressBar").value = Math.round(percent);
_("status").innerHTML = Math.round(percent) + "% uploaded... please wait";
}
function completeHandler(event) {
_("status").innerHTML = event.target.responseText;
_("progressBar").value = 0;
}
function errorHandler(event) {
_("status").innerHTML = "Upload Failed";
}
function abortHandler(event) {
_("status").innerHTML = "Upload Aborted";
}
</script>
</head>
<body>
<form method="post" enctype="multipart/form-data" action="/fileuploadtestExecution">
<!-- upload of a single file -->
<p>
<label>Add file (single): </label><br/>
<input type="file" name="FILE_SUBMISSION"/>
</p>
<p>
<input type="submit"/>
</p>
</form>
<form method="post" enctype="multipart/form-data">
<input type="file" name="FILE_SUBMISSION" id="FILE_SUBMISSION" onchange="upload()"><br>
<progress id="progressBar" value="0" max="100" style="width:250px;"></progress>
<h2 id="status"></h2>
<p id="loadedtotal"></p>
</form>
</body>
</html>