1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
|
/* jshint -W041 */
/* jshint -W083 */ /*This is for the loop closure I am using in line 143 */
/* jslint browser: true*/
/* global cordova,StatusBar,angular,console,moment */
// This controller generates a graph for events
// the main function is generateChart. I call generate chart with required parameters
// from the template file
// FIXME: I need to clean this up, the animation is stupid because the data loads
// dynamically. I think I should really be using $q.all to animate after we get everything
angular.module('zmApp.controllers').controller('zmApp.EventsGraphsCtrl', ['$ionicPlatform', '$scope', 'ZMDataModel', '$ionicSideMenuDelegate', '$rootScope', '$http', function ($ionicPlatform, $scope, ZMDataModel, $ionicSideMenuDelegate, $rootScope, $http, $element) {
console.log("Inside Graphs controller");
$scope.openMenu = function () {
$ionicSideMenuDelegate.toggleLeft();
};
$scope.$on('$ionicView.loaded', function () {
console.log("**VIEW ** Graph Ctrl Loaded");
});
$scope.$on('$ionicView.enter', function () {
console.log("**VIEW ** Graph Ctrl Entered");
});
$scope.$on('$ionicView.leave', function () {
console.log("**VIEW ** Graph Ctrl Left");
});
$scope.$on('$ionicView.unloaded', function () {
console.log("**VIEW ** Graph Ctrl Unloaded");
});
$scope.navTitle = 'Tab Page';
$scope.leftButtons = [{
type: 'button-icon icon ion-navicon',
tap: function (e) {
$scope.toggleMenu();
}
}];
// $scope.chartObject=[{},{},{},{}];
angular.element(document).ready(function () {
console.log('****DOCUMENT READY******');
});
$scope.generateTCChart = function(id,chartTitle, hrs)
{
var monitors = [];
var dateRange = "";
var startDate = "";
var endDate = "";
$scope.barHeight=$rootScope.devHeight;
if (hrs) {
// Apply a time based filter if I am not watching all events
var cur = moment();
endDate = cur.format("YYYY-MM-DD hh:mm:ss");
startDate = cur.subtract(hrs, 'hours').format("YYYY-MM-DD hh:mm:ss");
console.log("Start and End " + startDate + "==" + endDate);
}
var loginData = ZMDataModel.getLogin();
$scope.data={};
$scope.data = {
labels: [],
datasets: [
{
label: '',
fillColor: 'rgba(151,187,205,0.5)',
strokeColor: 'rgba(151,187,205,0.8)',
highlightFill: 'rgba(0,163,124,0.5)',
// highlightFill: 'rgba(151,187,205,0.75)',
// highlightStroke: 'rgba(151,187,205,1)',
data: []
},
]
};
ZMDataModel.getMonitors(0).then(function (data) {
monitors = data;
var adjustedHeight = monitors.length * 30;
if (adjustedHeight > $rootScope.devHeight) {
$scope.barHeight = adjustedHeight;
console.log ("********* BAR HEIGHT TO "+$scope.barHeight);
}
for (var i = 0; i < monitors.length; i++) {
(function (j) { // loop closure - http is async, so success returns after i goes out of scope
// so we need to bind j to i when http returns so its not out of scope. Gak.
// I much prefer the old days of passing context data from request to response
$scope.data.labels.push(monitors[j].Monitor.Name);
//$scope.chartObject[id].data.push([monitors[j].Monitor.Name,'0','color:#76A7FA','0']);
// $scope.chartObject.data[j+1]=([monitors[j].Monitor.Name,'100','color:#76A7FA','0']);
var dateString = "";
if (hrs) {
dateString = "/StartTime >=:" + startDate + "/EndTime <=:" + endDate;
}
var url = loginData.apiurl +
"/events/index/MonitorId:" + monitors[j].Monitor.Id + dateString +
".json?page=1";
// console.log("Monitor event URL:" + url);
if (!ZMDataModel.isSimulated()) {
$http.get(url /*,{timeout:15000}*/ )
.success(function (data) {
console.log("**** EVENT COUNT FOR MONITOR " +
monitors[j].Monitor.Id + " IS " + data.pagination.count);
$scope.data.datasets[0].data[j] = data.pagination.count;
})
.error(function (data) {
// ideally I should be treating it as an error
// but what I am really doing now is treating it like no events
// works but TBD: make this into a proper error handler
$scope.data.datasets[0].data[j] = 0;
});
} // is not simulated
else // simulated: grab a random event count
{
var rndEventCount = Math.floor(Math.random() * (100 - 20 + 1)) + 20;
$scope.data.datasets[0].data[j] = rndEventCount;
}
})(i); // j
} //for
});
$scope.options = {
responsive: true,
scaleBeginAtZero: true,
scaleShowGridLines: false,
scaleGridLineColor: "rgba(0,0,0,.05)",
scaleGridLineWidth: 1,
barShowStroke: true,
barStrokeWidth: 2,
barValueSpacing: 5,
barDatasetSpacing: 1,
showTooltip: true,
//String - A legend template
// legendTemplate : '<ul class="tc-chart-js-legend"><% for (var i=0; i<datasets.length; i++){%><li><span style="background-color:<%=datasets[i].fillColor%>"></span><%if(datasets[i].label){%><%=datasets[i].label%><%}%></li><%}%></ul>'
};
};
}]);
|
