per-file progress bars
This commit is contained in:
parent
30fc8845f0
commit
93da22569c
|
@ -31,6 +31,12 @@ table {
|
|||
margin: 20px auto;
|
||||
}
|
||||
|
||||
tr {
|
||||
background-image: linear-gradient(0deg, #7af, #7af);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 0;
|
||||
}
|
||||
|
||||
tr + tr td {
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
|
|
|
@ -41,6 +41,7 @@ function finishSending() {
|
|||
}
|
||||
socket.close();
|
||||
progressContainer.textContent = "Upload complete!";
|
||||
fileList.style.backgroundColor = "#7af";
|
||||
}
|
||||
|
||||
function sendData() {
|
||||
|
@ -72,6 +73,17 @@ function updateProgress() {
|
|||
}
|
||||
progress.textContent = percentage;
|
||||
progressBarFilled.style.width = percentage;
|
||||
|
||||
const fileEntries = Array.from(fileList.children);
|
||||
for (entry of fileEntries.slice(0, fileIndex)) {
|
||||
entry.style.backgroundSize = "100%";
|
||||
}
|
||||
if (fileIndex < files.length) {
|
||||
const currentFile = files[fileIndex];
|
||||
if (currentFile.size > 0) {
|
||||
fileEntries[fileIndex].style.backgroundSize = `${(byteIndex*100/currentFile.size)}%`;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function updateFiles() {
|
||||
|
|
Loading…
Reference in a new issue