Added support for clicking row to set TOI

This commit is contained in:
Henry 2016-10-07 17:57:14 -07:00
parent b995a8b87b
commit 70c4ce24e4
6 changed files with 75 additions and 21 deletions

View File

@ -105,7 +105,8 @@
ng-class="{ 'pinned': toi.pinned, 'val-to-right': toi.left < 20 }" ng-class="{ 'pinned': toi.pinned, 'val-to-right': toi.left < 20 }"
ng-style="{'left': toi.left + '%'}"> ng-style="{'left': toi.left + '%'}">
<div class="l-toi"> <div class="l-toi">
<a class="t-button-unpin icon-button" ng-click="toi.pinned = false"></a> <a class="t-button-unpin icon-button"
ng-click="toi.dismiss()"></a>
<span class="l-toi-val">{{toi.toiText}}</span> <span class="l-toi-val">{{toi.toiText}}</span>
</div> </div>
</div> </div>

View File

@ -94,6 +94,10 @@ define(
} }
}; };
ConductorTOIController.prototype.dismiss = function () {
this.conductor.timeOfInterest(undefined);
};
ConductorTOIController.prototype.resize = function () { ConductorTOIController.prototype.resize = function () {
//Do something? //Do something?
}; };

View File

@ -2,7 +2,7 @@
ng-class="{'loading': loading}"> ng-class="{'loading': loading}">
<mct-table <mct-table
headers="headers" headers="headers"
time-columns="timeColumns" time-columns="tableController.timeColumns"
rows="rows" rows="rows"
enableFilter="true" enableFilter="true"
enableSort="true" enableSort="true"

View File

@ -53,7 +53,7 @@
<!--ng-click="dummyUnpin()" --> <!--ng-click="dummyUnpin()" -->
<tr ng-repeat="visibleRow in visibleRows track by visibleRow.rowIndex" <tr ng-repeat="visibleRow in visibleRows track by visibleRow.rowIndex"
ng-class="{ 'l-toi pinned': visibleRow.rowIndex === toiRowIndex }" ng-class="{ 'l-toi pinned': visibleRow.rowIndex === toiRowIndex }"
ng-click="table.onRowClick($event, visibleRow.contents)" ng-click="table.onRowClick($event, visibleRow.rowIndex)"
ng-style="{ ng-style="{
top: visibleRow.offsetY + 'px', top: visibleRow.offsetY + 'px',
}"> }">

View File

@ -103,24 +103,29 @@ define(
*/ */
$scope.resize = this.setElementSizes.bind(this); $scope.resize = this.setElementSizes.bind(this);
// Time conductor integration // Time conductor integration
if (this.$scope.timeColumns) { $scope.$watch("timeColumns", function (timeColumns){
this.conductor.on('timeSystem', this.changeTimeSystem); if (timeColumns) {
this.conductor.on('timeOfInterest', this.setTimeOfInterest); this.destroyConductorListeners();
$scope.$on('$destroy', function () {
this.conductor.off('timeSystem', this.changeTimeSystem);
this.conductor.off('timeOfInterest', this.setTimeOfInterest);
}.bind(this));
// If time system defined, set initially this.conductor.on('timeSystem', this.changeTimeSystem);
if (conductor.timeSystem()) { this.conductor.on('timeOfInterest', this.setTimeOfInterest);
this.changeTimeSystem(conductor.timeSystem());
// If time system defined, set initially
if (conductor.timeSystem()) {
this.changeTimeSystem(conductor.timeSystem());
}
} }
} }.bind(this));
$scope.$on('$destroy', this.destroyConductorListeners);
} }
MCTTableController.prototype.destroyConductorListeners = function () {
this.conductor.off('timeSystem', this.changeTimeSystem);
this.conductor.off('timeOfInterest', this.setTimeOfInterest);
};
MCTTableController.prototype.changeTimeSystem = function () { MCTTableController.prototype.changeTimeSystem = function () {
var format = this.conductor.timeSystem().formats()[0]; var format = this.conductor.timeSystem().formats()[0];
this.toiFormatter = this.formatService.getFormat(format); this.toiFormatter = this.formatService.getFormat(format);
@ -558,18 +563,50 @@ define(
return rowsToFilter.filter(matchRow.bind(null, filters)); return rowsToFilter.filter(matchRow.bind(null, filters));
}; };
MCTTableController.prototype.scrollToRow = function (displayRowIndex) {
var visible = this.$scope.visibleRows.reduce(function (exists, row) {
return exists || (row.rowIndex === displayRowIndex)
}, false);
if (!visible) {
var scrollTop = displayRowIndex * this.$scope.rowHeight
+ this.$scope.headerHeight
- (this.scrollable[0].offsetHeight / 2);
this.scrollable[0].scrollTop = scrollTop;
this.setVisibleRows();
}
};
/** /**
* Update rows with new data. If filtering is enabled, rows * Update rows with new data. If filtering is enabled, rows
* will be sorted before display. * will be sorted before display.
*/ */
MCTTableController.prototype.setTimeOfInterest = function (newTOI) { MCTTableController.prototype.setTimeOfInterest = function (newTOI) {
if (this.$scope.timeColumns.indexOf(this.$scope.sortColumn) !== -1) { this.$scope.toiRowIndex = -1;
if (this.$scope.timeColumns.indexOf(this.$scope.sortColumn) !== -1
&& newTOI
&& this.$scope.displayRows.length > 0) {
var formattedTOI = this.toiFormatter.format(newTOI); var formattedTOI = this.toiFormatter.format(newTOI);
var rowsLength = this.$scope.displayRows.length; var rowsLength = this.$scope.displayRows.length;
// searchElement, min, max // searchElement, min, max
this.$scope.toiRowIndex = this.binarySearch(this.$scope.displayRows, formattedTOI, 0, rowsLength); this.$scope.toiRowIndex = this.binarySearch(this.$scope.displayRows, formattedTOI, 0, rowsLength);
} else { this.scrollToRow(this.$scope.toiRowIndex);
this.$scope.toiRowIndex = -1; }
};
MCTTableController.prototype.onRowClick = function (event, rowIndex) {
if (this.$scope.timeColumns.indexOf(this.$scope.sortColumn) !== -1) {
if (rowIndex === this.$scope.toiRowIndex) {
this.conductor.timeOfInterest(undefined);
} else {
var selectedTime = this.$scope.displayRows[rowIndex][this.$scope.sortColumn].text;
if (selectedTime
&& this.toiFormatter.validate(selectedTime)
&& event.altKey) {
this.conductor.timeOfInterest(this.toiFormatter.parse(selectedTime));
}
}
} }
}; };

View File

@ -69,7 +69,7 @@ define(
// Unsubscribe when the plot is destroyed // Unsubscribe when the plot is destroyed
this.$scope.$on("$destroy", this.destroy); this.$scope.$on("$destroy", this.destroy);
this.$scope.timeColumns = ['Time']; this.$scope.timeColumns = [];
} }
/** /**
@ -153,20 +153,32 @@ define(
this.setup(); this.setup();
}; };
TelemetryTableController.prototype.populateColumns = function (telemetryMetadata) {
this.table.populateColumns(telemetryMetadata);
//Identify time columns
telemetryMetadata.forEach(function (metadatum) {
//Push domains first
(metadatum.domains || []).forEach(function (domainMetadata) {
this.timeColumns.push(domainMetadata.name);
}.bind(this));
}.bind(this));
};
/** /**
* Setup table columns based on domain object metadata * Setup table columns based on domain object metadata
*/ */
TelemetryTableController.prototype.setup = function () { TelemetryTableController.prototype.setup = function () {
var handle = this.handle, var handle = this.handle,
table = this.table,
self = this; self = this;
if (handle) { if (handle) {
this.timeColumns = [];
handle.promiseTelemetryObjects().then(function () { handle.promiseTelemetryObjects().then(function () {
self.$scope.headers = []; self.$scope.headers = [];
self.$scope.rows = []; self.$scope.rows = [];
table.populateColumns(handle.getMetadata());
self.populateColumns(handle.getMetadata());
self.filterColumns(); self.filterColumns();
// When table column configuration changes, (due to being // When table column configuration changes, (due to being