nicolargo/glances
1
1
Fork 0
mirror of https://github.com/nicolargo/glances.git synced 2024-09-20 09:08:37 +03:00
Code Issues Projects Releases Wiki Activity

Add config to limit the number of processes to display in the web ui

Browse Source
This commit is contained in:
Floran Brutel 2016-12-27 11:45:13 +01:00
parent 723519f6a9
commit 6988b5ea03
9 changed files with 50 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
conf/glances.conf
View File

@ -16,6 +16,8 @@ history_size=28800
[outputs]
# Theme name for the Curses interface: black or white
curse_theme=black
# Limit the number of processes to display in the WebUI
max_processes_display=30
##############################################################################
# plugins

2
glances/outputs/static/html/plugins/processlist.html
View File

@ -13,7 +13,7 @@
<div sortable-th sorter="sorter" column="io_write" class="table-cell hidden-xs hidden-sm" ng-show="statsProcessList.ioReadWritePresent">IOW/s</div>
<div sortable-th sorter="sorter" column="name" class="table-cell text-left">Command</div>
</div>
<div class="table-row" ng-repeat="process in statsProcessList.processes | orderBy:sorter.column:sorter.isReverseColumn(sorter.column)">
<div class="table-row" ng-repeat="process in statsProcessList.processes | orderBy:sorter.column:sorter.isReverseColumn(sorter.column) | limitTo: statsProcessList.getLimit()">
<div class="table-cell" ng-class="statsProcessList.getCpuPercentAlert(process)">{{process.cpu_percent | number:1}}</div>
<div class="table-cell" ng-class="statsProcessList.getMemoryPercentAlert(process)">{{process.memory_percent | number:1}}</div>
<div class="table-cell hidden-xs hidden-sm">{{process.memvirt | bytes}}</div>

3
glances/outputs/static/js/app.js
View File

@ -8,6 +8,9 @@ var glancesApp = angular.module('glancesApp', ['ngRoute'])
help: function(GlancesStats) {
return GlancesStats.getHelp();
},
config: function(GlancesStats) {
return GlancesStats.getConfig();
},
arguments: function(GlancesStats, $route) {
return GlancesStats.getArguments().then(function(arguments) {
var refreshTimeRoute = parseInt($route.current.params.refresh_time);

2
glances/outputs/static/js/controllers.js
View File

@ -1,4 +1,4 @@
glancesApp.controller('statsController', function ($scope, $rootScope, $interval, GlancesStats, help, arguments, favicoService) {
glancesApp.controller('statsController', function ($scope, $rootScope, $interval, GlancesStats, help, config, arguments, favicoService) {
$scope.help = help;
$scope.arguments = arguments;

12
glances/outputs/static/js/services/core/stats.js
View File

@ -1,5 +1,5 @@
glancesApp.service('GlancesStats', function($http, $injector, $q, GlancesPlugin) {
var _stats = [], _views = [], _limits = [];
var _stats = [], _views = [], _limits = [], _config = {};
var _plugins = {
'alert': 'GlancesPluginAlert',
@ -69,6 +69,14 @@ glancesApp.service('GlancesStats', function($http, $injector, $q, GlancesPlugin)
});
};
this.getConfig = function() {
return $http.get('/api/2/config').then(function (response) {
_config = response.data;
return _config;
});
};
this.getArguments = function() {
return $http.get('/api/2/args').then(function (response) {
return response.data;
@ -83,7 +91,7 @@ glancesApp.service('GlancesStats', function($http, $injector, $q, GlancesPlugin)
}
plugin = $injector.get(plugin);
plugin.setData(_stats, _views);
plugin.setData(_stats, _views, _config);
return plugin;
};

10
glances/outputs/static/js/services/plugins/processlist.js
View File

@ -1,11 +1,13 @@
glancesApp.service('GlancesPluginProcessList', function($filter, GlancesPlugin) {
var _pluginName = "processlist";
var _ioReadWritePresent = false;
var _maxProcessesToDisplay = undefined;
this.processes = [];
this.ioReadWritePresent = false;
this.setData = function(data, views) {
this.setData = function(data, views, config) {
this.processes = [];
this.ioReadWritePresent = false;
_maxProcessesToDisplay = config.outputs !== undefined ? config.outputs.max_processes_display : undefined;;
for (var i = 0; i < data[_pluginName].length; i++) {
var process = data[_pluginName][i];
@ -51,4 +53,8 @@ glancesApp.service('GlancesPluginProcessList', function($filter, GlancesPlugin)
this.getMemoryPercentAlert = function(process) {
return GlancesPlugin.getAlert(_pluginName, 'processlist_mem_', process.cpu_percent);
};
this.getLimit = function() {
return _maxProcessesToDisplay;
};
});

2
glances/outputs/static/package.json
View File

@ -2,7 +2,7 @@
"private": true,
"dependencies": {},
"devDependencies": {
"bower": "^1.7.9",
"bower": "^1.8.0",
"del": "^2.2.1",
"gulp": "^3.9.1",
"gulp-angular-templatecache": "^2.0.0",

29
glances/outputs/static/public/js/main.min.js vendored
View File

@ -8,6 +8,9 @@ var glancesApp = angular.module('glancesApp', ['ngRoute'])
help: ["GlancesStats", function(GlancesStats) {
return GlancesStats.getHelp();
}],
config: ["GlancesStats", function(GlancesStats) {
return GlancesStats.getConfig();
}],
arguments: ["GlancesStats", "$route", function(GlancesStats, $route) {
return GlancesStats.getArguments().then(function(arguments) {
var refreshTimeRoute = parseInt($route.current.params.refresh_time);
@ -27,7 +30,7 @@ var glancesApp = angular.module('glancesApp', ['ngRoute'])
$rootScope.title = "Glances";
}]);
glancesApp.controller('statsController', ["$scope", "$rootScope", "$interval", "GlancesStats", "help", "arguments", "favicoService", function ($scope, $rootScope, $interval, GlancesStats, help, arguments, favicoService) {
glancesApp.controller('statsController', ["$scope", "$rootScope", "$interval", "GlancesStats", "help", "config", "arguments", "favicoService", function ($scope, $rootScope, $interval, GlancesStats, help, config, arguments, favicoService) {
$scope.help = help;
$scope.arguments = arguments;
@ -413,7 +416,7 @@ var keycodes = {
'r' : '82',
'q' : '81',
'A' : '65',
'R' : '82',
'Q' : '81'
}
glancesApp.service('favicoService', function() {
@ -432,7 +435,7 @@ glancesApp.service('favicoService', function() {
});
glancesApp.service('GlancesStats', ["$http", "$injector", "$q", "GlancesPlugin", function($http, $injector, $q, GlancesPlugin) {
var _stats = [], _views = [], _limits = [];
var _stats = [], _views = [], _limits = [], _config = {};
var _plugins = {
'alert': 'GlancesPluginAlert',
@ -502,6 +505,14 @@ glancesApp.service('GlancesStats', ["$http", "$injector", "$q", "GlancesPlugin",
});
};
this.getConfig = function() {
return $http.get('/api/2/config').then(function (response) {
_config = response.data;
return _config;
});
};
this.getArguments = function() {
return $http.get('/api/2/args').then(function (response) {
return response.data;
@ -516,7 +527,7 @@ glancesApp.service('GlancesStats', ["$http", "$injector", "$q", "GlancesPlugin",
}
plugin = $injector.get(plugin);
plugin.setData(_stats, _views);
plugin.setData(_stats, _views, _config);
return plugin;
};
@ -1112,12 +1123,14 @@ glancesApp.service('GlancesPluginProcessCount', function() {
glancesApp.service('GlancesPluginProcessList', ["$filter", "GlancesPlugin", function($filter, GlancesPlugin) {
var _pluginName = "processlist";
var _ioReadWritePresent = false;
var _maxProcessesToDisplay = undefined;
this.processes = [];
this.ioReadWritePresent = false;
this.setData = function(data, views) {
this.setData = function(data, views, config) {
this.processes = [];
this.ioReadWritePresent = false;
_maxProcessesToDisplay = config.outputs !== undefined ? config.outputs.max_processes_display : undefined;;
for (var i = 0; i < data[_pluginName].length; i++) {
var process = data[_pluginName][i];
@ -1163,6 +1176,10 @@ glancesApp.service('GlancesPluginProcessList', ["$filter", "GlancesPlugin", func
this.getMemoryPercentAlert = function(process) {
return GlancesPlugin.getAlert(_pluginName, 'processlist_mem_', process.cpu_percent);
};
this.getLimit = function() {
return _maxProcessesToDisplay;
};
}]);
glancesApp.service('GlancesPluginQuicklook', function() {

2
glances/outputs/static/public/js/templates.min.js vendored
View File

@ -16,7 +16,7 @@ $templateCache.put('plugins/network.html','<div class="table-row">\n <div cla
$templateCache.put('plugins/per_cpu.html','<div class="table">\n <div class="table-row">\n <div class="table-cell text-left title">PER CPU</div>\n <div class="table-cell" ng-repeat="percpu in statsPerCpu.cpus">{{ percpu.total }}%</div>\n </div>\n <div class="table-row">\n <div class="table-cell text-left">user:</div>\n <div class="table-cell" ng-repeat="percpu in statsPerCpu.cpus" ng-class="statsPerCpu.getUserAlert(percpu)">\n {{ percpu.user }}%\n </div>\n </div>\n <div class="table-row">\n <div class="table-cell text-left">system:</div>\n <div class="table-cell" ng-repeat="percpu in statsPerCpu.cpus" ng-class="statsPerCpu.getSystemAlert(percpu)">\n {{ percpu.system }}%\n </div>\n </div>\n <div class="table-row">\n <div class="table-cell text-left">idle:</div>\n <div class="table-cell" ng-repeat="percpu in statsPerCpu.cpus">{{ percpu.idle }}%</div>\n </div>\n <div class="table-row" ng-show="statsPerCpu.cpus[0].iowait">\n <div class="table-cell text-left">iowait:</div>\n <div class="table-cell" ng-repeat="percpu in statsPerCpu.cpus" ng-class="statsPerCpu.getSystemAlert(percpu)">\n {{ percpu.iowait }}%\n </div>\n </div>\n <div class="table-row" ng-show="statsPerCpu.cpus[0].steal">\n <div class="table-cell text-left">steal:</div>\n <div class="table-cell" ng-repeat="percpu in statsPerCpu.cpus" ng-class="statsPerCpu.getSystemAlert(percpu)">\n {{ percpu.steal }}%\n </div>\n </div>\n</div>\n');
$templateCache.put('plugins/ports.html','<div class="table-row" ng-repeat="port in statsPorts.ports">\n <div class="table-cell text-left">{{(port.description ? port.description : port.host + \' \' + port.port) | min_size: 20}}</div>\n <div class="table-cell"></div>\n <div ng-switch="port.status" ng-class="statsPorts.getDecoration(port)" class="table-cell">\n <span ng-switch-when="null">Scanning</span>\n <span ng-switch-when="false">Timeout</span>\n <span ng-switch-when="true">Open</span>\n <span ng-switch-default>{{port.status * 1000.0 | number:0}}ms</span>\n </div>\n</div>\n');
$templateCache.put('plugins/processcount.html','<span class="title">TASKS</span>\n<span>{{ statsProcessCount.total }} ({{ statsProcessCount.thread }} thr),</span>\n<span>{{ statsProcessCount.running }} run,</span>\n<span>{{ statsProcessCount.sleeping }} slp,</span>\n<span>{{ statsProcessCount.stopped }} oth</span>\n<span> sorted {{ sorter.auto ? \'automatically\' : \'\' }} by {{ sorter.getColumnLabel(sorter.column) }}, flat view</span>\n');
$templateCache.put('plugins/processlist.html','<div class="table">\n <div class="table-row">\n <div sortable-th sorter="sorter" column="cpu_percent" class="table-cell">CPU%</div>\n <div sortable-th sorter="sorter" column="memory_percent" class="table-cell">MEM%</div>\n <div class="table-cell hidden-xs hidden-sm">VIRT</div>\n <div class="table-cell hidden-xs hidden-sm">RES</div>\n <div class="table-cell">PID</div>\n <div sortable-th sorter="sorter" column="username" class="table-cell text-left">USER</div>\n <div class="table-cell">NI</div>\n <div class="table-cell">S</div>\n <div sortable-th sorter="sorter" column="timemillis" class="table-cell hidden-xs hidden-sm">TIME+</div>\n <div sortable-th sorter="sorter" column="io_read" class="table-cell hidden-xs hidden-sm" ng-show="statsProcessList.ioReadWritePresent">IOR/s</div>\n <div sortable-th sorter="sorter" column="io_write" class="table-cell hidden-xs hidden-sm" ng-show="statsProcessList.ioReadWritePresent">IOW/s</div>\n <div sortable-th sorter="sorter" column="name" class="table-cell text-left">Command</div>\n </div>\n <div class="table-row" ng-repeat="process in statsProcessList.processes | orderBy:sorter.column:sorter.isReverseColumn(sorter.column)">\n <div class="table-cell" ng-class="statsProcessList.getCpuPercentAlert(process)">{{process.cpu_percent | number:1}}</div>\n <div class="table-cell" ng-class="statsProcessList.getMemoryPercentAlert(process)">{{process.memory_percent | number:1}}</div>\n <div class="table-cell hidden-xs hidden-sm">{{process.memvirt | bytes}}</div>\n <div class="table-cell hidden-xs hidden-sm">{{process.memres | bytes}}</div>\n <div class="table-cell">{{process.pid}}</div>\n <div class="table-cell text-left">{{process.username}}</div>\n <div class="table-cell" ng-class="{nice: process.isNice}">{{process.nice | exclamation}}</div>\n <div class="table-cell" ng-class="{status: process.status == \'R\'}">{{process.status}}</div>\n <div class="table-cell hidden-xs hidden-sm">\n <span ng-show="process.timeplus.hours > 0" class="highlight">{{ process.timeplus.hours }}h</span>{{ process.timeplus.minutes | leftPad:2:\'0\' }}:{{ process.timeplus.seconds | leftPad:2:\'0\' }}<span ng-show="process.timeplus.hours <= 0">.{{ process.timeplus.milliseconds | leftPad:2:\'0\' }}</span>\n </div>\n <div class="table-cell hidden-xs hidden-sm" ng-show="statsProcessList.ioReadWritePresent">{{process.ioRead}}</div>\n <div class="table-cell hidden-xs hidden-sm" ng-show="statsProcessList.ioReadWritePresent">{{process.ioWrite}}</div>\n <div class="table-cell text-left" ng-show="arguments.process_short_name">{{process.name}}</div>\n <div class="table-cell text-left" ng-show="!arguments.process_short_name">{{process.cmdline}}</div>\n </div>\n</div>\n');
$templateCache.put('plugins/processlist.html','<div class="table">\n <div class="table-row">\n <div sortable-th sorter="sorter" column="cpu_percent" class="table-cell">CPU%</div>\n <div sortable-th sorter="sorter" column="memory_percent" class="table-cell">MEM%</div>\n <div class="table-cell hidden-xs hidden-sm">VIRT</div>\n <div class="table-cell hidden-xs hidden-sm">RES</div>\n <div class="table-cell">PID</div>\n <div sortable-th sorter="sorter" column="username" class="table-cell text-left">USER</div>\n <div class="table-cell">NI</div>\n <div class="table-cell">S</div>\n <div sortable-th sorter="sorter" column="timemillis" class="table-cell hidden-xs hidden-sm">TIME+</div>\n <div sortable-th sorter="sorter" column="io_read" class="table-cell hidden-xs hidden-sm" ng-show="statsProcessList.ioReadWritePresent">IOR/s</div>\n <div sortable-th sorter="sorter" column="io_write" class="table-cell hidden-xs hidden-sm" ng-show="statsProcessList.ioReadWritePresent">IOW/s</div>\n <div sortable-th sorter="sorter" column="name" class="table-cell text-left">Command</div>\n </div>\n <div class="table-row" ng-repeat="process in statsProcessList.processes | orderBy:sorter.column:sorter.isReverseColumn(sorter.column) | limitTo: statsProcessList.getLimit()">\n <div class="table-cell" ng-class="statsProcessList.getCpuPercentAlert(process)">{{process.cpu_percent | number:1}}</div>\n <div class="table-cell" ng-class="statsProcessList.getMemoryPercentAlert(process)">{{process.memory_percent | number:1}}</div>\n <div class="table-cell hidden-xs hidden-sm">{{process.memvirt | bytes}}</div>\n <div class="table-cell hidden-xs hidden-sm">{{process.memres | bytes}}</div>\n <div class="table-cell">{{process.pid}}</div>\n <div class="table-cell text-left">{{process.username}}</div>\n <div class="table-cell" ng-class="{nice: process.isNice}">{{process.nice | exclamation}}</div>\n <div class="table-cell" ng-class="{status: process.status == \'R\'}">{{process.status}}</div>\n <div class="table-cell hidden-xs hidden-sm">\n <span ng-show="process.timeplus.hours > 0" class="highlight">{{ process.timeplus.hours }}h</span>{{ process.timeplus.minutes | leftPad:2:\'0\' }}:{{ process.timeplus.seconds | leftPad:2:\'0\' }}<span ng-show="process.timeplus.hours <= 0">.{{ process.timeplus.milliseconds | leftPad:2:\'0\' }}</span>\n </div>\n <div class="table-cell hidden-xs hidden-sm" ng-show="statsProcessList.ioReadWritePresent">{{process.ioRead}}</div>\n <div class="table-cell hidden-xs hidden-sm" ng-show="statsProcessList.ioReadWritePresent">{{process.ioWrite}}</div>\n <div class="table-cell text-left" ng-show="arguments.process_short_name">{{process.name}}</div>\n <div class="table-cell text-left" ng-show="!arguments.process_short_name">{{process.cmdline}}</div>\n </div>\n</div>\n');
$templateCache.put('plugins/quicklook.html','<div class="cpu-name">\n {{ statsQuicklook.cpu_name }}\n</div>\n<div class="table">\n <div class="table-row" ng-show="!arguments.percpu">\n <div class="table-cell text-left">CPU</div>\n <div class="table-cell">\n <div class="progress">\n <div class="progress-bar progress-bar-{{ statsQuicklook.getDecoration(\'cpu\') }}" role="progressbar" aria-valuenow="{{ statsQuicklook.cpu }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ statsQuicklook.cpu }}%;">\n &nbsp;\n </div>\n </div>\n </div>\n <div class="table-cell">\n {{ statsQuicklook.cpu }}%\n </div>\n </div>\n <div class="table-row" ng-show="arguments.percpu" ng-repeat="percpu in statsQuicklook.percpus">\n <div class="table-cell text-left">CPU{{ percpu.number }}</div>\n <div class="table-cell">\n <div class="progress">\n <div class="progress-bar progress-bar-{{ statsQuicklook.getDecoration(\'cpu\') }}" role="progressbar" aria-valuenow="{{ percpu.total }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ percpu.total }}%;">\n &nbsp;\n </div>\n </div>\n </div>\n <div class="table-cell">\n {{ percpu.total }}%\n </div>\n </div>\n <div class="table-row">\n <div class="table-cell text-left">MEM</div>\n <div class="table-cell">\n <div class="progress">\n <div class="progress-bar progress-bar-{{ statsQuicklook.getDecoration(\'mem\') }}" role="progressbar" aria-valuenow="{{ statsQuicklook.mem }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ statsQuicklook.mem }}%;">\n &nbsp;\n </div>\n </div>\n </div>\n <div class="table-cell">\n {{ statsQuicklook.mem }}%\n </div>\n </div>\n <div class="table-row">\n <div class="table-cell text-left">SWAP</div>\n <div class="table-cell">\n <div class="progress">\n <div class="progress-bar progress-bar-{{ statsQuicklook.getDecoration(\'swap\') }}" role="progressbar" aria-valuenow="{{ statsQuicklook.swap }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ statsQuicklook.swap }}%;">\n &nbsp;\n </div>\n </div>\n </div>\n <div class="table-cell">\n {{ statsQuicklook.swap }}%\n </div>\n </div>\n</div>\n');
$templateCache.put('plugins/raid.html','<div class="table-row">\n <div class="table-cell text-left title">RAID disks</div>\n <div class="table-cell">Used</div>\n <div class="table-cell">Total</div>\n</div>\n<div class="table-row" ng-repeat="disk in statsRaid.disks | orderBy: \'name\'">\n <div class="table-cell text-left">\n {{ disk.type | uppercase }} {{ disk.name }}\n <div class="warning" ng-show="disk.degraded">\u2514\u2500 Degraded mode</div>\n <div ng-show="disk.degraded"> &nbsp; &nbsp;\u2514\u2500 {{ disk.config }}</div>\n\n <div class="critical" ng-show="disk.inactive">\u2514\u2500 Status {{ disk.status }}</div>\n <div ng-show="disk.inactive" ng-repeat="component in disk.components | orderBy: \'number\'">\n &nbsp; &nbsp;{{ $last ? \'\u2514\u2500\' : \'\u251C\u2500\' }} disk {{ component.number }}: {{ component.name }}\n </div>\n </div>\n <div class="table-cell" ng-show="!disk.inactive" ng-class="statsRaid.getAlert(disk)">{{ disk.used }}</div>\n <div class="table-cell" ng-show="!disk.inactive" ng-class="statsRaid.getAlert(disk)">{{ disk.available }}</div>\n</div>');
$templateCache.put('plugins/sensors.html','<div class="table-row">\n <div class="table-cell text-left title">SENSORS</div>\n</div>\n\n<div class="table-row" ng-repeat="sensor in statsSensors.sensors">\n <div class="table-cell text-left">{{ sensor.label }}</div>\n <div class="table-cell">{{ sensor.unit }}</div>\n <div class="table-cell" ng-class="statsSensors.getAlert(sensor)">{{ sensor.value }}</div>\n</div>\n');