Skip to content

Commit 9e5689f

Browse files
author
Pete Richards
committed
Merge remote-tracking branch 'origin/revert-839-revert-822-open769'
2 parents 0ccb696 + 6bf1ef5 commit 9e5689f

18 files changed

+577
-291
lines changed

‎docs/src/guide/index.md

Lines changed: 62 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,13 @@ Victor Woeltjen
66
September 23, 2015
77
Document Version 1.1
88

9-
Date | Version | Summary of Changes | Author
10-
------------------- | --------- | ----------------------- | ---------------
11-
April 29, 2015 | 0 | Initial Draft | Victor Woeltjen
12-
May 12, 2015 | 0.1 | | Victor Woeltjen
13-
June 4, 2015 | 1.0 | Name Changes | Victor Woeltjen
14-
October 4, 2015 | 1.1 | Conversion to MarkDown | Andrew Henry
9+
Date | Version | Summary of Changes | Author
10+
------------------- | --------- | ------------------------- | ---------------
11+
April 29, 2015 | 0 | Initial Draft | Victor Woeltjen
12+
May 12, 2015 | 0.1 | | Victor Woeltjen
13+
June 4, 2015 | 1.0 | Name Changes | Victor Woeltjen
14+
October 4, 2015 | 1.1 | Conversion to MarkDown | Andrew Henry
15+
April 5, 2016 | 1.2 | Added Mct-table directive | Andrew Henry
1516

1617
# Introduction
1718
The purpose of this guide is to familiarize software developers with the Open
@@ -1600,6 +1601,61 @@ there are items .
16001601
]
16011602
}
16021603

1604+
## Table
1605+
1606+
The `mct-table` directive provides a generic table component, with optional
1607+
sorting and filtering capabilities. The table can be pre-populated with data
1608+
by setting the `rows` parameter, and it can be updated in real-time using the
1609+
`add:row` and `remove:row` broadcast events. The table will expand to occupy
1610+
100% of the size of its containing element. The table is highly optimized for
1611+
very large data sets.
1612+
1613+
### Events
1614+
1615+
The table supports two events for notifying that the rows have changed. For
1616+
performance reasons, the table does not monitor the content of `rows`
1617+
constantly.
1618+
1619+
* `add:row`: A `$broadcast` event that will notify the table that a new row
1620+
has been added to the table.
1621+
1622+
eg. The code below adds a new row, and alerts the table using the `add:row`
1623+
event. Sorting and filtering will be applied automatically by the table component.
1624+
1625+
```
1626+
$scope.rows.push(newRow);
1627+
$scope.$broadcast('add:row', $scope.rows.length-1);
1628+
```
1629+
1630+
* `remove:row`: A `$broadcast` event that will notify the table that a row
1631+
should be removed from the table.
1632+
1633+
eg. The code below removes a row from the rows array, and then alerts the table
1634+
to its removal.
1635+
1636+
```
1637+
$scope.rows.slice(5, 1);
1638+
$scope.$broadcast('remove:row', 5);
1639+
```
1640+
1641+
### Parameters
1642+
1643+
* `headers`: An array of string values which will constitute the column titles
1644+
that appear at the top of the table. Corresponding values are specified in
1645+
the rows using the header title provided here.
1646+
* `rows`: An array of objects containing row values. Each element in the
1647+
array must be an associative array, where the key corresponds to a column header.
1648+
* `enableFilter`: A boolean that if true, will enable searching and result
1649+
filtering. When enabled, each column will have a text input field that can be
1650+
used to filter the table rows in real time.
1651+
* `enableSort`: A boolean determining whether rows can be sorted. If true,
1652+
sorting will be enabled allowing sorting by clicking on column headers. Only
1653+
one column may be sorted at a time.
1654+
* `autoScroll`: A boolean value that if true, will cause the table to automatically
1655+
scroll to the bottom as new data arrives. Auto-scroll can be disengaged manually
1656+
by scrolling away from the bottom of the table, and can also be enabled manually
1657+
by scrolling to the bottom of the table rows.
1658+
16031659
# Services
16041660

16051661
The Open MCT Web platform provides a variety of services which can be retrieved

‎platform/features/table/bundle.js

Lines changed: 15 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -23,16 +23,16 @@
2323

2424
define([
2525
"./src/directives/MCTTable",
26-
"./src/controllers/RTTelemetryTableController",
27-
"./src/controllers/TelemetryTableController",
26+
"./src/controllers/RealtimeTableController",
27+
"./src/controllers/HistoricalTableController",
2828
"./src/controllers/TableOptionsController",
2929
'../../commonUI/regions/src/Region',
3030
'../../commonUI/browse/src/InspectorRegion',
3131
"legacyRegistry"
3232
], function (
3333
MCTTable,
34-
RTTelemetryTableController,
35-
TelemetryTableController,
34+
RealtimeTableController,
35+
HistoricalTableController,
3636
TableOptionsController,
3737
Region,
3838
InspectorRegion,
@@ -109,13 +109,13 @@ define([
109109
],
110110
"controllers": [
111111
{
112-
"key": "TelemetryTableController",
113-
"implementation": TelemetryTableController,
112+
"key": "HistoricalTableController",
113+
"implementation": HistoricalTableController,
114114
"depends": ["$scope", "telemetryHandler", "telemetryFormatter"]
115115
},
116116
{
117-
"key": "RTTelemetryTableController",
118-
"implementation": RTTelemetryTableController,
117+
"key": "RealtimeTableController",
118+
"implementation": RealtimeTableController,
119119
"depends": ["$scope", "telemetryHandler", "telemetryFormatter"]
120120
},
121121
{
@@ -130,7 +130,7 @@ define([
130130
"name": "Historical Table",
131131
"key": "table",
132132
"glyph": "\ue604",
133-
"templateUrl": "templates/table.html",
133+
"templateUrl": "templates/historical-table.html",
134134
"needs": [
135135
"telemetry"
136136
],
@@ -161,6 +161,12 @@ define([
161161
"key": "table-options-edit",
162162
"templateUrl": "templates/table-options-edit.html"
163163
}
164+
],
165+
"stylesheets": [
166+
{
167+
"stylesheetUrl": "css/table.css",
168+
"priority": "mandatory"
169+
}
164170
]
165171
}
166172
});

‎platform/features/table/res/sass/table.scss

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
/*****************************************************************************
2+
* Open MCT Web, Copyright (c) 2014-2015, United States Government
3+
* as represented by the Administrator of the National Aeronautics and Space
4+
* Administration. All rights reserved.
5+
*
6+
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
7+
* "License"); you may not use this file except in compliance with the License.
8+
* You may obtain a copy of the License at
9+
* http://www.apache.org/licenses/LICENSE-2.0.
10+
*
11+
* Unless required by applicable law or agreed to in writing, software
12+
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
13+
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
14+
* License for the specific language governing permissions and limitations
15+
* under the License.
16+
*
17+
* Open MCT Web includes source code licensed under additional open source
18+
* licenses. See the Open Source Licenses file (LICENSES.md) included with
19+
* this source code distribution or the Licensing information page available
20+
* at runtime from the About dialog for additional information.
21+
*****************************************************************************/
22+
.sizing-table {
23+
min-width: 100%;
24+
z-index: -1;
25+
visibility: hidden;
26+
position: absolute;
27+
28+
//Add some padding to allow for decorations such as limits indicator
29+
td {
30+
padding-right: 15px;
31+
padding-left: 10px;
32+
white-space: nowrap;
33+
}
34+
}
35+
.mct-table {
36+
table-layout: fixed;
37+
th {
38+
box-sizing: border-box;
39+
}
40+
tbody {
41+
tr {
42+
position: absolute;
43+
}
44+
td {
45+
white-space: nowrap;
46+
overflow: hidden;
47+
box-sizing: border-box;
48+
}
49+
}
50+
}

‎platform/features/table/res/templates/table.html renamed to ‎platform/features/table/res/templates/historical-table.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<div ng-controller="TelemetryTableController">
1+
<div ng-controller="HistoricalTableController">
22
<mct-table
33
headers="headers"
44
rows="rows"

‎platform/features/table/res/templates/mct-table.html

Lines changed: 19 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,25 @@
1-
<div class="l-view-section scrolling"
2-
ng-style="overrideRowPositioning ?
3-
{'overflow': 'auto'} :
4-
{'overflow': 'scroll'}"
5-
>
6-
<table class="filterable"
7-
ng-style="overrideRowPositioning && {
1+
<div class="l-view-section scrolling" style="overflow: auto;">
2+
<table class="sizing-table">
3+
<tbody>
4+
<tr>
5+
<td ng-repeat="header in displayHeaders">{{header}}</td>
6+
</tr>
7+
<tr><td ng-repeat="header in displayHeaders" >
8+
{{sizingRow[header].text}}
9+
</td></tr>
10+
</tbody>
11+
</table>
12+
<table class="filterable mct-table"
13+
ng-style="{
814
height: totalHeight + 'px',
9-
'table-layout': overrideRowPositioning ? 'fixed' : 'auto',
1015
'max-width': totalWidth
11-
}">
16+
}">
1217
<thead>
1318
<tr>
1419
<th ng-repeat="header in displayHeaders"
15-
ng-style="overrideRowPositioning && {
20+
ng-style="{
1621
width: columnWidths[$index] + 'px',
1722
'max-width': columnWidths[$index] + 'px',
18-
overflow: 'none',
19-
'box-sizing': 'border-box'
2023
}"
2124
ng-class="[
2225
enableSort ? 'sortable' : '',
@@ -29,33 +32,25 @@
2932
</tr>
3033
<tr ng-if="enableFilter" class="s-filters">
3134
<th ng-repeat="header in displayHeaders"
32-
ng-style="overrideRowPositioning && {
35+
ng-style="{
3336
width: columnWidths[$index] + 'px',
3437
'max-width': columnWidths[$index] + 'px',
35-
overflow: 'none',
36-
'box-sizing': 'border-box'
3738
}">
3839
<input type="text"
3940
ng-model="filters[header]"/>
4041
</th>
4142
</tr>
4243
</thead>
4344

44-
<tbody ng-style="overrideRowPositioning ? '' : {
45-
'opacity': '0.0'
46-
}">
45+
<tbody>
4746
<tr ng-repeat="visibleRow in visibleRows track by visibleRow.rowIndex"
48-
ng-style="overrideRowPositioning && {
49-
position: 'absolute',
47+
ng-style="{
5048
top: visibleRow.offsetY + 'px',
5149
}">
5250
<td ng-repeat="header in displayHeaders"
53-
ng-style="overrideRowPositioning && {
51+
ng-style=" {
5452
width: columnWidths[$index] + 'px',
55-
'white-space': 'nowrap',
5653
'max-width': columnWidths[$index] + 'px',
57-
overflow: 'hidden',
58-
'box-sizing': 'border-box'
5954
}"
6055
class="{{visibleRow.contents[header].cssClass}}">
6156
{{ visibleRow.contents[header].text }}

‎platform/features/table/res/templates/rt-table.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<div ng-controller="RTTelemetryTableController">
1+
<div ng-controller="RealtimeTableController">
22
<mct-table
33
headers="headers"
44
rows="rows"

‎platform/features/table/src/TableConfiguration.js

Lines changed: 18 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ define(
4747
* @param metadata Metadata describing the domains and ranges available
4848
* @returns {TableConfiguration} This object
4949
*/
50-
TableConfiguration.prototype.buildColumns = function (metadata) {
50+
TableConfiguration.prototype.populateColumns = function (metadata) {
5151
var self = this;
5252

5353
this.columns = [];
@@ -140,8 +140,7 @@ define(
140140
* @private
141141
*/
142142
TableConfiguration.prototype.defaultColumnConfiguration = function () {
143-
return ((this.domainObject.getModel().configuration || {}).table ||
144-
{}).columns || {};
143+
return ((this.domainObject.getModel().configuration || {}).table || {}).columns || {};
145144
};
146145

147146
/**
@@ -156,14 +155,24 @@ define(
156155
});
157156
};
158157

158+
function configChanged(config1, config2) {
159+
var config1Keys = Object.keys(config1),
160+
config2Keys = Object.keys(config2);
161+
162+
return (config1Keys.length !== config2Keys.length) ||
163+
config1Keys.some(function(key){
164+
return config1[key] !== config2[key];
165+
});
166+
}
167+
159168
/**
160169
* As part of the process of building the table definition, extract
161170
* configuration from column definitions.
162171
* @returns {Object} A configuration object consisting of key-value
163172
* pairs where the key is the column title, and the value is a
164173
* boolean indicating whether the column should be shown.
165174
*/
166-
TableConfiguration.prototype.getColumnConfiguration = function () {
175+
TableConfiguration.prototype.buildColumnConfiguration = function () {
167176
var configuration = {},
168177
//Use existing persisted config, or default it
169178
defaultConfig = this.defaultColumnConfiguration();
@@ -179,6 +188,11 @@ define(
179188
defaultConfig[columnTitle];
180189
});
181190

191+
//Synchronize column configuration with model
192+
if (configChanged(configuration, defaultConfig)) {
193+
this.saveColumnConfiguration(configuration);
194+
}
195+
182196
return configuration;
183197
};
184198

0 commit comments

Comments
 (0)