filemure/public/filemure.js

66 lines
2.5 KiB
JavaScript
Raw Normal View History

document.addEventListener("DOMContentLoaded", function () {
const dropzone = document.querySelector('html');
2025-02-06 22:35:51 +00:00
let progressDialog = document.querySelector('#upload_progress_dialog')
let progressBar = document.querySelector('#upload_progress')
dropzone.addEventListener('dragover', (e) => {
e.preventDefault();
dropzone.classList.add('dragactive');
});
dropzone.addEventListener('dragleave', (e) => {
dropzone.classList.remove('dragactive');
});
dropzone.addEventListener('drop', (e) => {
e.preventDefault();
dropzone.classList.remove('dragactive');
// Handle dropped files
const files = e.dataTransfer.files;
if (files.length > 0) {
console.log('Files dropped:', files);
2025-02-06 22:35:51 +00:00
for (const file of files) {
// show progress dialog
// warning: this way the progress dialog is shown for each file individually
progressDialog.showModal();
const formData = new FormData();
formData.append('file', file);
2025-02-06 22:35:51 +00:00
const xhr = new XMLHttpRequest();
xhr.upload.addEventListener("progress", (event) => {
if (event.lengthComputable) {
// console.log("upload progress:", event.loaded / event.total);
progressBar.value = 100.0 * event.loaded / event.total;
}
});
xhr.addEventListener("progress", (event) => {
if (event.lengthComputable) {
// console.log("download progress:", event.loaded / event.total);
progressBar.value = event.loaded / event.total;
}
});
xhr.addEventListener("load", (event) => {
console.log(xhr.readyState, xhr.status)
progressDialog.close();
let res = JSON.parse(xhr.response);
window.location = res.redirect;
});
2025-02-06 22:35:51 +00:00
xhr.addEventListener("error", event => {
progressDialog.close();
alert("An error occurred.")
});
xhr.addEventListener("abort", event => {
progressDialog.close();
alert("Upload has been cancelled.")
});
2025-02-06 22:35:51 +00:00
xhr.open('POST', '/upload?target=document', false);
xhr.send(formData);
}
}
});
});