Remove composition listeners on destroy

* enable multiple selection

* enable object duplication

* enable copy styles

* enable converting plots and tables to alpha numerics

* enable merging multiple alpha numerics

* change icon for viewSwitcher

* allow users to merge overlay plots into a stacked plot

* New glyph for alphanumeric

Co-authored-by: charlesh88 <charlesh88@gmail.com>

.circleci/config.yml

@@ -2,7 +2,7 @@ version: 2
 jobs:
   build:
     docker:
-        - image: circleci/node:8-browsers
+        - image: circleci/node:13-browsers
           environment:
             CHROME_BIN: "/usr/bin/google-chrome"
     steps:
@@ -11,17 +11,17 @@ jobs:
             name: Update npm
             command: 'sudo npm install -g npm@latest'
         - restore_cache:
-            key: dependency-cache-{{ checksum "package.json" }}
+            key: dependency-cache-13-{{ checksum "package.json" }}
         - run:
             name: Installing dependencies (npm install)
             command: npm install
         - save_cache:
-            key: dependency-cache-{{ checksum "package.json" }}
+            key: dependency-cache-13-{{ checksum "package.json" }}
             paths:
               - node_modules
         - run:
-            name: npm run test
-            command: npm run test
+            name: npm run test:coverage
+            command: npm run test:coverage
         - run:
             name: npm run lint
             command: npm run lint

.eslintrc.js

@@ -1,3 +1,4 @@
+const LEGACY_FILES = ["platform/**", "example/**"];
 module.exports = {
     "env": {
         "browser": true,
@@ -10,7 +11,8 @@ module.exports = {
     },
     "extends": [
         "eslint:recommended",
-        "plugin:vue/recommended"
+        "plugin:vue/recommended",
+        "plugin:you-dont-need-lodash-underscore/compatible"
     ],
     "parser": "vue-eslint-parser",
     "parserOptions": {
@@ -22,6 +24,9 @@ module.exports = {
         }
     },
     "rules": {
+        "you-dont-need-lodash-underscore/omit": "off",
+        "you-dont-need-lodash-underscore/throttle": "off",
+        "you-dont-need-lodash-underscore/flatten": "off",
         "no-bitwise": "error",
         "curly": "error",
         "eqeqeq": "error",
@@ -66,6 +71,56 @@ module.exports = {
         ],
         "dot-notation": "error",
         "indent": ["error", 4],
+
+        // https://eslint.org/docs/rules/no-case-declarations
+        "no-case-declarations": "error",
+        // https://eslint.org/docs/rules/max-classes-per-file
+        "max-classes-per-file": ["error", 1],
+        // https://eslint.org/docs/rules/no-eq-null
+        "no-eq-null": "error",
+        // https://eslint.org/docs/rules/no-eval
+        "no-eval": "error",
+        // https://eslint.org/docs/rules/no-floating-decimal
+        "no-floating-decimal": "error",
+        // https://eslint.org/docs/rules/no-implicit-globals
+        "no-implicit-globals": "error",
+        // https://eslint.org/docs/rules/no-implied-eval
+        "no-implied-eval": "error",
+        // https://eslint.org/docs/rules/no-lone-blocks
+        "no-lone-blocks": "error",
+        // https://eslint.org/docs/rules/no-loop-func
+        "no-loop-func": "error",
+        // https://eslint.org/docs/rules/no-new-func
+        "no-new-func": "error",
+        // https://eslint.org/docs/rules/no-new-wrappers
+        "no-new-wrappers": "error",
+        // https://eslint.org/docs/rules/no-octal-escape
+        "no-octal-escape": "error",
+        // https://eslint.org/docs/rules/no-proto
+        "no-proto": "error",
+        // https://eslint.org/docs/rules/no-return-await
+        "no-return-await": "error",
+        // https://eslint.org/docs/rules/no-script-url
+        "no-script-url": "error",
+        // https://eslint.org/docs/rules/no-self-compare
+        "no-self-compare": "error",
+        // https://eslint.org/docs/rules/no-sequences
+        "no-sequences": "error",
+        // https://eslint.org/docs/rules/no-unmodified-loop-condition
+        "no-unmodified-loop-condition": "error",
+        // https://eslint.org/docs/rules/no-useless-call
+        "no-useless-call": "error",
+        // https://eslint.org/docs/rules/wrap-iife
+        "wrap-iife": "error",
+        // https://eslint.org/docs/rules/no-nested-ternary
+        "no-nested-ternary": "error",
+        // https://eslint.org/docs/rules/switch-colon-spacing
+        "switch-colon-spacing": "error",
+        // https://eslint.org/docs/rules/no-useless-computed-key
+        "no-useless-computed-key": "error",
+        // https://eslint.org/docs/rules/rest-spread-spacing
+        "rest-spread-spacing": ["error"],
+
         "vue/html-indent": [
             "error",
             4,
@@ -112,6 +167,13 @@ module.exports = {
                     }
                 ]
             }
+        }, {
+            "files": LEGACY_FILES,
+            "rules": {
+                // https://eslint.org/docs/rules/no-nested-ternary
+                "no-nested-ternary": "off",
+                "no-var": "off"
+            }
         }
     ]
 };

.gitignore

@@ -38,3 +38,4 @@ protractor/logs
 npm-debug.log
 
 package-lock.json
+report.*.json

API.md

@@ -231,7 +231,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).
 
@@ -427,8 +427,8 @@ Each telemetry value description has an object defining hints.  Keys in this thi
 
 Known hints:
 
-* `domain`: Indicates that the value represents the "input" of a datum. Values with a `domain` hint will be used for the x-axis of a plot, and tables will render columns for these values first.
-* `range`: Indicates that the value is the "output" of a datum.  Values with a `range` hint will be used as the y-axis on a plot, and tables will render columns for these values after the `domain` values.
+* `domain`: Values with a `domain` hint will be used for the x-axis of a plot, and tables will render columns for these values first.
+* `range`: Values with a `range` hint will be used as the y-axis on a plot, and tables will render columns for these values after the `domain` values.
 * `image`: Indicates that the value may be interpreted as the URL to an image file, in which case appropriate views will be made available.
 
 ##### The Time Conductor and Telemetry 

CONTRIBUTING.md

@@ -103,7 +103,7 @@ the name chosen could not be mistaken for a topic or master branch.
 ### Merging
 
 When development is complete on an issue, the first step toward merging it
-back into the master branch is to file a Pull Request. The contributions
+back into the master branch is to file a Pull Request (PR). The contributions
 should meet code, test, and commit message standards as described below,
 and the pull request should include a completed author checklist, also
 as described below. Pull requests may be assigned to specific team
@@ -114,6 +114,15 @@ request. When the reviewer is satisfied, they should add a comment to
 the pull request containing the reviewer checklist (from below) and complete
 the merge back to the master branch.
 
+Additionally:
+* Every pull request must link to the issue that it addresses. Eg. “Addresses #1234” or “Closes #1234”. This is the responsibility of the pull request’s __author__. If no issue exists, create one.
+* Every __author__ must include testing instructions. These instructions should identify the areas of code affected, and some minimal test steps. If addressing a bug, reproduction steps should be included, if they were not included in the original issue. If reproduction steps were included on the original issue, and are sufficient, refer to them.
+* A pull request that closes an issue should say so in the description. Including the text “Closes #1234” will cause the linked issue to be automatically closed when the pull request is merged. This is the responsibility of the pull request’s __author__.
+* When a pull request is merged, and the corresponding issue closed, the __reviewer__ must add the tag “unverified” to the original issue. This will indicate that although the issue is closed, it has not been tested yet.
+* Every PR must have two reviewers assigned, though only one approval is necessary for merge.
+* Changes to API require approval by a senior developer.
+* When creating a PR, it is the author's responsibility to apply any priority label from the issue to the PR as well. This helps with prioritization.
+
 ## Standards
 
 Contributions to Open MCT are expected to meet the following standards.
@@ -122,89 +131,96 @@ changes.
 
 ### Code Standards
 
-JavaScript sources in Open MCT must satisfy JSLint under its default
-settings. This is verified by the command line build.
+JavaScript sources in Open MCT must satisfy the ESLint rules defined in 
+this repository. This is verified by the command line build.
 
 #### Code Guidelines
 
-JavaScript sources in Open MCT should:
-
-* Use four spaces for indentation. Tabs should not be used.
-* Include JSDoc for any exposed API (e.g. public methods, constructors).
-* Include non-JSDoc comments as-needed for explaining private variables,
-  methods, or algorithms when they are non-obvious.
-* Define one public class per script, expressed as a constructor function
-  returned from an AMD-style module.
-* Follow “Java-like” naming conventions. These includes:
-  * Classes should use camel case, first letter capitalized
-    (e.g. SomeClassName).
-  * Methods, variables, fields, and function names should use camel case,
-    first letter lower-case (e.g. someVariableName).
-  * Constants (variables or fields which are meant to be declared and 
-    initialized statically, and never changed) should use only capital 
-    letters, with underscores between words (e.g. SOME_CONSTANT).
-  * File names should be the name of the exported class, plus a .js extension
-    (e.g. SomeClassName.js).
-* Avoid anonymous functions, except when functions are short (a few lines)
-  and/or their inclusion makes sense within the flow of the code
-  (e.g. as arguments to a forEach call).
-* Avoid deep nesting (especially of functions), except where necessary
-  (e.g. due to closure scope).
-* End with a single new-line character.
-* Expose public methods by declaring them on the class's prototype.
-* Within a given function's scope, do not mix declarations and imperative
-  code, and  present these in the following order:
-  * First, variable declarations and initialization.
-  * Second, function declarations.
-  * Third, imperative statements.
-  * Finally, the returned value.
+The following guidelines are provided for anyone contributing source code to the Open MCT project:
 
+1. Write clean code. Here’s a good summary - https://github.com/ryanmcdermott/clean-code-javascript.
+1. Include JSDoc for any exposed API (e.g. public methods, classes).
+1. Include non-JSDoc comments as-needed for explaining private variables,
+   methods, or algorithms when they are non-obvious. Otherwise code 
+   should be self-documenting.
+1. Classes and Vue components should use camel case, first letter capitalized
+   (e.g. SomeClassName).
+1. Methods, variables, fields, events, and function names should use camelCase,
+   first letter lower-case (e.g. someVariableName).
+1. Source files that export functions should use camelCase, first letter lower-case (eg. testTools.js)
+1. Constants (variables or fields which are meant to be declared and 
+   initialized statically, and never changed) should use only capital 
+   letters, with underscores between words (e.g. SOME_CONSTANT). They should always be declared as `const`s
+1. File names should be the name of the exported class, plus a .js extension
+   (e.g. SomeClassName.js).
+1. Avoid anonymous functions, except when functions are short (one or two lines)
+   and their inclusion makes sense within the flow of the code
+   (e.g. as arguments to a forEach call). Anonymous functions should always be arrow functions.
+1. Named functions are preferred over functions assigned to variables.
+   eg.
+   ```JavaScript
+   function renameObject(object, newName) {
+       Object.name = newName;
+   }
+   ```
+   is preferable to
+   ```JavaScript
+   const rename = (object, newName) => {
+       Object.name = newName;
+   }
+   ```
+1. Avoid deep nesting (especially of functions), except where necessary
+   (e.g. due to closure scope).
+1. End with a single new-line character.
+1. Always use ES6 `Class`es and inheritence rather than the pre-ES6 prototypal 
+   pattern.
+1. Within a given function's scope, do not mix declarations and imperative
+   code, and  present these in the following order:
+   * First, variable declarations and initialization.
+   * Secondly, imperative statements.
+   * Finally, the returned value. A single return statement at the end of the function should be used, except where an early return would improve code clarity.
+1. Avoid the use of "magic" values.
+   eg.
+   ```JavaScript
+   Const UNAUTHORIZED = 401
+   if (responseCode === UNAUTHORIZED)
+   ```
+   is preferable to
+   ```JavaScript
+   if (responseCode === 401)
+   ```
+1. Use the ternary operator only for simple cases such as variable assignment. Nested ternaries should be avoided in all cases.
+1. Test specs should reside alongside the source code they test, not in a separate directory.
+1. Organize code by feature, not by type.
+   eg.
+   ```
+   - telemetryTable
+       - row
+           TableRow.js
+           TableRowCollection.js
+           TableRow.vue
+       - column
+           TableColumn.js
+           TableColumn.vue
+       plugin.js
+       pluginSpec.js
+   ```
+   is preferable to
+   ```
+   - telemetryTable
+       - components
+           TableRow.vue
+           TableColumn.vue
+       - collections
+           TableRowCollection.js
+       TableColumn.js
+       TableRow.js
+       plugin.js
+       pluginSpec.js
+   ```
 Deviations from Open MCT code style guidelines require two-party agreement,
 typically from the author of the change and its reviewer.
 
-#### Code Example
-
-```js
-/*global define*/
-
-/**
- * Bundles should declare themselves as namespaces in whichever source
- * file is most like the "main point of entry" to the bundle.
- * @namespace some/bundle
- */
-define(
-    ['./OtherClass'],
-    function (OtherClass) {
-        "use strict";
-
-        /**
-         * A summary of how to use this class goes here.
-         *
-         * @constructor
-         * @memberof some/bundle
-         */
-        function ExampleClass() {
-        }
-
-        // Methods which are not intended for external use should
-        // not have JSDoc (or should be marked @private)
-        ExampleClass.prototype.privateMethod = function () {
-        };
-
-        /**
-         * A summary of this method goes here.
-         * @param {number} n a parameter
-         * @returns {number} a return value
-         */
-        ExampleClass.prototype.publicMethod = function (n) {
-            return n * 2;
-        }
-
-        return ExampleClass;
-    }
-);
-```
-
 ### Test Standards
 
 Automated testing shall occur whenever changes are merged into the main
@@ -292,6 +308,7 @@ checklist).
 2. Unit tests included and/or updated with changes?
 3. Command line build passes?
 4. Changes have been smoke-tested?
+5. Testing instructions included?
 
 ### Reviewer Checklist
 
@@ -299,3 +316,4 @@ checklist).
 2. Appropriate unit tests included?
 3. Code style and in-line documentation are appropriate?
 4. Commit messages meet standards?
+5. Has associated issue been labelled `unverified`? (only applicable if this PR closes the issue)

copyright-notice.html

@@ -1,5 +1,5 @@
 <!--
- 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.
 
@@ -18,4 +18,4 @@
  licenses. See the Open Source Licenses file (LICENSES.md) included with
  this source code distribution or the Licensing information page available
  at runtime from the About dialog for additional information.
--->
+-->

copyright-notice.js

@@ -1,5 +1,5 @@
 /*****************************************************************************
- * 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.
  *
@@ -18,4 +18,4 @@
  * licenses. See the Open Source Licenses file (LICENSES.md) included with
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
- *****************************************************************************/
+ *****************************************************************************/

coverage/HeadlessChrome 0.0.0 (Mac OS X 10.14.6)/index.html

@@ -1,80 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-    <title>Code coverage report for All files</title>
-    <meta charset="utf-8" />
-    <link rel="stylesheet" href="prettify.css" />
-    <link rel="stylesheet" href="base.css" />
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <style type='text/css'>
-        .coverage-summary .sorter {
-            background-image: url(sort-arrow-sprite.png);
-        }
-    </style>
-</head>
-<body>
-<div class='wrapper'>
-  <div class='pad1'>
-    <h1>
-      /
-    </h1>
-    <div class='clearfix'>
-      <div class='fl pad1y space-right2'>
-        <span class="strong">100% </span>
-        <span class="quiet">Statements</span>
-        <span class='fraction'>0/0</span>
-      </div>
-      <div class='fl pad1y space-right2'>
-        <span class="strong">100% </span>
-        <span class="quiet">Branches</span>
-        <span class='fraction'>0/0</span>
-      </div>
-      <div class='fl pad1y space-right2'>
-        <span class="strong">100% </span>
-        <span class="quiet">Functions</span>
-        <span class='fraction'>0/0</span>
-      </div>
-      <div class='fl pad1y space-right2'>
-        <span class="strong">100% </span>
-        <span class="quiet">Lines</span>
-        <span class='fraction'>0/0</span>
-      </div>
-    </div>
-  </div>
-  <div class='status-line high'></div>
-<div class="pad1">
-<table class="coverage-summary">
-<thead>
-<tr>
-   <th data-col="file" data-fmt="html" data-html="true" class="file">File</th>
-   <th data-col="pic" data-type="number" data-fmt="html" data-html="true" class="pic"></th>
-   <th data-col="statements" data-type="number" data-fmt="pct" class="pct">Statements</th>
-   <th data-col="statements_raw" data-type="number" data-fmt="html" class="abs"></th>
-   <th data-col="branches" data-type="number" data-fmt="pct" class="pct">Branches</th>
-   <th data-col="branches_raw" data-type="number" data-fmt="html" class="abs"></th>
-   <th data-col="functions" data-type="number" data-fmt="pct" class="pct">Functions</th>
-   <th data-col="functions_raw" data-type="number" data-fmt="html" class="abs"></th>
-   <th data-col="lines" data-type="number" data-fmt="pct" class="pct">Lines</th>
-   <th data-col="lines_raw" data-type="number" data-fmt="html" class="abs"></th>
-</tr>
-</thead>
-<tbody></tbody>
-</table>
-</div><div class='push'></div><!-- for sticky footer -->
-</div><!-- /wrapper -->
-<div class='footer quiet pad2 space-top1 center small'>
-  Code coverage
-  generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Wed Dec 11 2019 13:15:10 GMT-0800 (Pacific Standard Time)
-</div>
-</div>
-<script src="prettify.js"></script>
-<script>
-window.onload = function () {
-        if (typeof prettyPrint === 'function') {
-            prettyPrint();
-        }
-};
-</script>
-<script src="sorter.js"></script>
-</body>
-</html>

coverage/HeadlessChrome 0.0.0 (Mac OS X 10.14.6)/sorter.js

@@ -1,158 +0,0 @@
-var addSorting = (function () {
-    "use strict";
-    var cols,
-        currentSort = {
-            index: 0,
-            desc: false
-        };
-
-    // returns the summary table element
-    function getTable() { return document.querySelector('.coverage-summary'); }
-    // returns the thead element of the summary table
-    function getTableHeader() { return getTable().querySelector('thead tr'); }
-    // returns the tbody element of the summary table
-    function getTableBody() { return getTable().querySelector('tbody'); }
-    // returns the th element for nth column
-    function getNthColumn(n) { return getTableHeader().querySelectorAll('th')[n]; }
-
-    // loads all columns
-    function loadColumns() {
-        var colNodes = getTableHeader().querySelectorAll('th'),
-            colNode,
-            cols = [],
-            col,
-            i;
-
-        for (i = 0; i < colNodes.length; i += 1) {
-            colNode = colNodes[i];
-            col = {
-                key: colNode.getAttribute('data-col'),
-                sortable: !colNode.getAttribute('data-nosort'),
-                type: colNode.getAttribute('data-type') || 'string'
-            };
-            cols.push(col);
-            if (col.sortable) {
-                col.defaultDescSort = col.type === 'number';
-                colNode.innerHTML = colNode.innerHTML + '<span class="sorter"></span>';
-            }
-        }
-        return cols;
-    }
-    // attaches a data attribute to every tr element with an object
-    // of data values keyed by column name
-    function loadRowData(tableRow) {
-        var tableCols = tableRow.querySelectorAll('td'),
-            colNode,
-            col,
-            data = {},
-            i,
-            val;
-        for (i = 0; i < tableCols.length; i += 1) {
-            colNode = tableCols[i];
-            col = cols[i];
-            val = colNode.getAttribute('data-value');
-            if (col.type === 'number') {
-                val = Number(val);
-            }
-            data[col.key] = val;
-        }
-        return data;
-    }
-    // loads all row data
-    function loadData() {
-        var rows = getTableBody().querySelectorAll('tr'),
-            i;
-
-        for (i = 0; i < rows.length; i += 1) {
-            rows[i].data = loadRowData(rows[i]);
-        }
-    }
-    // sorts the table using the data for the ith column
-    function sortByIndex(index, desc) {
-        var key = cols[index].key,
-            sorter = function (a, b) {
-                a = a.data[key];
-                b = b.data[key];
-                return a < b ? -1 : a > b ? 1 : 0;
-            },
-            finalSorter = sorter,
-            tableBody = document.querySelector('.coverage-summary tbody'),
-            rowNodes = tableBody.querySelectorAll('tr'),
-            rows = [],
-            i;
-
-        if (desc) {
-            finalSorter = function (a, b) {
-                return -1 * sorter(a, b);
-            };
-        }
-
-        for (i = 0; i < rowNodes.length; i += 1) {
-            rows.push(rowNodes[i]);
-            tableBody.removeChild(rowNodes[i]);
-        }
-
-        rows.sort(finalSorter);
-
-        for (i = 0; i < rows.length; i += 1) {
-            tableBody.appendChild(rows[i]);
-        }
-    }
-    // removes sort indicators for current column being sorted
-    function removeSortIndicators() {
-        var col = getNthColumn(currentSort.index),
-            cls = col.className;
-
-        cls = cls.replace(/ sorted$/, '').replace(/ sorted-desc$/, '');
-        col.className = cls;
-    }
-    // adds sort indicators for current column being sorted
-    function addSortIndicators() {
-        getNthColumn(currentSort.index).className += currentSort.desc ? ' sorted-desc' : ' sorted';
-    }
-    // adds event listeners for all sorter widgets
-    function enableUI() {
-        var i,
-            el,
-            ithSorter = function ithSorter(i) {
-                var col = cols[i];
-
-                return function () {
-                    var desc = col.defaultDescSort;
-
-                    if (currentSort.index === i) {
-                        desc = !currentSort.desc;
-                    }
-                    sortByIndex(i, desc);
-                    removeSortIndicators();
-                    currentSort.index = i;
-                    currentSort.desc = desc;
-                    addSortIndicators();
-                };
-            };
-        for (i =0 ; i < cols.length; i += 1) {
-            if (cols[i].sortable) {
-                // add the click event handler on the th so users
-                // dont have to click on those tiny arrows
-                el = getNthColumn(i).querySelector('.sorter').parentElement;
-                if (el.addEventListener) {
-                    el.addEventListener('click', ithSorter(i));
-                } else {
-                    el.attachEvent('onclick', ithSorter(i));
-                }
-            }
-        }
-    }
-    // adds sorting functionality to the UI
-    return function () {
-        if (!getTable()) {
-            return;
-        }
-        cols = loadColumns();
-        loadData(cols);
-        addSortIndicators();
-        enableUI();
-    };
-})();
-
-window.addEventListener('load', addSorting);

docs/src/process/testing/plan.md

@@ -125,3 +125,22 @@ A release is not closed until both categories have been performed on
 the latest snapshot of the software, _and_ no issues labelled as
 ["blocker" or "critical"](https://github.com/nasa/openmctweb/blob/master/CONTRIBUTING.md#issue-reporting)
 remain open.
+
+### Testathons
+Testathons can be used as a means of performing per-sprint and per-release testing. 
+
+#### Timing
+For per-sprint testing, a testathon is typically performed at the beginning of the third week of a sprint, and again later that week to verify any fixes. For per-release testing, a testathon is typically performed prior to any formal testing processes that are applicable to that release.
+
+#### Process
+
+1. Prior to the scheduled testathon, a list will be compiled of all issues that are closed and unverified.
+2. For each issue, testers should review the associated PR for testing instructions. See the contributing guide for instructions on [pull requests](https://github.com/nasa/openmct/blob/master/CONTRIBUTING.md#merging).
+3. As each issue is verified via testing, any team members testing it should leave a comment on that issue indicating that it has been verified fixed.
+4. If a bug is found that relates to an issue being tested, notes should be included on the associated issue, and the issue should be reopened. Bug notes should include reproduction steps.
+5. For any bugs that are not obviously related to any of the issues under test, a new issue should be created with details about the bug, including reproduction steps. If unsure about whether a bug relates to an issue being tested, just create a new issue.
+6. At the end of the testathon, triage will take place, where all tested issues will be reviewed.
+7. If verified fixed, an issue will remain closed, and will have the “unverified” label removed.
+8. For any bugs found, a severity will be assigned.
+9. A second testathon will be scheduled for later in the week that will aim to address all issues identified as blockers, as well as any other issues scoped by the team during triage.
+10. Any issues that were not tested will remain "unverified" and will be picked up in the next testathon.

example/generator/GeneratorMetadataProvider.js

@@ -9,7 +9,8 @@ define([
             values: [
                 {
                     key: "name",
-                    name: "Name"
+                    name: "Name",
+                    format: "string"
                 },
                 {
                     key: "utc",
@@ -49,7 +50,8 @@ define([
             values: [
                 {
                     key: "name",
-                    name: "Name"
+                    name: "Name",
+                    format: "string"
                 },
                 {
                     key: "utc",
@@ -98,7 +100,7 @@ define([
     };
 
     GeneratorMetadataProvider.prototype.getMetadata = function (domainObject) {
-        return _.extend(
+        return Object.assign(
             {},
             domainObject.telemetry,
             METADATA_BY_TYPE[domainObject.type]

example/generator/GeneratorProvider.js

@@ -31,6 +31,7 @@ define([
         period: 10,
         offset: 0,
         dataRateInHz: 1,
+        randomness: 0,
         phase: 0
     };
 
@@ -52,7 +53,8 @@ define([
             'period',
             'offset',
             'dataRateInHz',
-            'phase'
+            'phase',
+            'randomness'
         ];
 
         request = request || {};

example/generator/generatorWorker.js

@@ -65,8 +65,8 @@
                         name: data.name,
                         utc: nextStep,
                         yesterday: nextStep - 60*60*24*1000,
-                        sin: sin(nextStep, data.period, data.amplitude, data.offset, data.phase),
-                        cos: cos(nextStep, data.period, data.amplitude, data.offset, data.phase)
+                        sin: sin(nextStep, data.period, data.amplitude, data.offset, data.phase, data.randomness),
+                        cos: cos(nextStep, data.period, data.amplitude, data.offset, data.phase, data.randomness)
                     }
                 });
                 nextStep += step;
@@ -99,6 +99,7 @@
         var offset = request.offset;
         var dataRateInHz = request.dataRateInHz;
         var phase = request.phase;
+        var randomness = request.randomness;
 
         var step = 1000 / dataRateInHz;
         var nextStep = start - (start % step) + step;
@@ -110,8 +111,8 @@
                 name: request.name,
                 utc: nextStep,
                 yesterday: nextStep - 60*60*24*1000,
-                sin: sin(nextStep, period, amplitude, offset, phase),
-                cos: cos(nextStep, period, amplitude, offset, phase)
+                sin: sin(nextStep, period, amplitude, offset, phase, randomness),
+                cos: cos(nextStep, period, amplitude, offset, phase, randomness)
             });
         }
         self.postMessage({
@@ -120,14 +121,14 @@
         });
     }
 
-    function cos(timestamp, period, amplitude, offset, phase) {
+    function cos(timestamp, period, amplitude, offset, phase, randomness) {
         return amplitude *
-            Math.cos(phase + (timestamp / period / 1000 * Math.PI * 2)) + offset;
+            Math.cos(phase + (timestamp / period / 1000 * Math.PI * 2)) + (amplitude * Math.random() * randomness) + offset;
     }
 
-    function sin(timestamp, period, amplitude, offset, phase) {
+    function sin(timestamp, period, amplitude, offset, phase, randomness) {
         return amplitude *
-            Math.sin(phase + (timestamp / period / 1000 * Math.PI * 2)) + offset;
+            Math.sin(phase + (timestamp / period / 1000 * Math.PI * 2)) + (amplitude * Math.random() * randomness) + offset;
     }
 
     function sendError(error, message) {

example/generator/plugin.js

@@ -122,6 +122,17 @@ define([
                         "telemetry",
                         "phase"
                     ]
+                },
+                {
+                    name: "Randomness",
+                    control: "numberfield",
+                    cssClass: "l-input-sm l-numeric",
+                    key: "randomness",
+                    required: true,
+                    property: [
+                        "telemetry",
+                        "randomness"
+                    ]
                 }
             ],
             initialize: function (object) {
@@ -130,7 +141,8 @@ define([
                     amplitude: 1,
                     offset: 0,
                     dataRateInHz: 1,
-                    phase: 0
+                    phase: 0,
+                    randomness: 0
                 };
             }
         });

example/imagery/plugin.js

@@ -52,6 +52,7 @@ define([
             return {
                 name: name,
                 utc: Math.floor(timestamp / 5000) * 5000,
+                local: Math.floor(timestamp / 5000) * 5000,
                 url: IMAGE_SAMPLES[Math.floor(timestamp / 5000) % IMAGE_SAMPLES.length]
             };
         }
@@ -78,7 +79,7 @@ define([
             },
             request: function (domainObject, options) {
                 var start = options.start;
-                var end = options.end;
+                var end = Math.min(options.end, Date.now());
                 var data = [];
                 while (start <= end && data.length < 5000) {
                     data.push(pointForTimestamp(start, domainObject.name));
@@ -118,6 +119,14 @@ define([
                                 name: 'Time',
                                 key: 'utc',
                                 format: 'utc',
+                                hints: {
+                                    domain: 2
+                                }
+                            },
+                            {
+                                name: 'Local Time',
+                                key: 'local',
+                                format: 'local-format',
                                 hints: {
                                     domain: 1
                                 }

example/simpleVuePlugin/HelloWorld.vue

@@ -1,14 +1,14 @@
 <template>
-  <div class="example">{{ msg }}</div>
+<div class="example">{{ msg }}</div>
 </template>
 
 <script>
 export default {
-  data () {
-    return {
-      msg: 'Hello world!'
+    data() {
+        return {
+            msg: 'Hello world!'
+        }
     }
-  }
 }
 </script>
 

index.html

@@ -1,5 +1,5 @@
 <!--
- Open MCT, Copyright (c) 2014-2017, 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.
 
@@ -34,6 +34,7 @@
     <body>
     </body>
     <script>
+        const ONE_MINUTE = 60 * 1000;
         const FIVE_MINUTES = 5 * 60 * 1000;
         const THIRTY_MINUTES = 30 * 60 * 1000;
 
@@ -43,9 +44,9 @@
             openmct.legacyRegistry.enable.bind(openmct.legacyRegistry)
         );
 
-        openmct.install(openmct.plugins.Snow());
-        openmct.install(openmct.plugins.MyItems());
         openmct.install(openmct.plugins.LocalStorage());
+        openmct.install(openmct.plugins.Espresso());
+        openmct.install(openmct.plugins.MyItems());
         openmct.install(openmct.plugins.Generator());
         openmct.install(openmct.plugins.ExampleImagery());
         openmct.install(openmct.plugins.UTCTimeSystem());
@@ -70,8 +71,8 @@
                     timeSystem: 'utc',
                     clock: 'local',
                     clockOffsets: {
-                        start: - THIRTY_MINUTES,
-                        end: FIVE_MINUTES
+                        start: - FIVE_MINUTES,
+                        end: ONE_MINUTE
                     }
                 }
             ]

karma.conf.js

@@ -24,16 +24,27 @@
 
 const devMode = process.env.NODE_ENV !== 'production';
 const browsers = [process.env.NODE_ENV === 'debug' ? 'ChromeDebugging' : 'ChromeHeadless'];
+const coverageEnabled = process.env.COVERAGE === 'true';
+const reporters = ['progress', 'html'];
+
+if (coverageEnabled) {
+    reporters.push('coverage-istanbul');
+}
 
 module.exports = (config) => {
     const webpackConfig = require('./webpack.config.js');
     delete webpackConfig.output;
 
-    if (!devMode) {
+    if (!devMode || coverageEnabled) {
         webpackConfig.module.rules.push({
             test: /\.js$/,
-            exclude: /node_modules|example/,
-            use: 'istanbul-instrumenter-loader'
+            exclude: /node_modules|example|lib|dist/,
+            use: {
+                loader: 'istanbul-instrumenter-loader',
+                options: {
+                    esModules: true
+                }
+            }
         });
     }
 
@@ -45,11 +56,7 @@ module.exports = (config) => {
             'src/**/*Spec.js'
         ],
         port: 9876,
-        reporters: [
-            'progress',
-            'coverage',
-            'html'
-        ],
+        reporters: reporters,
         browsers: browsers,
         customLaunchers: {
             ChromeDebugging: {
@@ -61,27 +68,27 @@ module.exports = (config) => {
         colors: true,
         logLevel: config.LOG_INFO,
         autoWatch: true,
-        coverageReporter: {
-            dir: process.env.CIRCLE_ARTIFACTS ?
-                process.env.CIRCLE_ARTIFACTS + '/coverage' :
-                "dist/reports/coverage",
-            check: {
-                global: {
-                    lines: 80,
-                    excludes: ['src/plugins/plot/**/*.js']
-                }
-            }
-        },
         // HTML test reporting.
         htmlReporter: {
             outputDir: "dist/reports/tests",
             preserveDescribeNesting: true,
             foldAll: false
         },
+        coverageIstanbulReporter: {
+            fixWebpackSourcePaths: true,
+            dir: process.env.CIRCLE_ARTIFACTS ?
+                process.env.CIRCLE_ARTIFACTS + '/coverage' :
+                "dist/reports/coverage",
+            reports: ['html', 'lcovonly', 'text-summary'],
+            thresholds: {
+                global: {
+                    lines: 62
+                }
+            }
+        },
         preprocessors: {
-            // add webpack as preprocessor
-            'platform/**/*Spec.js': [ 'webpack', 'sourcemap' ],
-            'src/**/*Spec.js': [ 'webpack', 'sourcemap' ]
+            'platform/**/*Spec.js': ['webpack', 'sourcemap'],
+            'src/**/*Spec.js': ['webpack', 'sourcemap']
         },
         webpack: webpackConfig,
         webpackMiddleware: {

package.json

@@ -2,10 +2,8 @@
   "name": "openmct",
   "version": "1.0.0-snapshot",
   "description": "The Open MCT core platform",
-  "dependencies": {},
   "devDependencies": {
-    "acorn": "6.2.0",
-    "angular": "1.4.14",
+    "angular": "1.7.9",
     "angular-route": "1.4.14",
     "babel-eslint": "8.2.6",
     "comma-separated-values": "^3.6.4",
@@ -25,6 +23,7 @@
     "d3-time-format": "2.1.x",
     "eslint": "5.2.0",
     "eslint-plugin-vue": "^6.0.0",
+    "eslint-plugin-you-dont-need-lodash-underscore": "^6.10.0",
     "eventemitter3": "^1.2.0",
     "exports-loader": "^0.7.0",
     "express": "^4.13.1",
@@ -39,26 +38,28 @@
     "istanbul-instrumenter-loader": "^3.0.1",
     "jasmine-core": "^3.1.0",
     "jsdoc": "^3.3.2",
-    "karma": "^2.0.3",
-    "karma-chrome-launcher": "^2.2.0",
+    "karma": "5.0.9",
+    "karma-chrome-launcher": "3.1.0",
     "karma-cli": "^1.0.1",
     "karma-coverage": "^1.1.2",
+    "karma-coverage-istanbul-reporter": "^2.1.1",
     "karma-html-reporter": "^0.2.7",
-    "karma-jasmine": "^1.1.2",
+    "karma-jasmine": "^2.0.0",
     "karma-sourcemap-loader": "^0.3.7",
     "karma-webpack": "^3.0.0",
     "location-bar": "^3.0.1",
-    "lodash": "^3.10.1",
+    "lodash": "^4.17.12",
     "markdown-toc": "^0.11.7",
     "marked": "^0.3.5",
     "mini-css-extract-plugin": "^0.4.1",
     "minimist": "^1.1.1",
-    "moment": "^2.11.1",
+    "moment": "2.25.3",
     "moment-duration-format": "^2.2.2",
-    "moment-timezone": "^0.5.21",
+    "moment-timezone": "0.5.28",
     "node-bourbon": "^4.2.3",
     "node-sass": "^4.9.2",
     "painterro": "^0.2.65",
+    "plotly.js-dist": "^1.54.1",
     "printj": "^1.2.1",
     "raw-loader": "^0.5.1",
     "request": "^2.69.0",
@@ -76,15 +77,17 @@
     "zepto": "^1.2.0"
   },
   "scripts": {
+    "clean": "rm -rf ./dist",
     "start": "node app.js",
-    "lint": "eslint platform example src/**/*.{js,vue} openmct.js",
-    "lint:fix": "eslint platform example src/**/*.{js,vue} openmct.js --fix",
+    "lint": "eslint platform example src --ext .js,.vue openmct.js",
+    "lint:fix": "eslint platform example src --ext .js,.vue openmct.js --fix",
     "build:prod": "cross-env NODE_ENV=production webpack",
     "build:dev": "webpack",
     "build:watch": "webpack --watch",
-    "test": "karma start --single-run",
-    "test-debug": "cross-env NODE_ENV=debug karma start --no-single-run",
-    "test:watch": "karma start --no-single-run",
+    "test": "cross-env NODE_OPTIONS=\"--max_old_space_size=4096\" karma start --single-run",
+    "test:debug": "cross-env NODE_ENV=debug karma start --no-single-run",
+    "test:coverage": "cross-env NODE_OPTIONS=\"--max_old_space_size=4096\" COVERAGE=true karma start --single-run",
+    "test:watch": "cross-env NODE_OPTIONS=\"--max_old_space_size=4096\" karma start --no-single-run",
     "verify": "concurrently 'npm:test' 'npm:lint'",
     "jsdoc": "jsdoc -c jsdoc.json -R API.md -r -d dist/docs/api",
     "otherdoc": "node docs/gendocs.js --in docs/src --out dist/docs --suppress-toc 'docs/src/index.md|docs/src/process/index.md'",

platform/commonUI/dialog/res/templates/overlay-message-list.html

@@ -6,6 +6,12 @@
                     ng-show="ngModel.dialog.messages.length > 1 ||
                             ngModel.dialog.messages.length == 0">s</span>
             </div>
+            <button
+                ng-if="ngModel.dialog.topBarButton"
+                class="c-button c-button--major"
+                ng-click="ngModel.topBarButton.onClick">
+                {{ ngModel.topBarButton.label }}
+            </button>
         </div>
         <div class="w-messages c-overlay__messages">
             <mct-include
@@ -16,7 +22,7 @@
             <button ng-repeat="dialogAction in ngModel.dialog.actions"
                class="c-button c-button--major"
                ng-click="dialogAction.action()">
-                {{dialogAction.label}}
+                {{ dialogAction.label }}
             </button>
         </div>
     </div>

platform/commonUI/edit/src/policies/EditPersistableObjectsPolicy.js

@@ -21,7 +21,7 @@
  *****************************************************************************/
 
 define(
-    ['../../../../../src/api/objects/object-utils'],
+    ['objectUtils'],
     function (objectUtils) {
 
         /**

platform/commonUI/notification/bundle.js

@@ -21,44 +21,15 @@
  *****************************************************************************/
 
 define([
-    "./src/NotificationIndicatorController",
-    "./src/NotificationIndicator",
-    "./src/NotificationService",
-    "./res/notification-indicator.html"
+    "./src/NotificationService"
 ], function (
-    NotificationIndicatorController,
-    NotificationIndicator,
-    NotificationService,
-    notificationIndicatorTemplate
+    NotificationService
 ) {
 
     return {
         name:"platform/commonUI/notification",
         definition: {
             "extensions": {
-                "templates": [
-                    {
-                        "key": "notificationIndicatorTemplate",
-                        "template": notificationIndicatorTemplate
-                    }
-                ],
-                "controllers": [
-                    {
-                        "key": "NotificationIndicatorController",
-                        "implementation": NotificationIndicatorController,
-                        "depends": [
-                            "$scope",
-                            "openmct",
-                            "dialogService"
-                        ]
-                    }
-                ],
-                "indicators": [
-                    {
-                        "implementation": NotificationIndicator,
-                        "priority": "fallback"
-                    }
-                ],
                 "services": [
                     {
                         "key": "notificationService",

platform/commonUI/notification/res/notification-indicator.html

@@ -1,8 +0,0 @@
-<!-- DO NOT ADD SPACES BETWEEN THE SPANS - IT ADDS WHITE SPACE!! -->
-<div ng-show="notifications.length > 0" class="c-indicator c-indicator--clickable s-status-{{highest.severity}} icon-bell"
-      ng-controller="NotificationIndicatorController">
-    <span class="label c-indicator__label">
-        <button ng-click="showNotificationsList()">
-           {{notifications.length}} Notification<span ng-show="notifications.length > 1">s</span></button>
-    </span><span class="c-indicator__count">{{notifications.length}}</span>
-</div>

platform/commonUI/notification/src/NotificationIndicatorController.js

@@ -1,73 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2018, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define(
-    [],
-    function () {
-
-        /**
-         * Provides an indicator that is visible when there are
-         * banner notifications that have been minimized. Will also indicate
-         * the number of notifications. Notifications can be viewed by
-         * clicking on the indicator to launch a dialog showing a list of
-         * notifications.
-         * @param $scope
-         * @param notificationService
-         * @param dialogService
-         * @constructor
-         */
-        function NotificationIndicatorController($scope, openmct, dialogService) {
-            $scope.notifications = openmct.notifications.notifications;
-            $scope.highest = openmct.notifications.highest;
-
-            /**
-             * Launch a dialog showing a list of current notifications.
-             */
-            $scope.showNotificationsList = function () {
-                let notificationsList = openmct.notifications.notifications.map(notification => {
-                    if (notification.model.severity === 'alert' || notification.model.severity === 'info') {
-                        notification.model.primaryOption = {
-                            label: 'Dismiss',
-                            callback: () => {
-                                let currentIndex = notificationsList.indexOf(notification);
-                                notification.dismiss();
-                                notificationsList.splice(currentIndex, 1);
-                            }
-                        }
-                    }
-                    return notification;
-                })
-                dialogService.getDialogResponse('overlay-message-list', {
-                    dialog: {
-                        title: "Messages",
-                        //Launch the message list dialog with the models
-                        // from the notifications
-                        messages: notificationsList
-                    }
-                });
-
-            };
-        }
-        return NotificationIndicatorController;
-    }
-);
-

platform/commonUI/notification/test/NotificationIndicatorControllerSpec.js

@@ -1,60 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2018, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define(
-    ['../src/NotificationIndicatorController'],
-    function (NotificationIndicatorController) {
-
-        xdescribe("The notification indicator controller ", function () {
-            var mockNotificationService,
-                mockScope,
-                mockDialogService,
-                controller;
-
-            beforeEach(function () {
-                mockNotificationService = jasmine.createSpy("notificationService");
-                mockScope = jasmine.createSpy("$scope");
-                mockDialogService = jasmine.createSpyObj(
-                    "dialogService",
-                    ["getDialogResponse","dismiss"]
-                );
-                mockNotificationService.highest = {
-                    severity: "error"
-                };
-                controller = new NotificationIndicatorController(mockScope, mockNotificationService, mockDialogService);
-            });
-
-            it("exposes the highest notification severity to the template", function () {
-                expect(mockScope.highest).toBeTruthy();
-                expect(mockScope.highest.severity).toBe("error");
-            });
-
-            it("invokes the dialog service to show list of messages", function () {
-                expect(mockScope.showNotificationsList).toBeDefined();
-                mockScope.showNotificationsList();
-                expect(mockDialogService.getDialogResponse).toHaveBeenCalled();
-                expect(mockDialogService.getDialogResponse.calls.mostRecent().args[0]).toBe('overlay-message-list');
-                expect(mockDialogService.getDialogResponse.calls.mostRecent().args[1].dialog).toBeDefined();
-            });
-        });
-    }
-);

platform/containment/src/PersistableCompositionPolicy.js

@@ -26,7 +26,7 @@
  * @namespace platform/containment
  */
 define(
-    ['../../../src/api/objects/object-utils'],
+    ['objectUtils'],
     function (objectUtils) {
 
         function PersistableCompositionPolicy(openmct) {

platform/core/src/actions/ActionCapability.js

@@ -81,7 +81,7 @@ define(
                 baseContext = context || {};
             }
 
-            var actionContext = _.extend({}, baseContext);
+            var actionContext = Object.assign({}, baseContext);
             actionContext.domainObject = this.domainObject;
 
             return this.actionService.getActions(actionContext);

platform/framework/src/FrameworkLayer.js

@@ -87,6 +87,11 @@ define([
                 bootstrapper
             );
 
+        // Override of angular1.6 ! hashPrefix
+        app.config(['$locationProvider', function ($locationProvider) {
+            $locationProvider.hashPrefix('');
+        }]);
+
         // Apply logging levels; this must be done now, before the
         // first log statement.
         new LogLevel(logLevel).configure(app, $log);

platform/import-export/src/actions/ExportAsJSONAction.js

@@ -121,7 +121,7 @@ define(['lodash'], function (_) {
      */
     ExportAsJSONAction.prototype.rewriteLink = function (child, parent) {
         this.externalIdentifiers.push(this.getId(child));
-        var index = _.findIndex(parent.composition, function (id) {
+        var index = parent.composition.findIndex(id => {
             return _.isEqual(child.identifier, id);
         });
         var copyOfChild = this.copyObject(child);

platform/import-export/src/actions/ImportAsJSONAction.js

@@ -19,7 +19,7 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
-define(['zepto', '../../../../src/api/objects/object-utils.js'], function ($, objectUtils) {
+define(['zepto', 'objectUtils'], function ($, objectUtils) {
 
     /**
      * The ImportAsJSONAction is available from context menus and allows a user

platform/persistence/couch/src/CouchIndicator.js

@@ -33,7 +33,7 @@ define(
         var CONNECTED = {
                 text: "Connected",
                 glyphClass: "ok",
-                statusClass: "s-status-ok",
+                statusClass: "s-status-on",
                 description: "Connected to the domain object database."
             },
             DISCONNECTED = {

platform/persistence/elastic/bundle.js

@@ -71,7 +71,7 @@ define([
                     },
                     {
                         "key": "ELASTIC_PATH",
-                        "value": "mct/domain_object",
+                        "value": "mct/_doc",
                         "priority": "fallback"
                     },
                     {

platform/persistence/elastic/src/ElasticIndicator.js

@@ -32,7 +32,7 @@ define(
         var CONNECTED = {
                 text: "Connected",
                 glyphClass: "ok",
-                statusClass: "s-status-ok",
+                statusClass: "s-status-on",
                 description: "Connected to the domain object database."
             },
             DISCONNECTED = {

platform/persistence/elastic/src/ElasticPersistenceProvider.js

@@ -32,9 +32,9 @@ define(
         // JSLint doesn't like underscore-prefixed properties,
         // so hide them here.
         var SRC = "_source",
-            REV = "_version",
-            ID = "_id",
-            CONFLICT = 409;
+            CONFLICT = 409,
+            SEQ_NO = "_seq_no",
+            PRIMARY_TERM = "_primary_term";
 
         /**
          * The ElasticPersistenceProvider reads and writes JSON documents
@@ -104,7 +104,8 @@ define(
         // Get a domain object model out of ElasticSearch's response
         ElasticPersistenceProvider.prototype.getModel = function (response) {
             if (response && response[SRC]) {
-                this.revs[response[ID]] = response[REV];
+                this.revs[response[SEQ_NO]] = response[SEQ_NO];
+                this.revs[response[PRIMARY_TERM]] = response[PRIMARY_TERM];
                 return response[SRC];
             } else {
                 return undefined;
@@ -116,7 +117,8 @@ define(
         // indicate that the request failed.
         ElasticPersistenceProvider.prototype.checkResponse = function (response, key) {
             if (response && !response.error) {
-                this.revs[key] = response[REV];
+                this.revs[SEQ_NO] = response[SEQ_NO];
+                this.revs[PRIMARY_TERM] = response[PRIMARY_TERM];
                 return response;
             } else {
                 return this.handleError(response, key);
@@ -147,7 +149,7 @@ define(
             function checkUpdate(response) {
                 return self.checkResponse(response, key);
             }
-            return this.put(key, value, { version: this.revs[key] })
+            return this.put(key, value)
                 .then(checkUpdate);
         };
 

platform/persistence/elastic/test/ElasticPersistenceProviderSpec.js

@@ -85,7 +85,7 @@ define(
             it("allows object creation", function () {
                 var model = { someKey: "some value" };
                 mockHttp.and.returnValue(mockPromise({
-                    data: { "_id": "abc", "_version": 1 }
+                    data: { "_id": "abc", "_seq_no": 1, "_primary_term": 1 }
                 }));
                 provider.createObject("testSpace", "abc", model).then(capture);
                 expect(mockHttp).toHaveBeenCalledWith({
@@ -100,7 +100,7 @@ define(
             it("allows object models to be read back", function () {
                 var model = { someKey: "some value" };
                 mockHttp.and.returnValue(mockPromise({
-                    data: { "_id": "abc", "_version": 1, "_source": model }
+                    data: { "_id": "abc", "_seq_no": 1, "_primary_term": 1, "_source": model }
                 }));
                 provider.readObject("testSpace", "abc").then(capture);
                 expect(mockHttp).toHaveBeenCalledWith({
@@ -117,19 +117,19 @@ define(
 
                 // First do a read to populate rev tags...
                 mockHttp.and.returnValue(mockPromise({
-                    data: { "_id": "abc", "_version": 42, "_source": {} }
+                    data: { "_id": "abc", "_source": {} }
                 }));
                 provider.readObject("testSpace", "abc");
 
                 // Now perform an update
                 mockHttp.and.returnValue(mockPromise({
-                    data: { "_id": "abc", "_version": 43, "_source": {} }
+                    data: { "_id": "abc", "_seq_no": 1, "_source": {} }
                 }));
                 provider.updateObject("testSpace", "abc", model).then(capture);
                 expect(mockHttp).toHaveBeenCalledWith({
                     url: "/test/db/abc",
                     method: "PUT",
-                    params: { version: 42 },
+                    params: undefined,
                     data: model
                 });
                 expect(capture.calls.mostRecent().args[0]).toBeTruthy();
@@ -138,13 +138,13 @@ define(
             it("allows object deletion", function () {
                 // First do a read to populate rev tags...
                 mockHttp.and.returnValue(mockPromise({
-                    data: { "_id": "abc", "_version": 42, "_source": {} }
+                    data: { "_id": "abc", "_source": {} }
                 }));
                 provider.readObject("testSpace", "abc");
 
                 // Now perform an update
                 mockHttp.and.returnValue(mockPromise({
-                    data: { "_id": "abc", "_version": 42, "_source": {} }
+                    data: { "_id": "abc", "_source": {} }
                 }));
                 provider.deleteObject("testSpace", "abc", {}).then(capture);
                 expect(mockHttp).toHaveBeenCalledWith({
@@ -167,13 +167,13 @@ define(
                 expect(capture).toHaveBeenCalledWith(undefined);
             });
 
-            it("handles rejection due to version", function () {
+            it("handles rejection due to _seq_no", function () {
                 var model = { someKey: "some value" },
                     mockErrorCallback = jasmine.createSpy('error');
 
                 // First do a read to populate rev tags...
                 mockHttp.and.returnValue(mockPromise({
-                    data: { "_id": "abc", "_version": 42, "_source": {} }
+                    data: { "_id": "abc", "_seq_no": 1, "_source": {} }
                 }));
                 provider.readObject("testSpace", "abc");
 
@@ -196,7 +196,7 @@ define(
 
                 // First do a read to populate rev tags...
                 mockHttp.and.returnValue(mockPromise({
-                    data: { "_id": "abc", "_version": 42, "_source": {} }
+                    data: { "_id": "abc", "_seq_no": 1, "_source": {} }
                 }));
                 provider.readObject("testSpace", "abc");
 

platform/search/src/services/GenericSearchProvider.js

@@ -25,7 +25,7 @@
  * Module defining GenericSearchProvider. Created by shale on 07/16/2015.
  */
 define([
-    '../../../../src/api/objects/object-utils',
+    'objectUtils',
     'lodash'
 ], function (
     objectUtils,
@@ -191,7 +191,7 @@ define([
         }
 
         var domainObject = objectUtils.toNewFormat(model, id);
-        var composition = _.find(this.openmct.composition.registry, function (p) {
+        var composition = this.openmct.composition.registry.find(p => {
             return p.appliesTo(domainObject);
         });
 

platform/telemetry/src/TelemetryCapability.js

@@ -25,7 +25,7 @@
  */
 define(
     [
-        '../../../src/api/objects/object-utils',
+        'objectUtils',
         'lodash'
     ],
     function (
@@ -235,7 +235,7 @@ define(
             var defaultRange = metadata.valuesForHints(['range'])[0];
             defaultRange = defaultRange ? defaultRange.key : undefined;
 
-            var sourceMap = _.indexBy(metadata.values(), 'key');
+            var sourceMap = _.keyBy(metadata.values(), 'key');
 
             var isLegacyProvider = telemetryAPI.findRequestProvider(domainObject) ===
                 telemetryAPI.legacyProvider;
@@ -300,7 +300,7 @@ define(
             var defaultRange = metadata.valuesForHints(['range'])[0];
             defaultRange = defaultRange ? defaultRange.key : undefined;
 
-            var sourceMap = _.indexBy(metadata.values(), 'key');
+            var sourceMap = _.keyBy(metadata.values(), 'key');
 
             var isLegacyProvider = telemetryAPI.findSubscriptionProvider(domainObject) ===
                 telemetryAPI.legacyProvider;

src/MCT.js

@@ -1,5 +1,5 @@
 /*****************************************************************************
- * Open MCT, Copyright (c) 2014-2019, 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.
  *
@@ -28,7 +28,7 @@ define([
     './api/api',
     './api/overlays/OverlayAPI',
     './selection/Selection',
-    './api/objects/object-utils',
+    'objectUtils',
     './plugins/plugins',
     './adapter/indicators/legacy-indicators-plugin',
     './plugins/buildInfo/plugin',
@@ -249,9 +249,10 @@ define([
         this.legacyRegistry = new BundleRegistry();
         installDefaultBundles(this.legacyRegistry);
 
-        // Plugin's that are installed by default
+        // Plugins that are installed by default
 
         this.install(this.plugins.Plot());
+        this.install(this.plugins.PlotlyPlot());
         this.install(this.plugins.TelemetryTable());
         this.install(PreviewPlugin.default());
         this.install(LegacyIndicatorsPlugin());
@@ -265,6 +266,9 @@ define([
         this.install(this.plugins.ImportExport());
         this.install(this.plugins.WebPage());
         this.install(this.plugins.Condition());
+        this.install(this.plugins.ConditionWidget());
+        this.install(this.plugins.URLTimeSettingsSynchronizer());
+        this.install(this.plugins.NotificationIndicator());
     }
 
     MCT.prototype = Object.create(EventEmitter.prototype);
@@ -349,17 +353,13 @@ define([
      * @param {HTMLElement} [domElement] the DOM element in which to run
      *        MCT; if undefined, MCT will be run in the body of the document
      */
-    MCT.prototype.start = function (domElement) {
+    MCT.prototype.start = function (domElement = document.body, isHeadlessMode = false) {
         if (!this.plugins.DisplayLayout._installed) {
             this.install(this.plugins.DisplayLayout({
                 showAsView: ['summary-widget']
             }));
         }
 
-        if (!domElement) {
-            domElement = document.body;
-        }
-
         this.element = domElement;
 
         this.legacyExtension('runs', {
@@ -399,24 +399,31 @@ define([
                 // something has depended upon objectService.  Cool, right?
                 this.$injector.get('objectService');
 
-                var appLayout = new Vue({
-                    components: {
-                        'Layout': Layout.default
-                    },
-                    provide: {
-                        openmct: this
-                    },
-                    template: '<Layout ref="layout"></Layout>'
-                });
-                domElement.appendChild(appLayout.$mount().$el);
+                if (!isHeadlessMode) {
+                    var appLayout = new Vue({
+                        components: {
+                            'Layout': Layout.default
+                        },
+                        provide: {
+                            openmct: this
+                        },
+                        template: '<Layout ref="layout"></Layout>'
+                    });
+                    domElement.appendChild(appLayout.$mount().$el);
 
-                this.layout = appLayout.$refs.layout;
-                Browse(this);
+                    this.layout = appLayout.$refs.layout;
+                    Browse(this);
+                }
                 this.router.start();
                 this.emit('start');
             }.bind(this));
     };
 
+    MCT.prototype.startHeadless = function () {
+        let unreachableNode = document.createElement('div');
+        return this.start(unreachableNode, true);
+    }
+
     /**
      * Install a plugin in MCT.
      *
@@ -428,6 +435,10 @@ define([
         plugin(this);
     };
 
+    MCT.prototype.destroy = function () {
+        this.emit('destroy');
+    };
+
     MCT.prototype.plugins = plugins;
 
     return MCT;

src/MCTSpec.js

@@ -21,24 +21,28 @@
  *****************************************************************************/
 
 define([
-    './MCT',
     './plugins/plugins',
-    'legacyRegistry'
-], function (MCT, plugins, legacyRegistry) {
-    xdescribe("MCT", function () {
+    'legacyRegistry',
+    'utils/testing'
+], function (plugins, legacyRegistry, testUtils) {
+    describe("MCT", function () {
         var openmct;
         var mockPlugin;
         var mockPlugin2;
         var mockListener;
         var oldBundles;
 
+        beforeAll(() => {
+            testUtils.resetApplicationState();
+        });
+
         beforeEach(function () {
             mockPlugin = jasmine.createSpy('plugin');
             mockPlugin2 = jasmine.createSpy('plugin2');
             mockListener = jasmine.createSpy('listener');
             oldBundles = legacyRegistry.list();
 
-            openmct = new MCT();
+            openmct = testUtils.createOpenMct();
 
             openmct.install(mockPlugin);
             openmct.install(mockPlugin2);
@@ -52,6 +56,7 @@ define([
                     legacyRegistry.delete(bundle);
                 }
             });
+            testUtils.resetApplicationState(openmct);
         });
 
         it("exposes plugins", function () {
@@ -63,8 +68,11 @@ define([
         });
 
         describe("start", function () {
-            beforeEach(function () {
-                openmct.start();
+            let appHolder;
+            beforeEach(function (done) {
+                appHolder = document.createElement("div");
+                openmct.on('start', done);
+                openmct.start(appHolder);
             });
 
             it("calls plugins for configuration", function () {
@@ -75,25 +83,51 @@ define([
             it("emits a start event", function () {
                 expect(mockListener).toHaveBeenCalled();
             });
+
+            it("Renders the application into the provided container element", function () {
+                let openMctShellElements = appHolder.querySelectorAll('div.l-shell');
+                expect(openMctShellElements.length).toBe(1);
+            });
+        });
+
+        describe("startHeadless", function () {
+            beforeEach(function (done) {
+                openmct.on('start', done);
+                openmct.startHeadless();
+            });
+
+            it("calls plugins for configuration", function () {
+                expect(mockPlugin).toHaveBeenCalledWith(openmct);
+                expect(mockPlugin2).toHaveBeenCalledWith(openmct);
+            });
+
+            it("emits a start event", function () {
+                expect(mockListener).toHaveBeenCalled();
+            });
+
+            it("Does not render Open MCT", function () {
+                let openMctShellElements = document.body.querySelectorAll('div.l-shell');
+                expect(openMctShellElements.length).toBe(0);
+            });
         });
 
         describe("setAssetPath", function () {
             var testAssetPath;
 
             beforeEach(function () {
-                testAssetPath = "some/path";
                 openmct.legacyExtension = jasmine.createSpy('legacyExtension');
-                openmct.setAssetPath(testAssetPath);
             });
 
-            it("internally configures the path for assets", function () {
-                expect(openmct.legacyExtension).toHaveBeenCalledWith(
-                    'constants',
-                    {
-                        key: "ASSETS_PATH",
-                        value: testAssetPath
-                    }
-                );
+            it("configures the path for assets", function () {
+                testAssetPath = "some/path/";
+                openmct.setAssetPath(testAssetPath);
+                expect(openmct.getAssetPath()).toBe(testAssetPath);
+            });
+
+            it("adds a trailing /", function () {
+                testAssetPath = "some/path";
+                openmct.setAssetPath(testAssetPath);
+                expect(openmct.getAssetPath()).toBe(testAssetPath + "/");
             });
         });
     });

src/adapter/actions/ActionDialogDecorator.js

@@ -21,7 +21,7 @@
  *****************************************************************************/
 
 define([
-    '../../api/objects/object-utils'
+    'objectUtils'
 ], function (objectUtils) {
     function ActionDialogDecorator(mct, actionService) {
         this.mct = mct;

src/adapter/bundle.js

@@ -29,7 +29,6 @@ define([
     './capabilities/APICapabilityDecorator',
     './policies/AdaptedViewPolicy',
     './runs/AlternateCompositionInitializer',
-    './runs/TimeSettingsURLHandler',
     './runs/TypeDeprecationChecker',
     './runs/LegacyTelemetryProvider',
     './runs/RegisterLegacyTypes',
@@ -46,7 +45,6 @@ define([
     APICapabilityDecorator,
     AdaptedViewPolicy,
     AlternateCompositionInitializer,
-    TimeSettingsURLHandler,
     TypeDeprecationChecker,
     LegacyTelemetryProvider,
     RegisterLegacyTypes,
@@ -134,16 +132,6 @@ define([
                         implementation: AlternateCompositionInitializer,
                         depends: ["openmct"]
                     },
-                    {
-                        implementation: function (openmct, $location, $rootScope) {
-                            return new TimeSettingsURLHandler(
-                                openmct.time,
-                                $location,
-                                $rootScope
-                            );
-                        },
-                        depends: ["openmct", "$location", "$rootScope"]
-                    },
                     {
                         implementation: LegacyTelemetryProvider,
                         depends: [

src/adapter/capabilities/AdapterCapability.js

@@ -20,7 +20,7 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-define(['../../api/objects/object-utils'], function (objectUtils) {
+define(['objectUtils'], function (objectUtils) {
     function AdapterCapability(domainObject) {
         this.domainObject = domainObject;
     }

src/adapter/capabilities/AlternateCompositionCapability.js

@@ -24,7 +24,7 @@
  * Module defining AlternateCompositionCapability. Created by vwoeltje on 11/7/14.
  */
 define([
-    '../../api/objects/object-utils',
+    'objectUtils',
     '../../../platform/core/src/capabilities/ContextualDomainObject'
 ], function (objectUtils, ContextualDomainObject) {
     function AlternateCompositionCapability($injector, domainObject) {

src/adapter/capabilities/patchViewCapability.js

@@ -31,6 +31,7 @@ define([
             var capability = viewConstructor(domainObject);
             var oldInvoke = capability.invoke.bind(capability);
 
+            /* eslint-disable you-dont-need-lodash-underscore/map */
             capability.invoke = function () {
                 var availableViews = oldInvoke();
                 var newDomainObject = capability
@@ -52,6 +53,8 @@ define([
                     .map('view')
                     .value();
             };
+            /* eslint-enable you-dont-need-lodash-underscore/map */
+
             return capability;
         };
     }

src/adapter/runs/AlternateCompositionInitializer.js

@@ -22,7 +22,7 @@
 
 define([
     '../capabilities/AlternateCompositionCapability',
-    '../../api/objects/object-utils'
+    'objectUtils'
 ], function (
     AlternateCompositionCapability,
     objectUtils

src/adapter/runs/LegacyTelemetryProvider.js

@@ -21,7 +21,7 @@
  *****************************************************************************/
 
 define([
-    '../../api/objects/object-utils'
+    'objectUtils'
 ], function (
     utils
 ) {

src/adapter/runs/TimeSettingsURLHandler.js

@@ -1,150 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2018, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define([
-    'lodash'
-], function (
-    _
-) {
-    // Parameter names in query string
-    var SEARCH = {
-        MODE: 'tc.mode',
-        TIME_SYSTEM: 'tc.timeSystem',
-        START_BOUND: 'tc.startBound',
-        END_BOUND: 'tc.endBound',
-        START_DELTA: 'tc.startDelta',
-        END_DELTA: 'tc.endDelta'
-    };
-    var TIME_EVENTS = ['bounds', 'timeSystem', 'clock', 'clockOffsets'];
-    // Used to shorthand calls to $location, which clears null parameters
-    var NULL_PARAMETERS = { key: null, start: null, end: null };
-
-    /**
-     * Communicates settings from the URL to the time API,
-     * and vice versa.
-     */
-    function TimeSettingsURLHandler(time, $location, $rootScope) {
-        this.time = time;
-        this.$location = $location;
-
-        $rootScope.$on('$locationChangeSuccess', this.updateTime.bind(this));
-
-        TIME_EVENTS.forEach(function (event) {
-            this.time.on(event, this.updateQueryParams.bind(this));
-        }, this);
-
-        this.updateTime(); // Initialize
-    }
-
-    TimeSettingsURLHandler.prototype.updateQueryParams = function () {
-        var clock = this.time.clock();
-        var fixed = !clock;
-        var mode = fixed ? 'fixed' : clock.key;
-        var timeSystem = this.time.timeSystem() || NULL_PARAMETERS;
-        var bounds = fixed ? this.time.bounds() : NULL_PARAMETERS;
-        var deltas = fixed ? NULL_PARAMETERS : this.time.clockOffsets();
-
-        bounds = bounds || NULL_PARAMETERS;
-        deltas = deltas || NULL_PARAMETERS;
-        if (deltas.start) {
-            deltas = { start: -deltas.start, end: deltas.end };
-        }
-
-        this.$location.search(SEARCH.MODE, mode);
-        this.$location.search(SEARCH.TIME_SYSTEM, timeSystem.key);
-        this.$location.search(SEARCH.START_BOUND, bounds.start);
-        this.$location.search(SEARCH.END_BOUND, bounds.end);
-        this.$location.search(SEARCH.START_DELTA, deltas.start);
-        this.$location.search(SEARCH.END_DELTA, deltas.end);
-    };
-
-    TimeSettingsURLHandler.prototype.parseQueryParams = function () {
-        var searchParams = _.pick(this.$location.search(), _.values(SEARCH));
-        var parsedParams = {
-            clock: searchParams[SEARCH.MODE],
-            timeSystem: searchParams[SEARCH.TIME_SYSTEM]
-        };
-        if (!isNaN(parseInt(searchParams[SEARCH.START_DELTA], 0xA)) &&
-            !isNaN(parseInt(searchParams[SEARCH.END_DELTA], 0xA))) {
-            parsedParams.clockOffsets = {
-                start: -searchParams[SEARCH.START_DELTA],
-                end: +searchParams[SEARCH.END_DELTA]
-            };
-        }
-        if (!isNaN(parseInt(searchParams[SEARCH.START_BOUND], 0xA)) &&
-            !isNaN(parseInt(searchParams[SEARCH.END_BOUND], 0xA))) {
-            parsedParams.bounds = {
-                start: +searchParams[SEARCH.START_BOUND],
-                end: +searchParams[SEARCH.END_BOUND]
-            };
-        }
-        return parsedParams;
-    };
-
-    TimeSettingsURLHandler.prototype.updateTime = function () {
-        var params = this.parseQueryParams();
-        if (_.isEqual(params, this.last)) {
-            return; // Do nothing;
-        }
-        this.last = params;
-
-        if (!params.timeSystem) {
-            this.updateQueryParams();
-        } else if (params.clock === 'fixed' && params.bounds) {
-            if (!this.time.timeSystem() ||
-                this.time.timeSystem().key !== params.timeSystem) {
-
-                this.time.timeSystem(
-                    params.timeSystem,
-                    params.bounds
-                );
-            } else if (!_.isEqual(this.time.bounds(), params.bounds)) {
-                this.time.bounds(params.bounds);
-            }
-            if (this.time.clock()) {
-                this.time.stopClock();
-            }
-        } else if (params.clockOffsets) {
-            if (params.clock === 'fixed') {
-                this.time.stopClock();
-                return;
-            }
-            if (!this.time.clock() ||
-                this.time.clock().key !== params.clock) {
-
-                this.time.clock(params.clock, params.clockOffsets);
-            } else if (!_.isEqual(this.time.clockOffsets(), params.clockOffsets)) {
-                this.time.clockOffsets(params.clockOffsets);
-            }
-            if (!this.time.timeSystem() ||
-                this.time.timeSystem().key !== params.timeSystem) {
-
-                this.time.timeSystem(params.timeSystem);
-            }
-        } else {
-            // Neither found, update from timeSystem.
-            this.updateQueryParams();
-        }
-    };
-
-    return TimeSettingsURLHandler;
-});

src/adapter/runs/TimeSettingsURLHandlerSpec.js

@@ -1,576 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2018, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define([
-    './TimeSettingsURLHandler',
-    '../../api/time/TimeAPI'
-], function (
-    TimeSettingsURLHandler,
-    TimeAPI
-) {
-    describe("TimeSettingsURLHandler", function () {
-        var time;
-        var $location;
-        var $rootScope;
-        var search;
-        var handler; // eslint-disable-line
-        var clockA;
-        var clockB;
-        var timeSystemA;
-        var timeSystemB;
-        var boundsA;
-        var boundsB;
-        var offsetsA;
-        var offsetsB;
-        var initialize;
-        var triggerLocationChange;
-
-
-        beforeEach(function () {
-            clockA = jasmine.createSpyObj('clockA', ['on', 'off']);
-            clockA.key = 'clockA';
-            clockA.currentValue = function () {
-                return 1000;
-            };
-            clockB = jasmine.createSpyObj('clockB', ['on', 'off']);
-            clockB.key = 'clockB';
-            clockB.currentValue = function () {
-                return 2000;
-            };
-            timeSystemA = {key: 'timeSystemA'};
-            timeSystemB = {key: 'timeSystemB'};
-            boundsA = {
-                start: 10,
-                end: 20
-            };
-            boundsB = {
-                start: 120,
-                end: 360
-            };
-            offsetsA = {
-                start: -100,
-                end: 0
-            };
-            offsetsB = {
-                start: -50,
-                end: 50
-            };
-
-            time = new TimeAPI();
-
-            [
-                'on',
-                'bounds',
-                'clockOffsets',
-                'timeSystem',
-                'clock',
-                'stopClock'
-            ].forEach(function (method) {
-                spyOn(time, method).and.callThrough();
-            });
-            time.addTimeSystem(timeSystemA);
-            time.addTimeSystem(timeSystemB);
-            time.addClock(clockA);
-            time.addClock(clockB);
-
-            $location = jasmine.createSpyObj('$location', [
-                'search'
-            ]);
-            $rootScope = jasmine.createSpyObj('$rootScope', [
-                '$on'
-            ]);
-
-            search = {};
-            $location.search.and.callFake(function (key, value) {
-                if (arguments.length === 0) {
-                    return search;
-                }
-                if (value === null) {
-                    delete search[key];
-                } else {
-                    search[key] = String(value);
-                }
-                return this;
-            });
-
-            expect(time.timeSystem()).toBeUndefined();
-            expect(time.bounds()).toEqual({});
-            expect(time.clockOffsets()).toBeUndefined();
-            expect(time.clock()).toBeUndefined();
-
-            initialize = function () {
-                handler = new TimeSettingsURLHandler(
-                    time,
-                    $location,
-                    $rootScope
-                );
-                expect($rootScope.$on).toHaveBeenCalledWith(
-                    '$locationChangeSuccess',
-                    jasmine.any(Function)
-                );
-                triggerLocationChange = $rootScope.$on.calls.mostRecent().args[1];
-
-            };
-        });
-
-        it("initializes with missing time system", function () {
-            // This handles an odd transitory case where a url does not include
-            // a timeSystem.  It's generally only experienced by those who
-            // based their code on the tutorial before it specified a time
-            // system.
-            search['tc.mode'] = 'clockA';
-            search['tc.timeSystem'] = undefined;
-            search['tc.startDelta'] = '123';
-            search['tc.endDelta'] = '456';
-
-            // We don't specify behavior right now other than "don't break."
-            expect(initialize).not.toThrow();
-        });
-
-        it("can initalize fixed mode from location", function () {
-            search['tc.mode'] = 'fixed';
-            search['tc.timeSystem'] = 'timeSystemA';
-            search['tc.startBound'] = '123';
-            search['tc.endBound'] = '456';
-
-            initialize();
-
-            expect(time.timeSystem).toHaveBeenCalledWith(
-                'timeSystemA',
-                {
-                    start: 123,
-                    end: 456
-                }
-            );
-        });
-
-        it("can initialize clock mode from location", function () {
-            search['tc.mode'] = 'clockA';
-            search['tc.timeSystem'] = 'timeSystemA';
-            search['tc.startDelta'] = '123';
-            search['tc.endDelta'] = '456';
-
-            initialize();
-
-            expect(time.clock).toHaveBeenCalledWith(
-                'clockA',
-                {
-                    start: -123,
-                    end: 456
-                }
-            );
-            expect(time.timeSystem).toHaveBeenCalledWith(
-                'timeSystemA'
-            );
-        });
-
-        it("can initialize fixed mode from time API", function () {
-            time.timeSystem(timeSystemA.key, boundsA);
-            initialize();
-            expect($location.search)
-                .toHaveBeenCalledWith('tc.mode', 'fixed');
-            expect($location.search)
-                .toHaveBeenCalledWith('tc.timeSystem', 'timeSystemA');
-            expect($location.search)
-                .toHaveBeenCalledWith('tc.startBound', 10);
-            expect($location.search)
-                .toHaveBeenCalledWith('tc.endBound', 20);
-            expect($location.search)
-                .toHaveBeenCalledWith('tc.startDelta', null);
-            expect($location.search)
-                .toHaveBeenCalledWith('tc.endDelta', null);
-        });
-
-        it("can initialize clock mode from time API", function () {
-            time.clock(clockA.key, offsetsA);
-            time.timeSystem(timeSystemA.key);
-            initialize();
-            expect($location.search)
-                .toHaveBeenCalledWith('tc.mode', 'clockA');
-            expect($location.search)
-                .toHaveBeenCalledWith('tc.timeSystem', 'timeSystemA');
-            expect($location.search)
-                .toHaveBeenCalledWith('tc.startBound', null);
-            expect($location.search)
-                .toHaveBeenCalledWith('tc.endBound', null);
-            expect($location.search)
-                .toHaveBeenCalledWith('tc.startDelta', 100);
-            expect($location.search)
-                .toHaveBeenCalledWith('tc.endDelta', 0);
-        });
-
-        describe('location changes in fixed mode', function () {
-
-            beforeEach(function () {
-                time.timeSystem(timeSystemA.key, boundsA);
-                initialize();
-                time.timeSystem.calls.reset();
-                time.bounds.calls.reset();
-                time.clock.calls.reset();
-                time.stopClock.calls.reset();
-            });
-
-            it("does not change on spurious location change", function () {
-                triggerLocationChange();
-                expect(time.timeSystem).not.toHaveBeenCalledWith(
-                    'timeSystemA',
-                    jasmine.any(Object)
-                );
-                expect(time.bounds).not.toHaveBeenCalledWith(
-                    jasmine.any(Object)
-                );
-                expect(time.stopClock).not.toHaveBeenCalled();
-            });
-
-            it("updates timeSystem changes", function () {
-                search['tc.timeSystem'] = 'timeSystemB';
-                triggerLocationChange();
-                expect(time.timeSystem).toHaveBeenCalledWith(
-                    'timeSystemB',
-                    {
-                        start: 10,
-                        end: 20
-                    }
-                );
-            });
-
-            it("updates bounds changes", function () {
-                search['tc.startBound'] = '100';
-                search['tc.endBound'] = '200';
-                triggerLocationChange();
-                expect(time.timeSystem).not.toHaveBeenCalledWith(
-                    jasmine.anything(), jasmine.anything()
-                );
-                expect(time.bounds).toHaveBeenCalledWith({
-                    start: 100,
-                    end: 200
-                });
-                search['tc.endBound'] = '300';
-                triggerLocationChange();
-                expect(time.timeSystem).not.toHaveBeenCalledWith(
-                    jasmine.anything(), jasmine.anything()
-                );
-                expect(time.bounds).toHaveBeenCalledWith({
-                    start: 100,
-                    end: 300
-                });
-            });
-
-            it("updates clock mode w/o timeSystem change", function () {
-                search['tc.mode'] = 'clockA';
-                search['tc.startDelta'] = '50';
-                search['tc.endDelta'] = '50';
-                delete search['tc.endBound'];
-                delete search['tc.startBound'];
-                triggerLocationChange();
-                expect(time.clock).toHaveBeenCalledWith(
-                    'clockA',
-                    {
-                        start: -50,
-                        end: 50
-                    }
-                );
-                expect(time.timeSystem).not.toHaveBeenCalledWith(
-                    jasmine.anything(), jasmine.anything()
-                );
-            });
-
-            it("updates clock mode and timeSystem", function () {
-                search['tc.mode'] = 'clockA';
-                search['tc.startDelta'] = '50';
-                search['tc.endDelta'] = '50';
-                search['tc.timeSystem'] = 'timeSystemB';
-                delete search['tc.endBound'];
-                delete search['tc.startBound'];
-                triggerLocationChange();
-                expect(time.clock).toHaveBeenCalledWith(
-                    'clockA',
-                    {
-                        start: -50,
-                        end: 50
-                    }
-                );
-                expect(time.timeSystem).toHaveBeenCalledWith('timeSystemB');
-            });
-        });
-
-        describe('location changes in clock mode', function () {
-
-            beforeEach(function () {
-                time.clock(clockA.key, offsetsA);
-                time.timeSystem(timeSystemA.key);
-                initialize();
-                time.timeSystem.calls.reset();
-                time.bounds.calls.reset();
-                time.clock.calls.reset();
-                time.clockOffsets.calls.reset();
-                time.stopClock.calls.reset();
-            });
-
-            it("does not change on spurious location change", function () {
-                triggerLocationChange();
-                expect(time.timeSystem).not.toHaveBeenCalledWith(
-                    'timeSystemA',
-                    jasmine.any(Object)
-                );
-                expect(time.clockOffsets).not.toHaveBeenCalledWith(
-                    jasmine.any(Object)
-                );
-                expect(time.clock).not.toHaveBeenCalledWith(
-                    jasmine.any(Object)
-                );
-                expect(time.bounds).not.toHaveBeenCalledWith(
-                    jasmine.any(Object)
-                );
-            });
-
-            it("changes time system", function () {
-                search['tc.timeSystem'] = 'timeSystemB';
-                triggerLocationChange();
-                expect(time.timeSystem).toHaveBeenCalledWith(
-                    'timeSystemB'
-                );
-                expect(time.clockOffsets).not.toHaveBeenCalledWith(
-                    jasmine.any(Object)
-                );
-                expect(time.clock).not.toHaveBeenCalledWith(
-                    jasmine.any(Object)
-                );
-                expect(time.stopClock).not.toHaveBeenCalled();
-                expect(time.bounds).not.toHaveBeenCalledWith(
-                    jasmine.any(Object)
-                );
-            });
-
-            it("changes offsets", function () {
-                search['tc.startDelta'] = '50';
-                search['tc.endDelta'] = '50';
-                triggerLocationChange();
-                expect(time.timeSystem).not.toHaveBeenCalledWith(
-                    'timeSystemA',
-                    jasmine.any(Object)
-                );
-                expect(time.clockOffsets).toHaveBeenCalledWith(
-                    {
-                        start: -50,
-                        end: 50
-                    }
-                );
-                expect(time.clock).not.toHaveBeenCalledWith(
-                    jasmine.any(Object)
-                );
-            });
-
-            it("updates to fixed w/o timeSystem change", function () {
-                search['tc.mode'] = 'fixed';
-                search['tc.startBound'] = '234';
-                search['tc.endBound'] = '567';
-                delete search['tc.endDelta'];
-                delete search['tc.startDelta'];
-
-                triggerLocationChange();
-                expect(time.stopClock).toHaveBeenCalled();
-                expect(time.bounds).toHaveBeenCalledWith({
-                    start: 234,
-                    end: 567
-                });
-                expect(time.timeSystem).not.toHaveBeenCalledWith(
-                    jasmine.anything(), jasmine.anything()
-                );
-            });
-
-            it("updates fixed and timeSystem", function () {
-                search['tc.mode'] = 'fixed';
-                search['tc.startBound'] = '234';
-                search['tc.endBound'] = '567';
-                search['tc.timeSystem'] = 'timeSystemB';
-                delete search['tc.endDelta'];
-                delete search['tc.startDelta'];
-
-                triggerLocationChange();
-                expect(time.stopClock).toHaveBeenCalled();
-                expect(time.timeSystem).toHaveBeenCalledWith(
-                    'timeSystemB',
-                    {
-                        start: 234,
-                        end: 567
-                    }
-                );
-            });
-
-            it("updates clock", function () {
-                search['tc.mode'] = 'clockB';
-                triggerLocationChange();
-                expect(time.clock).toHaveBeenCalledWith(
-                    'clockB',
-                    {
-                        start: -100,
-                        end: 0
-                    }
-                );
-                expect(time.timeSystem).not.toHaveBeenCalledWith(jasmine.anything());
-            });
-
-            it("updates clock and timeSystem", function () {
-                search['tc.mode'] = 'clockB';
-                search['tc.timeSystem'] = 'timeSystemB';
-                triggerLocationChange();
-                expect(time.clock).toHaveBeenCalledWith(
-                    'clockB',
-                    {
-                        start: -100,
-                        end: 0
-                    }
-                );
-                expect(time.timeSystem).toHaveBeenCalledWith(
-                    'timeSystemB'
-                );
-            });
-
-            it("updates clock and timeSystem and offsets", function () {
-                search['tc.mode'] = 'clockB';
-                search['tc.timeSystem'] = 'timeSystemB';
-                search['tc.startDelta'] = '50';
-                search['tc.endDelta'] = '50';
-                triggerLocationChange();
-                expect(time.clock).toHaveBeenCalledWith(
-                    'clockB',
-                    {
-                        start: -50,
-                        end: 50
-                    }
-                );
-                expect(time.timeSystem).toHaveBeenCalledWith(
-                    'timeSystemB'
-                );
-            });
-
-            it("stops the clock", function () {
-                // this is a robustness test, unsure if desired, requires
-                // user to be manually editing location strings.
-                search['tc.mode'] = 'fixed';
-                triggerLocationChange();
-                expect(time.stopClock).toHaveBeenCalled();
-            });
-        });
-
-
-        describe("location updates from time API in fixed", function () {
-            beforeEach(function () {
-                time.timeSystem(timeSystemA.key, boundsA);
-                initialize();
-            });
-
-            it("updates on bounds change", function () {
-                time.bounds(boundsB);
-                expect(search).toEqual({
-                    'tc.mode': 'fixed',
-                    'tc.startBound': '120',
-                    'tc.endBound': '360',
-                    'tc.timeSystem': 'timeSystemA'
-                });
-            });
-
-            it("updates on timeSystem change", function () {
-                time.timeSystem(timeSystemB, boundsA);
-                expect(search).toEqual({
-                    'tc.mode': 'fixed',
-                    'tc.startBound': '10',
-                    'tc.endBound': '20',
-                    'tc.timeSystem': 'timeSystemB'
-                });
-                time.timeSystem(timeSystemA, boundsB);
-                expect(search).toEqual({
-                    'tc.mode': 'fixed',
-                    'tc.startBound': '120',
-                    'tc.endBound': '360',
-                    'tc.timeSystem': 'timeSystemA'
-                });
-            });
-
-            it("Updates to clock", function () {
-                time.clock(clockA, offsetsA);
-                expect(search).toEqual({
-                    'tc.mode': 'clockA',
-                    'tc.startDelta': '100',
-                    'tc.endDelta': '0',
-                    'tc.timeSystem': 'timeSystemA'
-                });
-            });
-        });
-
-        describe("location updates from time API in fixed", function () {
-            beforeEach(function () {
-                time.clock(clockA.key, offsetsA);
-                time.timeSystem(timeSystemA.key);
-                initialize();
-            });
-
-            it("updates offsets", function () {
-                time.clockOffsets(offsetsB);
-                expect(search).toEqual({
-                    'tc.mode': 'clockA',
-                    'tc.startDelta': '50',
-                    'tc.endDelta': '50',
-                    'tc.timeSystem': 'timeSystemA'
-                });
-            });
-
-            it("updates clocks", function () {
-                time.clock(clockB, offsetsA);
-                expect(search).toEqual({
-                    'tc.mode': 'clockB',
-                    'tc.startDelta': '100',
-                    'tc.endDelta': '0',
-                    'tc.timeSystem': 'timeSystemA'
-                });
-                time.clock(clockA, offsetsB);
-                expect(search).toEqual({
-                    'tc.mode': 'clockA',
-                    'tc.startDelta': '50',
-                    'tc.endDelta': '50',
-                    'tc.timeSystem': 'timeSystemA'
-                });
-            });
-
-            it("updates timesystems", function () {
-                time.timeSystem(timeSystemB);
-                expect(search).toEqual({
-                    'tc.mode': 'clockA',
-                    'tc.startDelta': '100',
-                    'tc.endDelta': '0',
-                    'tc.timeSystem': 'timeSystemB'
-                });
-            });
-
-            it("stops the clock", function () {
-                time.stopClock();
-                expect(search).toEqual({
-                    'tc.mode': 'fixed',
-                    'tc.startBound': '900',
-                    'tc.endBound': '1000',
-                    'tc.timeSystem': 'timeSystemA'
-                });
-            });
-        });
-    });
-});

src/adapter/services/LegacyObjectAPIInterceptor.js

@@ -21,7 +21,7 @@
  *****************************************************************************/
 
 define([
-    '../../api/objects/object-utils'
+    'objectUtils'
 ], function (
     utils
 ) {

src/adapter/services/MissingModelCompatibilityDecorator.js

@@ -21,7 +21,7 @@
  *****************************************************************************/
 
 define([
-    '../../api/objects/object-utils'
+    'objectUtils'
 ], function (
     objectUtils
 ) {

src/adapter/views/installLegacyViews.js

@@ -1,7 +1,7 @@
 define([
     './LegacyViewProvider',
     './TypeInspectorViewProvider',
-    '../../api/objects/object-utils'
+    'objectUtils'
 ], function (
     LegacyViewProvider,
     TypeInspectorViewProvider,

src/api/composition/CompositionAPI.js

@@ -70,7 +70,7 @@ define([
      * @memberof module:openmct.CompositionAPI#
      */
     CompositionAPI.prototype.get = function (domainObject) {
-        var provider = _.find(this.registry, function (p) {
+        var provider = this.registry.find(p => {
             return p.appliesTo(domainObject);
         });
 

src/api/composition/CompositionCollection.js

@@ -122,7 +122,7 @@ define([
             throw new Error('Event not supported by composition: ' + event);
         }
 
-        var index = _.findIndex(this.listeners[event], function (l) {
+        var index = this.listeners[event].findIndex(l => {
             return l.callback === callback && l.context === context;
         });
 

src/api/composition/DefaultCompositionProvider.js

@@ -22,7 +22,7 @@
 
 define([
     'lodash',
-    '../objects/object-utils'
+    'objectUtils'
 ], function (
     _,
     objectUtils
@@ -143,7 +143,7 @@ define([
         var keyString = objectUtils.makeKeyString(domainObject.identifier);
         var objectListeners = this.listeningTo[keyString];
 
-        var index = _.findIndex(objectListeners[event], function (l) {
+        var index = objectListeners[event].findIndex(l => {
             return l.callback === callback && l.context === context;
         });
 
@@ -196,8 +196,8 @@ define([
      * @private
      */
     DefaultCompositionProvider.prototype.includes = function (parent, childId) {
-        return parent.composition.findIndex(composee =>
-            this.publicAPI.objects.areIdsEqual(composee, childId)) !== -1;
+        return parent.composition.some(composee =>
+            this.publicAPI.objects.areIdsEqual(composee, childId));
     };
 
     DefaultCompositionProvider.prototype.reorder = function (domainObject, oldIndex, newIndex) {

src/api/notifications/NotificationAPI.js

@@ -128,6 +128,11 @@ export default class NotificationAPI extends EventEmitter {
         return this._notify(notificationModel);
     }
 
+    dismissAllNotifications() {
+        this.notifications = [];
+        this.emit('dismiss-all');
+    }
+
     /**
      * Minimize a notification. The notification will still be available
      * from the notification list. Typically notifications with a

src/api/objects/MutableObject.js

@@ -21,7 +21,7 @@
  *****************************************************************************/
 
 define([
-    './object-utils.js',
+    'objectUtils',
     'lodash'
 ], function (
     utils,

src/api/objects/ObjectAPI.js

@@ -22,7 +22,7 @@
 
 define([
     'lodash',
-    './object-utils',
+    'objectUtils',
     './MutableObject',
     './RootRegistry',
     './RootObjectProvider',

src/api/objects/RootRegistry.js

@@ -43,7 +43,7 @@ define([
     }
 
     RootRegistry.prototype.addRoot = function (key) {
-        if (isKey(key) || (_.isArray(key) && _.every(key, isKey))) {
+        if (isKey(key) || (Array.isArray(key) && key.every(isKey))) {
             this.providers.push(function () {
                 return key;
             });

src/api/objects/test/object-utilsSpec.js

@@ -1,5 +1,5 @@
 define([
-    '../object-utils'
+    'objectUtils'
 ], function (
     objectUtils
 ) {

src/api/telemetry/DefaultMetadataProvider.js

@@ -85,9 +85,9 @@ define([
                             value: +e.value
                         };
                     }), 'e.value');
-                valueMetadata.values = _.pluck(valueMetadata.enumerations, 'value');
-                valueMetadata.max = _.max(valueMetadata.values);
-                valueMetadata.min = _.min(valueMetadata.values);
+                valueMetadata.values = valueMetadata.enumerations.map(e => e.value);
+                valueMetadata.max = Math.max(valueMetadata.values);
+                valueMetadata.min = Math.min(valueMetadata.values);
             }
 
             valueMetadatas.push(valueMetadata);
@@ -103,7 +103,7 @@ define([
         var metadata = domainObject.telemetry || {};
         if (this.typeHasTelemetry(domainObject)) {
             var typeMetadata = this.typeService.getType(domainObject.type).typeDef.telemetry;
-            _.extend(metadata, typeMetadata);
+            Object.assign(metadata, typeMetadata);
             if (!metadata.values) {
                 metadata.values = valueMetadatasFromOldFormat(metadata);
             }

src/api/telemetry/TelemetryAPI.js

@@ -24,7 +24,7 @@ define([
     './TelemetryMetadataManager',
     './TelemetryValueFormatter',
     './DefaultMetadataProvider',
-    '../objects/object-utils',
+    'objectUtils',
     'lodash'
 ], function (
     TelemetryMetadataManager,
@@ -370,7 +370,7 @@ define([
     TelemetryAPI.prototype.commonValuesForHints = function (metadatas, hints) {
         var options = metadatas.map(function (metadata) {
             var values = metadata.valuesForHints(hints);
-            return _.indexBy(values, 'key');
+            return _.keyBy(values, 'key');
         }).reduce(function (a, b) {
             var results = {};
             Object.keys(a).forEach(function (key) {
@@ -383,7 +383,7 @@ define([
         var sortKeys = hints.map(function (h) {
             return 'hints.' + h;
         });
-        return _.sortByAll(options, sortKeys);
+        return _.sortBy(options, sortKeys);
     };
 
     /**

src/api/telemetry/TelemetryMetadataManager.js

@@ -57,13 +57,13 @@ define([
 
         if (valueMetadata.format === 'enum') {
             if (!valueMetadata.values) {
-                valueMetadata.values = _.pluck(valueMetadata.enumerations, 'value');
+                valueMetadata.values = valueMetadata.enumerations.map(e => e.value);
             }
             if (!valueMetadata.hasOwnProperty('max')) {
-                valueMetadata.max = _.max(valueMetadata.values) + 1;
+                valueMetadata.max = Math.max(valueMetadata.values) + 1;
             }
             if (!valueMetadata.hasOwnProperty('min')) {
-                valueMetadata.min = _.min(valueMetadata.values) - 1;
+                valueMetadata.min = Math.min(valueMetadata.values) - 1;
             }
         }
 
@@ -81,7 +81,7 @@ define([
     function TelemetryMetadataManager(metadata) {
         this.metadata = metadata;
 
-        this.valueMetadatas = this.metadata.values.map(applyReasonableDefaults);
+        this.valueMetadatas = this.metadata.values ? this.metadata.values.map(applyReasonableDefaults) : [];
     }
 
     /**
@@ -121,7 +121,7 @@ define([
                 return metadata.hints[hint];
             }
         });
-        return _.sortByAll(matchingMetadata, ...iteratees);
+        return _.sortBy(matchingMetadata, ...iteratees);
     };
 
     TelemetryMetadataManager.prototype.getFilterableValues = function () {

src/api/telemetry/TelemetryValueFormatter.js

@@ -81,6 +81,24 @@ define([
                 return printj.sprintf(formatString, baseFormat.call(this, value));
             };
         }
+        if (valueMetadata.format === 'string') {
+            this.formatter.parse = function (value) {
+                if (value === undefined) {
+                    return '';
+                }
+                if (typeof value === 'string') {
+                    return value;
+                } else {
+                    return value.toString();
+                }
+            };
+            this.formatter.format = function (value) {
+                return value;
+            };
+            this.formatter.validate = function (value) {
+                return typeof value === 'string';
+            };
+        }
     }
 
     TelemetryValueFormatter.prototype.parse = function (datum) {

src/plugins/LADTable/LADTableCompositionPolicy.js

@@ -0,0 +1,39 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2020, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+export default class LADTableCompositionPolicy {
+
+    constructor(openmct) {
+        this.openmct = openmct;
+        return this.allow.bind(this);
+    }
+
+    allow(parent, child) {
+        if(parent.type === 'LadTable') {
+            return this.openmct.telemetry.isTelemetryObject(child);
+        } else if(parent.type === 'LadTableSet') {
+            return child.type === 'LadTable';
+        }
+
+        return true;
+    }
+}

src/plugins/LADTable/LADTableSetViewProvider.js

@@ -19,53 +19,46 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
+import LadTableSet from './components/LadTableSet.vue';
+import Vue from 'vue';
 
-define([
-    './components/LadTableSet.vue',
-    'vue'
-], function (
-    LadTableSet,
-    Vue
-) {
-    function LADTableSetViewProvider(openmct) {
-        return {
-            key: 'LadTableSet',
-            name: 'LAD Table Set',
-            cssClass: 'icon-tabular-lad-set',
-            canView: function (domainObject) {
-                return domainObject.type === 'LadTableSet';
-            },
-            canEdit: function (domainObject) {
-                return domainObject.type === 'LadTableSet';
-            },
-            view: function (domainObject, objectPath) {
-                let component;
+export default function LADTableSetViewProvider(openmct) {
+    return {
+        key: 'LadTableSet',
+        name: 'LAD Table Set',
+        cssClass: 'icon-tabular-lad-set',
+        canView: function (domainObject) {
+            return domainObject.type === 'LadTableSet';
+        },
+        canEdit: function (domainObject) {
+            return domainObject.type === 'LadTableSet';
+        },
+        view: function (domainObject, objectPath) {
+            let component;
 
-                return {
-                    show: function (element) {
-                        component =  new Vue({
-                            el: element,
-                            components: {
-                                LadTableSet: LadTableSet.default
-                            },
-                            provide: {
-                                openmct,
-                                domainObject,
-                                objectPath
-                            },
-                            template: '<lad-table-set></lad-table-set>'
-                        });
-                    },
-                    destroy: function (element) {
-                        component.$destroy();
-                        component = undefined;
-                    }
-                };
-            },
-            priority: function () {
-                return 1;
-            }
-        };
-    }
-    return LADTableSetViewProvider;
-});
+            return {
+                show: function (element) {
+                    component =  new Vue({
+                        el: element,
+                        components: {
+                            LadTableSet: LadTableSet
+                        },
+                        provide: {
+                            openmct,
+                            domainObject,
+                            objectPath
+                        },
+                        template: '<lad-table-set></lad-table-set>'
+                    });
+                },
+                destroy: function (element) {
+                    component.$destroy();
+                    component = undefined;
+                }
+            };
+        },
+        priority: function () {
+            return 1;
+        }
+    };
+}

src/plugins/LADTable/LADTableViewProvider.js

@@ -19,53 +19,46 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
+import LadTable from './components/LADTable.vue';
+import Vue from 'vue';
 
-define([
-    './components/LADTable.vue',
-    'vue'
-], function (
-    LadTableComponent,
-    Vue
-) {
-    function LADTableViewProvider(openmct) {
-        return {
-            key: 'LadTable',
-            name: 'LAD Table',
-            cssClass: 'icon-tabular-lad',
-            canView: function (domainObject) {
-                return domainObject.type === 'LadTable';
-            },
-            canEdit: function (domainObject) {
-                return domainObject.type === 'LadTable';
-            },
-            view: function (domainObject, objectPath) {
-                let component;
+export default function LADTableViewProvider(openmct) {
+    return {
+        key: 'LadTable',
+        name: 'LAD Table',
+        cssClass: 'icon-tabular-lad',
+        canView: function (domainObject) {
+            return domainObject.type === 'LadTable';
+        },
+        canEdit: function (domainObject) {
+            return domainObject.type === 'LadTable';
+        },
+        view: function (domainObject, objectPath) {
+            let component;
 
-                return {
-                    show: function (element) {
-                        component =  new Vue({
-                            el: element,
-                            components: {
-                                LadTableComponent: LadTableComponent.default
-                            },
-                            provide: {
-                                openmct,
-                                domainObject,
-                                objectPath
-                            },
-                            template: '<lad-table-component></lad-table-component>'
-                        });
-                    },
-                    destroy: function (element) {
-                        component.$destroy();
-                        component = undefined;
-                    }
-                };
-            },
-            priority: function () {
-                return 1;
-            }
-        };
-    }
-    return LADTableViewProvider;
-});
+            return {
+                show: function (element) {
+                    component =  new Vue({
+                        el: element,
+                        components: {
+                            LadTableComponent: LadTable
+                        },
+                        provide: {
+                            openmct,
+                            domainObject,
+                            objectPath
+                        },
+                        template: '<lad-table-component></lad-table-component>'
+                    });
+                },
+                destroy: function (element) {
+                    component.$destroy();
+                    component = undefined;
+                }
+            };
+        },
+        priority: function () {
+            return 1;
+        }
+    };
+}

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.
  *
@@ -22,12 +22,16 @@
  *****************************************************************************/
 
 <template>
-<tr @contextmenu.prevent="showContextMenu">
-    <td>{{ name }}</td>
-    <td>{{ timestamp }}</td>
-    <td :class="valueClass">
-        {{ value }}
-    </td>
+<tr
+    class="js-lad-table__body__row"
+    @contextmenu.prevent="showContextMenu"
+>
+    <td class="js-first-data">{{ name }}</td>
+    <td class="js-second-data">{{ formattedTimestamp }}</td>
+    <td
+        class="js-third-data"
+        :class="valueClass"
+    >{{ value }}</td>
 </tr>
 </template>
 
@@ -52,16 +56,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 +86,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 +100,63 @@ export default {
             .telemetry
             .subscribe(this.domainObject, this.updateValues);
 
-        this.openmct
-            .telemetry
-            .request(this.domainObject, {strategy: 'latest'})
-            .then((array) => this.updateValues(array[array.length - 1]));
+        this.requestHistory();
     },
     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);
-            this.value = this.formats[this.valueKey].format(datum);
+            let newTimestamp = this.formats[this.timestampKey].parse(datum),
+                limit;
 
-            var limit = this.limitEvaluator.evaluate(datum, this.valueMetadata);
-
-            if (limit) {
-                this.valueClass = limit.cssClass;
-            } else {
-                this.valueClass = '';
+            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);
+                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);

src/plugins/LADTable/components/LADTable.vue

@@ -21,22 +21,24 @@
  *****************************************************************************/
 
 <template>
-<table class="c-table c-lad-table">
-    <thead>
-        <tr>
-            <th>Name</th>
-            <th>Timestamp</th>
-            <th>Value</th>
-        </tr>
-    </thead>
-    <tbody>
-        <lad-row
-            v-for="item in items"
-            :key="item.key"
-            :domain-object="item.domainObject"
-        />
-    </tbody>
-</table>
+<div class="c-lad-table-wrapper">
+    <table class="c-table c-lad-table">
+        <thead>
+            <tr>
+                <th>Name</th>
+                <th>Timestamp</th>
+                <th>Value</th>
+            </tr>
+        </thead>
+        <tbody>
+            <lad-row
+                v-for="item in items"
+                :key="item.key"
+                :domain-object="item.domainObject"
+            />
+        </tbody>
+    </table>
+</div>
 </template>
 
 <script>
@@ -73,7 +75,7 @@ export default {
             this.items.push(item);
         },
         removeItem(identifier) {
-            let index = _.findIndex(this.items, (item) => this.openmct.objects.makeKeyString(identifier) === item.key);
+            let index = this.items.findIndex(item => this.openmct.objects.makeKeyString(identifier) === item.key);
 
             this.items.splice(index, 1);
         },
@@ -86,4 +88,3 @@ export default {
     }
 }
 </script>
-

src/plugins/LADTable/components/LadTableSet.vue

@@ -35,7 +35,7 @@
         >
             <tr
                 :key="primary.key"
-                class="c-table__group-header"
+                class="c-table__group-header js-lad-table-set__table-headers"
             >
                 <td colspan="10">
                     {{ primary.domainObject.name }}
@@ -102,7 +102,7 @@ export default {
             this.compositions.push({composition, addCallback, removeCallback});
         },
         removePrimary(identifier) {
-            let index = _.findIndex(this.primaryTelemetryObjects, (primary) => this.openmct.objects.makeKeyString(identifier) === primary.key),
+            let index = this.primaryTelemetryObjects.findIndex(primary => this.openmct.objects.makeKeyString(identifier) === primary.key),
                 primary = this.primaryTelemetryObjects[index];
 
             this.$set(this.secondaryTelemetryObjects, primary.key, undefined);
@@ -130,7 +130,7 @@ export default {
         removeSecondary(primary) {
             return (identifier) => {
                 let array = this.secondaryTelemetryObjects[primary.key],
-                    index = _.findIndex(array, (secondary) => this.openmct.objects.makeKeyString(identifier) === secondary.key);
+                    index = array.findIndex(secondary => this.openmct.objects.makeKeyString(identifier) === secondary.key);
 
                 array.splice(index, 1);
 

src/plugins/LADTable/plugin.js

@@ -19,38 +19,36 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
+import LADTableViewProvider from './LADTableViewProvider';
+import LADTableSetViewProvider from './LADTableSetViewProvider';
+import LADTableCompositionPolicy from './LADTableCompositionPolicy';
 
-define([
-    './LADTableViewProvider',
-    './LADTableSetViewProvider'
-], function (
-    LADTableViewProvider,
-    LADTableSetViewProvider
-) {
-    return function plugin() {
-        return function install(openmct) {
-            openmct.objectViews.addProvider(new LADTableViewProvider(openmct));
-            openmct.objectViews.addProvider(new LADTableSetViewProvider(openmct));
+export default function plugin() {
+    return function install(openmct) {
 
-            openmct.types.addType('LadTable', {
-                name: "LAD 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',
-                initialize(domainObject) {
-                    domainObject.composition = [];
-                }
-            });
+        openmct.objectViews.addProvider(new LADTableViewProvider(openmct));
+        openmct.objectViews.addProvider(new LADTableSetViewProvider(openmct));
 
-            openmct.types.addType('LadTableSet', {
-                name: "LAD Table Set",
-                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-set',
-                initialize(domainObject) {
-                    domainObject.composition = [];
-                }
-            });
-        };
+        openmct.types.addType('LadTable', {
+            name: "LAD 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',
+            initialize(domainObject) {
+                domainObject.composition = [];
+            }
+        });
+
+        openmct.types.addType('LadTableSet', {
+            name: "LAD Table Set",
+            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-set',
+            initialize(domainObject) {
+                domainObject.composition = [];
+            }
+        });
+
+        openmct.composition.addPolicy(new LADTableCompositionPolicy(openmct));
     };
-});
+}

src/plugins/LADTable/pluginSpec.js

@@ -0,0 +1,365 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2018, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+import LadPlugin from './plugin.js';
+import Vue from 'vue';
+import {
+    createOpenMct,
+    getMockObjects,
+    getMockTelemetry,
+    getLatestTelemetry,
+    resetApplicationState
+} from 'utils/testing';
+
+const TABLE_BODY_ROWS = '.js-lad-table__body__row';
+const TABLE_BODY_FIRST_ROW = TABLE_BODY_ROWS + ':first-child';
+const TABLE_BODY_FIRST_ROW_FIRST_DATA = TABLE_BODY_FIRST_ROW + ' .js-first-data';
+const TABLE_BODY_FIRST_ROW_SECOND_DATA = TABLE_BODY_FIRST_ROW + ' .js-second-data';
+const TABLE_BODY_FIRST_ROW_THIRD_DATA = TABLE_BODY_FIRST_ROW + ' .js-third-data';
+const LAD_SET_TABLE_HEADERS = '.js-lad-table-set__table-headers';
+
+function utcTimeFormat(value) {
+    return new Date(value).toISOString().replace('T', ' ')
+}
+
+describe("The LAD Table", () => {
+    const ladTableKey = 'LadTable';
+
+    let openmct,
+        ladPlugin,
+        parent,
+        child,
+        telemetryCount = 3,
+        timeFormat = 'utc',
+        mockTelemetry = getMockTelemetry({ count: telemetryCount, format: timeFormat }),
+        mockObj = getMockObjects({
+            objectKeyStrings: ['ladTable', 'telemetry'],
+            format: timeFormat
+        }),
+        bounds = {
+            start: 0,
+            end: 4
+        };
+
+    // add telemetry object as composition in lad table
+    mockObj.ladTable.composition.push(mockObj.telemetry.identifier);
+
+    // this setups up the app
+    beforeEach((done) => {
+        const appHolder = document.createElement('div');
+        appHolder.style.width = '640px';
+        appHolder.style.height = '480px';
+
+        openmct = createOpenMct();
+
+        parent = document.createElement('div');
+        child = document.createElement('div');
+        parent.appendChild(child);
+
+        spyOn(openmct.telemetry, 'request').and.returnValue(Promise.resolve([]));
+
+        ladPlugin = new LadPlugin();
+        openmct.install(ladPlugin);
+
+        spyOn(openmct.objects, 'get').and.returnValue(Promise.resolve({}));
+
+        openmct.time.bounds({ start: bounds.start, end: bounds.end });
+
+        openmct.on('start', done);
+        openmct.startHeadless(appHolder);
+    });
+
+    afterEach(() => {
+        resetApplicationState(openmct);
+    });
+
+    it("should provide a table view only for lad table objects", () => {
+        let applicableViews = openmct.objectViews.get(mockObj.ladTable),
+            ladTableView = applicableViews.find(
+                (viewProvider) => viewProvider.key === ladTableKey
+            );
+
+        expect(applicableViews.length).toEqual(1);
+        expect(ladTableView).toBeDefined();
+    });
+
+    describe('composition', () => {
+        let ladTableCompositionCollection;
+
+        beforeEach(() => {
+            ladTableCompositionCollection = openmct.composition.get(mockObj.ladTable);
+            ladTableCompositionCollection.load();
+        });
+
+        it("should accept telemetry producing objects", () => {
+            expect(() => {
+                ladTableCompositionCollection.add(mockObj.telemetry);
+            }).not.toThrow();
+        });
+
+        it("should reject non-telemtry producing objects", () => {
+            expect(()=> {
+                ladTableCompositionCollection.add(mockObj.ladTable);
+            }).toThrow();
+        });
+    });
+
+    describe("table view", () => {
+        let applicableViews,
+            ladTableViewProvider,
+            ladTableView,
+            anotherTelemetryObj = getMockObjects({
+                objectKeyStrings: ['telemetry'],
+                overwrite: {
+                    telemetry: {
+                        name: "New Telemetry Object",
+                        identifier: { namespace: "", key: "another-telemetry-object" }
+                    }
+                }
+            }).telemetry;
+
+        // add another telemetry object as composition in lad table to test multi rows
+        mockObj.ladTable.composition.push(anotherTelemetryObj.identifier);
+
+        beforeEach(async () => {
+            let telemetryRequestResolve,
+                telemetryObjectResolve,
+                anotherTelemetryObjectResolve;
+            let telemetryRequestPromise = new Promise((resolve) => {
+                    telemetryRequestResolve = resolve;
+                }),
+                telemetryObjectPromise = new Promise((resolve) => {
+                    telemetryObjectResolve = resolve;
+                }),
+                anotherTelemetryObjectPromise = new Promise((resolve) => {
+                    anotherTelemetryObjectResolve = resolve;
+                })
+            openmct.telemetry.request.and.callFake(() => {
+                telemetryRequestResolve(mockTelemetry);
+                return telemetryRequestPromise;
+            });
+            openmct.objects.get.and.callFake((obj) => {
+                if(obj.key === 'telemetry-object') {
+                    telemetryObjectResolve(mockObj.telemetry);
+                    return telemetryObjectPromise;
+                } else {
+                    anotherTelemetryObjectResolve(anotherTelemetryObj);
+                    return anotherTelemetryObjectPromise;
+                }
+            });
+
+            openmct.time.bounds({ start: bounds.start, end: bounds.end });
+
+            applicableViews = openmct.objectViews.get(mockObj.ladTable);
+            ladTableViewProvider = applicableViews.find((viewProvider) => viewProvider.key === ladTableKey);
+            ladTableView = ladTableViewProvider.view(mockObj.ladTable, [mockObj.ladTable]);
+            ladTableView.show(child, true);
+
+            await Promise.all([telemetryRequestPromise, telemetryObjectPromise, anotherTelemetryObjectPromise]);
+            await Vue.nextTick();
+            return;
+        });
+
+        it("should show one row per object in the composition", () => {
+            const rowCount = parent.querySelectorAll(TABLE_BODY_ROWS).length;
+            expect(rowCount).toBe(mockObj.ladTable.composition.length);
+        });
+
+        it("should show the most recent datum from the telemetry producing object", async () => {
+            const latestDatum = getLatestTelemetry(mockTelemetry, { timeFormat });
+            const expectedDate = utcTimeFormat(latestDatum[timeFormat]);
+            await Vue.nextTick();
+            const latestDate = parent.querySelector(TABLE_BODY_FIRST_ROW_SECOND_DATA).innerText;
+            expect(latestDate).toBe(expectedDate);
+        });
+
+        it("should show the name provided for the the telemetry producing object", () => {
+            const rowName = parent.querySelector(TABLE_BODY_FIRST_ROW_FIRST_DATA).innerText,
+                expectedName = mockObj.telemetry.name;
+            expect(rowName).toBe(expectedName);
+        });
+
+        it("should show the correct values for the datum based on domain and range hints", async () => {
+            const range = mockObj.telemetry.telemetry.values.find((val) => {
+                return val.hints && val.hints.range !== undefined;
+            }).key;
+            const domain = mockObj.telemetry.telemetry.values.find((val) => {
+                return val.hints && val.hints.domain !== undefined;
+            }).key;
+            const mostRecentTelemetry = getLatestTelemetry(mockTelemetry, { timeFormat });
+            const rangeValue = mostRecentTelemetry[range];
+            const domainValue = utcTimeFormat(mostRecentTelemetry[domain]);
+            await Vue.nextTick();
+            const actualDomainValue = parent.querySelector(TABLE_BODY_FIRST_ROW_SECOND_DATA).innerText;
+            const actualRangeValue = parent.querySelector(TABLE_BODY_FIRST_ROW_THIRD_DATA).innerText;
+            expect(actualRangeValue).toBe(rangeValue);
+            expect(actualDomainValue).toBe(domainValue);
+        });
+    });
+});
+
+describe("The LAD Table Set", () => {
+    const ladTableSetKey = 'LadTableSet';
+
+    let openmct,
+        ladPlugin,
+        parent,
+        child,
+        telemetryCount = 3,
+        timeFormat = 'utc',
+        mockTelemetry = getMockTelemetry({ count: telemetryCount, format: timeFormat }),
+        mockObj = getMockObjects({
+            objectKeyStrings: ['ladTable', 'ladTableSet', 'telemetry']
+        }),
+        bounds = {
+            start: 0,
+            end: 4
+        };
+    // add mock telemetry to lad table and lad table to lad table set (composition)
+    mockObj.ladTable.composition.push(mockObj.telemetry.identifier);
+    mockObj.ladTableSet.composition.push(mockObj.ladTable.identifier);
+
+    beforeEach((done) => {
+        const appHolder = document.createElement('div');
+        appHolder.style.width = '640px';
+        appHolder.style.height = '480px';
+
+        openmct = createOpenMct();
+
+        parent = document.createElement('div');
+        child = document.createElement('div');
+        parent.appendChild(child);
+
+        spyOn(openmct.telemetry, 'request').and.returnValue(Promise.resolve([]));
+
+        ladPlugin = new LadPlugin();
+        openmct.install(ladPlugin);
+
+        spyOn(openmct.objects, 'get').and.returnValue(Promise.resolve({}));
+
+        openmct.time.bounds({ start: bounds.start, end: bounds.end });
+
+        openmct.on('start', done);
+        openmct.start(appHolder);
+    });
+
+    afterEach(() => {
+        resetApplicationState(openmct);
+    });
+
+    it("should provide a lad table set view only for lad table set objects", () => {
+        let applicableViews = openmct.objectViews.get(mockObj.ladTableSet),
+            ladTableSetView = applicableViews.find(
+                (viewProvider) => viewProvider.key === ladTableSetKey
+            );
+
+        expect(applicableViews.length).toEqual(1);
+        expect(ladTableSetView).toBeDefined();
+    });
+
+    describe('composition', () => {
+        let ladTableSetCompositionCollection;
+
+        beforeEach(() => {
+            ladTableSetCompositionCollection = openmct.composition.get(mockObj.ladTableSet);
+            ladTableSetCompositionCollection.load();
+        });
+
+        it("should accept lad table objects", () => {
+            expect(() => {
+                ladTableSetCompositionCollection.add(mockObj.ladTable);
+            }).not.toThrow();
+        });
+
+        it("should reject non lad table objects", () => {
+            expect(()=> {
+                ladTableSetCompositionCollection.add(mockObj.telemetry);
+            }).toThrow();
+        });
+    });
+
+    describe("table view", () => {
+        let applicableViews,
+            ladTableSetViewProvider,
+            ladTableSetView,
+            otherObj = getMockObjects({
+                objectKeyStrings: ['ladTable'],
+                overwrite: {
+                    ladTable: {
+                        name: "New LAD Table Object",
+                        identifier: { namespace: "", key: "another-lad-object" }
+                    }
+                }
+            });
+
+        // add another lad table (with telemetry object) object to the lad table set for multi row test
+        otherObj.ladTable.composition.push(mockObj.telemetry.identifier);
+        mockObj.ladTableSet.composition.push(otherObj.ladTable.identifier);
+
+        beforeEach(async () => {
+            let telemetryRequestResolve,
+                ladObjectResolve,
+                anotherLadObjectResolve;
+            let telemetryRequestPromise = new Promise((resolve) => {
+                    telemetryRequestResolve = resolve;
+                }),
+                ladObjectPromise = new Promise((resolve) => {
+                    ladObjectResolve = resolve;
+                }),
+                anotherLadObjectPromise = new Promise((resolve) => {
+                    anotherLadObjectResolve = resolve;
+                })
+            openmct.telemetry.request.and.callFake(() => {
+                telemetryRequestResolve(mockTelemetry);
+                return telemetryRequestPromise;
+            });
+            openmct.objects.get.and.callFake((obj) => {
+                if(obj.key === 'lad-object') {
+                    ladObjectResolve(mockObj.ladObject);
+                    return ladObjectPromise;
+                } else if(obj.key === 'another-lad-object') {
+                    anotherLadObjectResolve(otherObj.ladObject);
+                    return anotherLadObjectPromise;
+                }
+
+                return Promise.resolve({});
+            });
+
+            openmct.time.bounds({ start: bounds.start, end: bounds.end });
+
+            applicableViews = openmct.objectViews.get(mockObj.ladTableSet);
+            ladTableSetViewProvider = applicableViews.find((viewProvider) => viewProvider.key === ladTableSetKey);
+            ladTableSetView = ladTableSetViewProvider.view(mockObj.ladTableSet, [mockObj.ladTableSet]);
+            ladTableSetView.show(child, true);
+
+            await Promise.all([telemetryRequestPromise, ladObjectPromise, anotherLadObjectPromise]);
+            await Vue.nextTick();
+            return;
+        });
+
+        it("should show one row per lad table object in the composition", () => {
+            const rowCount = parent.querySelectorAll(LAD_SET_TABLE_HEADERS).length;
+            expect(rowCount).toBe(mockObj.ladTableSet.composition.length);
+            pending();
+        });
+    });
+});
+

src/plugins/URLIndicatorPlugin/URLIndicator.js

@@ -30,7 +30,7 @@ define(
         // DISCONNECTED: HTTP failed; maybe misconfigured, disconnected.
         // PENDING: Still trying to connect, and haven't failed yet.
         var CONNECTED = {
-                statusClass: "s-status-ok"
+                statusClass: "s-status-on"
             },
             PENDING = {
                 statusClass: "s-status-warning-lo"

src/plugins/URLIndicatorPlugin/URLIndicatorSpec.js

@@ -122,7 +122,7 @@ define(
                 it("indicates success if connection is nominal", function () {
                     jasmine.clock().tick(pluginOptions.interval + 1);
                     ajaxOptions.success();
-                    expect(indicatorElement.classList.contains('s-status-ok')).toBe(true);
+                    expect(indicatorElement.classList.contains('s-status-on')).toBe(true);
                 });
 
                 it("indicates an error when the server cannot be reached", function () {

src/plugins/URLTimeSettingsSynchronizer/URLTimeSettingsSynchronizer.js

@@ -0,0 +1,230 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2020, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+import {
+    getAllSearchParams,
+    setAllSearchParams
+} from 'utils/openmctLocation';
+
+const TIME_EVENTS = ['bounds', 'timeSystem', 'clock', 'clockOffsets'];
+const SEARCH_MODE = 'tc.mode';
+const SEARCH_TIME_SYSTEM = 'tc.timeSystem';
+const SEARCH_START_BOUND = 'tc.startBound';
+const SEARCH_END_BOUND = 'tc.endBound';
+const SEARCH_START_DELTA = 'tc.startDelta';
+const SEARCH_END_DELTA = 'tc.endDelta';
+const MODE_FIXED = 'fixed';
+
+export default class URLTimeSettingsSynchronizer {
+    constructor(openmct) {
+        this.openmct = openmct;
+        this.isUrlUpdateInProgress = false;
+
+        this.initialize = this.initialize.bind(this);
+        this.destroy = this.destroy.bind(this);
+        this.updateTimeSettings = this.updateTimeSettings.bind(this);
+        this.setUrlFromTimeApi = this.setUrlFromTimeApi.bind(this);
+
+        openmct.on('start', this.initialize);
+        openmct.on('destroy', this.destroy);
+    }
+
+    initialize() {
+        this.updateTimeSettings();
+
+        window.addEventListener('hashchange', this.updateTimeSettings);
+        TIME_EVENTS.forEach(event => {
+            this.openmct.time.on(event, this.setUrlFromTimeApi);
+        });
+
+    }
+
+    destroy() {
+        window.removeEventListener('hashchange', this.updateTimeSettings);
+        this.openmct.off('start', this.initialize);
+        this.openmct.off('destroy', this.destroy);
+
+        TIME_EVENTS.forEach(event => {
+            this.openmct.time.off(event, this.setUrlFromTimeApi);
+        });
+    }
+
+    updateTimeSettings() {
+        // Prevent from triggering self
+        if (!this.isUrlUpdateInProgress) {
+            let timeParameters = this.parseParametersFromUrl();
+
+
+            if (this.areTimeParametersValid(timeParameters)) {
+                this.setTimeApiFromUrl(timeParameters);
+            } else {
+                this.setUrlFromTimeApi();
+            }
+        } else {
+            this.isUrlUpdateInProgress = false;
+        }
+    }
+
+    parseParametersFromUrl() {
+        let searchParams = getAllSearchParams();
+
+        let mode = searchParams.get(SEARCH_MODE);
+        let timeSystem = searchParams.get(SEARCH_TIME_SYSTEM);
+
+        let startBound = parseInt(searchParams.get(SEARCH_START_BOUND), 10);
+        let endBound = parseInt(searchParams.get(SEARCH_END_BOUND), 10);
+        let bounds = {
+            start: startBound,
+            end: endBound
+        };
+
+        let startOffset = parseInt(searchParams.get(SEARCH_START_DELTA), 10);
+        let endOffset = parseInt(searchParams.get(SEARCH_END_DELTA), 10);
+        let clockOffsets = {
+            start: 0 - startOffset,
+            end: endOffset
+        };
+
+        return {
+            mode,
+            timeSystem,
+            bounds,
+            clockOffsets
+        };
+    }
+
+    setTimeApiFromUrl(timeParameters) {
+        if (timeParameters.mode === 'fixed') {
+            if (this.openmct.time.timeSystem().key !== timeParameters.timeSystem) {
+                this.openmct.time.timeSystem(
+                    timeParameters.timeSystem,
+                    timeParameters.bounds
+                );
+            } else if (!this.areStartAndEndEqual(this.openmct.time.bounds(), timeParameters.bounds)) {
+                this.openmct.time.bounds(timeParameters.bounds);
+            }
+            if (this.openmct.time.clock()) {
+                this.openmct.time.stopClock();
+            }
+        } else {
+            if (!this.openmct.time.clock() ||
+                this.openmct.time.clock().key !== timeParameters.mode) {
+                this.openmct.time.clock(timeParameters.mode, timeParameters.clockOffsets);
+            } else if (!this.areStartAndEndEqual(this.openmct.time.clockOffsets(), timeParameters.clockOffsets)) {
+                this.openmct.time.clockOffsets(timeParameters.clockOffsets);
+            }
+            if (!this.openmct.time.timeSystem() ||
+                this.openmct.time.timeSystem().key !== timeParameters.timeSystem) {
+                this.openmct.time.timeSystem(timeParameters.timeSystem);
+            }
+        }
+    }
+
+    setUrlFromTimeApi() {
+        let searchParams = getAllSearchParams();
+        let clock = this.openmct.time.clock();
+        let bounds = this.openmct.time.bounds();
+        let clockOffsets = this.openmct.time.clockOffsets();
+
+        if (clock === undefined) {
+            searchParams.set(SEARCH_MODE, MODE_FIXED);
+            searchParams.set(SEARCH_START_BOUND, bounds.start);
+            searchParams.set(SEARCH_END_BOUND, bounds.end);
+
+            searchParams.delete(SEARCH_START_DELTA);
+            searchParams.delete(SEARCH_END_DELTA);
+        } else {
+            searchParams.set(SEARCH_MODE, clock.key);
+
+            if (clockOffsets !== undefined) {
+                searchParams.set(SEARCH_START_DELTA, 0 - clockOffsets.start);
+                searchParams.set(SEARCH_END_DELTA, clockOffsets.end);
+            } else {
+                searchParams.delete(SEARCH_START_DELTA);
+                searchParams.delete(SEARCH_END_DELTA);
+            }
+            searchParams.delete(SEARCH_START_BOUND);
+            searchParams.delete(SEARCH_END_BOUND);
+        }
+
+        searchParams.set(SEARCH_TIME_SYSTEM, this.openmct.time.timeSystem().key);
+        this.isUrlUpdateInProgress = true;
+        setAllSearchParams(searchParams);
+    }
+
+    areTimeParametersValid(timeParameters) {
+        let isValid = false;
+
+        if (this.isModeValid(timeParameters.mode) &&
+            this.isTimeSystemValid(timeParameters.timeSystem)) {
+
+            if (timeParameters.mode === 'fixed') {
+                isValid = this.areStartAndEndValid(timeParameters.bounds);
+            } else {
+                isValid = this.areStartAndEndValid(timeParameters.clockOffsets);
+            }
+        }
+
+        return isValid;
+    }
+
+    areStartAndEndValid(bounds) {
+        return bounds !== undefined &&
+            bounds.start !== undefined &&
+            bounds.start !== null &&
+            bounds.end !== undefined &&
+            bounds.start !== null &&
+            !isNaN(bounds.start) &&
+            !isNaN(bounds.end);
+    }
+
+    isTimeSystemValid(timeSystem) {
+        let isValid = timeSystem !== undefined;
+        if (isValid) {
+            let timeSystemObject = this.openmct.time.timeSystems.get(timeSystem);
+            isValid = timeSystemObject !== undefined;
+        }
+        return isValid;
+    }
+
+    isModeValid(mode) {
+        let isValid = false;
+
+        if (mode !== undefined &&
+            mode !== null) {
+            isValid = true;
+        }
+
+        if (isValid) {
+            if (mode.toLowerCase() === MODE_FIXED) {
+                isValid = true;
+            } else {
+                isValid = this.openmct.time.clocks.get(mode) !== undefined;
+            }
+        }
+        return isValid;
+    }
+
+    areStartAndEndEqual(firstBounds, secondBounds) {
+        return firstBounds.start === secondBounds.start &&
+            firstBounds.end === secondBounds.end;
+    }
+}

src/plugins/URLTimeSettingsSynchronizer/plugin.js

@@ -1,5 +1,5 @@
 /*****************************************************************************
- * 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.
  *
@@ -19,15 +19,10 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
+import URLTimeSettingsSynchronizer from "./URLTimeSettingsSynchronizer.js";
 
-define(
-    [],
-    function () {
-
-        function NotificationIndicator() {}
-
-        NotificationIndicator.template = 'notificationIndicatorTemplate';
-
-        return NotificationIndicator;
+export default function () {
+    return function install(openmct) {
+        return new URLTimeSettingsSynchronizer(openmct);
     }
-);
+}

src/plugins/URLTimeSettingsSynchronizer/pluginSpec.js

@@ -0,0 +1,307 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2020, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+import {
+    createOpenMct,
+    resetApplicationState
+} from 'utils/testing';
+
+describe("The URLTimeSettingsSynchronizer", () => {
+    let openmct;
+    let testClock;
+    beforeAll(() => resetApplicationState());
+
+    beforeEach((done) => {
+        openmct = createOpenMct();
+        openmct.install(openmct.plugins.LocalTimeSystem());
+        testClock = jasmine.createSpyObj("testClock", ["start", "stop", "tick", "currentValue", "on", "off"]);
+        testClock.key = "test-clock";
+        testClock.currentValue.and.returnValue(0);
+
+        openmct.time.addClock(testClock);
+
+        openmct.on('start', done);
+        openmct.startHeadless();
+    });
+
+    afterEach(() => resetApplicationState(openmct));
+
+    describe("realtime mode", () => {
+        it("when the clock is set via the time API, it is immediately reflected in the URL", () => {
+            //Test expected initial conditions
+            expect(window.location.hash.includes('tc.mode=fixed')).toBe(true);
+
+            openmct.time.clock('local', {start: -1000, end: 100});
+
+            expect(window.location.hash.includes('tc.mode=local')).toBe(true);
+
+            //Test that expected initial conditions are no longer true
+            expect(window.location.hash.includes('tc.mode=fixed')).toBe(false);
+        });
+        it("when offsets are set via the time API, they are immediately reflected in the URL", () => {
+            //Test expected initial conditions
+            expect(window.location.hash.includes('tc.startDelta')).toBe(false);
+            expect(window.location.hash.includes('tc.endDelta')).toBe(false);
+
+            openmct.time.clock('local', {start: -1000, end: 100});
+            expect(window.location.hash.includes('tc.startDelta=1000')).toBe(true);
+            expect(window.location.hash.includes('tc.endDelta=100')).toBe(true);
+
+            openmct.time.clockOffsets({start: -2000, end: 200});
+            expect(window.location.hash.includes('tc.startDelta=2000')).toBe(true);
+            expect(window.location.hash.includes('tc.endDelta=200')).toBe(true);
+
+            //Test that expected initial conditions are no longer true
+            expect(window.location.hash.includes('tc.mode=fixed')).toBe(false);
+        });
+        describe("when set in the url", () => {
+            it("will change from fixed to realtime mode when the mode changes", () => {
+                expectLocationToBeInFixedMode();
+                return switchToRealtimeMode().then(() => {
+                    let clock = openmct.time.clock();
+
+                    expect(clock).toBeDefined();
+                    expect(clock.key).toBe('local');
+                });
+            });
+            it("the clock is correctly set in the API from the URL parameters", () => {
+                return switchToRealtimeMode().then(() => {
+                    let resolveFunction;
+                    return new Promise((resolve) => {
+                        resolveFunction = resolve;
+
+                        //The 'hashchange' event appears to be asynchronous, so we need to wait until a clock change has been
+                        //detected in the API.
+                        openmct.time.on('clock', resolveFunction);
+                        let hash = window.location.hash;
+                        hash = hash.replace('tc.mode=local', 'tc.mode=test-clock');
+                        window.location.hash = hash;
+                    }).then(() => {
+                        let clock = openmct.time.clock();
+                        expect(clock).toBeDefined();
+                        expect(clock.key).toBe('test-clock');
+                        openmct.time.off('clock', resolveFunction);
+                    });
+                });
+            });
+            it("the clock offsets are correctly set in the API from the URL parameters", () => {
+                return switchToRealtimeMode().then(() => {
+                    let resolveFunction;
+                    return new Promise((resolve) => {
+                        resolveFunction = resolve;
+                        //The 'hashchange' event appears to be asynchronous, so we need to wait until a clock change has been
+                        //detected in the API.
+                        openmct.time.on('clockOffsets', resolveFunction);
+                        let hash = window.location.hash;
+                        hash = hash.replace('tc.startDelta=1000', 'tc.startDelta=2000');
+                        hash = hash.replace('tc.endDelta=100', 'tc.endDelta=200');
+                        window.location.hash = hash;
+                    }).then(() => {
+                        let clockOffsets = openmct.time.clockOffsets();
+                        expect(clockOffsets).toBeDefined();
+                        expect(clockOffsets.start).toBe(-2000);
+                        expect(clockOffsets.end).toBe(200);
+                        openmct.time.off('clockOffsets', resolveFunction);
+                    });
+                });
+            });
+            it("the time system is correctly set in the API from the URL parameters", () => {
+                return switchToRealtimeMode().then(() => {
+                    let resolveFunction;
+                    return new Promise((resolve) => {
+                        resolveFunction = resolve;
+
+                        //The 'hashchange' event appears to be asynchronous, so we need to wait until a clock change has been
+                        //detected in the API.
+                        openmct.time.on('timeSystem', resolveFunction);
+                        let hash = window.location.hash;
+                        hash = hash.replace('tc.timeSystem=utc', 'tc.timeSystem=local');
+                        window.location.hash = hash;
+                    }).then(() => {
+                        let timeSystem = openmct.time.timeSystem();
+                        expect(timeSystem).toBeDefined();
+                        expect(timeSystem.key).toBe('local');
+                        openmct.time.off('timeSystem', resolveFunction);
+                    });
+                });
+            });
+        });
+    });
+    describe("fixed timespan mode", () => {
+        beforeEach(() => {
+            openmct.time.stopClock();
+            openmct.time.timeSystem('utc', {start: 0, end: 1});
+        });
+
+        it("when bounds are set via the time API, they are immediately reflected in the URL", ()=>{
+            //Test expected initial conditions
+            expect(window.location.hash.includes('tc.startBound=0')).toBe(true);
+            expect(window.location.hash.includes('tc.endBound=1')).toBe(true);
+
+            openmct.time.bounds({start: 10, end: 20});
+
+            expect(window.location.hash.includes('tc.startBound=10')).toBe(true);
+            expect(window.location.hash.includes('tc.endBound=20')).toBe(true);
+
+            //Test that expected initial conditions are no longer true
+            expect(window.location.hash.includes('tc.startBound=0')).toBe(false);
+            expect(window.location.hash.includes('tc.endBound=1')).toBe(false);
+        });
+
+        it("when time system is set via the time API, it is immediately reflected in the URL", ()=>{
+            //Test expected initial conditions
+            expect(window.location.hash.includes('tc.timeSystem=utc')).toBe(true);
+
+            openmct.time.timeSystem('local', {start: 20, end: 30});
+
+            expect(window.location.hash.includes('tc.timeSystem=local')).toBe(true);
+
+            //Test that expected initial conditions are no longer true
+            expect(window.location.hash.includes('tc.timeSystem=utc')).toBe(false);
+        });
+        describe("when set in the url", () => {
+            it("time system changes are reflected in the API", () => {
+                let resolveFunction;
+
+                return new Promise((resolve) => {
+                    let timeSystem = openmct.time.timeSystem();
+                    resolveFunction = resolve;
+
+                    expect(timeSystem.key).toBe('utc');
+                    window.location.hash = window.location.hash.replace('tc.timeSystem=utc', 'tc.timeSystem=local');
+
+                    openmct.time.on('timeSystem', resolveFunction);
+                }).then(() => {
+                    let timeSystem = openmct.time.timeSystem();
+                    expect(timeSystem.key).toBe('local');
+
+                    openmct.time.off('timeSystem', resolveFunction);
+                });
+            });
+            it("mode can be changed from realtime to fixed", () => {
+                return switchToRealtimeMode().then(() => {
+                    expectLocationToBeInRealtimeMode();
+
+                    expect(openmct.time.clock()).toBeDefined();
+                }).then(switchToFixedMode).then(() => {
+                    let clock = openmct.time.clock();
+                    expect(clock).not.toBeDefined();
+                });
+            });
+            it("bounds are correctly set in the API from the URL parameters", () => {
+                let resolveFunction;
+
+                expectLocationToBeInFixedMode();
+
+                return new Promise((resolve) => {
+                    resolveFunction = resolve;
+                    openmct.time.on('bounds', resolveFunction);
+                    let hash = window.location.hash;
+                    hash = hash.replace('tc.startBound=0', 'tc.startBound=222')
+                        .replace('tc.endBound=1', 'tc.endBound=333');
+                    window.location.hash = hash;
+                }).then(() => {
+                    let bounds = openmct.time.bounds();
+
+                    expect(bounds).toBeDefined();
+                    expect(bounds.start).toBe(222);
+                    expect(bounds.end).toBe(333);
+                });
+            });
+            it("bounds are correctly set in the API from the URL parameters where only the end bound changes", () => {
+                let resolveFunction;
+
+                expectLocationToBeInFixedMode();
+
+                return new Promise((resolve) => {
+                    resolveFunction = resolve;
+                    openmct.time.on('bounds', resolveFunction);
+                    let hash = window.location.hash;
+                    hash = hash.replace('tc.endBound=1', 'tc.endBound=333');
+                    window.location.hash = hash;
+                }).then(() => {
+                    let bounds = openmct.time.bounds();
+
+                    expect(bounds).toBeDefined();
+                    expect(bounds.start).toBe(0);
+                    expect(bounds.end).toBe(333);
+                });
+            });
+        });
+    });
+
+    function setRealtimeLocationParameters() {
+        let hash = window.location.hash.toString()
+            .replace('tc.mode=fixed', 'tc.mode=local')
+            .replace('tc.startBound=0', 'tc.startDelta=1000')
+            .replace('tc.endBound=1', 'tc.endDelta=100');
+
+        window.location.hash = hash;
+    }
+
+    function setFixedLocationParameters() {
+        let hash = window.location.hash.toString()
+            .replace('tc.mode=local', 'tc.mode=fixed')
+            .replace('tc.timeSystem=utc', 'tc.timeSystem=local')
+            .replace('tc.startDelta=1000', 'tc.startBound=50')
+            .replace('tc.endDelta=100', 'tc.endBound=60');
+
+        window.location.hash = hash;
+    }
+
+    function switchToRealtimeMode() {
+        let resolveFunction;
+        return new Promise((resolve) => {
+            resolveFunction = resolve;
+            openmct.time.on('clock', resolveFunction);
+            setRealtimeLocationParameters();
+        }).then(() => {
+            openmct.time.off('clock', resolveFunction);
+        });
+    }
+
+    function switchToFixedMode() {
+        let resolveFunction;
+        return new Promise((resolve) => {
+            resolveFunction = resolve;
+            //The 'hashchange' event appears to be asynchronous, so we need to wait until a clock change has been
+            //detected in the API.
+            openmct.time.on('clock', resolveFunction);
+            setFixedLocationParameters();
+        }).then(() => {
+            openmct.time.off('clock', resolveFunction);
+        });
+    }
+
+    function expectLocationToBeInRealtimeMode() {
+        expect(window.location.hash.includes('tc.mode=local')).toBe(true);
+        expect(window.location.hash.includes('tc.startDelta=1000')).toBe(true);
+        expect(window.location.hash.includes('tc.endDelta=100')).toBe(true);
+        expect(window.location.hash.includes('tc.mode=fixed')).toBe(false);
+    }
+
+    function expectLocationToBeInFixedMode() {
+        expect(window.location.hash.includes('tc.mode=fixed')).toBe(true);
+        expect(window.location.hash.includes('tc.startBound=0')).toBe(true);
+        expect(window.location.hash.includes('tc.endBound=1')).toBe(true);
+        expect(window.location.hash.includes('tc.mode=local')).toBe(false);
+    }
+});

src/plugins/condition/Condition.js

@@ -20,77 +20,102 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-import * as EventEmitter from 'eventemitter3';
+import EventEmitter from 'EventEmitter';
 import uuid from 'uuid';
-import TelemetryCriterion from "@/plugins/condition/criterion/TelemetryCriterion";
-import { TRIGGER } from "@/plugins/condition/utils/constants";
-import {computeCondition} from "@/plugins/condition/utils/evaluator";
+import TelemetryCriterion from "./criterion/TelemetryCriterion";
+import { evaluateResults } from './utils/evaluator';
+import { getLatestTimestamp } from './utils/time';
+import AllTelemetryCriterion from "./criterion/AllTelemetryCriterion";
+import {TRIGGER_CONJUNCTION, TRIGGER_LABEL} from "./utils/constants";
 
 /*
 * conditionConfiguration = {
-*   identifier: {
-*       key: '',
-*       namespace: ''
-*   },
-*   trigger: 'any'/'all',
+*   id: uuid,
+*   trigger: 'any'/'all'/'not','xor',
 *   criteria: [
 *       {
 *           telemetry: '',
 *           operation: '',
-*           input: '',
-*           metadata: '',
-*           key: 'someTelemetryObjectKey'
+*           input: [],
+*           metadata: ''
 *       }
 *   ]
 * }
 */
-export default class ConditionClass extends EventEmitter {
+export default class Condition extends EventEmitter {
 
     /**
      * Manages criteria and emits the result of - true or false - based on criteria evaluated.
      * @constructor
-     * @param conditionConfiguration: {identifier: {domainObject.identifier},trigger: enum, criteria: Array of {id: uuid, operation: enum, input: Array, metaDataKey: string, key: {domainObject.identifier} }
+     * @param conditionConfiguration: {id: uuid,trigger: enum, criteria: Array of {id: uuid, operation: enum, input: Array, metaDataKey: string, key: {domainObject.identifier} }
      * @param openmct
+     * @param conditionManager
      */
-    constructor(conditionConfiguration, openmct) {
+    constructor(conditionConfiguration, openmct, conditionManager) {
         super();
 
         this.openmct = openmct;
-        this.id = this.openmct.objects.makeKeyString(conditionConfiguration.identifier);
+        this.conditionManager = conditionManager;
+        this.id = conditionConfiguration.id;
         this.criteria = [];
-        this.criteriaResults = {};
+        this.result = undefined;
+        this.timeSystems = this.openmct.time.getAllTimeSystems();
         if (conditionConfiguration.configuration.criteria) {
             this.createCriteria(conditionConfiguration.configuration.criteria);
         }
         this.trigger = conditionConfiguration.configuration.trigger;
-        this.result = null;
-        this.openmct.objects.get(this.id).then(obj => this.observeForChanges(obj));
+        this.description = '';
     }
 
-    observeForChanges(conditionDO) {
-        this.stopObservingForChanges = this.openmct.objects.observe(conditionDO, '*', this.update.bind(this));
+    getResult(datum) {
+        if (!datum || !datum.id) {
+            console.log('no data received');
+            return;
+        }
+
+        if (this.isTelemetryUsed(datum.id)) {
+
+            this.criteria.forEach(criterion => {
+                if (this.isAnyOrAllTelemetry(criterion)) {
+                    criterion.getResult(datum, this.conditionManager.telemetryObjects);
+                } else {
+                    criterion.getResult(datum);
+                }
+            });
+
+            this.result = evaluateResults(this.criteria.map(criterion => criterion.result), this.trigger);
+        }
     }
 
-    update(newDomainObject) {
-        this.updateTrigger(newDomainObject.configuration.trigger);
-        // this.updateCriteria(newDomainObject.configuration.criteria);
+    isAnyOrAllTelemetry(criterion) {
+        return (criterion.telemetry && (criterion.telemetry === 'all' || criterion.telemetry === 'any'));
+    }
+
+    isTelemetryUsed(id) {
+        return this.criteria.some(criterion => {
+            return this.isAnyOrAllTelemetry(criterion) || criterion.telemetryObjectIdAsString === id;
+        });
+    }
+
+    update(conditionConfiguration) {
+        this.updateTrigger(conditionConfiguration.configuration.trigger);
+        this.updateCriteria(conditionConfiguration.configuration.criteria);
     }
 
     updateTrigger(trigger) {
         if (this.trigger !== trigger) {
             this.trigger = trigger;
-            this.handleConditionUpdated();
         }
     }
 
     generateCriterion(criterionConfiguration) {
         return {
-            id: uuid(),
+            id: criterionConfiguration.id || uuid(),
             telemetry: criterionConfiguration.telemetry || '',
+            telemetryObjects: this.conditionManager.telemetryObjects,
             operation: criterionConfiguration.operation || '',
             input: criterionConfiguration.input === undefined ? [] : criterionConfiguration.input,
-            metadata: criterionConfiguration.metadata || '',
-            key: criterionConfiguration.key || ''
+            metadata: criterionConfiguration.metadata || ''
         };
     }
 
@@ -98,6 +123,7 @@ export default class ConditionClass extends EventEmitter {
         criterionConfigurations.forEach((criterionConfiguration) => {
             this.addCriterion(criterionConfiguration);
         });
+        this.updateDescription();
     }
 
     updateCriteria(criterionConfigurations) {
@@ -105,21 +131,29 @@ export default class ConditionClass extends EventEmitter {
         this.createCriteria(criterionConfigurations);
     }
 
+    updateTelemetryObjects() {
+        this.criteria.forEach((criterion) => {
+            criterion.updateTelemetryObjects(this.conditionManager.telemetryObjects);
+        });
+        this.updateDescription();
+    }
+
     /**
      *  adds criterion to the condition.
      */
     addCriterion(criterionConfiguration) {
+        let criterion;
         let criterionConfigurationWithId = this.generateCriterion(criterionConfiguration || null);
-        console.log('condition class criterionConfigurationWithId', criterionConfigurationWithId );
-        let criterion = new TelemetryCriterion(criterionConfigurationWithId, this.openmct);
+        if (criterionConfiguration.telemetry && (criterionConfiguration.telemetry === 'any' || criterionConfiguration.telemetry === 'all')) {
+            criterion = new AllTelemetryCriterion(criterionConfigurationWithId, this.openmct);
+        } else {
+            criterion = new TelemetryCriterion(criterionConfigurationWithId, this.openmct);
+        }
         criterion.on('criterionUpdated', (obj) => this.handleCriterionUpdated(obj));
-        criterion.on('criterionResultUpdated', (obj) => this.handleCriterionResult(obj));
         if (!this.criteria) {
             this.criteria = [];
         }
         this.criteria.push(criterion);
-        //Do we need this here?
-        this.handleConditionUpdated();
         return criterionConfigurationWithId.id;
     }
 
@@ -141,27 +175,15 @@ export default class ConditionClass extends EventEmitter {
     updateCriterion(id, criterionConfiguration) {
         let found = this.findCriterion(id);
         if (found) {
-            console.log('updateCriterion found')
-            const newcriterionConfiguration = this.generateCriterion(criterionConfiguration);
-            let newCriterion = new TelemetryCriterion(newcriterionConfiguration, this.openmct);
+            const newCriterionConfiguration = this.generateCriterion(criterionConfiguration);
+            let newCriterion = new TelemetryCriterion(newCriterionConfiguration, this.openmct);
             newCriterion.on('criterionUpdated', (obj) => this.handleCriterionUpdated(obj));
-            newCriterion.on('criterionResultUpdated', (obj) => this.handleCriterionResult(obj));
 
             let criterion = found.item;
             criterion.unsubscribe();
             criterion.off('criterionUpdated', (obj) => this.handleCriterionUpdated(obj));
-            criterion.off('criterionResultUpdated', (obj) => this.handleCriterionResult(obj));
             this.criteria.splice(found.index, 1, newCriterion);
-            if (this.criteriaResults[criterion.id] !== undefined) {
-                delete this.criteriaResults[criterion.id];
-            }
-            this.handleConditionUpdated();
-        }
-    }
-
-    removeCriterion(id) {
-        if (this.destroyCriterion(id)) {
-            this.handleConditionUpdated();
+            this.updateDescription();
         }
     }
 
@@ -169,14 +191,13 @@ export default class ConditionClass extends EventEmitter {
         let found = this.findCriterion(id);
         if (found) {
             let criterion = found.item;
-            criterion.destroy();
-            criterion.off('criterionUpdated', (result) => {
-                this.handleCriterionUpdated(id, result);
+            criterion.off('criterionUpdated', (obj) => {
+                this.handleCriterionUpdated(obj);
             });
+            criterion.destroy();
             this.criteria.splice(found.index, 1);
-            if (this.criteriaResults[criterion.id] !== undefined) {
-                delete this.criteriaResults[criterion.id];
-            }
+            this.updateDescription();
+
             return true;
         }
         return false;
@@ -186,36 +207,59 @@ export default class ConditionClass extends EventEmitter {
         let found = this.findCriterion(criterion.id);
         if (found) {
             this.criteria[found.index] = criterion.data;
-            //Most likely don't need this.
-            console.log('conditiion subscribe')
-            this.subscribe();
-            this.emitEvent('conditionUpdated', {
-                trigger: this.trigger,
-                criteria: this.criteria
+            this.updateDescription();
+        }
+    }
+
+    updateDescription() {
+        const triggerDescription = this.getTriggerDescription();
+        let description = '';
+        this.criteria.forEach((criterion, index) => {
+            if (!index) {
+                description = `Match if ${triggerDescription.prefix}`;
+            }
+            description = `${description} ${criterion.getDescription()} ${(index < this.criteria.length - 1) ? triggerDescription.conjunction : ''}`;
+        });
+        this.description = description;
+        this.conditionManager.updateConditionDescription(this);
+    }
+
+    getTriggerDescription() {
+        return {
+            conjunction: TRIGGER_CONJUNCTION[this.trigger],
+            prefix: `${TRIGGER_LABEL[this.trigger]}: `
+        };
+    }
+
+    requestLADConditionResult() {
+        let latestTimestamp;
+        let criteriaResults = {};
+        const criteriaRequests = this.criteria
+            .map(criterion => criterion.requestLAD(this.conditionManager.telemetryObjects));
+
+        return Promise.all(criteriaRequests)
+            .then(results => {
+                results.forEach(resultObj => {
+                    const { id, data, data: { result } } = resultObj;
+                    if (this.findCriterion(id)) {
+                        criteriaResults[id] = !!result;
+                    }
+                    latestTimestamp = getLatestTimestamp(
+                        latestTimestamp,
+                        data,
+                        this.timeSystems,
+                        this.openmct.time.timeSystem()
+                    );
+                });
+                return {
+                    id: this.id,
+                    data: Object.assign(
+                        {},
+                        latestTimestamp,
+                        { result: evaluateResults(Object.values(criteriaResults), this.trigger) }
+                    )
+                };
             });
-        }
-    }
-
-    handleCriterionResult(eventData) {
-        let id = eventData.id;
-        let result = eventData.data.result;
-        let found = this.findCriterion(id);
-        if (found) {
-            this.criteriaResults[id] = result;
-        }
-        this.handleConditionUpdated();
-    }
-
-    subscribe() {
-        this.criteria.forEach((criterion) => {
-            criterion.subscribe();
-        })
-    }
-
-    handleConditionUpdated() {
-        // trigger an updated event so that consumers can react accordingly
-        this.evaluate();
-        this.emitEvent('conditionResultUpdated', {result: this.result});
     }
 
     getCriteria() {
@@ -231,22 +275,7 @@ export default class ConditionClass extends EventEmitter {
         return success;
     }
 
-    //TODO: implement as part of the evaluator class task.
-    evaluate() {
-        this.result = computeCondition(this.criteriaResults, this.trigger === TRIGGER.ALL);
-    }
-
-    emitEvent(eventName, data) {
-        this.emit(eventName, {
-            id: this.id,
-            data: data
-        });
-    }
-
     destroy() {
-        if (typeof this.stopObservingForChanges === 'function') {
-            this.stopObservingForChanges();
-        }
         this.destroyCriteria();
     }
 }

src/plugins/condition/ConditionManager.js

@@ -0,0 +1,382 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2020, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+import Condition from "./Condition";
+import { getLatestTimestamp } from './utils/time';
+import uuid from "uuid";
+import EventEmitter from 'EventEmitter';
+
+export default class ConditionManager extends EventEmitter {
+    constructor(conditionSetDomainObject, openmct) {
+        super();
+        this.openmct = openmct;
+        this.conditionSetDomainObject = conditionSetDomainObject;
+        this.timeSystems = this.openmct.time.getAllTimeSystems();
+        this.composition = this.openmct.composition.get(conditionSetDomainObject);
+        this.composition.on('add', this.subscribeToTelemetry, this);
+        this.composition.on('remove', this.unsubscribeFromTelemetry, this);
+        this.compositionLoad = this.composition.load();
+        this.subscriptions = {};
+        this.telemetryObjects = {};
+        this.testData = {conditionTestData: [], applied: false};
+        this.initialize();
+
+        this.stopObservingForChanges = this.openmct.objects.observe(this.conditionSetDomainObject, '*', (newDomainObject) => {
+            this.conditionSetDomainObject = newDomainObject;
+        });
+
+    }
+
+    subscribeToTelemetry(endpoint) {
+        const id = this.openmct.objects.makeKeyString(endpoint.identifier);
+        if (this.subscriptions[id]) {
+            console.log('subscription already exists');
+            return;
+        }
+        this.telemetryObjects[id] = Object.assign({}, endpoint, {telemetryMetaData: this.openmct.telemetry.getMetadata(endpoint).valueMetadatas});
+        this.subscriptions[id] = this.openmct.telemetry.subscribe(
+            endpoint,
+            this.telemetryReceived.bind(this, endpoint)
+        );
+        this.updateConditionTelemetryObjects();
+    }
+
+    unsubscribeFromTelemetry(endpointIdentifier) {
+        const id = this.openmct.objects.makeKeyString(endpointIdentifier);
+        if (!this.subscriptions[id]) {
+            console.log('no subscription to remove');
+            return;
+        }
+
+        this.subscriptions[id]();
+        delete this.subscriptions[id];
+        delete this.telemetryObjects[id];
+        this.removeConditionTelemetryObjects();
+    }
+
+    initialize() {
+        this.conditions = [];
+        if (this.conditionSetDomainObject.configuration.conditionCollection.length) {
+            this.conditionSetDomainObject.configuration.conditionCollection.forEach((conditionConfiguration, index) => {
+                this.initCondition(conditionConfiguration, index);
+            });
+        }
+    }
+
+    updateConditionTelemetryObjects() {
+        this.conditions.forEach((condition) => condition.updateTelemetryObjects());
+    }
+
+    removeConditionTelemetryObjects() {
+        let conditionsChanged = false;
+        this.conditionSetDomainObject.configuration.conditionCollection.forEach((conditionConfiguration, conditionIndex) => {
+            let conditionChanged = false;
+            conditionConfiguration.configuration.criteria.forEach((criterion, index) => {
+                const isAnyAllTelemetry = criterion.telemetry && (criterion.telemetry === 'any' || criterion.telemetry === 'all');
+                if (!isAnyAllTelemetry) {
+                    const found = Object.values(this.telemetryObjects).find((telemetryObject) => {
+                        return this.openmct.objects.areIdsEqual(telemetryObject.identifier, criterion.telemetry);
+                    });
+                    if (!found) {
+                        criterion.telemetry = '';
+                        criterion.metadata = '';
+                        criterion.input = [];
+                        criterion.operation = '';
+                        conditionChanged = true;
+                    }
+                }
+            });
+            if (conditionChanged) {
+                this.updateCondition(conditionConfiguration, conditionIndex);
+                conditionsChanged = true;
+            }
+        });
+        if (conditionsChanged) {
+            this.persistConditions();
+        }
+    }
+
+    updateCondition(conditionConfiguration, index) {
+        let condition = this.conditions[index];
+        this.conditionSetDomainObject.configuration.conditionCollection[index] = conditionConfiguration;
+        condition.update(conditionConfiguration);
+        this.persistConditions();
+    }
+
+    updateConditionDescription(condition) {
+        const found = this.conditionSetDomainObject.configuration.conditionCollection.find(conditionConfiguration => (conditionConfiguration.id === condition.id));
+        found.summary = condition.description;
+        this.persistConditions();
+    }
+
+    initCondition(conditionConfiguration, index) {
+        let condition = new Condition(conditionConfiguration, this.openmct, this);
+        if (index !== undefined) {
+            this.conditions.splice(index + 1, 0, condition);
+        } else {
+            this.conditions.unshift(condition);
+        }
+    }
+
+    createCondition(conditionConfiguration) {
+        let conditionObj;
+        if (conditionConfiguration) {
+            conditionObj = {
+                ...conditionConfiguration,
+                id: uuid(),
+                configuration: {
+                    ...conditionConfiguration.configuration,
+                    name: `Copy of ${conditionConfiguration.configuration.name}`
+                }
+            };
+        } else {
+            conditionObj = {
+                id: uuid(),
+                configuration: {
+                    name: 'Unnamed Condition',
+                    output: 'false',
+                    trigger: 'all',
+                    criteria: [{
+                        id: uuid(),
+                        telemetry: '',
+                        operation: '',
+                        input: [],
+                        metadata: ''
+                    }]
+                },
+                summary: ''
+            };
+        }
+
+        return conditionObj;
+    }
+
+    addCondition() {
+        this.createAndSaveCondition();
+    }
+
+    cloneCondition(conditionConfiguration, index) {
+        let clonedConfig = JSON.parse(JSON.stringify(conditionConfiguration));
+        clonedConfig.configuration.criteria.forEach((criterion) => criterion.id = uuid());
+        this.createAndSaveCondition(index, clonedConfig);
+    }
+
+    createAndSaveCondition(index, conditionConfiguration) {
+        const newCondition = this.createCondition(conditionConfiguration);
+        if (index !== undefined) {
+            this.conditionSetDomainObject.configuration.conditionCollection.splice(index + 1, 0, newCondition);
+        } else {
+            this.conditionSetDomainObject.configuration.conditionCollection.unshift(newCondition);
+        }
+        this.initCondition(newCondition, index);
+        this.persistConditions();
+    }
+
+    removeCondition(index) {
+        let condition = this.conditions[index];
+        condition.destroy();
+        this.conditions.splice(index, 1);
+        this.conditionSetDomainObject.configuration.conditionCollection.splice(index, 1);
+        this.persistConditions();
+    }
+
+    findConditionById(id) {
+        return this.conditions.find(condition => condition.id === id);
+    }
+
+    reorderConditions(reorderPlan) {
+        let oldConditions = Array.from(this.conditionSetDomainObject.configuration.conditionCollection);
+        let newCollection = [];
+        reorderPlan.forEach((reorderEvent) => {
+            let item = oldConditions[reorderEvent.oldIndex];
+            newCollection.push(item);
+            this.conditionSetDomainObject.configuration.conditionCollection = newCollection;
+        });
+        this.persistConditions();
+    }
+
+    getCurrentCondition() {
+        const conditionCollection = this.conditionSetDomainObject.configuration.conditionCollection;
+        let currentCondition = conditionCollection[conditionCollection.length-1];
+
+        for (let i = 0; i < conditionCollection.length - 1; i++) {
+            const condition = this.findConditionById(conditionCollection[i].id)
+            if (condition.result) {
+                //first condition to be true wins
+                currentCondition = conditionCollection[i];
+                break;
+            }
+        }
+
+        return currentCondition;
+    }
+
+    getCurrentConditionLAD(conditionResults) {
+        const conditionCollection = this.conditionSetDomainObject.configuration.conditionCollection;
+        let currentCondition = conditionCollection[conditionCollection.length-1];
+
+        for (let i = 0; i < conditionCollection.length - 1; i++) {
+            if (conditionResults[conditionCollection[i].id]) {
+                //first condition to be true wins
+                currentCondition = conditionCollection[i];
+                break;
+            }
+        }
+        return currentCondition;
+    }
+
+    requestLADConditionSetOutput() {
+        if (!this.conditions.length) {
+            return Promise.resolve([]);
+        }
+
+        return this.compositionLoad.then(() => {
+            let latestTimestamp;
+            let conditionResults = {};
+            const conditionRequests = this.conditions
+                .map(condition => condition.requestLADConditionResult());
+
+            return Promise.all(conditionRequests)
+                .then((results) => {
+                    results.forEach(resultObj => {
+                        const { id, data, data: { result } } = resultObj;
+                        if (this.findConditionById(id)) {
+                            conditionResults[id] = !!result;
+                        }
+                        latestTimestamp = getLatestTimestamp(
+                            latestTimestamp,
+                            data,
+                            this.timeSystems,
+                            this.openmct.time.timeSystem()
+                        );
+                    });
+
+                    if (!Object.values(latestTimestamp).some(timeSystem => timeSystem)) {
+                        return [];
+                    }
+
+                    const currentCondition = this.getCurrentConditionLAD(conditionResults);
+                    const currentOutput = Object.assign(
+                        {
+                            output: currentCondition.configuration.output,
+                            id: this.conditionSetDomainObject.identifier,
+                            conditionId: currentCondition.id
+                        },
+                        latestTimestamp
+                    );
+
+                    return [currentOutput];
+                });
+        });
+    }
+
+    isTelemetryUsed(endpoint) {
+        const id = this.openmct.objects.makeKeyString(endpoint.identifier);
+
+        for(const condition of this.conditions) {
+            if (condition.isTelemetryUsed(id)) {
+                return true;
+            }
+        }
+
+        return false;
+    }
+
+    telemetryReceived(endpoint, datum) {
+        if (!this.isTelemetryUsed(endpoint)) {
+            return;
+        }
+
+        const normalizedDatum = this.createNormalizedDatum(datum, endpoint);
+        const timeSystemKey = this.openmct.time.timeSystem().key;
+        let timestamp = {};
+        timestamp[timeSystemKey] = normalizedDatum[timeSystemKey];
+
+        this.conditions.forEach(condition => {
+            condition.getResult(normalizedDatum);
+        });
+
+        const currentCondition = this.getCurrentCondition();
+
+        this.emit('conditionSetResultUpdated',
+            Object.assign(
+                {
+                    output: currentCondition.configuration.output,
+                    id: this.conditionSetDomainObject.identifier,
+                    conditionId: currentCondition.id
+                },
+                timestamp
+            )
+        )
+    }
+
+    getTestData(metadatum) {
+        let data = undefined;
+        if (this.testData.applied) {
+            const found = this.testData.conditionTestInputs.find((testInput) => (testInput.metadata === metadatum.source));
+            if (found) {
+                data = found.value;
+            }
+        }
+        return data;
+    }
+
+    createNormalizedDatum(telemetryDatum, endpoint) {
+        const id = this.openmct.objects.makeKeyString(endpoint.identifier);
+        const metadata = this.openmct.telemetry.getMetadata(endpoint).valueMetadatas;
+
+        const normalizedDatum = Object.values(metadata).reduce((datum, metadatum) => {
+            const testValue = this.getTestData(metadatum);
+            const formatter = this.openmct.telemetry.getValueFormatter(metadatum);
+            datum[metadatum.key] = testValue !== undefined ?  formatter.parse(testValue) : formatter.parse(telemetryDatum[metadatum.source]);
+            return datum;
+        }, {});
+
+        normalizedDatum.id = id;
+
+        return normalizedDatum;
+    }
+
+    updateTestData(testData) {
+        this.testData = testData;
+        this.openmct.objects.mutate(this.conditionSetDomainObject, 'configuration.conditionTestData', this.testData.conditionTestInputs);
+    }
+
+    persistConditions() {
+        this.openmct.objects.mutate(this.conditionSetDomainObject, 'configuration.conditionCollection', this.conditionSetDomainObject.configuration.conditionCollection);
+    }
+
+    destroy() {
+        this.composition.off('add', this.subscribeToTelemetry, this);
+        this.composition.off('remove', this.unsubscribeFromTelemetry, this);
+        Object.values(this.subscriptions).forEach(unsubscribe => unsubscribe());
+        delete this.subscriptions;
+
+        if(this.stopObservingForChanges) {
+            this.stopObservingForChanges();
+        }
+
+        this.conditions.forEach((condition) => {
+            condition.destroy();
+        })
+    }
+}

src/plugins/condition/ConditionManagerSpec.js

@@ -0,0 +1,133 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2020, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+import ConditionManager  from './ConditionManager';
+
+describe('ConditionManager', () => {
+
+    let conditionMgr;
+    let mockListener;
+    let openmct = {};
+    let mockCondition = {
+        isDefault: true,
+        id: '1234-5678',
+        configuration: {
+            criteria: []
+        }
+    };
+    let conditionSetDomainObject = {
+        identifier: {
+            namespace: "",
+            key: "600a7372-8d48-4dc4-98b6-548611b1ff7e"
+        },
+        type: "conditionSet",
+        location: "mine",
+        configuration: {
+            conditionCollection: [
+                mockCondition
+            ]
+        }
+    };
+    let mockComposition;
+    let loader;
+    let mockTimeSystems;
+
+    function mockAngularComponents() {
+        let mockInjector = jasmine.createSpyObj('$injector', ['get']);
+
+        let mockInstantiate = jasmine.createSpy('mockInstantiate');
+        mockInstantiate.and.returnValue(mockInstantiate);
+
+        let mockDomainObject = {
+            useCapability: function () {
+                return mockCondition;
+            }
+        };
+        mockInstantiate.and.callFake(function () {
+            return mockDomainObject;
+        });
+        mockInjector.get.and.callFake(function (service) {
+            return {
+                'instantiate': mockInstantiate
+            }[service];
+        });
+
+        openmct.$injector = mockInjector;
+    }
+
+    beforeEach(function () {
+
+        mockAngularComponents();
+        mockListener = jasmine.createSpy('mockListener');
+        loader = {};
+        loader.promise = new Promise(function (resolve, reject) {
+            loader.resolve = resolve;
+            loader.reject = reject;
+        });
+
+        mockComposition = jasmine.createSpyObj('compositionCollection', [
+            'load',
+            'on',
+            'off'
+        ]);
+        mockComposition.load.and.callFake(() => {
+            setTimeout(() => {
+                loader.resolve();
+            });
+            return loader.promise;
+        });
+        mockComposition.on('add', mockListener);
+        mockComposition.on('remove', mockListener);
+        openmct.composition = jasmine.createSpyObj('compositionAPI', [
+            'get'
+        ]);
+        openmct.composition.get.and.returnValue(mockComposition);
+
+        openmct.objects = jasmine.createSpyObj('objects', ['get', 'makeKeyString', 'observe', 'mutate']);
+        openmct.objects.get.and.returnValues(new Promise(function (resolve, reject) {
+            resolve(conditionSetDomainObject);
+        }), new Promise(function (resolve, reject) {
+            resolve(mockCondition);
+        }));
+        openmct.objects.makeKeyString.and.returnValue(conditionSetDomainObject.identifier.key);
+        openmct.objects.observe.and.returnValue(function () {});
+        openmct.objects.mutate.and.returnValue(function () {});
+
+        mockTimeSystems = {
+            key: 'utc'
+        };
+        openmct.time = jasmine.createSpyObj('time', ['getAllTimeSystems']);
+        openmct.time.getAllTimeSystems.and.returnValue([mockTimeSystems]);
+
+        conditionMgr = new ConditionManager(conditionSetDomainObject, openmct);
+
+        conditionMgr.on('conditionSetResultUpdated', mockListener);
+        conditionMgr.on('telemetryReceived', mockListener);
+    });
+
+    it('creates a conditionCollection with a default condition', function () {
+        expect(conditionMgr.conditionSetDomainObject.configuration.conditionCollection.length).toEqual(1);
+        let defaultConditionId = conditionMgr.conditions[0].id;
+        expect(defaultConditionId).toEqual(mockCondition.id);
+    });
+
+});

src/plugins/condition/ConditionSetCompositionPolicySpec.js

@@ -28,7 +28,6 @@ describe('ConditionSetCompositionPolicy', () => {
     let testTelemetryObject;
     let openmct = {};
     let parentDomainObject;
-    let composition;
 
     beforeAll(function () {
         testTelemetryObject = {
@@ -57,7 +56,6 @@ describe('ConditionSetCompositionPolicy', () => {
         openmct.telemetry = jasmine.createSpyObj('telemetry', ['isTelemetryObject']);
         policy = new ConditionSetCompositionPolicy(openmct);
         parentDomainObject = {};
-        composition = {};
     });
 
     it('returns true for object types that are not conditionSets', function () {

src/plugins/condition/ConditionSetMetadataProvider.js

@@ -0,0 +1,77 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2020, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+export default class ConditionSetMetadataProvider {
+    constructor(openmct) {
+        this.openmct = openmct;
+    }
+
+    supportsMetadata(domainObject) {
+        return domainObject.type === 'conditionSet';
+    }
+
+    getDomains(domainObject) {
+        return this.openmct.time.getAllTimeSystems().map(function (ts, i) {
+            return {
+                key: ts.key,
+                name: ts.name,
+                format: ts.timeFormat,
+                hints: {
+                    domain: i
+                }
+            };
+        });
+    }
+
+    getMetadata(domainObject) {
+        const enumerations = domainObject.configuration.conditionCollection
+            .map((condition, index) => {
+                return {
+                    string: condition.configuration.output,
+                    value: index
+                };
+            });
+
+        return {
+            values: this.getDomains().concat([
+                {
+                    key: "state",
+                    source: "output",
+                    name: "State",
+                    format: "enum",
+                    enumerations: enumerations,
+                    hints: {
+                        range: 1
+                    }
+                },
+                {
+                    key: "output",
+                    name: "Value",
+                    format: "string",
+                    hints: {
+                        range: 2
+                    }
+                }
+            ])
+        };
+    }
+}

src/plugins/condition/ConditionSetTelemetryProvider.js

@@ -0,0 +1,86 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2020, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+import ConditionManager from './ConditionManager'
+
+export default class ConditionSetTelemetryProvider {
+    constructor(openmct) {
+        this.openmct = openmct;
+        this.conditionManagerPool = {};
+    }
+
+    isTelemetryObject(domainObject) {
+        return domainObject.type === 'conditionSet';
+    }
+
+    supportsRequest(domainObject) {
+        return domainObject.type === 'conditionSet';
+    }
+
+    supportsSubscribe(domainObject) {
+        return domainObject.type === 'conditionSet';
+    }
+
+    request(domainObject) {
+        let conditionManager = this.getConditionManager(domainObject);
+
+        return conditionManager.requestLADConditionSetOutput()
+            .then(latestOutput => {
+                return latestOutput;
+            });
+    }
+
+    subscribe(domainObject, callback) {
+        let conditionManager = this.getConditionManager(domainObject);
+
+        conditionManager.on('conditionSetResultUpdated', callback);
+
+        return this.destroyConditionManager.bind(this, this.openmct.objects.makeKeyString(domainObject.identifier));
+    }
+
+    /**
+     * returns conditionManager instance for corresponding domain object
+     * creates the instance if it is not yet created
+     * @private
+     */
+    getConditionManager(domainObject) {
+        const id = this.openmct.objects.makeKeyString(domainObject.identifier);
+
+        if (!this.conditionManagerPool[id]) {
+            this.conditionManagerPool[id] = new ConditionManager(domainObject, this.openmct);
+        }
+
+        return this.conditionManagerPool[id];
+    }
+
+    /**
+     * cleans up and destroys conditionManager instance for corresponding domain object id
+     * can be called manually for views that only request but do not subscribe to data
+     */
+    destroyConditionManager(id) {
+        if (this.conditionManagerPool[id]) {
+            this.conditionManagerPool[id].off('conditionSetResultUpdated');
+            this.conditionManagerPool[id].destroy();
+            delete this.conditionManagerPool[id];
+        }
+    }
+}

src/plugins/condition/ConditionSetViewPolicy.js

@@ -0,0 +1,33 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2020, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+function ConditionSetViewPolicy() {
+}
+
+ConditionSetViewPolicy.prototype.allow = function (view, domainObject) {
+    if (domainObject.getModel().type === 'conditionSet') {
+        return view.key === 'conditionSet.view';
+    }
+    return true;
+}
+
+export default ConditionSetViewPolicy;

src/plugins/condition/ConditionSetViewProvider.js

@@ -23,11 +23,14 @@
 import ConditionSet from './components/ConditionSet.vue';
 import Vue from 'vue';
 
+const DEFAULT_VIEW_PRIORITY = 100;
+
 export default class ConditionSetViewProvider {
     constructor(openmct) {
         this.openmct = openmct;
+        this.name = 'Conditions View';
         this.key = 'conditionSet.view';
-        this.cssClass = 'icon-conditional'; // TODO: replace with class for new icon
+        this.cssClass = 'icon-conditional';
     }
 
     canView(domainObject) {
@@ -70,4 +73,12 @@ export default class ConditionSetViewProvider {
             }
         };
     }
+
+    priority(domainObject) {
+        if (domainObject.type === 'conditionSet') {
+            return Number.MAX_VALUE;
+        } else {
+            return DEFAULT_VIEW_PRIORITY;
+        }
+    }
 }

src/plugins/condition/ConditionSpec.js

@@ -25,35 +25,53 @@ import {TRIGGER} from "./utils/constants";
 import TelemetryCriterion from "./criterion/TelemetryCriterion";
 
 let openmct = {},
-    mockListener,
     testConditionDefinition,
     testTelemetryObject,
-    conditionObj;
+    conditionObj,
+    conditionManager,
+    mockTelemetryReceived,
+    mockTimeSystems;
 
 describe("The condition", function () {
 
     beforeEach (() => {
-        mockListener = jasmine.createSpy('listener');
+        conditionManager = jasmine.createSpyObj('conditionManager',
+            ['on', 'updateConditionDescription']
+        );
+        mockTelemetryReceived = jasmine.createSpy('listener');
+        conditionManager.on('telemetryReceived', mockTelemetryReceived);
+        conditionManager.updateConditionDescription.and.returnValue(function () {});
+
         testTelemetryObject = {
             identifier:{ namespace: "", key: "test-object"},
             type: "test-object",
             name: "Test Object",
             telemetry: {
-                values: [{
+                valueMetadatas: [{
                     key: "some-key",
                     name: "Some attribute",
+                    hints: {
+                        range: 2
+                    }
+                },
+                {
+                    key: "utc",
+                    name: "Time",
+                    format: "utc",
                     hints: {
                         domain: 1
                     }
                 }, {
-                    key: "some-other-key",
-                    name: "Another attribute",
-                    hints: {
-                        range: 1
-                    }
+                    key: "testSource",
+                    source: "value",
+                    name: "Test",
+                    format: "string"
                 }]
             }
         };
+        conditionManager.telemetryObjects = {
+            "test-object": testTelemetryObject
+        };
         openmct.objects = jasmine.createSpyObj('objects', ['get', 'makeKeyString']);
         openmct.objects.get.and.returnValue(new Promise(function (resolve, reject) {
             resolve(testTelemetryObject);
@@ -61,17 +79,27 @@ describe("The condition", function () {
         openmct.telemetry = jasmine.createSpyObj('telemetry', ['isTelemetryObject', 'subscribe', 'getMetadata']);
         openmct.telemetry.isTelemetryObject.and.returnValue(true);
         openmct.telemetry.subscribe.and.returnValue(function () {});
-        openmct.telemetry.getMetadata.and.returnValue(testTelemetryObject.telemetry.values);
+        openmct.telemetry.getMetadata.and.returnValue(testTelemetryObject.telemetry);
+
+        mockTimeSystems = {
+            key: 'utc'
+        };
+        openmct.time = jasmine.createSpyObj('time', ['getAllTimeSystems']);
+        openmct.time.getAllTimeSystems.and.returnValue([mockTimeSystems]);
 
         testConditionDefinition = {
-            definition: {
+            id: '123-456',
+            configuration: {
+                name: 'mock condition',
+                output: 'mock output',
                 trigger: TRIGGER.ANY,
                 criteria: [
                     {
+                        id: '1234-5678-9999-0000',
                         operation: 'equalTo',
-                        input: false,
-                        metaDataKey: 'value',
-                        key: testTelemetryObject.identifier
+                        input: ['0'],
+                        metadata: 'value',
+                        telemetry: testTelemetryObject.identifier
                     }
                 ]
             }
@@ -79,21 +107,19 @@ describe("The condition", function () {
 
         conditionObj = new Condition(
             testConditionDefinition,
-            openmct
+            openmct,
+            conditionManager
         );
-
-        conditionObj.on('conditionUpdated', mockListener);
-
     });
 
-    it("generates criteria with an id", function () {
-        const testCriterion = testConditionDefinition.definition.criteria[0];
+    it("generates criteria with the correct properties", function () {
+        const testCriterion = testConditionDefinition.configuration.criteria[0];
         let criterion = conditionObj.generateCriterion(testCriterion);
         expect(criterion.id).toBeDefined();
         expect(criterion.operation).toEqual(testCriterion.operation);
         expect(criterion.input).toEqual(testCriterion.input);
-        expect(criterion.metaDataKey).toEqual(testCriterion.metaDataKey);
-        expect(criterion.key).toEqual(testCriterion.key);
+        expect(criterion.metadata).toEqual(testCriterion.metadata);
+        expect(criterion.telemetry).toEqual(testCriterion.telemetry);
     });
 
     it("initializes with an id", function () {
@@ -104,13 +130,13 @@ describe("The condition", function () {
         expect(conditionObj.criteria.length).toEqual(1);
         let criterion = conditionObj.criteria[0];
         expect(criterion instanceof TelemetryCriterion).toBeTrue();
-        expect(criterion.operator).toEqual(testConditionDefinition.definition.criteria[0].operator);
-        expect(criterion.input).toEqual(testConditionDefinition.definition.criteria[0].input);
-        expect(criterion.metaDataKey).toEqual(testConditionDefinition.definition.criteria[0].metaDataKey);
+        expect(criterion.operator).toEqual(testConditionDefinition.configuration.criteria[0].operator);
+        expect(criterion.input).toEqual(testConditionDefinition.configuration.criteria[0].input);
+        expect(criterion.metadata).toEqual(testConditionDefinition.configuration.criteria[0].metadata);
     });
 
     it("initializes with the trigger from the condition definition", function () {
-        expect(conditionObj.trigger).toEqual(testConditionDefinition.definition.trigger);
+        expect(conditionObj.trigger).toEqual(testConditionDefinition.configuration.trigger);
     });
 
     it("destroys all criteria for a condition", function () {
@@ -118,4 +144,38 @@ describe("The condition", function () {
         expect(result).toBeTrue();
         expect(conditionObj.criteria.length).toEqual(0);
     });
+
+    it("gets the result of a condition when new telemetry data is received", function () {
+        conditionObj.getResult({
+            value: '0',
+            utc: 'Hi',
+            id: testTelemetryObject.identifier.key
+        });
+        expect(conditionObj.result).toBeTrue();
+    });
+
+    it("gets the result of a condition when new telemetry data is received", function () {
+        conditionObj.getResult({
+            value: '1',
+            utc: 'Hi',
+            id: testTelemetryObject.identifier.key
+        });
+        expect(conditionObj.result).toBeFalse();
+    });
+
+    it("keeps the old result new telemetry data is not used by it", function () {
+        conditionObj.getResult({
+            value: '0',
+            utc: 'Hi',
+            id: testTelemetryObject.identifier.key
+        });
+        expect(conditionObj.result).toBeTrue();
+
+        conditionObj.getResult({
+            value: '1',
+            utc: 'Hi',
+            id: '1234'
+        });
+        expect(conditionObj.result).toBeTrue();
+    });
 });

src/plugins/condition/StyleRuleManager.js

@@ -0,0 +1,162 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2020, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+import EventEmitter from 'EventEmitter';
+
+export default class StyleRuleManager extends EventEmitter {
+    constructor(styleConfiguration, openmct, callback, suppressSubscriptionOnEdit) {
+        super();
+        this.openmct = openmct;
+        this.callback = callback;
+        if (suppressSubscriptionOnEdit) {
+            this.openmct.editor.on('isEditing', this.toggleSubscription.bind(this));
+            this.isEditing = this.openmct.editor.editing;
+        }
+        if (styleConfiguration) {
+            this.initialize(styleConfiguration);
+            if (styleConfiguration.conditionSetIdentifier) {
+                this.subscribeToConditionSet();
+            } else {
+                this.applyStaticStyle();
+            }
+        }
+    }
+
+    toggleSubscription(isEditing) {
+        this.isEditing = isEditing;
+        if (this.isEditing) {
+            if (this.stopProvidingTelemetry) {
+                this.stopProvidingTelemetry();
+            }
+            if (this.conditionSetIdentifier) {
+                this.applySelectedConditionStyle();
+            }
+        } else if (this.conditionSetIdentifier) {
+            this.subscribeToConditionSet();
+        }
+    }
+
+    initialize(styleConfiguration) {
+        this.conditionSetIdentifier = styleConfiguration.conditionSetIdentifier;
+        this.staticStyle = styleConfiguration.staticStyle;
+        this.selectedConditionId = styleConfiguration.selectedConditionId;
+        this.defaultConditionId = styleConfiguration.defaultConditionId;
+        this.updateConditionStylesMap(styleConfiguration.styles || []);
+    }
+
+    subscribeToConditionSet() {
+        if (this.stopProvidingTelemetry) {
+            this.stopProvidingTelemetry();
+        }
+        this.openmct.objects.get(this.conditionSetIdentifier).then((conditionSetDomainObject) => {
+            this.openmct.telemetry.request(conditionSetDomainObject)
+                .then(output => {
+                    if (output && output.length) {
+                        this.handleConditionSetResultUpdated(output[0]);
+                    }
+                });
+            this.stopProvidingTelemetry = this.openmct.telemetry.subscribe(conditionSetDomainObject, this.handleConditionSetResultUpdated.bind(this));
+        });
+    }
+
+    updateObjectStyleConfig(styleConfiguration) {
+        if (!styleConfiguration || !styleConfiguration.conditionSetIdentifier) {
+            this.initialize(styleConfiguration || {});
+            this.destroy();
+        } else {
+            let isNewConditionSet = !this.conditionSetIdentifier ||
+                                    !this.openmct.objects.areIdsEqual(this.conditionSetIdentifier, styleConfiguration.conditionSetIdentifier);
+            this.initialize(styleConfiguration);
+            if (this.isEditing) {
+                this.applySelectedConditionStyle();
+            } else {
+                //Only resubscribe if the conditionSet has changed.
+                if (isNewConditionSet) {
+                    this.subscribeToConditionSet();
+                }
+            }
+        }
+    }
+
+    updateConditionStylesMap(conditionStyles) {
+        let conditionStyleMap = {};
+        conditionStyles.forEach((conditionStyle) => {
+            if (conditionStyle.conditionId) {
+                conditionStyleMap[conditionStyle.conditionId] = conditionStyle.style;
+            } else {
+                conditionStyleMap.static = conditionStyle.style;
+            }
+        });
+        this.conditionalStyleMap = conditionStyleMap;
+    }
+
+    handleConditionSetResultUpdated(resultData) {
+        let foundStyle = this.conditionalStyleMap[resultData.conditionId];
+        if (foundStyle) {
+            if (foundStyle !== this.currentStyle) {
+                this.currentStyle = foundStyle;
+            }
+            this.updateDomainObjectStyle();
+        } else {
+            this.applyStaticStyle();
+        }
+    }
+
+    updateDomainObjectStyle() {
+        if (this.callback) {
+            this.callback(Object.assign({}, this.currentStyle));
+        }
+    }
+
+    applySelectedConditionStyle() {
+        const conditionId = this.selectedConditionId || this.defaultConditionId;
+        if (!conditionId) {
+            this.applyStaticStyle();
+        } else if (this.conditionalStyleMap[conditionId]) {
+            this.currentStyle = this.conditionalStyleMap[conditionId];
+            this.updateDomainObjectStyle();
+        }
+    }
+
+    applyStaticStyle() {
+        if (this.staticStyle) {
+            this.currentStyle = this.staticStyle.style;
+        } else {
+            if (this.currentStyle) {
+                Object.keys(this.currentStyle).forEach(key => {
+                    this.currentStyle[key] = '__no_value';
+                });
+            }
+        }
+        this.updateDomainObjectStyle();
+    }
+
+    destroy() {
+        this.applyStaticStyle();
+        if (this.stopProvidingTelemetry) {
+            this.stopProvidingTelemetry();
+        }
+        delete this.stopProvidingTelemetry;
+        this.conditionSetIdentifier = undefined;
+    }
+
+}

src/plugins/condition/components/Condition.vue

@@ -1,160 +1,211 @@
+/*****************************************************************************
+* Open MCT, Copyright (c) 2014-2020, United States Government
+* as represented by the Administrator of the National Aeronautics and Space
+* Administration. All rights reserved.
+*
+* Open MCT is licensed under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+* http://www.apache.org/licenses/LICENSE-2.0.
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+* License for the specific language governing permissions and limitations
+* under the License.
+*
+* Open MCT includes source code licensed under additional open source
+* licenses. See the Open Source Licenses file (LICENSES.md) included with
+* this source code distribution or the Licensing information page available
+* at runtime from the About dialog for additional information.
+*****************************************************************************/
+
 <template>
-<div v-if="isEditing">
-    <div v-if="domainObject"
-         class="c-c-editui__conditions c-c-container__container c-c__drag-wrapper"
-         :class="['widget-condition', { 'widget-condition--current': currentConditionIdentifier && (currentConditionIdentifier.key === conditionIdentifier.key) }]"
-         :data-condition-index="conditionIndex"
-         :draggable="!domainObject.isDefault"
-         @dragstart="dragStart"
-         @dragover.stop
+<div class="c-condition-h"
+     :class="{ 'is-drag-target': draggingOver }"
+     @dragover.prevent
+     @drop.prevent="dropCondition($event, conditionIndex)"
+     @dragenter="dragEnter($event, conditionIndex)"
+     @dragleave="dragLeave($event, conditionIndex)"
+>
+    <div class="c-condition-h__drop-target"></div>
+    <div v-if="isEditing"
+         :class="{'is-current': condition.id === currentConditionId}"
+         class="c-condition c-condition--edit"
     >
-        <div class="title-bar">
-            <span
-                class="c-c__menu-hamburger"
-                :class="{ 'is-enabled': !domainObject.isDefault }"
+        <!-- Edit view -->
+        <div class="c-condition__header">
+            <span class="c-condition__drag-grippy c-grippy c-grippy--vertical-drag"
+                  title="Drag to reorder conditions"
+                  :class="[{ 'is-enabled': !condition.isDefault }, { 'hide-nice': condition.isDefault }]"
+                  :draggable="!condition.isDefault"
+                  @dragstart="dragStart"
+                  @dragend="dragEnd"
             ></span>
-            <span
-                class="is-enabled flex-elem"
-                :class="['c-c__disclosure-triangle', { 'c-c__disclosure-triangle--expanded': expanded }]"
-                @click="expanded = !expanded"
+
+            <span class="c-condition__disclosure c-disclosure-triangle c-tree__item__view-control is-enabled"
+                  :class="{ 'c-disclosure-triangle--expanded': expanded }"
+                  @click="expanded = !expanded"
             ></span>
-            <div class="condition-summary">
-                <span class="condition-name">{{ domainObject.configuration.name }}</span>
-                <span class="condition-description">{{ domainObject.configuration.name }}</span>
+
+            <span class="c-condition__name">{{ condition.configuration.name }}</span>
+            <span class="c-condition__summary">
+                <template v-if="!condition.isDefault && !canEvaluateCriteria">
+                    Define criteria
+                </template>
+                <span v-else>
+                    <condition-description :show-label="false"
+                                           :condition="condition"
+                    />
+                </span>
+            </span>
+
+            <div class="c-condition__buttons">
+                <button v-if="!condition.isDefault"
+                        class="c-click-icon c-condition__duplicate-button icon-duplicate"
+                        title="Duplicate this condition"
+                        @click="cloneCondition"
+                ></button>
+
+                <button v-if="!condition.isDefault"
+                        class="c-click-icon c-condition__delete-button icon-trash"
+                        title="Delete this condition"
+                        @click="removeCondition"
+                ></button>
             </div>
-            <span v-if="!domainObject.isDefault"
-                  class="is-enabled c-c__duplicate"
-                  @click="cloneCondition"
-            ></span>
-            <span v-if="!domainObject.isDefault"
-                  class="is-enabled c-c__trash"
-                  @click="removeCondition"
-            ></span>
         </div>
         <div v-if="expanded"
-             class="condition-config-edit widget-condition-content c-sw-editui__conditions-wrapper holder widget-conditions-wrapper flex-elem expanded"
+             class="c-condition__definition c-cdef"
         >
-            <div id="conditionArea"
-                 class="c-c-editui__condition widget-conditions"
+            <span class="c-cdef__separator c-row-separator"></span>
+            <span class="c-cdef__label">Condition Name</span>
+            <span class="c-cdef__controls">
+                <input v-model="condition.configuration.name"
+                       class="t-condition-input__name"
+                       type="text"
+                       @change="persist"
+                >
+            </span>
+
+            <span class="c-cdef__label">Output</span>
+            <span class="c-cdef__controls">
+                <span class="c-cdef__control">
+                    <select v-model="selectedOutputSelection"
+                            @change="setOutputValue"
+                    >
+                        <option v-for="option in outputOptions"
+                                :key="option"
+                                :value="option"
+                        >
+                            {{ initCap(option) }}
+                        </option>
+                    </select>
+                </span>
+                <span class="c-cdef__control">
+                    <input v-if="selectedOutputSelection === outputOptions[2]"
+                           v-model="condition.configuration.output"
+                           class="t-condition-name-input"
+                           type="text"
+                           @change="persist"
+                    >
+                </span>
+            </span>
+
+            <div v-if="!condition.isDefault"
+                 class="c-cdef__match-and-criteria"
             >
-                <div class="c-c-condition">
-                    <div class="c-c-condition__ui l-compact-form l-widget-condition has-local-controls">
-                        <div>
-                            <ul class="t-widget-condition-config">
-                                <li>
-                                    <label>Condition Name</label>
-                                    <span class="controls">
-                                        <input v-model="domainObject.configuration.name"
-                                               class="t-condition-input__name"
-                                               type="text"
-                                        >
-                                    </span>
-                                </li>
-                                <li>
-                                    <label>Output</label>
-                                    <span class="controls">
-                                        <select v-model="selectedOutputKey"
-                                                @change="checkInputValue"
-                                        >
-                                            <option value="">- Select Output -</option>
-                                            <option v-for="option in outputOptions"
-                                                    :key="option"
-                                                    :value="option"
-                                            >
-                                                {{ option.charAt(0).toUpperCase() + option.slice(1) }}
-                                            </option>
-                                        </select>
-                                        <input v-if="selectedOutputKey === outputOptions[2]"
-                                               v-model="domainObject.configuration.output"
-                                               class="t-condition-name-input"
-                                               type="text"
-                                        >
-                                    </span>
-                                </li>
-                            </ul>
-                            <div v-if="!domainObject.isDefault"
-                                 class="widget-condition-content expanded"
-                            >
-                                <ul class="t-widget-condition-config">
-                                    <li class="has-local-controls t-condition">
-                                        <label>Match when</label>
-                                        <span class="controls">
-                                            <select v-model="trigger">
-                                                <option value="all">all criteria are met</option>
-                                                <option value="any">any criteria are met</option>
-                                            </select>
-                                        </span>
-                                    </li>
-                                </ul>
-                                <ul v-if="telemetry.length"
-                                    class="t-widget-condition-config"
-                                >
-                                    <Criterion v-for="(criterion, index) in domainObject.configuration.criteria"
-                                               :key="index"
-                                               :telemetry="telemetry"
-                                               :criterion="criterion"
-                                               :condition="domainObject"
-                                               :index="index"
-                                               :trigger="trigger"
-                                               @persist="persist"
-                                    />
-                                </ul>
-                                <div class="holder c-c-button-wrapper align-left">
-                                    <span class="c-c-label-spacer"></span>
-                                    <button
-                                        class="c-c-button c-c-button--minor add-criteria-button"
-                                        @click="addCriteria"
-                                    >
-                                        <span class="c-c-button__label">Add Criteria</span>
-                                    </button>
-                                </div>
-                            </div>
+                <span class="c-cdef__separator c-row-separator"></span>
+                <span class="c-cdef__label">Match</span>
+                <span class="c-cdef__controls">
+                    <select v-model="condition.configuration.trigger"
+                            @change="persist"
+                    >
+                        <option v-for="option in triggers"
+                                :key="option.value"
+                                :value="option.value"
+                        > {{ option.label }}</option>
+                    </select>
+                </span>
+
+                <template v-if="telemetry.length || condition.configuration.criteria.length">
+                    <div v-for="(criterion, index) in condition.configuration.criteria"
+                         :key="criterion.id"
+                         class="c-cdef__criteria"
+                    >
+                        <Criterion :telemetry="telemetry"
+                                   :criterion="criterion"
+                                   :index="index"
+                                   :trigger="condition.configuration.trigger"
+                                   :is-default="condition.configuration.criteria.length === 1"
+                                   @persist="persist"
+                        />
+                        <div class="c-cdef__criteria__buttons">
+                            <button class="c-click-icon c-cdef__criteria-duplicate-button icon-duplicate"
+                                    title="Duplicate this criteria"
+                                    @click="cloneCriterion(index)"
+                            ></button>
+                            <button v-if="!(condition.configuration.criteria.length === 1)"
+                                    class="c-click-icon c-cdef__criteria-duplicate-button icon-trash"
+                                    title="Delete this criteria"
+                                    @click="removeCriterion(index)"
+                            ></button>
                         </div>
                     </div>
+                </template>
+                <div class="c-cdef__separator c-row-separator"></div>
+                <div class="c-cdef__controls"
+                     :disabled="!telemetry.length"
+                >
+                    <button
+                        class="c-cdef__add-criteria-button c-button c-button--labeled icon-plus"
+                        @click="addCriteria"
+                    >
+                        <span class="c-button__label">Add Criteria</span>
+                    </button>
                 </div>
             </div>
         </div>
     </div>
-</div>
-<div v-else>
-    <div v-if="domainObject"
-         id="conditionArea"
-         class="c-cs-ui__conditions"
-         :class="['widget-condition', { 'widget-condition--current': currentConditionIdentifier && (currentConditionIdentifier.key === conditionIdentifier.key) }]"
+    <div v-else
+         class="c-condition c-condition--browse"
+         :class="{'is-current': condition.id === currentConditionId}"
     >
-        <div class="title-bar">
-            <span class="condition-name">
-                {{ domainObject.configuration.name }}
+        <!-- Browse view -->
+        <div class="c-condition__header">
+            <span class="c-condition__name">
+                {{ condition.configuration.name }}
             </span>
-            <span class="condition-output">
-                Output: {{ domainObject.configuration.output }}
+            <span class="c-condition__output">
+                Output: {{ condition.configuration.output }}
             </span>
         </div>
-        <div class="condition-config">
-            <span class="condition-description">
-                {{ domainObject.configuration.description }}
-            </span>
+        <div class="c-condition__summary">
+            <condition-description :show-label="false"
+                                   :condition="condition"
+            />
         </div>
     </div>
 </div>
 </template>
 
 <script>
-import ConditionClass from "@/plugins/condition/Condition";
-import Criterion from '../../condition/components/Criterion.vue';
+import Criterion from './Criterion.vue';
+import ConditionDescription from "./ConditionDescription.vue";
+import { TRIGGER, TRIGGER_LABEL } from "@/plugins/condition/utils/constants";
 import uuid from 'uuid';
 
 export default {
-    inject: ['openmct', 'domainObject'],
+    inject: ['openmct'],
     components: {
-        Criterion
+        Criterion,
+        ConditionDescription
     },
     props: {
-        conditionIdentifier: {
-            type: Object,
-            required: true
+        currentConditionId: {
+            type: String,
+            default: ''
         },
-        currentConditionIdentifier: {
+        condition: {
             type: Object,
             required: true
         },
@@ -170,120 +221,157 @@ export default {
             type: Array,
             required: true,
             default: () => []
+        },
+        isDragging: {
+            type: Boolean,
+            default: false
+        },
+        moveIndex: {
+            type: Number,
+            default: 0
         }
     },
     data() {
         return {
-            domainObject: this.domainObject,
             currentCriteria: this.currentCriteria,
             expanded: true,
             trigger: 'all',
-            selectedOutputKey: '',
-            stringOutputField: false,
-            outputOptions: ['false', 'true', 'string']
+            selectedOutputSelection: '',
+            outputOptions: ['false', 'true', 'string'],
+            criterionIndex: 0,
+            draggingOver: false,
+            isDefault: this.condition.isDefault
         };
     },
     computed: {
-        initCap: function (string) {
-            return string.charAt(0).toUpperCase() + string.slice(1)
+        triggers() {
+            const keys = Object.keys(TRIGGER);
+            const triggerOptions = [];
+            keys.forEach((trigger) => {
+                triggerOptions.push({
+                    value: TRIGGER[trigger],
+                    label: `when ${TRIGGER_LABEL[TRIGGER[trigger]]}`
+                });
+            });
+            return triggerOptions;
+        },
+        canEvaluateCriteria: function () {
+            let criteria = this.condition.configuration.criteria;
+            if (criteria.length) {
+                let lastCriterion = criteria[criteria.length - 1];
+                if (lastCriterion.telemetry &&
+                    lastCriterion.operation &&
+                    (lastCriterion.input.length ||
+                        lastCriterion.operation === 'isDefined' ||
+                        lastCriterion.operation === 'isUndefined')) {
+                    return true;
+                }
+            }
+            return false;
         }
     },
     destroyed() {
         this.destroy();
     },
     mounted() {
-        this.openmct.objects.get(this.conditionIdentifier).then((domainObject => {
-            this.domainObject = domainObject;
-            this.initialize();
-        }));
-    },
-    updated() {
-        //validate telemetry exists, update criteria as needed
-        this.persist();
+        this.setOutputSelection();
     },
     methods: {
-        initialize() {
-            this.setOutput();
-            if (!this.domainObject.isDefault) {
-                this.conditionClass = new ConditionClass(this.domainObject, this.openmct);
-                this.conditionClass.on('conditionResultUpdated', this.handleConditionResult.bind(this));
+        setOutputSelection() {
+            let conditionOutput = this.condition.configuration.output;
+            if (conditionOutput) {
+                if (conditionOutput !== 'false' && conditionOutput !== 'true') {
+                    this.selectedOutputSelection = 'string';
+                } else {
+                    this.selectedOutputSelection = conditionOutput;
+                }
             }
         },
+        setOutputValue() {
+            if (this.selectedOutputSelection === 'string') {
+                this.condition.configuration.output = '';
+            } else {
+                this.condition.configuration.output = this.selectedOutputSelection;
+            }
+            this.persist();
+        },
         addCriteria() {
             const criteriaObject = {
+                id: uuid(),
                 telemetry: '',
                 operation: '',
                 input: '',
-                metadata: '',
-                key: {
-                    namespace: '',
-                    key: uuid()
-                }
-            }
-            this.domainObject.configuration.criteria.push(criteriaObject);
+                metadata: ''
+            };
+            this.condition.configuration.criteria.push(criteriaObject);
         },
         dragStart(e) {
-            this.$emit('set-move-index', Number(e.target.getAttribute('data-condition-index')));
+            e.dataTransfer.setData('dragging', e.target); // required for FF to initiate drag
+            e.dataTransfer.effectAllowed = "copyMove";
+            e.dataTransfer.setDragImage(e.target.closest('.c-condition-h'), 0, 0);
+            this.$emit('setMoveIndex', this.conditionIndex);
         },
-        destroy() {
-            // this.conditionClass.off('conditionResultUpdated', this.handleConditionResult.bind(this));
-            if (this.conditionClass && typeof this.conditionClass.destroy === 'function') {
-                this.conditionClass.destroy();
-                delete this.conditionClass;
+        dragEnd(event) {
+            this.dragStarted = false;
+            event.dataTransfer.clearData();
+            this.$emit('dragComplete');
+        },
+        dropCondition(event, targetIndex) {
+            if (!this.isDragging) { return }
+            if (targetIndex > this.moveIndex) { targetIndex-- } // for 'downward' move
+            if (this.isValidTarget(targetIndex)) {
+                this.dragElement = undefined;
+                this.draggingOver = false;
+                this.$emit('dropCondition', targetIndex);
             }
         },
-        handleConditionResult(args) {
-            this.$emit('conditionResultUpdated', {
-                id: this.conditionIdentifier,
-                result: args.data.result
-            })
+        dragEnter(event, targetIndex) {
+            if (!this.isDragging) { return }
+            if (targetIndex > this.moveIndex) { targetIndex-- } // for 'downward' move
+            if (this.isValidTarget(targetIndex)) {
+                this.dragElement = event.target.parentElement;
+                this.draggingOver = true;
+            }
+        },
+        dragLeave(event) {
+            if (event.target.parentElement === this.dragElement) {
+                this.draggingOver = false;
+                this.dragElement = undefined;
+            }
+        },
+        isValidTarget(targetIndex) {
+            return this.moveIndex !== targetIndex;
+        },
+        destroy() {
         },
         removeCondition(ev) {
-            this.$emit('removeCondition', this.conditionIdentifier);
+            this.$emit('removeCondition', this.conditionIndex);
         },
         cloneCondition(ev) {
             this.$emit('cloneCondition', {
-                identifier: this.conditionIdentifier,
-                index: Number(ev.target.closest('.widget-condition').getAttribute('data-condition-index'))
+                condition: this.condition,
+                index: this.conditionIndex
             });
         },
-        setOutput() {
-            let conditionOutput = this.domainObject.configuration.output;
-            if (conditionOutput) {
-                if (conditionOutput !== 'false' && conditionOutput !== 'true') {
-                    this.selectedOutputKey = 'string';
-                } else {
-                    this.selectedOutputKey = conditionOutput;
-                }
-            }
+        removeCriterion(index) {
+            this.condition.configuration.criteria.splice(index, 1);
+            this.persist();
+        },
+        cloneCriterion(index) {
+            const clonedCriterion = JSON.parse(JSON.stringify(this.condition.configuration.criteria[index]));
+            clonedCriterion.id = uuid();
+            this.condition.configuration.criteria.splice(index + 1, 0, clonedCriterion);
+            this.persist();
         },
         persist() {
-            this.openmct.objects.mutate(this.domainObject, 'configuration', this.domainObject.configuration);
+            this.$emit('updateCondition', {
+                condition: this.condition,
+                index: this.conditionIndex
+            });
         },
-        checkInputValue() {
-            if (this.selectedOutputOption === 'string') {
-                this.domainObject.configuration.output = '';
-            } else {
-                this.domainObject.configuration.output = this.selectedOutputOption;
-            }
-        },
-        updateOutputOption(ev) {
-            if (this.selectedOutputOption === 'string') {
-                this.domainObject.configuration.output = '';
-            } else {
-                this.domainObject.configuration.output = this.selectedOutputOption;
-            }
-        },
-        updateCurrentCondition() {
-            console.log('condition this.currentConditionIdentifier', this.currentConditionIdentifier);
-            this.$emit('updateCurrentCondition', this.currentConditionIdentifier);
-        },
-        hasTelemetry(identifier) {
-            // TODO: check parent domainObject.composition.hasTelemetry
-            return this.currentCriteria && identifier;
+        initCap(str) {
+            return str.charAt(0).toUpperCase() + str.slice(1)
         }
     }
 }
 </script>
-
-

src/plugins/condition/components/ConditionCollection.vue

@@ -22,67 +22,63 @@
 
 <template>
 <section id="conditionCollection"
-         class="c-cs__ui_section"
+         :class="{ 'is-expanded': expanded }"
 >
-    <div class="c-cs__ui__header">
-        <span class="c-cs__ui__header-label">Conditions</span>
+    <div class="c-cs__header c-section__header">
         <span
-            class="is-enabled flex-elem"
-            :class="['c-cs__disclosure-triangle', { 'c-cs__disclosure-triangle--expanded': expanded }]"
+            class="c-disclosure-triangle c-tree__item__view-control is-enabled"
+            :class="{ 'c-disclosure-triangle--expanded': expanded }"
             @click="expanded = !expanded"
         ></span>
+        <div class="c-cs__header-label c-section__label">Conditions</div>
     </div>
     <div v-if="expanded"
-         class="c-cs__ui_content"
+         class="c-cs__content"
     >
         <div v-show="isEditing"
-             class="help"
+             class="hint"
+             :class="{ 's-status-icon-warning-lo': !telemetryObjs.length }"
         >
-            <span>The first condition to match is the one that wins. Drag conditions to rearrange.</span>
+            <template v-if="!telemetryObjs.length">Drag telemetry into this Condition Set to configure Conditions and add criteria.</template>
+            <template v-else>The first condition to match is the one that is applied. Drag conditions to reorder.</template>
         </div>
-        <div class="holder add-condition-button-wrapper align-left">
-            <button
-                v-show="isEditing"
-                id="addCondition"
-                class="c-cs-button c-cs-button--major add-condition-button"
-                @click="addCondition"
-            >
-                <span class="c-cs-button__label">Add Condition</span>
-            </button>
-        </div>
-        <div class="c-c condition-collection">
-            <ul class="c-c__container-holder">
-                <li v-for="(conditionIdentifier, index) in conditionCollection"
-                    :key="conditionIdentifier.key"
-                >
-                    <div v-if="isEditing"
-                         class="c-c__drag-ghost"
-                         @drop.prevent="dropCondition"
-                         @dragenter="dragEnter"
-                         @dragleave="dragLeave"
-                         @dragover.prevent
-                    ></div>
-                    <Condition :condition-identifier="conditionIdentifier"
-                               :current-condition-identifier="currentConditionIdentifier"
-                               :condition-index="index"
-                               :telemetry="telemetryObjs"
-                               :is-editing="isEditing"
-                               @updateCurrentCondition="updateCurrentCondition"
-                               @removeCondition="removeCondition"
-                               @conditionResultUpdated="handleConditionResult"
-                               @setMoveIndex="setMoveIndex"
-                    />
-                </li>
-            </ul>
+
+        <button
+            v-show="isEditing"
+            id="addCondition"
+            class="c-button c-button--major icon-plus labeled"
+            @click="addCondition"
+        >
+            <span class="c-cs-button__label">Add Condition</span>
+        </button>
+
+        <div class="c-cs__conditions-h"
+             :class="{ 'is-active-dragging': isDragging }"
+        >
+            <Condition v-for="(condition, index) in conditionCollection"
+                       :key="condition.id"
+                       :condition="condition"
+                       :current-condition-id="currentConditionId"
+                       :condition-index="index"
+                       :telemetry="telemetryObjs"
+                       :is-editing="isEditing"
+                       :move-index="moveIndex"
+                       :is-dragging="isDragging"
+                       @updateCondition="updateCondition"
+                       @removeCondition="removeCondition"
+                       @cloneCondition="cloneCondition"
+                       @setMoveIndex="setMoveIndex"
+                       @dragComplete="dragComplete"
+                       @dropCondition="dropCondition"
+            />
         </div>
     </div>
 </section>
 </template>
 
 <script>
-import Condition from '../../condition/components/Condition.vue';
-import uuid from 'uuid';
-
+import Condition from './Condition.vue';
+import ConditionManager from '../ConditionManager';
 
 export default {
     inject: ['openmct', 'domainObject'],
@@ -90,45 +86,87 @@ export default {
         Condition
     },
     props: {
-        isEditing: Boolean
+        isEditing: Boolean,
+        testData: {
+            type: Object,
+            required: true,
+            default: () => {
+                return {
+                    applied: false,
+                    conditionTestInputs: []
+                }
+            }
+        }
     },
     data() {
         return {
             expanded: true,
-            parentKeyString: this.openmct.objects.makeKeyString(this.domainObject.identifier),
             conditionCollection: [],
             conditionResults: {},
             conditions: [],
-            currentConditionIdentifier: this.currentConditionIdentifier || {},
             telemetryObjs: [],
-            moveIndex: Number,
-            isDragging: false
+            moveIndex: undefined,
+            isDragging: false,
+            defaultOutput: undefined,
+            dragCounter: 0,
+            currentConditionId: ''
         };
     },
+    watch: {
+        defaultOutput(newOutput, oldOutput) {
+            this.$emit('updateDefaultOutput', newOutput);
+        },
+        testData: {
+            handler() {
+                this.updateTestData();
+            },
+            deep: true
+        }
+    },
     destroyed() {
         this.composition.off('add', this.addTelemetryObject);
+        this.composition.off('remove', this.removeTelemetryObject);
+        if(this.conditionManager) {
+            this.conditionManager.off('conditionSetResultUpdated', this.handleConditionSetResultUpdated);
+            this.conditionManager.destroy();
+        }
+        if (this.stopObservingForChanges) {
+            this.stopObservingForChanges();
+        }
     },
     mounted() {
-        this.instantiate = this.openmct.$injector.get('instantiate');
         this.composition = this.openmct.composition.get(this.domainObject);
         this.composition.on('add', this.addTelemetryObject);
         this.composition.on('remove', this.removeTelemetryObject);
         this.composition.load();
-        this.conditionCollection = this.domainObject.configuration ? this.domainObject.configuration.conditionCollection : [];
-        if (!this.conditionCollection.length) {
-            this.addCondition(null, true);
-        } else {
-            this.updateCurrentCondition(this.conditionCollection[0]);
-        }
+        this.conditionCollection = this.domainObject.configuration.conditionCollection;
+        this.observeForChanges();
+        this.conditionManager = new ConditionManager(this.domainObject, this.openmct);
+        this.conditionManager.on('conditionSetResultUpdated', this.handleConditionSetResultUpdated);
+        this.updateDefaultCondition();
     },
     methods: {
+        handleConditionSetResultUpdated(data) {
+            this.currentConditionId = data.conditionId;
+            this.$emit('conditionSetResultUpdated', data)
+        },
+        observeForChanges() {
+            this.stopObservingForChanges = this.openmct.objects.observe(this.domainObject, 'configuration.conditionCollection', (newConditionCollection) => {
+                //this forces children to re-render
+                this.conditionCollection = newConditionCollection.map(condition => condition);
+                this.updateDefaultCondition();
+            });
+        },
+        updateDefaultCondition() {
+            const defaultCondition = this.domainObject.configuration.conditionCollection
+                .find(conditionConfiguration => conditionConfiguration.isDefault);
+            this.defaultOutput = defaultCondition.configuration.output;
+        },
         setMoveIndex(index) {
             this.moveIndex = index;
             this.isDragging = true;
         },
-        dropCondition(e) {
-            let targetIndex = Array.from(document.querySelectorAll('.c-c__drag-ghost')).indexOf(e.target);
-            if (targetIndex > this.moveIndex) { targetIndex-- } // for 'downward' move
+        dropCondition(targetIndex) {
             const oldIndexArr = Object.keys(this.conditionCollection);
             const move = function (arr, old_index, new_index) {
                 while (old_index < 0) {
@@ -154,43 +192,16 @@ export default {
             }
 
             this.reorder(reorderPlan);
-
-            e.target.classList.remove("dragging");
+        },
+        dragComplete() {
             this.isDragging = false;
         },
-        dragEnter(e) {
-            if (!this.isDragging) { return }
-            let targetIndex = Array.from(document.querySelectorAll('.c-c__drag-ghost')).indexOf(e.target);
-            if (targetIndex > this.moveIndex) { targetIndex-- } // for 'downward' move
-            if (this.moveIndex === targetIndex) { return }
-            e.target.classList.add("dragging");
-        },
-        dragLeave(e) {
-            e.target.classList.remove("dragging");
-        },
-        handleConditionResult(args) {
-            let idAsString = this.openmct.objects.makeKeyString(args.id);
-            this.conditionResults[idAsString] = args.result;
-            this.updateCurrentConditionId();
-        },
-        updateCurrentConditionId() {
-            let currentConditionIdentifier = this.conditionCollection[this.conditionCollection.length-1];
-            for (let i = 0; i < this.conditionCollection.length - 1; i++) {
-                let conditionIdAsString = this.openmct.objects.makeKeyString(this.conditionCollection[i]);
-                if (this.conditionResults[conditionIdAsString]) {
-                    //first condition to be true wins
-                    currentConditionIdentifier = this.conditionCollection[i];
-                    break;
-                }
-            }
-            // console.log('conditioncollection before emit currentConditionIdentifier', currentConditionIdentifier)
-            this.$emit('currentConditionUpdated', currentConditionIdentifier);
-        },
         addTelemetryObject(domainObject) {
             this.telemetryObjs.push(domainObject);
+            this.$emit('telemetryUpdated', this.telemetryObjs);
         },
         removeTelemetryObject(identifier) {
-            let index = _.findIndex(this.telemetryObjs, (obj) => {
+            let index = this.telemetryObjs.findIndex(obj => {
                 let objId = this.openmct.objects.makeKeyString(obj.identifier);
                 let id = this.openmct.objects.makeKeyString(identifier);
                 return objId === id;
@@ -199,80 +210,23 @@ export default {
                 this.telemetryObjs.splice(index, 1);
             }
         },
-        removeTelemetry(telemetryDomainObjectIdentifier) {
-            let index = _.findIndex(this.telemetryObjs, (obj) => {
-                let objId = this.openmct.objects.makeKeyString(obj.identifier);
-                let id = this.openmct.objects.makeKeyString(telemetryDomainObjectIdentifier);
-                return objId === id;
-            });
-            if (index > -1) {
-                this.telemetryObjs.splice(index, 1);
-            }
+        addCondition() {
+            this.conditionManager.addCondition();
         },
-        addCondition(event, isDefault) {
-            let conditionDomainObject = this.createConditionDomainObject(!!isDefault);
-            //persist the condition domain object so that we can do an openmct.objects.get on it and only persist the identifier in the conditionCollection of conditionSet
-            this.conditionCollection.unshift(conditionDomainObject.identifier);
-            this.persist();
+        updateCondition(data) {
+            this.conditionManager.updateCondition(data.condition, data.index);
         },
-        updateCurrentCondition(identifier) {
-            this.currentConditionIdentifier = identifier;
-            // console.log('conditionCollection this.conditionIdentifier', this.currentConditionIdentifier);
-        },
-        createConditionDomainObject(isDefault) {
-            let conditionObj = {
-                isDefault: isDefault,
-                name: isDefault ? 'Default' : 'Unnamed Condition',
-                identifier: {
-                    namespace: this.domainObject.identifier.namespace,
-                    key: uuid()
-                },
-                configuration: {
-                    name: isDefault ? 'Default' : 'Unnamed Condition',
-                    output: 'false',
-                    trigger: 'any',
-                    criteria: isDefault ? [] : [{
-                        telemetry: '',
-                        operation: '',
-                        input: '',
-                        metadata: '',
-                        identifier: {
-                            namespace: '',
-                            key: this.telemetryObjs.length ? this.openmct.objects.makeKeyString(this.telemetryObjs[0].identifier) : null
-                        }
-                    }]
-                },
-                summary: 'summary description',
-                created: new Date()
-            };
-            let conditionDomainObjectKeyString = this.openmct.objects.makeKeyString(conditionObj.identifier);
-            let newDomainObject = this.instantiate(conditionObj, conditionDomainObjectKeyString);
-
-            return newDomainObject.useCapability('adapter');
-        },
-        updateCondition(updatedCondition) {
-            let index = _.findIndex(this.conditions, (condition) => condition.id === updatedCondition.id);
-            this.conditions[index] = updatedCondition;
-        },
-        removeCondition(identifier) {
-            let index = _.findIndex(this.conditionCollection, (condition) => {
-                let conditionId = this.openmct.objects.makeKeyString(condition);
-                let id = this.openmct.objects.makeKeyString(identifier);
-                return conditionId === id;
-            });
-            this.conditionCollection.splice(index, 1);
-            this.persist();
-            this.updateCurrentConditionIdentifier();
+        removeCondition(index) {
+            this.conditionManager.removeCondition(index);
         },
         reorder(reorderPlan) {
-            let oldConditions = this.conditionCollection.slice();
-            reorderPlan.forEach((reorderEvent) => {
-                this.$set(this.conditionCollection, reorderEvent.newIndex, oldConditions[reorderEvent.oldIndex]);
-            });
-            this.persist();
+            this.conditionManager.reorderConditions(reorderPlan);
         },
-        persist() {
-            this.openmct.objects.mutate(this.domainObject, 'configuration.conditionCollection', this.conditionCollection);
+        cloneCondition(data) {
+            this.conditionManager.cloneCondition(data.condition, data.index);
+        },
+        updateTestData() {
+            this.conditionManager.updateTestData(this.testData);
         }
     }
 }

src/plugins/condition/components/ConditionDescription.vue

@@ -0,0 +1,68 @@
+/*****************************************************************************
+* Open MCT, Copyright (c) 2014-2020, United States Government
+* as represented by the Administrator of the National Aeronautics and Space
+* Administration. All rights reserved.
+*
+* Open MCT is licensed under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+* http://www.apache.org/licenses/LICENSE-2.0.
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+* License for the specific language governing permissions and limitations
+* under the License.
+*
+* Open MCT includes source code licensed under additional open source
+* licenses. See the Open Source Licenses file (LICENSES.md) included with
+* this source code distribution or the Licensing information page available
+* at runtime from the About dialog for additional information.
+*****************************************************************************/
+
+<template>
+<div class="c-style__condition-desc">
+    <span v-if="showLabel && condition"
+          class="c-style__condition-desc__name c-condition__name"
+    >
+        {{ condition.configuration.name }}
+    </span>
+    <span class="c-style__condition-desc__text"
+          v-if="!condition.isDefault"
+    >
+        {{ description }}
+    </span>
+    <span class="c-style__condition-desc__text"
+          v-else
+    >
+        Match if no other condition is matched
+    </span>
+</div>
+</template>
+
+<script>
+
+export default {
+    name: 'ConditionDescription',
+    inject: [
+        'openmct'
+    ],
+    props: {
+        showLabel: {
+            type: Boolean,
+            default: false
+        },
+        condition: {
+            type: Object,
+            default() {
+                return undefined;
+            }
+        }
+    },
+    computed: {
+        description() {
+            return this.condition ? this.condition.summary : '';
+        }
+    }
+}
+</script>

src/plugins/condition/components/ConditionError.vue

@@ -0,0 +1,80 @@
+/*****************************************************************************
+* Open MCT, Copyright (c) 2014-2020, United States Government
+* as represented by the Administrator of the National Aeronautics and Space
+* Administration. All rights reserved.
+*
+* Open MCT is licensed under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+* http://www.apache.org/licenses/LICENSE-2.0.
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+* License for the specific language governing permissions and limitations
+* under the License.
+*
+* Open MCT includes source code licensed under additional open source
+* licenses. See the Open Source Licenses file (LICENSES.md) included with
+* this source code distribution or the Licensing information page available
+* at runtime from the About dialog for additional information.
+*****************************************************************************/
+
+<template>
+<div v-if="conditionErrors.length"
+     class="c-condition__errors"
+>
+    <div v-for="(error, index) in conditionErrors"
+         :key="index"
+         class="u-alert u-alert--block u-alert--with-icon"
+    >{{ error.message.errorText }} {{ error.additionalInfo }}
+    </div>
+</div>
+</template>
+
+<script>
+
+import { ERROR } from "@/plugins/condition/utils/constants";
+
+export default {
+    name: 'ConditionError',
+    inject: [
+        'openmct'
+    ],
+    props: {
+        condition: {
+            type: Object,
+            default() {
+                return undefined;
+            }
+        }
+    },
+    data() {
+        return {
+            conditionErrors: []
+        }
+    },
+    mounted() {
+        this.getConditionErrors();
+    },
+    methods: {
+        getConditionErrors() {
+            if (this.condition) {
+                this.condition.configuration.criteria.forEach((criterion, index) => {
+                    this.getCriterionErrors(criterion, index);
+                });
+            }
+        },
+        getCriterionErrors(criterion, index) {
+            //It is sufficient to check for absence of telemetry here since the condition manager ensures that telemetry for a criterion is set if it exists
+            const isInvalidTelemetry = !criterion.telemetry && (criterion.telemetry !== 'all' && criterion.telemetry !== 'any');
+            if (isInvalidTelemetry) {
+                this.conditionErrors.push({
+                    message: ERROR.TELEMETRY_NOT_FOUND,
+                    additionalInfo: ''
+                });
+            }
+        }
+    }
+}
+</script>

src/plugins/condition/components/ConditionSet.vue

@@ -21,26 +21,45 @@
  *****************************************************************************/
 
 <template>
-<div class="c-cs-edit w-condition-set">
-    <div class="c-sw-edit__ui holder">
-        <CurrentOutput :condition="currentCondition" />
-        <TestData :is-editing="isEditing" />
-        <ConditionCollection :is-editing="isEditing"
-                             @currentConditionUpdated="updateCurrentCondition"
+<div class="c-cs">
+    <section class="c-cs__current-output c-section">
+        <div class="c-cs__content c-cs__current-output-value">
+            <span class="c-cs__current-output-value__label">Current Output</span>
+            <span class="c-cs__current-output-value__value">
+                <template v-if="currentConditionOutput">
+                    {{ currentConditionOutput }}
+                </template>
+                <template v-else>
+                    {{ defaultConditionOutput }}
+                </template>
+            </span>
+        </div>
+    </section>
+    <div class="c-cs__test-data-and-conditions-w">
+        <TestData class="c-cs__test-data"
+                  :is-editing="isEditing"
+                  :test-data="testData"
+                  :telemetry="telemetryObjs"
+                  @updateTestData="updateTestData"
+        />
+        <ConditionCollection class="c-cs__conditions"
+                             :is-editing="isEditing"
+                             :test-data="testData"
+                             @conditionSetResultUpdated="updateCurrentOutput"
+                             @updateDefaultOutput="updateDefaultOutput"
+                             @telemetryUpdated="updateTelemetry"
         />
     </div>
 </div>
 </template>
 
 <script>
-import CurrentOutput from './CurrentOutput.vue';
 import TestData from './TestData.vue';
 import ConditionCollection from './ConditionCollection.vue';
 
 export default {
     inject: ["openmct", "domainObject"],
     components: {
-        CurrentOutput,
         TestData,
         ConditionCollection
     },
@@ -49,27 +68,31 @@ export default {
     },
     data() {
         return {
-            currentCondition: this.currentCondition
+            currentConditionOutput: '',
+            defaultConditionOutput: '',
+            telemetryObjs: [],
+            testData: {}
         }
     },
     mounted() {
-        let conditionCollection = this.domainObject.configuration.conditionCollection;
-        this.currentConditionIdentifier = conditionCollection.length ? this.updateCurrentCondition(conditionCollection[0]) : null;
-        // console.log('conditionCollection[0]', conditionCollection[0]);
+        this.conditionSetIdentifier = this.openmct.objects.makeKeyString(this.domainObject.identifier);
+        this.testData = {
+            applied: false,
+            conditionTestInputs: this.domainObject.configuration.conditionTestData || []
+        };
     },
     methods: {
-        setCurrentCondition() {
-            if (this.currentConditionIdentifier) {
-                this.openmct.objects.get(this.currentConditionIdentifier).then((obj) => {
-                    this.currentCondition = obj;
-                });
-            }
+        updateCurrentOutput(currentConditionResult) {
+            this.currentConditionOutput = currentConditionResult.output;
         },
-        updateCurrentCondition(conditionIdentifier) {
-            // console.log('conditionIdentifier', conditionIdentifier);
-
-            this.currentConditionIdentifier = conditionIdentifier;
-            this.setCurrentCondition();
+        updateDefaultOutput(output) {
+            this.currentConditionOutput = output;
+        },
+        updateTelemetry(telemetryObjs) {
+            this.telemetryObjs = telemetryObjs;
+        },
+        updateTestData(testData) {
+            this.testData = testData;
         }
     }
 };

src/plugins/condition/components/Criterion.vue

@@ -1,12 +1,38 @@
+/*****************************************************************************
+* Open MCT, Copyright (c) 2014-2020, United States Government
+* as represented by the Administrator of the National Aeronautics and Space
+* Administration. All rights reserved.
+*
+* Open MCT is licensed under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+* http://www.apache.org/licenses/LICENSE-2.0.
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+* License for the specific language governing permissions and limitations
+* under the License.
+*
+* Open MCT includes source code licensed under additional open source
+* licenses. See the Open Source Licenses file (LICENSES.md) included with
+* this source code distribution or the Licensing information page available
+* at runtime from the About dialog for additional information.
+*****************************************************************************/
+
 <template>
-<li class="has-local-controls t-condition">
-    <label>{{ setRowLabel }}</label>
-    <span class="t-configuration">
-        <span class="controls">
-            <select v-model="selectedTelemetryObject"
-                    @change="updateFieldOptions"
+<div class="u-contents">
+    <div class="c-cdef__separator c-row-separator"></div>
+    <span class="c-cdef__label">{{ setRowLabel }}</span>
+    <span class="c-cdef__controls">
+        <span class="c-cdef__control">
+            <select ref="telemetrySelect"
+                    v-model="criterion.telemetry"
+                    @change="updateMetadataOptions"
             >
                 <option value="">- Select Telemetry -</option>
+                <option value="all">all telemetry</option>
+                <option value="any">any telemetry</option>
                 <option v-for="telemetryOption in telemetry"
                         :key="telemetryOption.identifier.key"
                         :value="telemetryOption.identifier"
@@ -15,45 +41,74 @@
                 </option>
             </select>
         </span>
-        <span class="controls">
-            <select v-model="selectedFieldOption"
-                    @change="persist"
+        <span v-if="criterion.telemetry"
+              class="c-cdef__control"
+        >
+            <select ref="metadataSelect"
+                    v-model="criterion.metadata"
+                    @change="updateOperations"
             >
                 <option value="">- Select Field -</option>
-                <option v-for="option in telemetryMetadata"
+                <option v-for="option in telemetryMetadataOptions"
                         :key="option.key"
-                        :value="option"
+                        :value="option.key"
                 >
                     {{ option.name }}
                 </option>
             </select>
         </span>
-        <span class="controls">
-            <select v-model="selectedOperationOption"
-                    @change="updateOperationInput"
+        <span v-if="criterion.telemetry && criterion.metadata"
+              class="c-cdef__control"
+        >
+            <select v-model="criterion.operation"
+                    @change="updateInputVisibilityAndValues"
             >
                 <option value="">- Select Comparison -</option>
-                <option v-for="option in operations"
+                <option v-for="option in filteredOps"
                         :key="option.name"
                         :value="option.name"
                 >
                     {{ option.text }}
                 </option>
             </select>
-            <input v-if="isInputOperation"
-                   v-model="comparisonInputValue"
-                   class="t-condition-name-input"
-                   type="text"
-                   @change="persist"
-            >
+            <template v-if="!enumerations.length">
+                <span v-for="(item, inputIndex) in inputCount"
+                      :key="inputIndex"
+                      class="c-cdef__control__inputs"
+                >
+                    <input v-model="criterion.input[inputIndex]"
+                           class="c-cdef__control__input"
+                           :type="setInputType"
+                           @change="persist"
+                    >
+                    <span v-if="inputIndex < inputCount-1">and</span>
+                </span>
+            </template>
+            <span v-else>
+                <span v-if="inputCount && criterion.operation"
+                      class="c-cdef__control"
+                >
+                    <select v-model="criterion.input[0]"
+                            @change="persist"
+                    >
+                        <option v-for="option in enumerations"
+                                :key="option.string"
+                                :value="option.value.toString()"
+                        >
+                            {{ option.string }}
+                        </option>
+                    </select>
+                </span>
+            </span>
         </span>
     </span>
-</li>
-
+</div>
 </template>
 
 <script>
 import { OPERATIONS } from '../utils/operations';
+import { INPUT_TYPES } from '../utils/operations';
+import {TRIGGER_CONJUNCTION} from "../utils/constants";
 
 export default {
     inject: ['openmct'],
@@ -71,10 +126,6 @@ export default {
             type: Number,
             required: true
         },
-        condition: {
-            type: Object,
-            required: true
-        },
         trigger: {
             type: String,
             required: true
@@ -82,62 +133,161 @@ export default {
     },
     data() {
         return {
-            telemetryMetadata: {},
+            telemetryMetadataOptions: [],
             operations: OPERATIONS,
-            selectedTelemetryObject: '',
-            selectedFieldOption: {},
-            selectedOperationOption: '',
-            operationValue: '',
-            comparisonInputValue: '',
-            isInputOperation: false,
-            rowLabel: ''
+            inputCount: 0,
+            rowLabel: '',
+            operationFormat: '',
+            enumerations: [],
+            inputTypes: INPUT_TYPES
         }
     },
     computed: {
         setRowLabel: function () {
-            let operator = this.trigger === 'all' ? 'and ': 'or ';
-
-            return (this.index !== 0 ? operator : '') + 'when';
+            let operator = TRIGGER_CONJUNCTION[this.trigger];
+            return (this.index !== 0 ? operator : '') + ' when';
+        },
+        filteredOps: function () {
+            return this.operations.filter(op => op.appliesTo.indexOf(this.operationFormat) !== -1);
+        },
+        setInputType: function () {
+            let type = '';
+            for (let i = 0; i < this.filteredOps.length; i++) {
+                if (this.criterion.operation === this.filteredOps[i].name) {
+                    if (this.filteredOps[i].appliesTo.length) {
+                        type = this.inputTypes[this.filteredOps[i].appliesTo[0]];
+                    } else {
+                        type = 'text'
+                    }
+                    break;
+                }
+            }
+            return type;
+        }
+    },
+    watch: {
+        telemetry: {
+            handler(newTelemetry, oldTelemetry) {
+                this.checkTelemetry();
+            },
+            deep: true
         }
     },
     mounted() {
-        this.initialize();
-    },
-    updated() {
-        this.persist();
+        this.updateMetadataOptions();
     },
     methods: {
-        initialize() {
-            this.selectedTelemetryObject = this.criterion.telemetry;
-            this.selectedFieldOption = this.criterion.metadata;
-            this.selectedOperationOption = this.criterion.operation;
-            this.comparisonInputValue = this.criterion.input;
-            this.updateOperationInput();
-            this.updateFieldOptions();
-
-        },
-        updateFieldOptions() {
-            if (this.selectedTelemetryObject) {
-                this.openmct.objects.get(this.selectedTelemetryObject).then((telemetryObject) => {
-                    this.telemetryMetadata = this.openmct.telemetry.getMetadata(telemetryObject).values();
-                });
+        checkTelemetry() {
+            if(this.criterion.telemetry) {
+                const isAnyAllTelemetry = this.criterion.telemetry === 'any' || this.criterion.telemetry === 'all';
+                const telemetryForCriterionExists = this.telemetry.find((telemetryObj) => this.openmct.objects.areIdsEqual(this.criterion.telemetry, telemetryObj.identifier));
+                if (!isAnyAllTelemetry &&
+                    !telemetryForCriterionExists) {
+                    //telemetry being used was removed. So reset this criterion.
+                    this.criterion.telemetry = '';
+                    this.criterion.metadata = '';
+                    this.criterion.input = [];
+                    this.criterion.operation = '';
+                    this.persist();
+                } else {
+                    this.updateMetadataOptions();
+                }
             }
         },
-        updateOperationInput() {
-            if (this.selectedOperationOption &&
-                (this.selectedOperationOption !== 'isUndefined' &&
-                 this.selectedOperationOption !== 'isDefined')) {
-                this.isInputOperation = true;
+        updateOperationFormat() {
+            this.enumerations = [];
+            let foundMetadata = this.telemetryMetadataOptions.find((value) => {
+                return value.key === this.criterion.metadata;
+            });
+            if (foundMetadata) {
+                if (foundMetadata.enumerations !== undefined) {
+                    this.operationFormat = 'enum';
+                    this.enumerations = foundMetadata.enumerations;
+                } else if (foundMetadata.format === 'string' || foundMetadata.format === 'number') {
+                    this.operationFormat = foundMetadata.format;
+                } else if (foundMetadata.hints.hasOwnProperty('range')) {
+                    this.operationFormat = 'number';
+                } else if (foundMetadata.hints.hasOwnProperty('domain')) {
+                    this.operationFormat = 'number';
+                } else if (foundMetadata.key === 'name') {
+                    this.operationFormat = 'string';
+                } else {
+                    this.operationFormat = 'number';
+                }
+            }
+            this.updateInputVisibilityAndValues();
+        },
+        updateMetadataOptions(ev) {
+            if (ev) {
+                this.clearDependentFields(ev.target);
+                this.persist();
+            }
+            if (this.criterion.telemetry) {
+                let telemetryObjects = this.telemetry;
+                if (this.criterion.telemetry !== 'all' && this.criterion.telemetry !== 'any') {
+                    const found = this.telemetry.find(telemetryObj => (this.openmct.objects.areIdsEqual(telemetryObj.identifier, this.criterion.telemetry)));
+                    telemetryObjects = found ? [found] : [];
+                }
+                this.telemetryMetadataOptions = [];
+                telemetryObjects.forEach(telemetryObject => {
+                    let telemetryMetadata = this.openmct.telemetry.getMetadata(telemetryObject);
+                    this.addMetaDataOptions(telemetryMetadata.values());
+                });
+                this.updateOperations();
+            }
+        },
+        addMetaDataOptions(options) {
+            if (!this.telemetryMetadataOptions) {
+                this.telemetryMetadataOptions = options;
+            }
+            options.forEach((option) => {
+                const found = this.telemetryMetadataOptions.find((metadataOption) => {
+                    return (metadataOption.key && (metadataOption.key === option.key)) && (metadataOption.name && (metadataOption.name === option.name))
+                });
+                if (!found) {
+                    this.telemetryMetadataOptions.push(option);
+                }
+            });
+        },
+        updateOperations(ev) {
+            this.updateOperationFormat();
+            if (ev) {
+                this.clearDependentFields(ev.target);
+                this.persist();
+            }
+        },
+        updateInputVisibilityAndValues(ev) {
+            if (ev) {
+                this.clearDependentFields();
+                this.persist();
+            }
+
+            for (let i = 0; i < this.filteredOps.length; i++) {
+                if (this.criterion.operation === this.filteredOps[i].name) {
+                    this.inputCount = this.filteredOps[i].inputCount;
+                }
+            }
+            if (!this.inputCount) {
+                this.criterion.input = [];
+            }
+        },
+        clearDependentFields(el) {
+            if (el === this.$refs.telemetrySelect) {
+                this.criterion.metadata = '';
+            } else if (el === this.$refs.metadataSelect) {
+                if (!this.filteredOps.find(operation => operation.name === this.criterion.operation)) {
+                    this.criterion.operation = '';
+                    this.criterion.input = this.enumerations.length ? [this.enumerations[0].value.toString()] : [];
+                    this.inputCount = 0;
+                }
             } else {
-                this.isInputOperation = false;
-                this.comparisonInputValue = '';
+                if (this.enumerations.length && !this.criterion.input.length) {
+                    this.criterion.input = [this.enumerations[0].value.toString()];
+                }
+                this.inputCount = 0;
             }
         },
         persist() {
-            this.criterion.telemetry = this.selectedTelemetryObject;
-            this.criterion.metadata = this.selectedFieldOption;
-            this.criterion.operation = this.selectedOperationOption;
-            this.criterion.input = this.comparisonInputValue;
             this.$emit('persist', this.criterion);
         }
     }

src/plugins/condition/components/CurrentOutput.vue

@@ -1,70 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2020, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-<template>
-<section id="current-output">
-    <div v-if="condition"
-         class="c-cs__ui__header"
-    >
-        <span class="c-cs__ui__header-label">Current Output</span>
-        <span
-            class="is-enabled flex-elem"
-            :class="['c-cs__disclosure-triangle', { 'c-cs__disclosure-triangle--expanded': expanded }]"
-            @click="expanded = !expanded"
-        ></span>
-    </div>
-    <div v-if="expanded && condition"
-         class="c-cs__ui_content"
-    >
-        <div>
-            <span class="current-output">{{ condition.configuration.output }}</span>
-        </div>
-    </div>
-</section>
-</template>
-
-<script>
-export default {
-    inject: ['openmct', 'domainObject'],
-    props: {
-        isEditing: Boolean,
-        condition: {
-            default: () => {return null;},
-            type: Object
-        }
-    },
-    data() {
-        return {
-            expanded: true
-        }
-    },
-    mounted() {
-        // console.log('this.condition', this.condition);
-    },
-    updated() {
-
-    },
-    methods: {
-
-    }
-}
-</script>

src/plugins/condition/components/TestData.vue

@@ -23,54 +23,98 @@
 <template>
 <section v-show="isEditing"
          id="test-data"
-         class="test-data"
+         :class="{ 'is-expanded': expanded }"
 >
-    <div class="c-cs__ui__header">
-        <span class="c-cs__ui__header-label">Test Data</span>
+    <div class="c-cs__header c-section__header">
         <span
-            class="is-enabled flex-elem"
-            :class="['c-cs__disclosure-triangle', { 'c-cs__disclosure-triangle--expanded': expanded }]"
+            class="c-disclosure-triangle c-tree__item__view-control is-enabled"
+            :class="{ 'c-disclosure-triangle--expanded': expanded }"
             @click="expanded = !expanded"
         ></span>
+        <div class="c-cs__header-label c-section__label">Test Data</div>
     </div>
     <div v-if="expanded"
-         class="c-cs__ui_content"
+         class="c-cs__content"
     >
-        <label class="c-toggle-switch">
-            <input
-                type="checkbox"
-                :checked="isApplied"
-                @change="applyTestData"
-            >
-            <span class="c-toggle-switch__slider"></span>
-            <span>Apply Test Data</span>
-        </label>
-        <div class="t-test-data-config">
-            <div class="c-cs-editui__conditions widget-condition">
-                <form>
-                    <label>
-                        <span>Set</span>
-                        <select>
-                            <option>- Select Input -</option>
-                        </select>
-                    </label>
-                    <span class="is-enabled  flex-elem c-cs__duplicate"></span>
-                    <span class="is-enabled  flex-elem c-cs__trash"></span>
-                </form>
-            </div>
-            <div class="c-cs-editui__conditions widget-condition">
-                <form>
-                    <label>
-                        <span>Set</span>
-                        <select>
-                            <option>- Select Input -</option>
-                        </select>
-                    </label>
-                    <span class="is-enabled c-cs__duplicate"></span>
-                    <span class="is-enabled c-cs__trash"></span>
-                </form>
-            </div>
+        <div class="c-cs__test-data__controls c-cdef__controls"
+             :disabled="!telemetry.length"
+        >
+            <label class="c-toggle-switch">
+                <input
+                    type="checkbox"
+                    :checked="isApplied"
+                    @change="applyTestData"
+                >
+                <span class="c-toggle-switch__slider"></span>
+                <span class="c-toggle-switch__label">Apply Test Data</span>
+            </label>
         </div>
+        <div class="c-cs-tests">
+            <span v-for="(testInput, tIndex) in testInputs"
+                  :key="tIndex"
+                  class="c-test-datum c-cs-test"
+            >
+                <span class="c-cs-test__label">Set</span>
+                <span class="c-cs-test__controls">
+                    <span class="c-cdef__control">
+                        <select v-model="testInput.telemetry"
+                                @change="updateMetadata(testInput)"
+                        >
+                            <option value="">- Select Telemetry -</option>
+                            <option v-for="(telemetryOption, index) in telemetry"
+                                    :key="index"
+                                    :value="telemetryOption.identifier"
+                            >
+                                {{ telemetryOption.name }}
+                            </option>
+                        </select>
+                    </span>
+                    <span v-if="testInput.telemetry"
+                          class="c-cdef__control"
+                    >
+                        <select v-model="testInput.metadata"
+                                @change="updateTestData"
+                        >
+                            <option value="">- Select Field -</option>
+                            <option v-for="(option, index) in telemetryMetadataOptions[getId(testInput.telemetry)]"
+                                    :key="index"
+                                    :value="option.key"
+                            >
+                                {{ option.name }}
+                            </option>
+                        </select>
+                    </span>
+                    <span v-if="testInput.metadata"
+                          class="c-cdef__control__inputs"
+                    >
+                        <input v-model="testInput.value"
+                               placeholder="Enter test input"
+                               type="text"
+                               class="c-cdef__control__input"
+                               @change="updateTestData"
+                        >
+                    </span>
+                </span>
+                <div class="c-cs-test__buttons">
+                    <button class="c-click-icon c-test-data__duplicate-button icon-duplicate"
+                            title="Duplicate this test datum"
+                            @click="addTestInput(testInput)"
+                    ></button>
+                    <button class="c-click-icon c-test-data__delete-button icon-trash"
+                            title="Delete this test datum"
+                            @click="removeTestInput(tIndex)"
+                    ></button>
+                </div>
+            </span>
+        </div>
+        <button
+            v-show="isEditing"
+            id="addTestDatum"
+            class="c-button c-button--major icon-plus labeled"
+            @click="addTestInput"
+        >
+            <span class="c-cs-button__label">Add Test Datum</span>
+        </button>
     </div>
 </section>
 </template>
@@ -79,17 +123,113 @@
 export default {
     inject: ['openmct'],
     props: {
-        isEditing: Boolean
+        isEditing: Boolean,
+        telemetry: {
+            type: Array,
+            required: true,
+            default: () => []
+        },
+        testData: {
+            type: Object,
+            required: true,
+            default: () => {
+                return {
+                    applied: false,
+                    conditionTestInputs: []
+                }
+            }
+        }
     },
     data() {
         return {
             expanded: true,
-            isApplied: true
+            isApplied: false,
+            testInputs: [],
+            telemetryMetadataOptions: {}
         };
     },
+    watch: {
+        isEditing(editing) {
+            if (!editing) {
+                this.resetApplied();
+            }
+        },
+        telemetry: {
+            handler() {
+                this.initializeMetadata();
+            },
+            deep: true
+        },
+        testData: {
+            handler() {
+                this.initialize();
+            },
+            deep: true
+        }
+    },
+    beforeDestroy() {
+        this.resetApplied();
+    },
+    mounted() {
+        this.initialize();
+        this.initializeMetadata();
+    },
     methods: {
-        applyTestData(ev) {
-            this.$emit('change', ev.target.checked);
+        applyTestData() {
+            this.isApplied = !this.isApplied;
+            this.updateTestData();
+        },
+        initialize() {
+            if (this.testData && this.testData.conditionTestInputs) {
+                this.testInputs = this.testData.conditionTestInputs;
+            }
+            if (!this.testInputs.length) {
+                this.addTestInput();
+            }
+        },
+        initializeMetadata() {
+            this.telemetry.forEach((telemetryObject) => {
+                const id = this.openmct.objects.makeKeyString(telemetryObject.identifier);
+                let telemetryMetadata = this.openmct.telemetry.getMetadata(telemetryObject);
+                this.telemetryMetadataOptions[id] = telemetryMetadata.values().slice();
+            });
+        },
+        addTestInput(testInput) {
+            this.testInputs.push(Object.assign({
+                telemetry: '',
+                metadata: '',
+                input: ''
+            }, testInput));
+        },
+        removeTestInput(index) {
+            this.testInputs.splice(index, 1);
+            this.updateTestData();
+        },
+        getId(identifier) {
+            if (identifier) {
+                return this.openmct.objects.makeKeyString(identifier);
+            }
+            return [];
+        },
+        updateMetadata(testInput) {
+            if (testInput.telemetry) {
+                const id = this.openmct.objects.makeKeyString(testInput.telemetry);
+                if(this.telemetryMetadataOptions[id]) {
+                    return;
+                }
+                let telemetryMetadata = this.openmct.telemetry.getMetadata(testInput);
+                this.telemetryMetadataOptions[id] = telemetryMetadata.values().slice();
+            }
+        },
+        resetApplied() {
+            this.isApplied = false;
+            this.updateTestData();
+        },
+        updateTestData() {
+            this.$emit('updateTestData', {
+                applied: this.isApplied,
+                conditionTestInputs: this.testInputs
+            });
         }
     }
 }

src/plugins/condition/components/condition-set.scss

@@ -1,147 +0,0 @@
-.c-cs-edit {
-    padding: 0;
-}
-
-section {
-    padding-bottom: 5px;
-}
-
-.c-cs__ui__header {
-    background-color: #D0D1D3;
-    padding: 0.4em 0.6em;
-    text-transform: uppercase;
-    font-size: 0.8em;
-    font-weight: bold;
-    color: #7C7D80;
-    display: flex;
-    justify-content: stretch;
-    align-items: center;
-}
-
-.c-cs__ui__header-label {
-    display: inline-block;
-    width: 100%;
-}
-
-.c-cs__ui_content {
-    padding: 0.4em;
-}
-
-.c-cs-ui__label {
-    color: #333;
-}
-
-.c-cs__ui_content .help {
-    font-style: italic;
-    padding: 0.4em 0;
-}
-
-.current-output {
-    text-transform: uppercase;
-    font-weight: bold;
-    margin: 0.4em 0.6em;
-}
-
-.condition-output {
-    color: #999;
-}
-
-.condition-description {
-    color: #333;
-}
-
-.checkbox.custom {
-    display: flex;
-    align-items: center;
-    margin-left: 0.6em;
-}
-.checkbox.custom span {
-    display: inline-block;
-    margin-left: 0.6em;
-}
-
-.t-test-data-config {
-    margin-top: 5px;
-}
-
-.widget-condition form {
-    padding: 0.5em;
-    display: flex;
-    align-items: center;
-    justify-content: stretch;
-}
-
-.widget-condition form label {
-    flex-grow: 1;
-    margin-left: 0;
-}
-
-.widget-condition form input {
-    min-height: 24px;
-}
-
-.c-cs-button[class*="--major"],
-.c-cs-button[class*='is-active'],
-.c-cs-button--menu[class*="--major"],
-.c-cs-button--menu[class*='is-active'] {
-    border: solid 1px #0B427C;
-    background-color: #4778A3;
-    padding: 0.2em 0.6em;
-    margin: 0.4em;
-    font-weight: bold;
-    color: #eee;
-    border-radius: 6px;
-}
-
-.c-cs__disclosure-triangle,
-.c-cs__menu-hamburger,
-.c-cs__duplicate,
-.c-cs__trash {
-    $d: 8px;
-    color: $colorDisclosureCtrl;
-    width: $d;
-    visibility: hidden;
-
-    &.is-enabled {
-        cursor: pointer;
-        visibility: visible;
-
-        &:hover {
-            color: $colorDisclosureCtrlHov;
-        }
-
-        &:before {
-            $s: .5;
-            display: block;
-            font-family: symbolsfont;
-            font-size: 1rem * $s;
-        }
-    }
-}
-
-.c-cs__disclosure-triangle {
-    &:before {
-        content: $glyph-icon-arrow-right;
-    }
-
-    &--expanded {
-        &:before {
-            transform: rotate(90deg);
-        }
-    }
-}
-
-.c-cs__duplicate {
-    margin-right: 0.3em;
-    &:before {
-        content: $glyph-icon-duplicate;
-    }
-}
-
-.c-cs__trash {
-    &:before {
-        content: $glyph-icon-trash;
-    }
-}
-
-

src/plugins/condition/components/condition.scss

@@ -1,199 +0,0 @@
-.widget-condition {
-    background-color: #eee;
-    margin: 0 0 0.33em;
-    border-radius: 3px;
-
-    &--current {
-        background-color: #DEECFA;
-    }
-
-}
-
-.c-c-editui__conditions.widget-condition {
-    margin: 0;
-}
-
-.c-c-button-wrapper {
-    border-top: solid 1px #ccc;
-    padding: 2px;
-}
-
-.c-c-label-spacer {
-    display: inline-block;
-    width: 90px;
-}
-
-.c-c-button[class*="--minor"],
-.c-c-button[class*='is-active'],
-.c-c-button--menu[class*="--minor"],
-.c-c-button--menu[class*='is-active'] {
-    border: solid 1px #666;
-    background-color: #fff;
-    padding: 0.1em 0.4em;
-    margin: 0.4em;
-    font-weight: normal;
-    color: #666;
-    border-radius: 6px;
-}
-
-
-
-.title-bar {
-    display: flex;
-    align-items: center;
-    justify-content: stretch;
-    padding: 0.4em 0;
-}
-
-.title-bar span {
-    margin-right: 0.6em;
-}
-
-.title-bar span.c-c__duplicate,
-.title-bar span.c-c__trash{
-    margin-right: 0;
-    margin-left: 0.3em;
-}
-
-.widget-condition > div {
-    margin: 0 0.4em;
-}
-
-.condition-name {
-    font-weight: bold;
-}
-
-.condition-summary .condition-description {
-    color: #999;
-}
-
-.condition-summary {
-    flex-grow: 1;
-}
-
-.condition-config {
-    padding: 0.3em 0;
-}
-
-.widget-condition form label {
-    flex-grow: 1;
-    margin-left: 0;
-}
-
-.l-widget-condition {
-    padding: 0;
-}
-
-.l-compact-form ul li {
-    padding: 0;
-}
-
-.widget-condition-content.expanded {
-    margin: 0 3px;
-}
-
-.widget-condition-content.expanded ul li {
-    border-top: solid 1px #ccc;
-    padding: 2px;
-}
-
-.l-compact-form ul li .controls {
-    display: inline-flex;
-    flex-grow: inherit;
-    padding: 2px 0;
-}
-
-.l-compact-form ul li > label {
-    display: block;
-    width: 90px;
-    min-width: 90px;
-    text-align: right;
-    line-height: 20px;
-}
-
-.l-compact-form ul li .controls input[type="text"],
-.l-compact-form ul li .controls input[type="search"],
-.l-compact-form ul li .controls input[type="number"],
-.l-compact-form ul li .controls button,
-.l-compact-form ul li .controls select {
-    min-height: 20px;
-}
-
-.condition-config-edit {
-    padding: 3px 0;
-}
-
-
-.c-c__disclosure-triangle,
-.c-c__menu-hamburger,
-.c-c__duplicate,
-.c-c__trash {
-    $d: 8px;
-    color: $colorDisclosureCtrl;
-    width: $d;
-    visibility: hidden;
-
-    &.is-enabled {
-        cursor: pointer;
-        visibility: visible;
-
-        &:hover {
-            color: $colorDisclosureCtrlHov;
-        }
-
-        &:before {
-            $s: .5;
-            display: block;
-            font-family: symbolsfont;
-            font-size: 1rem * $s;
-        }
-    }
-}
-
-.c-c__disclosure-triangle {
-    &:before {
-        content: $glyph-icon-arrow-right;
-    }
-
-    &--expanded {
-        &:before {
-            transform: rotate(90deg);
-        }
-    }
-}
-
-
-.c-c__menu-hamburger {
-    &:active {
-        cursor: grabbing;
-        cursor: -moz-grabbing;
-        cursor: -webkit-grabbing;
-    }
-
-    &:before {
-        content: $glyph-icon-menu-hamburger;
-    }
-}
-
-.c-c__duplicate {
-    &:before {
-        content: $glyph-icon-duplicate;
-    }
-}
-
-.c-c__trash {
-    &:before {
-        content: $glyph-icon-trash;
-    }
-}
-
-.c-c__drag-ghost {
-    width: 100%;
-    min-height: 0.33em;
-    &.dragging {
-        min-height: 2em;
-        border: solid 1px blue;
-        background-color: lightblue;
-        border-radius: 2px;
-    }
-}

src/plugins/condition/components/conditionals.scss

@@ -0,0 +1,318 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2020, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+/***************************** DRAGGING */
+.is-active-dragging {
+    .c-condition-h__drop-target {
+        height: 3px;
+        margin-bottom: $interiorMarginSm;
+    }
+}
+
+.c-condition-h {
+    &__drop-target {
+        border-radius: $controlCr;
+        height: 0;
+        min-height: 0;
+        transition: background-color, height;
+        transition-duration: 150ms;
+    }
+
+    &.is-drag-target {
+        .c-condition > * {
+            pointer-events: none; // Keeps the JS drop handler from being intercepted by internal elements
+        }
+
+        .c-condition-h__drop-target {
+            background-color: rgba($colorKey, 0.7);
+        }
+    }
+}
+
+.c-cs {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    overflow: hidden;
+
+    /************************** CONDITION SET LAYOUT */
+    &__current-output {
+        flex: 0 0 auto;
+    }
+
+    &__test-data-and-conditions-w {
+        display: flex;
+        flex-direction: column;
+        flex: 1 1 auto;
+        height: 100%;
+        overflow: hidden;
+    }
+
+    &__test-data,
+    &__conditions {
+        flex: 0 0 auto;
+        overflow: hidden;
+    }
+
+    &__test-data {
+        flex: 0 0 auto;
+        max-height: 50%;
+
+        &.is-expanded {
+            margin-bottom: $interiorMargin * 4;
+        }
+    }
+
+    &__conditions {
+        flex: 1 1 auto;
+
+        > * + * {
+            margin-top: $interiorMarginSm;
+        }
+    }
+
+    &__content {
+        display: flex;
+        flex-direction: column;
+        flex: 0 1 auto;
+        overflow: hidden;
+
+        > * {
+            flex: 0 0 auto;
+            overflow: hidden;
+            + * {
+                margin-top: $interiorMarginSm;
+            }
+        }
+
+        .c-button {
+            align-self: start;
+        }
+    }
+
+    .is-editing & {
+        // Add some space to kick away from blue editing border indication
+        padding: $interiorMargin;
+    }
+
+    section {
+        display: flex;
+        flex-direction: column;
+        overflow: hidden;
+    }
+
+    &__conditions-h {
+        display: flex;
+        flex-direction: column;
+        flex: 1 1 auto;
+        overflow: auto;
+        padding-right: $interiorMarginSm;
+
+        > * + * {
+            margin-top: $interiorMarginSm;
+        }
+    }
+
+    .hint {
+        padding: $interiorMarginSm;
+    }
+
+    /************************** SPECIFIC ITEMS */
+    &__current-output-value {
+        flex-direction: row;
+        align-items: baseline;
+        padding: 0 $interiorMargin $interiorMarginLg $interiorMargin;
+
+        > * {
+            padding: $interiorMargin 0; // Must do this to align label and value
+        }
+
+        &__label {
+            color: $colorInspectorSectionHeaderFg;
+            opacity: 0.9;
+            text-transform: uppercase;
+        }
+
+        &__value {
+            $p: $interiorMargin * 3;
+            font-size: 1.25em;
+            margin-left: $interiorMargin;
+            padding-left: $p;
+            padding-right: $p;
+            background: rgba(black, 0.2);
+            border-radius: 5px;
+        }
+    }
+}
+
+/***************************** CONDITIONS AND TEST DATUM ELEMENTS */
+.c-condition,
+.c-test-datum {
+    @include discreteItem();
+    display: flex;
+    padding: $interiorMargin;
+    line-height: 170%; // Aligns text with controls like selects
+}
+
+.c-cdef,
+.c-cs-test {
+    &__controls {
+        display: flex;
+        flex: 1 1 auto;
+        flex-wrap: wrap;
+
+        > * > * {
+            margin-right: $interiorMarginSm;
+        }
+    }
+
+    &__buttons {
+        white-space: nowrap;
+    }
+}
+
+.c-condition {
+    border: 1px solid transparent;
+    flex-direction: column;
+    min-width: 400px;
+
+    > * + * {
+        margin-top: $interiorMarginSm;
+    }
+    &--browse {
+        .c-condition__summary {
+            border-top: 1px solid $colorInteriorBorder;
+            padding-top: $interiorMargin;
+        }
+    }
+
+    /***************************** HEADER */
+    &__header {
+        $h: 22px;
+        display: flex;
+        align-items: start;
+        align-content: stretch;
+        overflow: hidden;
+        min-height: $h;
+        line-height: $h;
+
+        > * {
+            flex: 0 0 auto;
+            + * {
+                margin-left: $interiorMarginSm;
+            }
+        }
+    }
+
+    &__drag-grippy {
+        transform: translateY(50%);
+    }
+
+    &__name {
+        font-weight: bold;
+        align-self: baseline; // Fixes bold line-height offset problem
+    }
+
+    &__output,
+    &__summary {
+        flex: 1 1 auto;
+    }
+
+    &.is-current {
+        $c: $colorBodyFg;
+        border-color: rgba($c, 0.2);
+        background: rgba($c, 0.2);
+    }
+}
+
+/***************************** CONDITION DEFINITION, EDITING */
+.c-cdef {
+    display: grid;
+    grid-row-gap: $interiorMarginSm;
+    grid-column-gap: $interiorMargin;
+    grid-auto-columns: min-content 1fr max-content;
+    align-items: start;
+    min-width: 150px;
+    margin-left: 29px;
+    overflow: hidden;
+
+    &__criteria,
+    &__match-and-criteria {
+        display: contents;
+    }
+
+    &__label {
+        grid-column: 1;
+        text-align: right;
+        white-space: nowrap;
+    }
+
+    &__separator {
+        grid-column: 1 / span 3;
+    }
+
+    &__controls {
+        align-items: flex-start;
+        grid-column: 2;
+
+        > * > * {
+            margin-right: $interiorMarginSm;
+        }
+    }
+
+    &__buttons {
+        grid-column: 3;
+    }
+}
+
+.c-c__drag-ghost {
+    width: 100%;
+    min-height: $interiorMarginSm;
+
+    &.dragging {
+        min-height: 5em;
+        background-color: lightblue;
+        border-radius: 2px;
+    }
+}
+
+/***************************** TEST DATA */
+.c-cs__test-data {
+    &__controls {
+        flex: 0 0 auto;
+    }
+}
+
+.c-cs-tests {
+    flex: 0 1 auto;
+    overflow: auto;
+    padding-right: $interiorMarginSm;
+
+    > * + * {
+        margin-top: $interiorMarginSm;
+    }
+}
+
+.c-cs-test {
+    > * + * {
+        margin-left: $interiorMargin;
+    }
+}

src/plugins/condition/components/inspector/ConditionSetDialogTreeItem.vue

@@ -0,0 +1,185 @@
+/*****************************************************************************
+* Open MCT, Copyright (c) 2014-2020, United States Government
+* as represented by the Administrator of the National Aeronautics and Space
+* Administration. All rights reserved.
+*
+* Open MCT is licensed under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+* http://www.apache.org/licenses/LICENSE-2.0.
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+* License for the specific language governing permissions and limitations
+* under the License.
+*
+* Open MCT includes source code licensed under additional open source
+* licenses. See the Open Source Licenses file (LICENSES.md) included with
+* this source code distribution or the Licensing information page available
+* at runtime from the About dialog for additional information.
+*****************************************************************************/
+
+<template>
+<li class="c-tree__item-h">
+    <div
+        class="c-tree__item"
+        :class="{ 'is-alias': isAlias, 'is-navigated-object': navigated }"
+        @click="handleItemSelected(node.object, node)"
+    >
+        <view-control
+            v-model="expanded"
+            class="c-tree__item__view-control"
+            :enabled="hasChildren"
+            :propagate="false"
+        />
+        <div class="c-tree__item__label c-object-label">
+            <div
+                class="c-tree__item__type-icon c-object-label__type-icon"
+                :class="typeClass"
+            ></div>
+            <div class="c-tree__item__name c-object-label__name">{{ node.object.name }}</div>
+        </div>
+    </div>
+    <ul
+        v-if="expanded"
+        class="c-tree"
+    >
+        <li
+            v-if="isLoading && !loaded"
+            class="c-tree__item-h"
+        >
+            <div class="c-tree__item loading">
+                <span class="c-tree__item__label">Loading...</span>
+            </div>
+        </li>
+        <condition-set-dialog-tree-item
+            v-for="child in children"
+            :key="child.id"
+            :node="child"
+            :selected-item="selectedItem"
+            :handle-item-selected="handleItemSelected"
+        />
+    </ul>
+</li>
+</template>
+
+<script>
+import viewControl from '@/ui/components/viewControl.vue';
+
+export default {
+    name: 'ConditionSetDialogTreeItem',
+    inject: ['openmct'],
+    components: {
+        viewControl
+    },
+    props: {
+        node: {
+            type: Object,
+            required: true
+        },
+        selectedItem: {
+            type: Object,
+            default() {
+                return undefined;
+            }
+        },
+        handleItemSelected: {
+            type: Function,
+            default() {
+                return (item) => {};
+            }
+        }
+    },
+    data() {
+        return {
+            hasChildren: false,
+            isLoading: false,
+            loaded: false,
+            children: [],
+            expanded: false
+        }
+    },
+    computed: {
+        navigated() {
+            const itemId = this.selectedItem && this.selectedItem.itemId;
+            const isSelectedObject = itemId && this.openmct.objects.areIdsEqual(this.node.object.identifier, itemId);
+            if (isSelectedObject && this.node.objectPath && this.node.objectPath.length > 1) {
+                const isParent = this.openmct.objects.areIdsEqual(this.node.objectPath[1].identifier, this.selectedItem.parentId);
+                return isSelectedObject && isParent;
+            }
+            return isSelectedObject;
+        },
+        isAlias() {
+            let parent = this.node.objectPath[1];
+            if (!parent) {
+                return false;
+            }
+            let parentKeyString = this.openmct.objects.makeKeyString(parent.identifier);
+            return parentKeyString !== this.node.object.location;
+        },
+        typeClass() {
+            let type = this.openmct.types.get(this.node.object.type);
+            if (!type) {
+                return 'icon-object-unknown';
+            }
+            return type.definition.cssClass;
+        }
+    },
+    watch: {
+        expanded() {
+            if (!this.hasChildren) {
+                return;
+            }
+            if (!this.loaded && !this.isLoading) {
+                this.composition = this.openmct.composition.get(this.domainObject);
+                this.composition.on('add', this.addChild);
+                this.composition.on('remove', this.removeChild);
+                this.composition.load().then(this.finishLoading);
+                this.isLoading = true;
+            }
+        }
+    },
+    mounted() {
+        this.domainObject = this.node.object;
+        let removeListener = this.openmct.objects.observe(this.domainObject, '*', (newObject) => {
+            this.domainObject = newObject;
+        });
+
+        this.$once('hook:destroyed', removeListener);
+        if (this.openmct.composition.get(this.node.object)) {
+            this.hasChildren = true;
+        }
+
+    },
+    beforeDestroy() {
+        this.expanded = false;
+    },
+    destroyed() {
+        if (this.composition) {
+            this.composition.off('add', this.addChild);
+            this.composition.off('remove', this.removeChild);
+            delete this.composition;
+        }
+    },
+    methods: {
+        addChild(child) {
+            this.children.push({
+                id: this.openmct.objects.makeKeyString(child.identifier),
+                object: child,
+                objectPath: [child].concat(this.node.objectPath),
+                navigateToParent: this.navigateToPath
+            });
+        },
+        removeChild(identifier) {
+            let removeId = this.openmct.objects.makeKeyString(identifier);
+            this.children = this.children
+                .filter(c => c.id !== removeId);
+        },
+        finishLoading() {
+            this.isLoading = false;
+            this.loaded = true;
+        }
+    }
+}
+</script>