alihan/openmct
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Tables] Refactoring for consolidation of historical and real-time tables

Browse Source 
Added batch processing of large historical queries. #1077
This commit is contained in:
Henry
2016-12-16 16:34:41 -08:00
parent 3544caf4be
commit 2a4944d6ee
9 changed files with 365 additions and 177 deletions
Download Patch File Download Diff File Expand all files Collapse all files

118
platform/features/table/src/controllers/MCTTableController.js
View File

@@ -12,12 +12,12 @@ define(
* @param element
* @constructor
*/
function MCTTableController($scope, $timeout, element, exportService, formatService, openmct) {
function MCTTableController($scope, $window, element, exportService, formatService, openmct) {
var self = this;
this.$scope = $scope;
this.element = $(element[0]);
this.$timeout = $timeout;
this.$window = $window;
this.maxDisplayRows = 50;
this.scrollable = this.element.find('.l-view-section.scrolling').first();
@@ -27,15 +27,39 @@ define(
this.conductor = openmct.conductor;
this.toiFormatter = undefined;
this.formatService = formatService;
this.callbacks = {};
//Bind all class functions to 'this'
Object.keys(MCTTableController.prototype).filter(function (key) {
return typeof MCTTableController.prototype[key] === 'function';
}).forEach(function (key) {
this[key] = MCTTableController.prototype[key].bind(this);
}.bind(this));
_.bindAll(this, [
'destroyConductorListeners',
'changeTimeSystem',
'scrollToBottom',
'addRow',
'removeRow',
'onScroll',
'firstVisible',
'lastVisible',
'setVisibleRows',
'setHeaders',
'setElementSizes',
'binarySearch',
'insertSorted',
'sortComparator',
'sortRows',
'buildLargestRow',
'resize',
'filterAndSort',
'setRows',
'filterRows',
'scrollToRow',
'setTimeOfInterestRow',
'changeTimeOfInterest',
'changeBounds',
'onRowClick',
'digest'
]);
this.scrollable.on('scroll', this.onScroll.bind(this));
this.scrollable.on('scroll', this.onScroll);
$scope.visibleRows = [];
@@ -86,7 +110,7 @@ define(
$scope.sortDirection = 'asc';
}
self.setRows($scope.rows);
self.setTimeOfInterest(self.conductor.timeOfInterest());
self.setTimeOfInterestRow(self.conductor.timeOfInterest());
};
/*
@@ -108,7 +132,11 @@ define(
* Populated from the default-sort attribute on MctTable
* directive tag.
*/
$scope.$watch('sortColumn', $scope.toggleSort);
$scope.$watch('defaultSort', function (newColumn, oldColumn) {
if (newColumn !== oldColumn) {
$scope.toggleSort(newColumn)
}
});
/*
* Listen for resize events to trigger recalculation of table width
@@ -125,7 +153,7 @@ define(
this.destroyConductorListeners();
this.conductor.on('timeSystem', this.changeTimeSystem);
this.conductor.on('timeOfInterest', this.setTimeOfInterest);
this.conductor.on('timeOfInterest', this.changeTimeOfInterest);
this.conductor.on('bounds', this.changeBounds);
// If time system defined, set initially
@@ -135,12 +163,22 @@ define(
}
}.bind(this));
$scope.$on('$destroy', this.destroyConductorListeners);
}
console.log('constructed');
$scope.$on('$destroy', function() {
this.scrollable.off('scroll', this.onScroll);
this.destroyConductorListeners();
// In case for some reason this controller instance lingers around,
// destroy scope as it can be extremely large for large tables.
delete this.$scope;
}.bind(this));
};
MCTTableController.prototype.destroyConductorListeners = function () {
this.conductor.off('timeSystem', this.changeTimeSystem);
this.conductor.off('timeOfInterest', this.setTimeOfInterest);
this.conductor.off('timeOfInterest', this.changeTimeOfInterest);
this.conductor.off('bounds', this.changeBounds);
};
@@ -160,7 +198,7 @@ define(
//Use timeout to defer execution until next digest when any
// pending UI changes have completed, eg. a new row in the table.
if (this.$scope.autoScroll) {
this.$timeout(function () {
this.digest(function () {
self.scrollable[0].scrollTop = self.scrollable[0].scrollHeight;
});
}
@@ -183,6 +221,12 @@ define(
this.resize([this.$scope.sizingRow, row])
.then(this.setVisibleRows.bind(this))
.then(this.scrollToBottom.bind(this));
var toi = this.conductor.timeOfInterest();
if (toi !== -1) {
this.setTimeOfInterestRow(toi);
}
}
};
@@ -193,8 +237,8 @@ define(
*/
MCTTableController.prototype.removeRow = function (event, rowIndex) {
var row = this.$scope.rows[rowIndex],
// Do a sequential search here. Only way of finding row is by
// object equality, so array is in effect unsorted.
// Do a sequential search here. Only way of finding row is by
// object equality, so array is in effect unsorted.
indexInDisplayRows = this.$scope.displayRows.indexOf(row);
if (indexInDisplayRows !== -1) {
this.$scope.displayRows.splice(indexInDisplayRows, 1);
@@ -522,6 +566,27 @@ define(
return largestRow;
};
MCTTableController.prototype.digest = function (callback) {
var scope = this.$scope;
var callbacks = this.callbacks;
var requestAnimationFrame = this.$window.requestAnimationFrame;
var promise = callbacks[callback];
if (!promise){
promise = new Promise(function (resolve) {
requestAnimationFrame(function() {
scope.$digest();
delete callbacks[callback];
resolve(callback && callback());
});
});
callbacks[callback] = promise;
}
return promise;
};
/**
* Calculates the widest row in the table, and if necessary, resizes
* the table accordingly
@@ -533,7 +598,7 @@ define(
*/
MCTTableController.prototype.resize = function (rows) {
this.$scope.sizingRow = this.buildLargestRow(rows);
return this.$timeout(this.setElementSizes.bind(this));
return this.digest(this.setElementSizes);
};
/**
@@ -566,15 +631,15 @@ define(
.then(this.setVisibleRows)
//Timeout following setVisibleRows to allow digest to
// perform DOM changes, otherwise scrollTo won't work.
.then(this.$timeout)
.then(this.digest)
.then(function () {
//If TOI specified, scroll to it
var timeOfInterest = this.conductor.timeOfInterest();
if (timeOfInterest) {
this.setTimeOfInterest(timeOfInterest);
this.setTimeOfInterestRow(timeOfInterest);
this.scrollToRow(this.$scope.toiRowIndex);
}
}.bind(this));
};
/**
@@ -635,7 +700,7 @@ define(
* Update rows with new data. If filtering is enabled, rows
* will be sorted before display.
*/
MCTTableController.prototype.setTimeOfInterest = function (newTOI) {
MCTTableController.prototype.setTimeOfInterestRow = function (newTOI) {
var isSortedByTime =
this.$scope.timeColumns &&
this.$scope.timeColumns.indexOf(this.$scope.sortColumn) !== -1;
@@ -652,17 +717,22 @@ define(
if (rowIndex > 0 && rowIndex < this.$scope.displayRows.length) {
this.$scope.toiRowIndex = rowIndex;
this.scrollToRow(this.$scope.toiRowIndex);
}
}
};
MCTTableController.prototype.changeTimeOfInterest = function (newTOI) {
this.setTimeOfInterestRow(newTOI);
this.scrollToRow(this.$scope.toiRowIndex);
};
/**
* On zoom, pan, etc. reset TOI
* @param bounds
*/
MCTTableController.prototype.changeBounds = function (bounds) {
this.setTimeOfInterest(this.conductor.timeOfInterest());
this.setTimeOfInterestRow(this.conductor.timeOfInterest());
this.scrollToRow(this.$scope.toiRowIndex);
};
/**