upload: progress bar #471
Massimo Melina committed
Feb 2, 2024 at 09:53 UTC
422beef37059209a11318056be0ca4893aeefe92
2 files changed
+8
-3
frontend/src/index.scss
+4
@@ -452,6 +452,10 @@ button .label {
452
display: inline-block;
453
margin-left: 0.5em;
454
}
455
+.upload-progress-bar {
456
+ display: block;
457
+ width: 100%;
458
+}
459
.upload-list {
460
margin-top: .5em;
461
td:nth-child(1) { width: 0; }
frontend/src/upload.ts
+4
-3
@@ -213,9 +213,10 @@ function FilesList({ entries, actions }: { entries: ToUpload[], actions: { [icon
213
h('td', { className: 'nowrap '}, ..._.map(actions, (cb, icon) =>
214
cb && iconBtn(icon, () => cb(entries[i]))) ),
215
h('td', {}, formatBytes(e.file.size)),
216
- h('td', { className: working ? 'ani-working' : undefined },
217
- e.name || path(entries[i].file),
218
- working && h('span', { className: 'upload-progress' }, formatPerc(progress))
216
+ h('td', {},
217
+ h('span', { className: working ? 'ani-working' : undefined }, e.name || path(entries[i].file)),
218
+ working && h('span', { className: 'upload-progress' }, formatPerc(progress)),
219
+ working && h('progress', { className: 'upload-progress-bar', value: progress, max: 1 }),
220
),
221
),
222
e.comment && h('tr', {}, h('td', { colSpan: 3 }, h('div', { className: 'entry-comment' }, e.comment)) )