Rework disk usage graphs and give more information what is installed where

This commit is contained in:
Johannes Zellner
2019-08-19 16:50:03 +02:00
parent 09f7c35dac
commit 6b4893b854
2 changed files with 39 additions and 40 deletions

View File

@@ -8,10 +8,10 @@
angular.module('Application').controller('GraphsController', ['$scope', '$location', 'Client', function ($scope, $location, Client) {
Client.onReady(function () { if (!Client.getUserInfo().admin) $location.path('/'); });
$scope.diskUsage = {};
$scope.memoryUsageSystem = [];
$scope.memoryUsageApps = [];
$scope.activeApp = null;
$scope.disks = [];
$scope.installedApps = Client.getInstalledApps();
@@ -33,26 +33,6 @@ angular.module('Application').controller('GraphsController', ['$scope', '$locati
return color;
}
function renderDisk(type, free, reserved, used) {
// this will mismatch df output since df -H is SI units (1000)
$scope.diskUsage[type] = {
used: bytesToGigaBytes(used.datapoints[0][0] + reserved.datapoints[0][0]),
free: bytesToGigaBytes(free.datapoints[0][0]),
sum: bytesToGigaBytes(used.datapoints[0][0] + reserved.datapoints[0][0] + free.datapoints[0][0])
};
var tmp = {
datasets: [{
data: [$scope.diskUsage[type].used, $scope.diskUsage[type].free],
backgroundColor: ['#2196F3', '#76E59F']
}],
labels: ['Used', 'Free']
};
var ctx = $('#' + type + 'DiskUsageChart').get(0).getContext('2d');
new Chart(ctx, { type: 'doughnut', data: tmp, options: { legend: { display: false }} });
}
$scope.setMemoryApp = function (app, color) {
$scope.activeApp = app;
@@ -126,22 +106,36 @@ angular.module('Application').controller('GraphsController', ['$scope', '$locati
// https://graphite.readthedocs.io/en/latest/render_api.html#paths-and-wildcards
// on scaleway, for some reason docker devices are collected as part of collectd
// until we figure why just hardcode popular disk devices - https://www.mjmwired.net/kernel/Documentation/devices.txt
Client.disks(function (error, disks) {
Client.disks(function (error, result) {
if (error) return console.log(error);
result.disks.forEach(function (disk, index) {
disk.id = index;
disk.containsPlatformData = disk.filesystem === result.platformDataDisk;
disk.containsBoxData = disk.filesystem === result.boxDataDisk;
disk.containsAppsData = disk.filesystem === result.appsDataDisk;
disk.apps = Object.keys(result.apps).filter(function (appId) { return result.apps[appId] === disk.filesystem; }).map(function (appId) { return Client.getCachedAppSync(appId); });
});
$scope.disks = result.disks;
// /dev/sda1 -> sda1
// /dev/mapper/foo -> mapper_foo (see #348)
var appDataDiskName = disks.appsDataDisk.slice(disks.appsDataDisk.indexOf('/', 1) + 1);
var appDataDiskName = result.appsDataDisk.slice(result.appsDataDisk.indexOf('/', 1) + 1);
appDataDiskName = appDataDiskName.replace(/\//g, '_');
Client.graphs([
'absolute(collectd.localhost.df-' + appDataDiskName + '.df_complex-free)',
'absolute(collectd.localhost.df-' + appDataDiskName + '.df_complex-reserved)',
'absolute(collectd.localhost.df-' + appDataDiskName + '.df_complex-used)'
], '-1min', function (error, data) {
if (error) return console.log(error);
$scope.disks.forEach(function (disk) {
Client.graphs([
'absolute(collectd.localhost.df-' + appDataDiskName + '.df_complex-free)',
'absolute(collectd.localhost.df-' + appDataDiskName + '.df_complex-reserved)',
'absolute(collectd.localhost.df-' + appDataDiskName + '.df_complex-used)'
], '-1min', function (error, data) {
if (error) return console.log(error);
renderDisk('system', data[0], data[1], data[2]);
disk.size = bytesToGigaBytes(data[2].datapoints[0][0] + data[1].datapoints[0][0] + data[0].datapoints[0][0]);
disk.free = bytesToGigaBytes(data[0].datapoints[0][0]);
disk.occupied = bytesToGigaBytes(data[2].datapoints[0][0] + data[1].datapoints[0][0]);
});
});
});
};