Human readable size with HandleBars helper.

This commit is contained in:
opi 2014-02-14 20:14:09 +01:00
parent 3a9bd7feff
commit 82de203482
2 changed files with 25 additions and 52 deletions

View file

@ -7,6 +7,14 @@ app = Sammy('#main', function (sam) {
// Plugins
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
var storageType;
if (Sammy.Store.isAvailable('session')) {
@ -577,56 +585,21 @@ app = Sammy('#main', function (sam) {
sam.get('#/monitor', function (c) {
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 ?
c.api('/monitor/update-stats', function(data) { // ?
c.api('/monitor/system', function(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) {
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) {
monitorData.network = data;
// Remove useless interface
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);
});

View file

@ -36,15 +36,15 @@
<table class="table table-condensed">
<tr>
<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>
<td>Free</td>
<td>{{system.memory.ram.free}}</td>
<td>{{humanSize system.memory.ram.free}}</td>
</tr>
<tr class="active">
<td>Total</td>
<td>{{system.memory.ram.total}}</td>
<td>{{humanSize system.memory.ram.total}}</td>
</tr>
</table>
@ -52,15 +52,15 @@
<table class="table table-condensed">
<tr>
<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>
<td>Free</td>
<td>{{system.memory.swap.free}}</td>
<td>{{humanSize system.memory.swap.free}}</td>
</tr>
<tr class="active">
<td>Total</td>
<td>{{system.memory.swap.total}}</td>
<td>{{humanSize system.memory.swap.total}}</td>
</tr>
</table>
</div>
@ -147,18 +147,18 @@
<table class="table table-condensed">
<tr>
<td>Cx</td>
<td>{{cx}}</td>
<td>{{cumulative_cx}} (cumulative)</td>
<td>{{humanSize cx}}</td>
<td>{{humanSize cumulative_cx}} (cumulative)</td>
</tr>
<tr>
<td>Rx</td>
<td>{{rx}}</td>
<td>{{cumulative_rx}} (cumulative)</td>
<td>{{humanSize rx}}</td>
<td>{{humanSize cumulative_rx}} (cumulative)</td>
</tr>
<tr>
<td>Tx</td>
<td>{{tx}}</td>
<td>{{cumulative_tx}} (cumulative)</td>
<td>{{humanSize tx}}</td>
<td>{{humanSize cumulative_tx}} (cumulative)</td>
</tr>
</table>
{{/each}}
@ -188,13 +188,13 @@
<td>Mount point</td><td>{{ filesystem.mnt_point }}</td>
</tr>
<tr>
<td>Size</td><td>{{ filesystem.size }}</td>
<td>Size</td><td>{{humanSize filesystem.size }}</td>
</tr>
<tr>
<td>Used</td><td>{{ filesystem.used }}</td>
<td>Used</td><td>{{humanSize filesystem.used }}</td>
</tr>
<tr class="active">
<td>Available</td><td>{{ filesystem.avail }}</td>
<td>Available</td><td>{{humanSize filesystem.avail }}</td>
</tr>
</table>
</div>
@ -202,10 +202,10 @@
<h4>I/O <small>Time since update: {{ io.time_since_update }}</small></h4>
<table class="table table-condensed">
<tr>
<td>Read</td><td>{{ io.read_bytes }}</td>
<td>Read</td><td>{{humanSize io.read_bytes }}</td>
</tr>
<tr>
<td>Write</td><td>{{ io.write_bytes }}</td>
<td>Write</td><td>{{humanSize io.write_bytes }}</td>
</tr>
</table>
</div>