ZaneYork
/
zoneminder
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use Monitor's WebColour in Host 'Disk Usage' graph

This commit is contained in:
Kyle Johnson 2015-01-26 17:22:57 -05:00
parent e4b1f8a64e
commit 7a5ee71080
3 changed files with 38 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
web/api/app/Controller/HostController.php
View File

@ -61,23 +61,36 @@ class HostController extends AppController {
// Get disk usage for $mid
$usage = shell_exec ("du -sh0 $zm_dir_events/$mid | awk '{print $1}'");
} else {
$monitors = $this->Monitor->find('list');
$monitors = $this->Monitor->find('all', array(
'fields' => array('Id', 'Name', 'WebColour')
));
$usage = array();
// Add each monitor's usage to array
foreach ($monitors as $id => $name) {
foreach ($monitors as $key => $value) {
$id = $value['Monitor']['Id'];
$name = $value['Monitor']['Name'];
$color = $value['Monitor']['WebColour'];
$space = shell_exec ("du -s0 $zm_dir_events/$id | awk '{print $1}'");
if ($space == null) {
$space = 0;
}
$space = $space/1024/1024;
$usage[$name] = rtrim($space);
$usage[$name] = array(
'space' => rtrim($space),
'color' => $color
);
}
// Add total usage to array
$space = shell_exec( "df $zm_dir_events |tail -n1 | awk '{print $3 }'");
$space = $space/1024/1024;
$usage['Total'] = rtrim($space);
$usage['Total'] = array(
'space' => rtrim($space),
'color' => '#F7464A'
);
}
$this->set(array(

34
web/skins/bootstrap/js/controllers.js
View File

@ -333,19 +333,31 @@ ZoneMinder.controller('ConfigController', function($scope, $http, Config) {
});
ZoneMinder.controller('HostController', function($scope, Host) {
Host.getDiskPercent(function(diskPercent) {
Host.getDiskPercent(function(diskPercent) {
var array = [];
angular.forEach(diskPercent.usage, function(value, key) {
var a = {
'value' : Math.floor(value),
'value' : Math.floor(value.space),
'label' : key,
'color' : '#F7464A',
'highlight' : '#FFC870',
'color' : value.color
};
array.push(a);
});
$scope.ddata = array;
});
$scope.doptions = {
responsive: false,
segmentShowStroke : true,
segmentStrokeColor : '#fff',
segmentStrokeWidth : 2,
percentageInnerCutout : 50, // This is 0 for Pie charts
animationSteps : 1,
animationEasing : 'easeOutBounce',
animateRotate : false,
animateScale : false,
legendTemplate : '<ul class="list-inline tc-chart-js-legend"><% for (var i=0; i<segments.length; i++){%><li><span style="color:<%=segments[i].fillColor%>"><%if(segments[i].label){%><%=segments[i].label%>: <%=segments[i].value%>Gb <%}%></span></li><%}%></ul>'
};
});
Host.getLoad(function(load) {
$scope.loadData = {
@ -363,16 +375,4 @@ ZoneMinder.controller('HostController', function($scope, Host) {
};
});
$scope.doptions = {
responsive: false,
segmentShowStroke : true,
segmentStrokeColor : '#fff',
segmentStrokeWidth : 2,
percentageInnerCutout : 50, // This is 0 for Pie charts
animationSteps : 1,
animationEasing : 'easeOutBounce',
animateRotate : false,
animateScale : false,
legendTemplate : '<ul class="tc-chart-js-legend"><% for (var i=0; i<segments.length; i++){%><li><span style="background-color:<%=segments[i].fillColor%>"></span><%if(segments[i].label){%><%=segments[i].label%><%}%></li><%}%></ul>'
};
});

10
web/skins/bootstrap/views/host.php
View File

@ -9,20 +9,18 @@ xhtmlHeaders( __FILE__, 'Host' );
<div class="container-fluid" ng-controller="HostController">
<div class="row">
<div class="col-md-4">
<div class="col-md-3">
<h3>Disk Usage in Gigabytes</h3>
<div class="col-md-6">
<canvas tc-chartjs-polararea chart-data="ddata" chart-options="doptions" width="250px" height="250px" chart-legend="doughnutChart1"></canvas>
</div>
<div class="col-md-6" tc-chartjs-legend="" chart-legend="doughnutChart1"></div>
<div tc-chartjs-legend="" chart-legend="doughnutChart1"></div>
</div> <!-- End disk usage -->
<div class="col-md-4">
<div class="col-md-3">
<h3>CPU Load</h3>
<canvas tc-chartjs-line chart-data="loadData" chart-options="doptions" width="250px" height="250px"></canvas>
<canvas tc-chartjs-line chart-data="loadData" width="250px" height="250px"></canvas>
</div>
</div>