This repository has been archived on 2024-10-24. You can view files and clone it, but cannot push or open issues or pull requests.
NG_2023_Video/templates/video.html
Heorhii Mykhailenko 4d9aecf18e Impoved style
2023-06-15 21:04:28 +03:00

48 lines
No EOL
1.6 KiB
HTML
Executable file

<!DOCTYPE html>
<html lang="en">
<head>
<title>Video editing</title>
</head>
<body>
{% if error %}
<p>{{ error | safe }}</p>
{% endif %}
<p>Video length: {{length}} s</p>
<form method="POST" enctype="multipart/form-data" onsubmit="trackProgress()">
<label for="start">Start (s): </label><br>
<input type="text" id="start" name="start"><br>
<label for="end">End (s): </label><br>
<input type="text" id="end" name="end"><br>
<label for="extension">Recode to (extension): </label><br>
<input type="text" id="extension" name="extension"><br>
<label for="watermark">Watermark: </label><br>
<input type="file" id="watermark" name="watermark"><br>
<label for="email">Send result to email: </label><br>
<input type="email" id="email" name="email" required><br>
<button id="submit" type="submit">Submit</button>
</form>
<progress id="bar" value="0" max="100">0 %</progress>
<script>
function getProgress() {
const urlParams = new URLSearchParams(window.location.search);
const id = urlParams.get('id');
const xhttp = new XMLHttpRequest();
xhttp.onload = function () {
document.getElementById("bar").value = this.responseText;
}
xhttp.open("GET", "/progress?id=" + id, true);
xhttp.send();
}
function trackProgress() {
window.setInterval(() => {
getProgress();
}, 1000);
}
</script>
</body>
</html>