LAD views should respond to conductor bounds changes (#2946)

Added bounds listener, moved history request to function, checking for race conditions
Co-authored-by: Andrew Henry <akhenry@gmail.com>

src/plugins/LADTable/components/LADRow.vue

@@ -1,6 +1,6 @@
 
 /*****************************************************************************
- * Open MCT, Copyright (c) 2014-2018, United States Government
+ * Open MCT, Copyright (c) 2014-2020, United States Government
  * as represented by the Administrator of the National Aeronautics and Space
  * Administration. All rights reserved.
  *
@@ -24,10 +24,8 @@
 <template>
 <tr @contextmenu.prevent="showContextMenu">
     <td>{{ name }}</td>
-    <td>{{ timestamp }}</td>
+    <td>{{ formattedTimestamp }}</td>
-    <td :class="valueClass">
+    <td :class="valueClass">{{ value }}</td>
-        {{ value }}
-    </td>
 </tr>
 </template>
 
@@ -52,16 +50,22 @@ export default {
 
         return {
             name: this.domainObject.name,
-            timestamp: '---',
+            timestamp: undefined,
             value: '---',
             valueClass: '',
             currentObjectPath
         }
     },
+    computed: {
+        formattedTimestamp() {
+            return this.timestamp !== undefined ? this.formats[this.timestampKey].format(this.timestamp) : '---';
+        }
+    },
     mounted() {
         this.metadata = this.openmct.telemetry.getMetadata(this.domainObject);
         this.formats = this.openmct.telemetry.getFormatMap(this.metadata);
         this.keyString = this.openmct.objects.makeKeyString(this.domainObject.identifier);
+        this.bounds = this.openmct.time.bounds();
 
         this.limitEvaluator = this.openmct
             .telemetry
@@ -76,6 +80,7 @@ export default {
             );
 
         this.openmct.time.on('timeSystem', this.updateTimeSystem);
+        this.openmct.time.on('bounds', this.updateBounds);
 
         this.timestampKey = this.openmct.time.timeSystem().key;
 
@@ -89,43 +94,63 @@ export default {
             .telemetry
             .subscribe(this.domainObject, this.updateValues);
 
-        this.openmct
+        this.requestHistory();
-            .telemetry
-            .request(this.domainObject, {strategy: 'latest'})
-            .then((array) => this.updateValues(array[array.length - 1]));
     },
     destroyed() {
         this.stopWatchingMutation();
         this.unsubscribe();
-        this.openmct.off('timeSystem', this.updateTimeSystem);
+        this.openmct.time.off('timeSystem', this.updateTimeSystem);
+        this.openmct.time.off('bounds', this.updateBounds);
     },
     methods: {
         updateValues(datum) {
-            this.timestamp = this.formats[this.timestampKey].format(datum);
+            let newTimestamp = this.formats[this.timestampKey].parse(datum),
+                limit;
+
+            if(this.shouldUpdate(newTimestamp)) {
+                this.timestamp = this.formats[this.timestampKey].parse(datum);
                 this.value = this.formats[this.valueKey].format(datum);
-
+                limit = this.limitEvaluator.evaluate(datum, this.valueMetadata);
-            var limit = this.limitEvaluator.evaluate(datum, this.valueMetadata);
-
                 if (limit) {
                     this.valueClass = limit.cssClass;
                 } else {
                     this.valueClass = '';
                 }
+            }
+        },
+        shouldUpdate(newTimestamp) {
+            return (this.timestamp === undefined) ||
+                (this.inBounds(newTimestamp) &&
+                newTimestamp > this.timestamp);
+        },
+        requestHistory() {
+            this.openmct
+                .telemetry
+                .request(this.domainObject, {
+                    start: this.bounds.start,
+                    end: this.bounds.end,
+                    size: 1,
+                    strategy: 'latest'
+                })
+                .then((array) => this.updateValues(array[array.length - 1]));
         },
         updateName(name) {
             this.name = name;
         },
+        updateBounds(bounds, isTick) {
+            this.bounds = bounds;
+            if(!isTick) {
+                this.requestHistory();
+            }
+        },
+        inBounds(timestamp) {
+            return timestamp >= this.bounds.start && timestamp <= this.bounds.end;
+        },
         updateTimeSystem(timeSystem) {
             this.value = '---';
             this.timestamp = '---';
             this.valueClass = '';
             this.timestampKey = timeSystem.key;
-
-            this.openmct
-                .telemetry
-                .request(this.domainObject, {strategy: 'latest'})
-                .then((array) => this.updateValues(array[array.length - 1]));
-
         },
         showContextMenu(event) {
             this.openmct.contextMenu._showContextMenuForObjectPath(this.currentObjectPath, event.x, event.y, CONTEXT_MENU_ACTIONS);