mirror of
https://github.com/YunoHost/yunohost-admin.git
synced 2024-09-03 20:06:15 +02:00
Human readable size with HandleBars helper.
This commit is contained in:
parent
3a9bd7feff
commit
82de203482
2 changed files with 25 additions and 52 deletions
43
js/app.js
43
js/app.js
|
@ -7,6 +7,14 @@ app = Sammy('#main', function (sam) {
|
||||||
// Plugins
|
// Plugins
|
||||||
sam.use('Handlebars', 'ms');
|
sam.use('Handlebars', 'ms');
|
||||||
|
|
||||||
|
Handlebars.registerHelper('humanSize', function(bytes) {
|
||||||
|
var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
|
||||||
|
if (bytes == 0) return 'n/a';
|
||||||
|
var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
|
||||||
|
return Math.round(bytes / Math.pow(1024, i), 2) + ' ' + sizes[[i]];
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
// Look for supported type of storage to use
|
// Look for supported type of storage to use
|
||||||
var storageType;
|
var storageType;
|
||||||
if (Sammy.Store.isAvailable('session')) {
|
if (Sammy.Store.isAvailable('session')) {
|
||||||
|
@ -577,56 +585,21 @@ app = Sammy('#main', function (sam) {
|
||||||
sam.get('#/monitor', function (c) {
|
sam.get('#/monitor', function (c) {
|
||||||
monitorData = {}
|
monitorData = {}
|
||||||
|
|
||||||
// Put this function elswere ?
|
|
||||||
function bytesToSize(bytes) {
|
|
||||||
var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
|
|
||||||
if (bytes == 0) return 'n/a';
|
|
||||||
var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
|
|
||||||
return Math.round(bytes / Math.pow(1024, i), 2) + ' ' + sizes[[i]];
|
|
||||||
};
|
|
||||||
|
|
||||||
// Why this method ?
|
// Why this method ?
|
||||||
c.api('/monitor/update-stats', function(data) { // ?
|
c.api('/monitor/update-stats', function(data) { // ?
|
||||||
|
|
||||||
c.api('/monitor/system', function(data) {
|
c.api('/monitor/system', function(data) {
|
||||||
monitorData.system = data;
|
monitorData.system = data;
|
||||||
|
|
||||||
// Convert byte to human readable string
|
|
||||||
$.each(monitorData.system.memory, function(k,v) {
|
|
||||||
monitorData.system.memory[k].free = bytesToSize(v.free);
|
|
||||||
monitorData.system.memory[k].used = bytesToSize(v.used);
|
|
||||||
monitorData.system.memory[k].total = bytesToSize(v.total);
|
|
||||||
});
|
|
||||||
|
|
||||||
c.api('/monitor/disk', function(data) {
|
c.api('/monitor/disk', function(data) {
|
||||||
monitorData.disk = data;
|
monitorData.disk = data;
|
||||||
|
|
||||||
// Convert byte to human readable string
|
|
||||||
$.each(monitorData.disk, function(k,v) {
|
|
||||||
monitorData.disk[k].filesystem.avail = bytesToSize(v.filesystem.avail);
|
|
||||||
monitorData.disk[k].filesystem.size = bytesToSize(v.filesystem.size);
|
|
||||||
monitorData.disk[k].filesystem.used = bytesToSize(v.filesystem.used);
|
|
||||||
monitorData.disk[k].io.read_bytes = bytesToSize(v.io.read_bytes);
|
|
||||||
monitorData.disk[k].io.write_bytes = bytesToSize(v.io.write_bytes);
|
|
||||||
});
|
|
||||||
|
|
||||||
c.api('/monitor/network', function(data) {
|
c.api('/monitor/network', function(data) {
|
||||||
monitorData.network = data;
|
monitorData.network = data;
|
||||||
|
|
||||||
// Remove useless interface
|
// Remove useless interface
|
||||||
delete monitorData.network.usage.lo;
|
delete monitorData.network.usage.lo;
|
||||||
|
|
||||||
// Convert byte to human readable string
|
|
||||||
$.each(monitorData.network.usage, function(k,v) {
|
|
||||||
monitorData.network.usage[k].cx = bytesToSize(v.cx);
|
|
||||||
monitorData.network.usage[k].cumulative_cx = bytesToSize(v.cumulative_cx);
|
|
||||||
monitorData.network.usage[k].rx = bytesToSize(v.rx);
|
|
||||||
monitorData.network.usage[k].cumulative_rx = bytesToSize(v.cumulative_rx);
|
|
||||||
monitorData.network.usage[k].tx = bytesToSize(v.tx);
|
|
||||||
monitorData.network.usage[k].cumulative_tx = bytesToSize(v.cumulative_tx);
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
c.view('monitor', monitorData);
|
c.view('monitor', monitorData);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -36,15 +36,15 @@
|
||||||
<table class="table table-condensed">
|
<table class="table table-condensed">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Used</td>
|
<td>Used</td>
|
||||||
<td>{{system.memory.ram.used}} ({{system.memory.ram.percent}} %)</td>
|
<td>{{humanSize system.memory.ram.used}} ({{system.memory.ram.percent}} %)</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Free</td>
|
<td>Free</td>
|
||||||
<td>{{system.memory.ram.free}}</td>
|
<td>{{humanSize system.memory.ram.free}}</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr class="active">
|
<tr class="active">
|
||||||
<td>Total</td>
|
<td>Total</td>
|
||||||
<td>{{system.memory.ram.total}}</td>
|
<td>{{humanSize system.memory.ram.total}}</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
|
|
||||||
|
@ -52,15 +52,15 @@
|
||||||
<table class="table table-condensed">
|
<table class="table table-condensed">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Used</td>
|
<td>Used</td>
|
||||||
<td>{{system.memory.swap.used}} ({{system.memory.swap.percent}} %)</td>
|
<td>{{humanSize system.memory.swap.used}} ({{system.memory.swap.percent}} %)</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Free</td>
|
<td>Free</td>
|
||||||
<td>{{system.memory.swap.free}}</td>
|
<td>{{humanSize system.memory.swap.free}}</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr class="active">
|
<tr class="active">
|
||||||
<td>Total</td>
|
<td>Total</td>
|
||||||
<td>{{system.memory.swap.total}}</td>
|
<td>{{humanSize system.memory.swap.total}}</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
@ -147,18 +147,18 @@
|
||||||
<table class="table table-condensed">
|
<table class="table table-condensed">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Cx</td>
|
<td>Cx</td>
|
||||||
<td>{{cx}}</td>
|
<td>{{humanSize cx}}</td>
|
||||||
<td>{{cumulative_cx}} (cumulative)</td>
|
<td>{{humanSize cumulative_cx}} (cumulative)</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Rx</td>
|
<td>Rx</td>
|
||||||
<td>{{rx}}</td>
|
<td>{{humanSize rx}}</td>
|
||||||
<td>{{cumulative_rx}} (cumulative)</td>
|
<td>{{humanSize cumulative_rx}} (cumulative)</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Tx</td>
|
<td>Tx</td>
|
||||||
<td>{{tx}}</td>
|
<td>{{humanSize tx}}</td>
|
||||||
<td>{{cumulative_tx}} (cumulative)</td>
|
<td>{{humanSize cumulative_tx}} (cumulative)</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
{{/each}}
|
{{/each}}
|
||||||
|
@ -188,13 +188,13 @@
|
||||||
<td>Mount point</td><td>{{ filesystem.mnt_point }}</td>
|
<td>Mount point</td><td>{{ filesystem.mnt_point }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Size</td><td>{{ filesystem.size }}</td>
|
<td>Size</td><td>{{humanSize filesystem.size }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Used</td><td>{{ filesystem.used }}</td>
|
<td>Used</td><td>{{humanSize filesystem.used }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr class="active">
|
<tr class="active">
|
||||||
<td>Available</td><td>{{ filesystem.avail }}</td>
|
<td>Available</td><td>{{humanSize filesystem.avail }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
@ -202,10 +202,10 @@
|
||||||
<h4>I/O <small>Time since update: {{ io.time_since_update }}</small></h4>
|
<h4>I/O <small>Time since update: {{ io.time_since_update }}</small></h4>
|
||||||
<table class="table table-condensed">
|
<table class="table table-condensed">
|
||||||
<tr>
|
<tr>
|
||||||
<td>Read</td><td>{{ io.read_bytes }}</td>
|
<td>Read</td><td>{{humanSize io.read_bytes }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Write</td><td>{{ io.write_bytes }}</td>
|
<td>Write</td><td>{{humanSize io.write_bytes }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Add table
Reference in a new issue