fix for charts hidding when scrolling too fast
Costa Tsaousis (ktsaou) committed
Jan 10, 2016 at 03:49 UTC
01fca1c3cee53e3d9b7a192bebf0009bb84d4596
1 file changed
+82
-53
web/dashboard.js
+82
-53
@@ -227,7 +227,7 @@
227
focus: false,
228
visibility: false,
229
chart_data_url: false,
230
- chart_errors: true, // FIXME
230
+ chart_errors: false, // FIXME
231
chart_timing: false,
232
chart_calls: false,
233
libraries: false,
@@ -1145,20 +1145,28 @@
1145
return false;
1146
}
1147
1148
+ var isHidden = function() {
1149
+ if(typeof that.___chartIsHidden___ !== 'undefined')
1150
+ return true;
1151
+
1152
+ return false;
1153
+ }
1154
+
1155
// hide the chart, when it is not visible - called from isVisible()
1156
var hideChart = function() {
1157
// hide it, if it is not already hidden
1151
- if(typeof that.___chartIsHidden___ !== 'undefined')
1152
- return;
1158
+ if(isHidden() === true) return;
1159
1154
- // we should destroy it
1155
- if(NETDATA.options.current.destroy_on_hide === true) {
1156
- if(that.chart_created === true) init();
1157
- }
1158
- else {
1159
- showRendering();
1160
- that.element_chart.style.display = 'none';
1161
- if(that.element_legend !== null) that.element_legend.style.display = 'none';
1160
+ if(that.chart_created === true) {
1161
+ // we should destroy it
1162
+ if(NETDATA.options.current.destroy_on_hide === true) {
1163
+ init();
1164
+ }
1165
+ else {
1166
+ showRendering();
1167
+ that.element_chart.style.display = 'none';
1168
+ if(that.element_legend !== null) that.element_legend.style.display = 'none';
1169
+ }
1170
}
1171
1172
that.___chartIsHidden___ = true;
@@ -1166,8 +1174,7 @@
1174
1175
// unhide the chart, when it is visible - called from isVisible()
1176
var unhideChart = function() {
1169
- if(typeof that.___chartIsHidden___ === 'undefined')
1170
- return;
1177
+ if(isHidden() === false) return;
1178
1179
that.___chartIsHidden___ = undefined;
1180
@@ -1177,39 +1184,73 @@
1184
init();
1185
}
1186
else {
1180
- that.element_chart.style.display = 'inline-block';
1181
- if(that.element_legend !== null) that.element_legend.style.display = 'inline-block';
1187
+ that.element_chart.style.display = '';
1188
+ if(that.element_legend !== null) that.element_legend.style.display = '';
1189
resizeChart();
1190
hideMessage();
1191
}
1192
}
1193
1194
+ var canBeRendered = function() {
1195
+ if(isHidden() === true || that.isVisible(true) === false)
1196
+ return false;
1197
+
1198
+ return true;
1199
+ }
1200
+
1201
// https://github.com/petkaantonov/bluebird/wiki/Optimization-killers
1202
var callChartLibraryUpdateSafely = function(data) {
1203
var status;
1204
1191
- try {
1205
+ if(canBeRendered() === false)
1206
+ return false;
1207
+
1208
+ if(NETDATA.options.debug.chart_errors === true)
1209
status = that.library.update(that, data);
1210
+ else {
1211
+ try {
1212
+ status = that.library.update(that, data);
1213
+ }
1214
+ catch(err) {
1215
+ status = false;
1216
+ }
1217
}
1194
- catch(err) {
1195
- status = false;
1218
+
1219
+ if(status === false) {
1220
+ error('chart failed to be updated as ' + that.library_name);
1221
+ return false;
1222
}
1223
1198
- return status;
1224
+ that.updates_since_last_creation++;
1225
+ return true;
1226
}
1227
1228
// https://github.com/petkaantonov/bluebird/wiki/Optimization-killers
1229
var callChartLibraryCreateSafely = function(data) {
1230
var status;
1231
1205
- try {
1232
+ if(canBeRendered() === false)
1233
+ return false;
1234
+
1235
+ if(NETDATA.options.debug.chart_errors === true)
1236
status = that.library.create(that, data);
1237
+ else {
1238
+ try {
1239
+ status = that.library.create(that, data);
1240
+ }
1241
+ catch(err) {
1242
+ status = false;
1243
+ }
1244
}
1208
- catch(err) {
1209
- status = false;
1245
+
1246
+ if(status === false) {
1247
+ error('chart failed to be created as ' + that.library_name);
1248
+ return false;
1249
}
1250
1212
- return status;
1251
+ that.chart_created = true;
1252
+ that.updates_since_last_creation = 0;
1253
+ return true;
1254
}
1255
1256
// ----------------------------------------------------------------------------------------------------------------
@@ -2245,41 +2286,19 @@
2286
2287
if(this.chart_created === true
2288
&& typeof this.library.update === 'function') {
2248
- var status = false;
2289
2290
if(this.debug === true)
2291
this.log('updating chart...');
2292
2253
- if(NETDATA.options.debug.chart_errors === true)
2254
- status = this.library.update(this, data);
2255
- else
2256
- status = callChartLibraryUpdateSafely(data);
2257
-
2258
- if(status === false) {
2259
- error('chart failed to be updated as ' + this.library_name);
2260
- }
2261
- else {
2262
- this.updates_since_last_creation++;
2263
- }
2293
+ if(callChartLibraryUpdateSafely(data) === false)
2294
+ return;
2295
}
2296
else {
2266
- var status = false;
2267
-
2297
if(this.debug === true)
2298
this.log('creating chart...');
2299
2271
- if(NETDATA.options.debug.chart_errors === true)
2272
- status = this.library.create(this, data);
2273
- else
2274
- status = callChartLibraryCreateSafely(data);
2275
-
2276
- if(status === false) {
2277
- error('chart failed to be created as ' + this.library_name);
2278
- }
2279
- else {
2280
- this.chart_created = true;
2281
- this.updates_since_last_creation = 0;
2282
- }
2300
+ if(callChartLibraryCreateSafely(data) === false)
2301
+ return;
2302
}
2303
hideMessage();
2304
this.legendShowLatestValues();
@@ -2322,15 +2341,20 @@
2341
return false;
2342
}
2343
2344
+ if(canBeRendered() === false) {
2345
+ if(typeof callback === 'function') callback();
2346
+ return false;
2347
+ }
2348
+
2349
if(this.chart === null) {
2350
this.getChart(function() { that.updateChart(callback); });
2327
- return;
2351
+ return false;
2352
}
2353
2354
if(this.library.initialized === false) {
2355
if(this.library.enabled === true) {
2356
this.library.initialize(function() { that.updateChart(callback); });
2333
- return;
2357
+ return false;
2358
}
2359
else {
2360
error('chart library "' + this.library_name + '" is not available.');
@@ -2363,14 +2387,19 @@
2387
.always(function() {
2388
if(typeof callback === 'function') callback();
2389
});
2390
+
2391
+ return true;
2392
}
2393
2368
- this.isVisible = function() {
2394
+ this.isVisible = function(nocache) {
2395
+ if(typeof nocache === 'undefined')
2396
+ nocache = false;
2397
+
2398
// this.log('last_visible_check: ' + this.tm.last_visible_check + ', last_page_scroll: ' + NETDATA.options.last_page_scroll);
2399
2400
// caching - we do not evaluate the charts visibility
2401
// if the page has not been scrolled since the last check
2373
- if(this.tm.last_visible_check > NETDATA.options.last_page_scroll) {
2402
+ if(nocache === false && this.tm.last_visible_check > NETDATA.options.last_page_scroll) {
2403
if(this.debug === true)
2404
this.log('isVisible: ' + this.___isVisible___);
2405