simplefileshare/templates/index.htm

76 lines
2.1 KiB
HTML

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>File Storage</title>
<link rel="stylesheet" href="/style.css">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
</head>
<body>
<header>
<span>
<img src="/favicon.svg" alt="icon">
File Storage
</span>
<label>
<input id="file-uploader" type="file" multiple>
Загрузить файл(ы)
</label>
</header>
<main>
<table>
<col width="*">
<col width="0">
<col width="0">
<tr>
<th>Имя файла</th>
<th>Размер</th>
<th>Дата</th>
</tr>
{{range .Files}} <tr>
<td><img src="/icon?ext={{.Ext}}"> <a href="/download?filename={{.Name}}">{{.Name}}</a> <a class="right" href="/stream?filename={{.Name}}">просмотр</a></td>
<td>
<pre>{{.Size}}</pre>
</td>
<td>{{.Date}}</td>
</tr>
{{end}}
</table>
</main>
<footer>
Файлы хранятся как минимум {{.StorageDuration}} ч.
</footer>
<script>
function myProgressHandler(event) {
var p = Math.floor(event.loaded / event.total * 100);
document.querySelector("label").innerHTML = 'Загрузка: ' + p + '%...';
}
function myOnLoadHandler(event) {
const response = event.currentTarget;
if (response.status != 200) {
alert('Ошибка при загрузке:\n' + response.responseText);
}
document.querySelector("label").innerHTML = 'Загрузка завершена.';
window.location.reload();
}
document.getElementById("file-uploader").addEventListener('change', (e) => {
var formData = new FormData;
var ajax = new XMLHttpRequest;
for (var i = 0; i < document.getElementById("file-uploader").files.length; i++) {
file = document.getElementById("file-uploader").files[i];
formData.append('file', file);
}
ajax.upload.addEventListener("progress", myProgressHandler, false);
ajax.addEventListener('load', myOnLoadHandler, false);
ajax.open('POST', '/upload', true);
ajax.send(formData);
});
</script>
</body>
</html>