table fixes

Revert minMax to minmax

API.md

@@ -237,7 +237,7 @@ attributes
     of this object. This is used for specifying an icon to appear next to each 
     object of this type.
 
-The [Open MCT Tutorials](https://github.com/openmct/openmct-tutorial) provide a 
+The [Open MCT Tutorials](https://github.com/nasa/openmct-tutorial) provide a 
 step-by-step examples of writing code for Open MCT that includes a [section on 
 defining a new object type](https://github.com/nasa/openmct-tutorial#step-3---providing-objects).
 

platform/import-export/bundle.js

@@ -72,6 +72,8 @@ define([
                     ]
                 }
             });
+
+            openmct.legacyRegistry.enable('platform/import-export');
         };
     };
 });

src/plugins/flexibleLayout/components/flexibleLayout.vue

@@ -540,18 +540,16 @@ export default {
             this.newFrameLocation = [containerIndex, insertFrameIndex];
         },
         addFrame(domainObject) {
-            if (this.newFrameLocation.length) {
-                let containerIndex = this.newFrameLocation[0],
-                    frameIndex = this.newFrameLocation[1],
-                    frame = new Frame(domainObject.identifier),
-                    container = this.containers[containerIndex];
+            let containerIndex = this.newFrameLocation.length ? this.newFrameLocation[0] : 0;
+            let container = this.containers[containerIndex];
+            let frameIndex = this.newFrameLocation.length ? this.newFrameLocation[1] : container.frames.length;
+            let frame = new Frame(domainObject.identifier);
 
-                container.frames.splice(frameIndex + 1, 0, frame);
-                sizeItems(container.frames, frame);
+            container.frames.splice(frameIndex + 1, 0, frame);
+            sizeItems(container.frames, frame);
 
-                this.newFrameLocation = [];
-                this.persist(containerIndex);
-            }
+            this.newFrameLocation = [];
+            this.persist(containerIndex);
         },
         deleteFrame(frameId) {
             let container = this.containers

src/plugins/plot/src/configuration/PlotSeries.js

@@ -140,8 +140,14 @@ define([
          * @returns {Promise}
          */
         fetch: function (options) {
-            const strategy = options.shouldUseMinMax ? 'minMax' : undefined;
+            let strategy;
+
+            if (this.model.interpolate !== 'none') {
+                strategy = 'minmax';
+            }
+
             options = _.extend({}, { size: 1000, strategy, filters: this.filters }, options || {});
+
             if (!this.unsubscribe) {
                 this.unsubscribe = this.openmct
                     .telemetry
@@ -371,26 +377,17 @@ define([
          * @public
          */
         updateFiltersAndRefresh: function (updatedFilters) {
-            this.filters = updatedFilters;
-            this.reset();
-            if (this.unsubscribe) {
-                this.unsubscribe();
-                delete this.unsubscribe;
+            if (this.filters && !_.isEqual(this.filters, updatedFilters)) {
+                this.filters = updatedFilters;
+                this.reset();
+                if (this.unsubscribe) {
+                    this.unsubscribe();
+                    delete this.unsubscribe;
+                }
+                this.fetch();
+            } else {
+                this.filters = updatedFilters;
             }
-            this.fetch();
-        },
-
-        /**
-         * Clears the plot series, unsubscribes and resubscribes
-         * @public
-         */
-        refresh: function () {
-            this.reset();
-            if (this.unsubscribe) {
-                this.unsubscribe();
-                delete this.unsubscribe;
-            }
-            this.fetch();
         }
     });
 

src/plugins/plot/src/telemetry/PlotController.js

@@ -102,8 +102,7 @@ define([
         this.startLoading();
         var options = {
             size: this.$element[0].offsetWidth,
-            domain: this.config.xAxis.get('key'),
-            shouldUseMinMax: this.shouldUseMinMax(series)
+            domain: this.config.xAxis.get('key')
         };
 
         series.load(options)
@@ -161,10 +160,6 @@ define([
         return config;
     };
 
-    PlotController.prototype.shouldUseMinMax = function (series) {
-        return series.model.interpolate !== 'none';
-    };
-
     PlotController.prototype.onTimeSystemChange = function (timeSystem) {
         this.config.xAxis.set('key', timeSystem.key);
     };

src/plugins/telemetryTable/TelemetryTable.js

@@ -47,6 +47,7 @@ define([
             this.subscriptions = {};
             this.tableComposition = undefined;
             this.telemetryObjects = [];
+            this.datumCache = [];
             this.outstandingRequests = 0;
             this.configuration = new TelemetryTableConfiguration(domainObject, openmct);
             this.paused = false;
@@ -155,6 +156,7 @@ define([
         processHistoricalData(telemetryData, columnMap, keyString, limitEvaluator) {
             let telemetryRows = telemetryData.map(datum => new TelemetryTableRow(datum, columnMap, keyString, limitEvaluator));
             this.boundedRows.add(telemetryRows);
+            this.emit('historical-rows-processed');
         }
 
         /**
@@ -227,12 +229,28 @@ define([
                     return;
                 }
 
-                if (!this.paused) {
+                if (this.paused) {
+                    let realtimeDatum = {
+                        datum,
+                        columnMap,
+                        keyString,
+                        limitEvaluator
+                    };
+
+                    this.datumCache.push(realtimeDatum);
+                } else {
                     this.processRealtimeDatum(datum, columnMap, keyString, limitEvaluator);
                 }
             }, subscribeOptions);
         }
 
+        processDatumCache() {
+            this.datumCache.forEach(cachedDatum => {
+                this.processRealtimeDatum(cachedDatum.datum, cachedDatum.columnMap, cachedDatum.keyString, cachedDatum.limitEvaluator);
+            });
+            this.datumCache = [];
+        }
+
         processRealtimeDatum(datum, columnMap, keyString, limitEvaluator) {
             this.boundedRows.add(new TelemetryTableRow(datum, columnMap, keyString, limitEvaluator));
         }
@@ -272,8 +290,8 @@ define([
 
         unpause() {
             this.paused = false;
+            this.processDatumCache();
             this.boundedRows.subscribeToBounds();
-            this.refreshData();
         }
 
         destroy() {

src/plugins/telemetryTable/TelemetryTableViewProvider.js

@@ -51,24 +51,33 @@ define([
             view(domainObject, isEditing, objectPath) {
                 let table = new TelemetryTable(domainObject, openmct);
                 let component;
+
+                let markingProp = {
+                    enable: true,
+                    useAlternateControlBar: false,
+                    rowName: '',
+                    rowNamePlural: ''
+                };
+
                 return {
                     show: function (element, editMode) {
                         component = new Vue({
-                            data() {
-                                return {
-                                    isEditing: editMode
-                                }
-                            },
+                            el: element,
                             components: {
                                 TableComponent: TableComponent.default
                             },
+                            data() {
+                                return {
+                                    isEditing: editMode,
+                                    markingProp
+                                };
+                            },
                             provide: {
                                 openmct,
                                 table,
                                 objectPath
                             },
-                            el: element,
-                            template: '<table-component :isEditing="isEditing" :enableMarking="true"></table-component>'
+                            template: '<table-component :isEditing="isEditing" :marking="markingProp"/>'
                         });
                     },
                     onEditModeChange(editMode) {
@@ -86,7 +95,7 @@ define([
             priority() {
                 return 1;
             }
-        }
+        };
     }
     return TelemetryTableViewProvider;
 });

src/styles/_controls.scss

@@ -619,6 +619,7 @@ select {
 
 .c-separator {
     @include cToolbarSeparator();
+    height: 100%;
 }
 
 .c-toolbar {

src/styles/_legacy.scss

@@ -28,6 +28,16 @@
     height: $controlBarH;
 }
 
+.c-control-bar {
+    display: flex;
+    align-items: center;
+
+    &__label {
+        display: inline-block;
+        white-space: nowrap;
+    }
+}
+
 .l-view-section {
     @include abs();
     overflow: auto;

src/ui/components/ToggleSwitch.vue

@@ -1,78 +1,114 @@
 <template>
-    <label class="c-toggle-switch">
-        <input type="checkbox"
-                :id="id"
-                :checked="checked"
-                @change="onUserSelect($event)"/>
+<div class="c-toggle-switch">
+    <label class="c-toggle-switch__control">
+        <input
+            :id="id"
+            type="checkbox"
+            :checked="checked"
+            @change="onUserSelect($event)"
+        >
         <span class="c-toggle-switch__slider"></span>
     </label>
+    <div
+        v-if="label && label.length"
+        class="c-toggle-switch__label"
+    >
+        {{ label }}
+    </div>
+</div>
 </template>
 
 <style lang="scss">
     @import "~styles/sass-base";
 
     .c-toggle-switch {
-        $d: 12px;
-        $m: 2px;
-        $br: $d/1.5;
+    $d: 12px;
+    $m: 2px;
+    $br: $d/1.5;
+    display: inline-flex;
+    align-items: center;
+    vertical-align: middle;
+
+    &__control,
+    &__label {
+        flex: 0 0 auto;
+    }
+
+    &__control {
         cursor: pointer;
         overflow: hidden;
-        display: inline;
-        vertical-align: middle;
+        display: block;
+    }
 
-        &__slider {
-            background: $colorBtnBg; // TODO: make discrete theme constants for these colors
-            border-radius: $br;
-            //box-shadow: inset rgba($colorBtnFg, 0.4) 0 0 0 1px;
-            display: inline-block;
-            height: $d + ($m*2);
-            position: relative;
-            transform: translateY(2px); // TODO: get this to work without this kind of hack!
-            width: $d*2 + $m*2;
+    input {
+        opacity: 0;
+        width: 0;
+        height: 0;
 
-            &:before {
-                // Knob
-                background: $colorBtnFg; // TODO: make discrete theme constants for these colors
-                border-radius: floor($br * 0.8);
-                box-shadow: rgba(black, 0.4) 0 0 2px;
-                content: '';
-                display: block;
-                position: absolute;
-                height: $d; width: $d;
-                top: $m; left: $m; right: auto;
-                transition: transform 100ms ease-in-out;
-            }
-        }
-
-        input {
-            opacity: 0;
-            width: 0;
-            height: 0;
-
-            &:checked {
-                + .c-toggle-switch__slider {
-                    background: $colorKey; // TODO: make discrete theme constants for these colors
-                    &:before {
-                        transform: translateX(100%);
-                    }
+        &:checked {
+            + .c-toggle-switch__slider {
+                background: $colorKey; // TODO: make discrete theme constants for these colors
+                &:before {
+                    transform: translateX(100%);
                 }
             }
         }
     }
 
+    &__slider {
+        // Sits within __switch
+        background: $colorBtnBg; // TODO: make discrete theme constants for these colors
+        border-radius: $br;
+        display: inline-block;
+        height: $d + ($m*2);
+        position: relative;
+        transform: translateY(2px); // TODO: get this to work without this kind of hack!
+        width: $d*2 + $m*2;
+
+        &:before {
+            // Knob
+            background: $colorBtnFg; // TODO: make discrete theme constants for these colors
+            border-radius: floor($br * 0.8);
+            box-shadow: rgba(black, 0.4) 0 0 2px;
+            content: '';
+            display: block;
+            position: absolute;
+            height: $d; width: $d;
+            top: $m; left: $m; right: auto;
+            transition: transform 100ms ease-in-out;
+        }
+    }
+
+    &__label {
+        margin-left: $interiorMarginSm;
+        margin-right: $interiorMargin;
+        white-space: nowrap;
+    }
+}
+
 </style>
 
 <script>
-    export default {
-        inject: ['openmct'],
-        props: {
-            id: String,
-            checked: Boolean
+
+export default {
+    inject: ['openmct'],
+    props: {
+        id: {
+            type: String,
+            required: true
         },
-        methods: {
-            onUserSelect(event) {
-                this.$emit('change', event.target.checked);
-            }
+        label: {
+            type: String,
+            required: false,
+            default: ''
+        },
+        checked: Boolean
+    },
+    methods: {
+        onUserSelect(event) {
+            this.$emit('change', event.target.checked);
         }
     }
-</script>
+}
+
+</script>

src/ui/components/toggle-switch.scss

@@ -0,0 +1,64 @@
+.c-toggle-switch {
+    $d: 12px;
+    $m: 2px;
+    $br: $d/1.5;
+    display: inline-flex;
+    align-items: center;
+    vertical-align: middle;
+
+    &__control,
+    &__label {
+        flex: 0 0 auto;
+    }
+
+    &__control {
+        cursor: pointer;
+        overflow: hidden;
+        display: block;
+    }
+
+    input {
+        opacity: 0;
+        width: 0;
+        height: 0;
+
+        &:checked {
+            + .c-toggle-switch__slider {
+                background: $colorKey; // TODO: make discrete theme constants for these colors
+                &:before {
+                    transform: translateX(100%);
+                }
+            }
+        }
+    }
+
+    &__slider {
+        // Sits within __switch
+        background: $colorBtnBg; // TODO: make discrete theme constants for these colors
+        border-radius: $br;
+        display: inline-block;
+        height: $d + ($m*2);
+        position: relative;
+        transform: translateY(2px); // TODO: get this to work without this kind of hack!
+        width: $d*2 + $m*2;
+
+        &:before {
+            // Knob
+            background: $colorBtnFg; // TODO: make discrete theme constants for these colors
+            border-radius: floor($br * 0.8);
+            box-shadow: rgba(black, 0.4) 0 0 2px;
+            content: '';
+            display: block;
+            position: absolute;
+            height: $d; width: $d;
+            top: $m; left: $m; right: auto;
+            transition: transform 100ms ease-in-out;
+        }
+    }
+
+    &__label {
+        margin-left: $interiorMarginSm;
+        margin-right: $interiorMargin;
+        white-space: nowrap;
+    }
+}