Add total Download/Upload in title

This commit is contained in:
Emile Nijssen 2021-11-29 18:03:39 +01:00
parent 03e8544097
commit 1b036c3b4c
2 changed files with 21 additions and 19 deletions

View File

@ -154,7 +154,7 @@
</span> </span>
<!-- Transfer TX --> <!-- Transfer TX -->
<span v-if="client.transferTx" title="Download"> <span v-if="client.transferTx":title="'Total Download: ' + bytes(client.transferTx)">
· ·
<svg class="align-middle h-3 inline" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" <svg class="align-middle h-3 inline" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
fill="currentColor"> fill="currentColor">
@ -166,7 +166,7 @@
</span> </span>
<!-- Transfer RX --> <!-- Transfer RX -->
<span v-if="client.transferRx" title="Upload"> <span v-if="client.transferRx" :title="'Total Upload: ' + bytes(client.transferRx)">
· ·
<svg class="align-middle h-3 inline" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" <svg class="align-middle h-3 inline" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
fill="currentColor"> fill="currentColor">

View File

@ -227,26 +227,10 @@ new Vue({
}, },
}, },
filters: { filters: {
bytes,
timeago: value => { timeago: value => {
return timeago().format(value); return timeago().format(value);
}, },
bytes: (bytes, decimals, kib, maxunit) => {
kib = kib || false;
if (bytes === 0) return '0 B';
if (Number.isNaN(parseFloat(bytes)) && !Number.isFinite(bytes)) return 'NaN';
const k = kib ? 1024 : 1000;
const dm = decimals != null && !Number.isNaN(decimals) && decimals >= 0 ? decimals : 2;
const sizes = kib
? ['B', 'KiB', 'MiB', 'GiB', 'TiB', 'PiB', 'EiB', 'ZiB', 'YiB', 'BiB']
: ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB', 'BB'];
let i = Math.floor(Math.log(bytes) / Math.log(k));
if (maxunit !== undefined) {
const index = sizes.indexOf(maxunit);
if (index !== -1) i = index;
}
// eslint-disable-next-line no-restricted-properties
return `${parseFloat((bytes / Math.pow(k, i)).toFixed(dm))} ${sizes[i]}`;
},
}, },
mounted() { mounted() {
this.api = new API(); this.api = new API();
@ -292,3 +276,21 @@ new Vue({
}).catch(console.error); }).catch(console.error);
}, },
}); });
function bytes(bytes, decimals, kib, maxunit) {
kib = kib || false;
if (bytes === 0) return '0 B';
if (Number.isNaN(parseFloat(bytes)) && !Number.isFinite(bytes)) return 'NaN';
const k = kib ? 1024 : 1000;
const dm = decimals != null && !Number.isNaN(decimals) && decimals >= 0 ? decimals : 2;
const sizes = kib
? ['B', 'KiB', 'MiB', 'GiB', 'TiB', 'PiB', 'EiB', 'ZiB', 'YiB', 'BiB']
: ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB', 'BB'];
let i = Math.floor(Math.log(bytes) / Math.log(k));
if (maxunit !== undefined) {
const index = sizes.indexOf(maxunit);
if (index !== -1) i = index;
}
// eslint-disable-next-line no-restricted-properties
return `${parseFloat((bytes / Math.pow(k, i)).toFixed(dm))} ${sizes[i]}`;
}