Finish code walkthrough

index.html

@@ -194,7 +194,7 @@
             ['table', 'telemetry.plot.overlay', 'telemetry.plot.stacked'],
             {indicator: true}
         ));
-        openmct.install(openmct.plugins.CodeWalkthrough);
+        //openmct.install(openmct.plugins.CodeWalkthrough);
         openmct.start();
     </script>
 </html>

src/plugins/LADTable/plugin.js

@@ -30,7 +30,7 @@ export default function plugin() {
         openmct.objectViews.addProvider(new LADTableSetViewProvider(openmct));
 
         openmct.types.addType('LadTable', {
-            name: "LAD Table",
+            name: "Latest Data Table",
             creatable: true,
             description: "A Latest Available Data tabular view in which each row displays the values for one or more contained telemetry objects.",
             cssClass: 'icon-tabular-lad',

src/plugins/codeWalkthrough/plugin.js

@@ -1,71 +1,63 @@
-import Vue from 'Vue';
-
 export default function install(openmct) {
     openmct.objectViews.addProvider({
-        name: "Latest Data Table",
-        key: "latest-table",
+        name: "Data Table",
+        key: "data-table",
         cssClass: "icon-packet",
-        description: "A tabular view of telemetry contents.",
-        canView: function () {
+        description: "Tabular view of telemetry",
+        canView(domainObject) {
             return true;
         },
-        view: function (domainObject) {
-            let unsubscribe;
-
+        view(domainObject) {
             return {
-                show: function (element) {
-                    //element.innerText = 'Hello World!';
+                async show(element) {
                     let telemetryMetadata = openmct.telemetry.getMetadata(domainObject).values();
-                    let tableEl = document.createElement('table');
-                    let tableHeader = document.createElement('thead');
-                    let tableHeaderRow = document.createElement('tr');
+                    let table = document.createElement('table');
+                    let tableHead = document.createElement('thead');
                     let tableBody = document.createElement('tbody');
+                    let tableHeadRow = document.createElement('tr');
 
-                    element.appendChild(tableEl);
-                    tableHeader.appendChild(tableHeaderRow);
-                    tableEl.appendChild(tableHeader);
-                    tableEl.appendChild(tableBody);
+                    tableHead.appendChild(tableHeadRow);
+                    table.appendChild(tableHead);
+                    table.appendChild(tableBody);
+                    element.appendChild(table);
 
                     telemetryMetadata.forEach(metadatum => {
-                        let tableHeader = document.createElement('td');
-                        tableHeader.innerText = metadatum.name;
-                        tableHeaderRow.appendChild(tableHeader);
+                        let tableHeadCell = document.createElement('td');
+                        tableHeadRow.appendChild(tableHeadCell);
+
+                        tableHeadCell.innerText = metadatum.name;
                     });
 
-                    openmct.time.on('bounds', (newBounds) => {
-                        tableBody.innerHTML = '';
-                        requestTelemetry(newBounds);
-                    });
+                    async function requestTelemetry() {
+                        let telemetry = await openmct.telemetry.request(domainObject);
+                        telemetry.forEach((datum) => {
+                            let dataRow = document.createElement('tr');
+                            telemetryMetadata.forEach(metadatum => {
+                                let dataCell = document.createElement('td');
+                                let formatter = openmct.telemetry.getValueFormatter(metadatum);
 
-                    requestTelemetry();
-
-                    // unsubscribe = openmct.telemetry.subscribe(domainObject, (datum) => {
-                    //     addRow(datum);
-                    // });
-
-                    function addRow(telemetryDatum) {
-                        let dataRow = document.createElement('tr');
-                        telemetryMetadata.forEach(metadatum => {
-                            let tableCell = document.createElement('td');
-                            let formatter = openmct.telemetry.getValueFormatter(metadatum);
-
-                            tableCell.innerText = formatter.format(telemetryDatum[metadatum.key]);
-                            dataRow.appendChild(tableCell);
+                                let telemetryValue = formatter.format(datum[metadatum.key]);
+                                dataCell.innerText = telemetryValue;
+                                dataRow.appendChild(dataCell);
+                            });
                             tableBody.appendChild(dataRow);
                         });
                     }
 
-                    function requestTelemetry(bounds) {
-                        openmct.telemetry.request(domainObject, {bounds}).then(arrayOfTelemetry => {
-                            arrayOfTelemetry.forEach(addRow);
-                        });
-                    }
+                    openmct.time.on('bounds', () => {
+                        tableBody.innerHTML = '';
+                        requestTelemetry();
+                    });
+
+                    requestTelemetry();
+
+                    // openmct.telemetry.subscribe(domainObject, (datum) => {
+                    //     element.innerText = JSON.stringify(datum);
+                    // });
                 },
-                destroy: function (element) {
-                    unsubscribe();
+                destroy() {
                 }
             };
         }
     });
-
-}
+}

src/plugins/plugins.js

@@ -113,7 +113,7 @@ define([
     PerformanceIndicator,
     CouchDBSearchFolder,
     Timeline,
-    codeWalkthroughPlugin
+    CodeWalkthrough
 ) {
     const bundleMap = {
         LocalStorage: 'platform/persistence/local',
@@ -214,7 +214,7 @@ define([
     plugins.PerformanceIndicator = PerformanceIndicator.default;
     plugins.CouchDBSearchFolder = CouchDBSearchFolder.default;
     plugins.Timeline = Timeline.default;
-    plugins.CodeWalkthrough = codeWalkthroughPlugin.default;
+    plugins.CodeWalkthrough = CodeWalkthrough.default;
 
     return plugins;
 });