greatbody
/
glances
mirror of https://github.com/nicolargo/glances
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge pull request #1044 from notFloran/webui-cloud 

Integrate the new cloud plugin in the webUI
pull/1045/head
Nicolas Hennion 2017-03-05 13:00:11 +01:00 committed by GitHub
parent 5ee81bc9c3 c8ffd34d72
commit c416136070
10 changed files with 97 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
glances/outputs/static/css/style.css
View File

@ -20,6 +20,10 @@ body {
text-align: right;
}
.top-plugin {
margin-bottom: 20px;
}
.plugin {
margin-bottom: 20px;
}

1
glances/outputs/static/html/plugins/cloud.html Normal file
View File

@ -0,0 +1 @@
<span class="title">{{ statsCloud.getProvider() }}</span> {{ statsCloud.getInstance() }}

27
glances/outputs/static/html/stats.html
View File

@ -6,16 +6,25 @@
<div ng-show="arguments.help_tag" class="container-fluid" ng-include src="'help.html'"></div>
<div ng-show="dataLoaded && !arguments.help_tag" class="container-fluid">
<div class="row">
<div class="col-sm-24">
<div class="pull-left">
<section id="system" class="plugin" ng-include src="'plugins/system.html'"></section>
<div class="top-plugin">
<div class="row">
<div class="col-sm-24">
<div class="pull-left">
<section id="system" ng-include src="'plugins/system.html'"></section>
</div>
<div class="pull-left">
<section id="ip" ng-if="statsIp.address != undefined && !arguments.disable_ip" ng-include src="'plugins/ip.html'"></section>
</div>
<div class="pull-right">
<section id="uptime" ng-include src="'plugins/uptime.html'"></section>
</div>
</div>
<div class="pull-left">
<section id="ip" class="plugin" ng-if="statsIp.address != undefined && !arguments.disable_ip" ng-include src="'plugins/ip.html'"></section>
</div>
<div class="pull-right">
<section id="uptime" class="plugin" ng-include src="'plugins/uptime.html'"></section>
</div>
<div class="row" ng-if="statsCloud.getProvider()">
<div class="col-sm-24">
<div class="pull-left">
<section id="cloud" ng-include src="'plugins/cloud.html'"></section>
</div>
</div>
</div>
</div>

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

@ -22,6 +22,7 @@ glancesApp.controller('statsController', function ($scope, $rootScope, $interval
GlancesStats.getData().then(function (data) {
$scope.statsAlert = GlancesStats.getPlugin('alert');
$scope.statsCloud = GlancesStats.getPlugin('cloud');
$scope.statsCpu = GlancesStats.getPlugin('cpu');
$scope.statsDiskio = GlancesStats.getPlugin('diskio');
$scope.statsIrq = GlancesStats.getPlugin('irq');

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

@ -3,6 +3,7 @@ glancesApp.service('GlancesStats', function($http, $injector, $q, GlancesPlugin)
var _plugins = {
'alert': 'GlancesPluginAlert',
'cloud': 'GlancesPluginCloud',
'cpu': 'GlancesPluginCpu',
'diskio': 'GlancesPluginDiskio',
'irq' : 'GlancesPluginIrq',

23
glances/outputs/static/js/services/plugins/cloud.js Normal file
View File

@ -0,0 +1,23 @@
glancesApp.service('GlancesPluginCloud', function() {
var _pluginName = "cloud";
var _provider = null;
var _instance = null;
this.setData = function(data, views) {
data = data[_pluginName];
data = {"region": "R", "instance-type": "IT", "ami-id": "AMI", "instance-id": "IID"};
if (data['ami-id'] !== undefined) {
_provider = 'AWS EC2';
_instance = data['instance-type'] + ' instance ' + data['instance-id'] + ' (' + data['region'] + ')';
}
}
this.getProvider = function() {
return _provider;
}
this.getInstance = function() {
return _instance;
}
});

4
glances/outputs/static/public/css/style.min.css vendored
View File

@ -20,6 +20,10 @@ body {
text-align: right;
}
.top-plugin {
margin-bottom: 20px;
}
.plugin {
margin-bottom: 20px;
}

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

@ -54,6 +54,7 @@ glancesApp.controller('statsController', ["$scope", "$rootScope", "$interval", "
GlancesStats.getData().then(function (data) {
$scope.statsAlert = GlancesStats.getPlugin('alert');
$scope.statsCloud = GlancesStats.getPlugin('cloud');
$scope.statsCpu = GlancesStats.getPlugin('cpu');
$scope.statsDiskio = GlancesStats.getPlugin('diskio');
$scope.statsIrq = GlancesStats.getPlugin('irq');
@ -450,6 +451,7 @@ glancesApp.service('GlancesStats', ["$http", "$injector", "$q", "GlancesPlugin",
var _plugins = {
'alert': 'GlancesPluginAlert',
'cloud': 'GlancesPluginCloud',
'cpu': 'GlancesPluginCpu',
'diskio': 'GlancesPluginDiskio',
'irq' : 'GlancesPluginIrq',
@ -645,6 +647,30 @@ glancesApp.service('GlancesPluginAmps', function() {
}
});
glancesApp.service('GlancesPluginCloud', function() {
var _pluginName = "cloud";
var _provider = null;
var _instance = null;
this.setData = function(data, views) {
data = data[_pluginName];
data = {"region": "R", "instance-type": "IT", "ami-id": "AMI", "instance-id": "IID"};
if (data['ami-id'] !== undefined) {
_provider = 'AWS EC2';
_instance = data['instance-type'] + ' instance ' + data['instance-id'] + ' (' + data['region'] + ')';
}
}
this.getProvider = function() {
return _provider;
}
this.getInstance = function() {
return _instance;
}
});
glancesApp.service('GlancesPluginCpu', function() {
var _pluginName = "cpu";
var _view = {};

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

@ -1,6 +1,7 @@
angular.module('glancesApp').run(['$templateCache', function($templateCache) {$templateCache.put('plugins/alert.html','<div class="table">\n <div class="table-row" ng-repeat="alert in statsAlert.getAlerts()">\n <div class="table-cell text-left">\n{{alert.begin | date : \'yyyy-MM-dd H:mm:ss\'}} ({{ alert.ongoing ? \'ongoing\' : alert.duration }}) - <span ng-hide="alert.ongoing">{{alert.level}} on</span> <span class="{{ alert.level | lowercase }}">{{alert.name}}</span> ({{alert.max}})\n\t\t</div>\n </div>\n</div>\n');
$templateCache.put('plugins/alerts.html','<span class="title" ng-show="!statsAlert.hasAlerts()">No warning or critical alert detected</span>\n<span class="title" ng-show="statsAlert.hasAlerts()">Warning or critical alerts (lasts {{statsAlert.count()}} entries)</span>\n');
$templateCache.put('plugins/amps.html','<div class="table">\n <div class="table-row" ng-repeat="process in statsAmps.processes">\n <div class="table-cell text-left" ng-class="statsAmps.getDescriptionDecoration(process)">{{ process.name }}</div>\n <div class="table-cell text-left">{{ process.count }}</div>\n <div class="table-cell text-left process-result">{{ process.result }}</div>\n </div>\n</div>\n');
$templateCache.put('plugins/cloud.html','<span class="title">{{ statsCloud.getProvider() }}</span> {{ statsCloud.getInstance() }}\n');
$templateCache.put('plugins/cpu.html','<div class="row">\n <div class="col-sm-24 col-md-12 col-lg-8">\n <div class="table">\n <div class="table-row">\n <div class="table-cell text-left title">CPU</div>\n <div class="table-cell">{{ statsCpu.total }}%</div>\n </div>\n <div class="table-row">\n <div class="table-cell text-left">user:</div>\n <div class="table-cell" ng-class="statsCpu.getDecoration(\'user\')">\n {{ statsCpu.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-class="statsCpu.getDecoration(\'system\')">\n {{ statsCpu.system }}%\n </div>\n </div>\n <div class="table-row">\n <div class="table-cell text-left">idle:</div>\n <div class="table-cell">{{ statsCpu.idle }}%</div>\n </div>\n </div>\n </div>\n <div class="hidden-xs hidden-sm col-md-12 col-lg-8">\n <div class="table">\n <div class="table-row">\n <div class="table-cell text-left">nice:</div>\n <div class="table-cell">\n {{ statsCpu.nice }}%\n </div>\n </div>\n <div class="table-row" ng-show="statsCpu.irq != undefined">\n <div class="table-cell text-left">irq:</div>\n <div class="table-cell">\n {{ statsCpu.irq }}%\n </div>\n </div>\n <div class="table-row" ng-show="statsCpu.iowait != undefined">\n <div class="table-cell text-left">iowait:</div>\n <div class="table-cell" ng-class="statsCpu.getDecoration(\'iowait\')">\n {{ statsCpu.iowait }}%\n </div>\n </div>\n <div class="table-row" ng-show="statsCpu.steal != undefined">\n <div class="table-cell text-left">steal:</div>\n <div class="table-cell" ng-class="statsCpu.getDecoration(\'steal\')">\n {{ statsCpu.steal }}%\n </div>\n </div>\n </div>\n </div>\n <div class="hidden-xs hidden-sm hidden-md col-lg-8">\n <div class="table">\n <div class="table-row" ng-if="statsCpu.ctx_switches">\n <div class="table-cell text-left">ctx_sw:</div>\n <div class="table-cell" ng-class="statsCpu.getDecoration(\'ctx_switches\')">\n {{ statsCpu.ctx_switches }}\n </div>\n </div>\n <div class="table-row" ng-if="statsCpu.interrupts">\n <div class="table-cell text-left">inter:</div>\n <div class="table-cell">\n {{ statsCpu.interrupts }}\n </div>\n </div>\n <div class="table-row" ng-if="statsCpu.soft_interrupts">\n <div class="table-cell text-left">sw_int:</div>\n <div class="table-cell">\n {{ statsCpu.soft_interrupts }}\n </div>\n </div>\n <div class="table-row" ng-if="!statsSystem.isLinux() && statsCpu.syscalls">\n <div class="table-cell text-left">syscal:</div>\n <div class="table-cell">\n {{ statsCpu.syscalls }}\n </div>\n </div>\n </div>\n </div>\n</div>\n');
$templateCache.put('plugins/diskio.html','<div class="table-row">\n <div class="table-cell text-left title">DISK I/O</div>\n <div class="table-cell" ng-show="!arguments.diskio_iops">R/s</div>\n <div class="table-cell" ng-show="!arguments.diskio_iops">W/s</div>\n\n <div class="table-cell" ng-show="arguments.diskio_iops">IOR/s</div>\n <div class="table-cell" ng-show="arguments.diskio_iops">IOW/s</div>\n</div>\n<div class="table-row" ng-repeat="disk in statsDiskio.disks">\n <div class="table-cell text-left">{{(disk.alias ? disk.alias : disk.name) | min_size}}</div>\n <div class="table-cell" ng-show="!arguments.diskio_iops">{{disk.bitrate.txps }}</div>\n <div class="table-cell" ng-show="!arguments.diskio_iops">{{disk.bitrate.rxps }}</div>\n\n <div class="table-cell" ng-show="arguments.diskio_iops">{{disk.count.txps }}</div>\n <div class="table-cell" ng-show="arguments.diskio_iops">{{disk.count.rxps }}</div>\n</div>\n');
$templateCache.put('plugins/docker.html','<span class="title">CONTAINERS</span> {{ statsDocker.containers.length }} (served by Docker {{ statsDocker.version }})\n\n<div class="table">\n <div class="table-row">\n <div class="table-cell text-left">Name</div>\n <div class="table-cell">Status</div>\n <div class="table-cell">CPU%</div>\n <div class="table-cell">MEM</div>\n <div class="table-cell">IOR/s</div>\n <div class="table-cell">IOW/s</div>\n <div class="table-cell">RX/s</div>\n <div class="table-cell">TX/s</div>\n <div class="table-cell text-left">Command</div>\n </div>\n <div class="table-row" ng-repeat="container in statsDocker.containers">\n <div class="table-cell text-left">{{ container.name }}</div>\n <div class="table-cell" ng-class="container.status == \'Paused\' ? \'careful\' : \'ok\'">{{ container.status }}</div>\n <div class="table-cell">{{ container.cpu | number:1 }}</div>\n <div class="table-cell">{{ container.memory | bytes }}</div>\n <div class="table-cell">{{ container.ior / container.io_time_since_update | bits }}</div>\n <div class="table-cell">{{ container.iow / container.io_time_since_update | bits }}</div>\n <div class="table-cell">{{ container.rx / container.net_time_since_update | bits }}</div>\n <div class="table-cell">{{ container.tx / container.net_time_since_update | bits }}</div>\n <div class="table-cell text-left">{{ container.command }}</div>\n </div>\n</div>\n');

27
glances/outputs/static/public/stats.html vendored
View File

@ -6,16 +6,25 @@
<div ng-show="arguments.help_tag" class="container-fluid" ng-include src="'help.html'"></div>
<div ng-show="dataLoaded && !arguments.help_tag" class="container-fluid">
<div class="row">
<div class="col-sm-24">
<div class="pull-left">
<section id="system" class="plugin" ng-include src="'plugins/system.html'"></section>
<div class="top-plugin">
<div class="row">
<div class="col-sm-24">
<div class="pull-left">
<section id="system" ng-include src="'plugins/system.html'"></section>
</div>
<div class="pull-left">
<section id="ip" ng-if="statsIp.address != undefined && !arguments.disable_ip" ng-include src="'plugins/ip.html'"></section>
</div>
<div class="pull-right">
<section id="uptime" ng-include src="'plugins/uptime.html'"></section>
</div>
</div>
<div class="pull-left">
<section id="ip" class="plugin" ng-if="statsIp.address != undefined && !arguments.disable_ip" ng-include src="'plugins/ip.html'"></section>
</div>
<div class="pull-right">
<section id="uptime" class="plugin" ng-include src="'plugins/uptime.html'"></section>
</div>
<div class="row" ng-if="statsCloud.getProvider()">
<div class="col-sm-24">
<div class="pull-left">
<section id="cloud" ng-include src="'plugins/cloud.html'"></section>
</div>
</div>
</div>
</div>