1
Fork 0
mirror of https://github.com/jech/galene.git synced 2024-11-09 18:25:58 +01:00

Better progress indicator for file transfer.

This commit is contained in:
Juliusz Chroboczek 2023-01-16 15:51:40 +01:00
parent 645ba5fb48
commit dbeb75ee0e
2 changed files with 64 additions and 15 deletions

View file

@ -1331,3 +1331,9 @@ header .collapse:hover {
.contextualMenu{ .contextualMenu{
z-index: 2999; z-index: 2999;
} }
.file-progress {
accent-color: #610a86;
margin-left: 10px;
margin-right: 10px;
}

View file

@ -2416,12 +2416,15 @@ function gotFileTransfer(f) {
f.cancel(); f.cancel();
}; };
bno.id = "bno-" + f.fullid(); bno.id = "bno-" + f.fullid();
let status = document.createElement('div'); let status = document.createElement('span');
status.id = 'status-' + f.fullid(); status.id = 'status-' + f.fullid();
if(!f.up) { if(!f.up) {
status.textContent = status.textContent =
'(Choosing "Accept" will disclose your IP address.)'; '(Choosing "Accept" will disclose your IP address.)';
} }
let statusp = document.createElement('p');
statusp.id = 'statusp-' + f.fullid();
statusp.appendChild(status);
let div = document.createElement('div'); let div = document.createElement('div');
div.id = 'file-' + f.fullid(); div.id = 'file-' + f.fullid();
div.appendChild(p); div.appendChild(p);
@ -2429,7 +2432,7 @@ function gotFileTransfer(f) {
div.appendChild(byes); div.appendChild(byes);
if(bno) if(bno)
div.appendChild(bno); div.appendChild(bno);
div.appendChild(status); div.appendChild(statusp);
div.classList.add('message'); div.classList.add('message');
div.classList.add('message-private'); div.classList.add('message-private');
div.classList.add('message-row'); div.classList.add('message-row');
@ -2441,20 +2444,52 @@ function gotFileTransfer(f) {
/** /**
* @param {TransferredFile} f * @param {TransferredFile} f
* @param {string} status * @param {string} status
* @param {number} [value]
*/ */
function setFileStatus(f, status) { function setFileStatus(f, status, value) {
let statusdiv = document.getElementById('status-' + f.fullid()); let statuselt = document.getElementById('status-' + f.fullid());
if(!statusdiv) if(!statuselt)
throw new Error("Couldn't find statusdiv"); throw new Error("Couldn't find statusp");
statusdiv.textContent = status; statuselt.textContent = status;
if(value) {
let progress = document.getElementById('progress-' + f.fullid());
if(!progress || !(progress instanceof HTMLProgressElement))
throw new Error("Couldn't find progress element");
progress.value = value;
let label = document.getElementById('progresstext-' + f.fullid());
let percent = Math.round(100 * value / progress.max);
label.textContent = `${percent}%`;
}
}
/**
* @param {TransferredFile} f
* @param {number} [max]
*/
function createFileProgress(f, max) {
let statusp = document.getElementById('statusp-' + f.fullid());
if(!statusp)
throw new Error("Couldn't find status div");
/** @type HTMLProgressElement */
let progress = document.createElement('progress');
progress.id = 'progress-' + f.fullid();
progress.classList.add('file-progress');
progress.max = max;
progress.value = 0;
statusp.appendChild(progress);
let progresstext = document.createElement('span');
progresstext.id = 'progresstext-' + f.fullid();
progresstext.textContent = '0%';
statusp.appendChild(progresstext);
} }
/** /**
* @param {TransferredFile} f * @param {TransferredFile} f
* @param {boolean} delyes * @param {boolean} delyes
* @param {boolean} delno * @param {boolean} delno
* @param {boolean} [delprogress]
*/ */
function delFileStatusButtons(f, delyes, delno) { function delFileStatusButtons(f, delyes, delno, delprogress) {
let div = document.getElementById('file-' + f.fullid()); let div = document.getElementById('file-' + f.fullid());
if(!div) if(!div)
throw new Error("Couldn't find file div"); throw new Error("Couldn't find file div");
@ -2468,6 +2503,16 @@ function delFileStatusButtons(f, delyes, delno) {
if(bno) if(bno)
div.removeChild(bno); div.removeChild(bno);
} }
if(delprogress) {
let statusp = document.getElementById('statusp-' + f.fullid());
let progress = document.getElementById('progress-' + f.fullid());
let progresstext =
document.getElementById('progresstext-' + f.fullid());
if(progress)
statusp.removeChild(progress);
if(progresstext)
statusp.removeChild(progresstext);
}
} }
/** /**
@ -2481,17 +2526,15 @@ function gotFileTransferEvent(state, data) {
case 'inviting': case 'inviting':
break; break;
case 'connecting': case 'connecting':
delFileStatusButtons(f, true); delFileStatusButtons(f, true, false);
setFileStatus(f, 'Connecting...'); setFileStatus(f, 'Connecting...');
createFileProgress(f, f.size);
break; break;
case 'connected': case 'connected':
if(f.up) setFileStatus(f, f.up ? 'Sending...' : 'Receiving...', f.datalen);
setFileStatus(f, `Sending... ${f.datalen}/${f.size}`);
else
setFileStatus(f, `Receiving... ${f.datalen}/${f.size}`);
break; break;
case 'done': case 'done':
delFileStatusButtons(f, true, true); delFileStatusButtons(f, true, true, true);
setFileStatus(f, 'Done.'); setFileStatus(f, 'Done.');
if(!f.up) { if(!f.up) {
let url = URL.createObjectURL(data); let url = URL.createObjectURL(data);
@ -2505,7 +2548,7 @@ function gotFileTransferEvent(state, data) {
} }
break; break;
case 'cancelled': case 'cancelled':
delFileStatusButtons(f, true, true); delFileStatusButtons(f, true, true, true);
if(data) if(data)
setFileStatus(f, `Cancelled: ${data.toString()}.`); setFileStatus(f, `Cancelled: ${data.toString()}.`);
else else