VirtIT/web-ft
1
0
Fork 0
Code Issues 3 Pull Requests Releases Wiki Activity

add progress bar

Browse Source
This commit is contained in:
Beu
2025-07-31 10:00:20 +02:00
parent 773e13a441
commit 0c32bbbc57
3 changed files with 87 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
script.js
View File

@@ -28,30 +28,69 @@ function copytoclipboard()
document.execCommand("Copy");
}
function upload_file(file_obj,file_name)
function upload_file(file_obj, file_name)
{
var divresponse = document.getElementById('divresponse');
divresponse.innerHTML = "Uploading file..." ;
const divresponse = document.getElementById('divresponse');
divresponse.innerHTML = "Uploading file...";
const copyToClipboard = document.getElementById('copytoclipboard');
copyToClipboard.style.visibility = "hidden";
const progressContainer = document.getElementById('progress-container');
// Update progress bar
const progressBar = document.getElementById('progress-bar');
progressBar.value = 0;
const progressText = document.getElementById('progress-text');
progressText.innerText = "0%";
progressContainer.style.display = ''; // <- become visible by style
const request = async () => {
var response = await fetch('/index.php?name=' + file_name, {
method: 'PUT',
body: file_obj
// Create XMLHttpRequest for progress tracking
const xhr = new XMLHttpRequest();
// Track upload progress
xhr.upload.addEventListener('progress', function(e) {
if (e.lengthComputable) {
const percentComplete = Math.round((e.loaded / e.total) * 100);
if (progressBar && progressText) {
progressBar.value = percentComplete;
progressText.innerText = percentComplete + '%';
}
}
});
var text = await response.text();
divresponse.innerHTML = text ;
document.getElementById('copytoclipboard').style.visibility = "visible";
if (text.startsWith("http")) {
var fturl = document.getElementsByTagName("fturl");
Array.from(fturl).forEach(tag => tag.innerHTML = text);
}
// Handle completion
xhr.addEventListener('load', function() {
if (xhr.status === 200) {
divresponse.innerHTML = xhr.responseText;
progressContainer.style.display = 'none';
copyToClipboard.style.visibility = 'visible';
if (xhr.responseText.startsWith("http")) {
var fturl = document.getElementsByTagName("fturl");
Array.from(fturl).forEach(tag => tag.innerHTML = xhr.responseText);
}
} else {
divresponse.innerHTML = "Upload failed. Please try again.";
}
});
// Handle errors
xhr.addEventListener('error', function() {
progressContainer.style.display = 'none';
divresponse.innerHTML = "Upload failed. Please try again.";
});
// Setup and send request
xhr.open('PUT', '/index.php?name=' + encodeURIComponent(file_name));
xhr.send(file_obj);
}
request();
}
function change_color_ondrag(event)
{
if (event === "ondragenter")
@@ -65,4 +104,3 @@ function change_color_ondrag(event)
element.classList.remove("dragover");
}
}