xenofem/transbeam
1
0
Fork 0
Code Issues 6 Pull requests Projects Releases Wiki Activity

per-file progress bars

Browse source
This commit is contained in:
xenofem 2022-04-28 02:19:43 -04:00
parent 30fc8845f0
commit 93da22569c
2 changed files with 18 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

6
static/transbeam.css
View file

@ -31,6 +31,12 @@ table {
margin: 20px auto; margin: 20px auto;
} }
tr {
background-image: linear-gradient(0deg, #7af, #7af);
background-repeat: no-repeat;
background-size: 0;
}
tr + tr td { tr + tr td {
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
} }

12
static/transbeam.js
View file

@ -41,6 +41,7 @@ function finishSending() {
} }
socket.close(); socket.close();
progressContainer.textContent = "Upload complete!"; progressContainer.textContent = "Upload complete!";
fileList.style.backgroundColor = "#7af";
} }
function sendData() { function sendData() {
@ -72,6 +73,17 @@ function updateProgress() {
} }
progress.textContent = percentage; progress.textContent = percentage;
progressBarFilled.style.width = 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() { function updateFiles() {