WIP implementation of multiple-composition

index.html

@@ -82,7 +82,6 @@
         openmct.install(openmct.plugins.Filters(['table', 'telemetry.plot.overlay']));
         openmct.install(openmct.plugins.ObjectMigration());
         openmct.install(openmct.plugins.ClearData(['table', 'telemetry.plot.overlay', 'telemetry.plot.stacked']));
-        openmct.install(openmct.plugins.WindowLayout());
         openmct.start();
     </script>
 </html>

package.json

@@ -53,9 +53,9 @@
     "marked": "^0.3.5",
     "mini-css-extract-plugin": "^0.4.1",
     "minimist": "^1.1.1",
-    "moment": "2.25.3",
+    "moment": "2.24.0",
     "moment-duration-format": "^2.2.2",
-    "moment-timezone": "0.5.28",
+    "moment-timezone": "^0.5.21",
     "node-bourbon": "^4.2.3",
     "node-sass": "^4.9.2",
     "painterro": "^0.2.65",

src/api/contextMenu/ContextMenu.vue

@@ -6,7 +6,7 @@
             :key="action.name"
             :class="action.cssClass"
             :title="action.description"
-            @click="action.invoke(objectPath)"
+            @click="action.invoke(objectPath, context)"
         >
             {{ action.name }}
         </li>
@@ -19,6 +19,6 @@
 
 <script>
 export default {
-    inject: ['actions', 'objectPath']
+    inject: ['actions', 'objectPath', 'context']
 }
 </script>

src/api/contextMenu/ContextMenuAPI.js

@@ -75,7 +75,7 @@ class ContextMenuAPI {
     /**
      * @private
      */
-    _showContextMenuForObjectPath(objectPath, x, y, actionsToBeIncluded) {
+    _showContextMenuForObjectPath(objectPath, x, y, actionsToBeIncluded, context) {
 
         let applicableActions = this._allActions.filter((action) => {
 
@@ -96,7 +96,7 @@ class ContextMenuAPI {
             this._hideActiveContextMenu();
         }
 
-        this._activeContextMenu = this._createContextMenuForObject(objectPath, applicableActions);
+        this._activeContextMenu = this._createContextMenuForObject(objectPath, applicableActions, context);
         this._activeContextMenu.$mount();
         document.body.appendChild(this._activeContextMenu.$el);
 
@@ -141,14 +141,15 @@ class ContextMenuAPI {
     /**
      * @private
      */
-    _createContextMenuForObject(objectPath, actions) {
+    _createContextMenuForObject(objectPath, actions, context) {
         return new Vue({
             components: {
                 ContextMenu: ContextMenuComponent
             },
             provide: {
                 actions: actions,
-                objectPath: objectPath
+                objectPath: objectPath,
+                context
             },
             template: '<ContextMenu></ContextMenu>'
         });

src/plugins/condition/StyleRuleManager.js

@@ -157,6 +157,7 @@ export default class StyleRuleManager extends EventEmitter {
         delete this.stopProvidingTelemetry;
         this.conditionSetIdentifier = undefined;
         this.isEditing = undefined;
+        this.callback = undefined;
     }
 
 }

src/plugins/condition/components/Condition.vue

@@ -30,7 +30,6 @@
 >
     <div class="c-condition-h__drop-target"></div>
     <div v-if="isEditing"
-         :class="{'is-current': condition.id === currentConditionId}"
          class="c-condition c-condition--edit"
     >
         <!-- Edit view -->
@@ -168,7 +167,6 @@
     </div>
     <div v-else
          class="c-condition c-condition--browse"
-         :class="{'is-current': condition.id === currentConditionId}"
     >
         <!-- Browse view -->
         <div class="c-condition__header">
@@ -201,10 +199,6 @@ export default {
         ConditionDescription
     },
     props: {
-        currentConditionId: {
-            type: String,
-            default: ''
-        },
         condition: {
             type: Object,
             required: true

src/plugins/condition/components/ConditionCollection.vue

@@ -58,7 +58,6 @@
             <Condition v-for="(condition, index) in conditionCollection"
                        :key="condition.id"
                        :condition="condition"
-                       :current-condition-id="currentConditionId"
                        :condition-index="index"
                        :telemetry="telemetryObjs"
                        :is-editing="isEditing"
@@ -108,8 +107,7 @@ export default {
             moveIndex: undefined,
             isDragging: false,
             defaultOutput: undefined,
-            dragCounter: 0,
-            currentConditionId: ''
+            dragCounter: 0
         };
     },
     watch: {
@@ -147,7 +145,6 @@ export default {
     },
     methods: {
         handleConditionSetResultUpdated(data) {
-            this.currentConditionId = data.conditionId;
             this.$emit('conditionSetResultUpdated', data)
         },
         observeForChanges() {

src/plugins/condition/components/conditionals.scss

@@ -190,7 +190,6 @@
 }
 
 .c-condition {
-    border: 1px solid transparent;
     flex-direction: column;
     min-width: 400px;
 
@@ -235,12 +234,6 @@
     &__summary {
         flex: 1 1 auto;
     }
-
-    &.is-current {
-        $c: $colorBodyFg;
-        border-color: rgba($c, 0.2);
-        background: rgba($c, 0.2);
-    }
 }
 
 /***************************** CONDITION DEFINITION, EDITING */

src/plugins/condition/components/inspector/conditional-styles.scss

@@ -65,7 +65,7 @@
 
         &.is-current {
             $c: $colorBodyFg;
-            border-color: rgba($c, 0.2);
+            border-color: rgba($c, 0.5);
             background: rgba($c, 0.2);
         }
 

src/plugins/notebook/components/notebook-menu-switcher.vue

@@ -29,7 +29,7 @@
 
 <script>
 import Snapshot from '../snapshot';
-import { getDefaultNotebook } from '../utils/notebook-storage';
+import { clearDefaultNotebook, getDefaultNotebook } from '../utils/notebook-storage';
 import { NOTEBOOK_DEFAULT, NOTEBOOK_SNAPSHOT } from '../notebook-constants';
 
 export default {
@@ -72,22 +72,28 @@ export default {
     methods: {
         async setNotebookTypes() {
             const notebookTypes = [];
+            let defaultPath = '';
             const defaultNotebook = getDefaultNotebook();
 
             if (defaultNotebook) {
-                const domainObject = defaultNotebook.domainObject;
+                const domainObject = await this.openmct.objects.get(defaultNotebook.notebookMeta.identifier)
+                    .then(d => d);
 
-                if (domainObject.location) {
-                    const defaultPath = `${domainObject.name} - ${defaultNotebook.section.name} - ${defaultNotebook.page.name}`;
-
-                    notebookTypes.push({
-                        cssClass: 'icon-notebook',
-                        name: `Save to Notebook ${defaultPath}`,
-                        type: NOTEBOOK_DEFAULT
-                    });
+                if (!domainObject.location) {
+                    clearDefaultNotebook();
+                } else {
+                    defaultPath = `${domainObject.name} - ${defaultNotebook.section.name} - ${defaultNotebook.page.name}`;
                 }
             }
 
+            if (defaultPath.length !== 0) {
+                notebookTypes.push({
+                    cssClass: 'icon-notebook',
+                    name: `Save to Notebook ${defaultPath}`,
+                    type: NOTEBOOK_DEFAULT
+                });
+            }
+
             notebookTypes.push({
                 cssClass: 'icon-notebook',
                 name: 'Save to Notebook Snapshots',

src/plugins/notebook/components/notebook.vue

@@ -239,7 +239,6 @@ export default {
             const section = this.getSelectedSection();
 
             return {
-                domainObject: this.internalDomainObject,
                 notebookMeta,
                 section,
                 page
@@ -441,7 +440,7 @@ export default {
         async updateDefaultNotebook(notebookStorage) {
             const defaultNotebookObject = await this.getDefaultNotebookObject();
             this.removeDefaultClass(defaultNotebookObject);
-            setDefaultNotebook(this.openmct, notebookStorage);
+            setDefaultNotebook(notebookStorage);
             this.addDefaultClass();
             this.defaultSectionId = notebookStorage.section.id;
             this.defaultPageId = notebookStorage.page.id;

src/plugins/notebook/utils/notebook-storage.js

@@ -1,46 +1,6 @@
 const NOTEBOOK_LOCAL_STORAGE = 'notebook-storage';
-let currentNotebookObject = null;
-let unlisten = null;
-
-function defaultNotebookObjectChanged(newDomainObject) {
-    if (newDomainObject.location !== null) {
-        currentNotebookObject = newDomainObject;
-        const notebookStorage = getDefaultNotebook();
-        notebookStorage.domainObject = newDomainObject;
-        saveDefaultNotebook(notebookStorage);
-
-        return;
-    }
-
-    if (unlisten) {
-        unlisten();
-        unlisten = null;
-    }
-
-    clearDefaultNotebook();
-}
-
-function observeDefaultNotebookObject(openmct, notebookStorage) {
-    const domainObject = notebookStorage.domainObject;
-    if (currentNotebookObject
-            && currentNotebookObject.identifier.key === domainObject.identifier.key) {
-        return;
-    }
-
-    if (unlisten) {
-        unlisten();
-        unlisten = null;
-    }
-
-    unlisten = openmct.objects.observe(notebookStorage.domainObject, '*', defaultNotebookObjectChanged);
-}
-
-function saveDefaultNotebook(notebookStorage) {
-    window.localStorage.setItem(NOTEBOOK_LOCAL_STORAGE, JSON.stringify(notebookStorage));
-}
 
 export function clearDefaultNotebook() {
-    currentNotebookObject = null;
     window.localStorage.setItem(NOTEBOOK_LOCAL_STORAGE, null);
 }
 
@@ -50,21 +10,20 @@ export function getDefaultNotebook() {
     return JSON.parse(notebookStorage);
 }
 
-export function setDefaultNotebook(openmct, notebookStorage) {
-    observeDefaultNotebookObject(openmct, notebookStorage);
-    saveDefaultNotebook(notebookStorage);
+export function setDefaultNotebook(notebookStorage) {
+    window.localStorage.setItem(NOTEBOOK_LOCAL_STORAGE, JSON.stringify(notebookStorage));
 }
 
 export function setDefaultNotebookSection(section) {
     const notebookStorage = getDefaultNotebook();
 
     notebookStorage.section = section;
-    saveDefaultNotebook(notebookStorage);
+    window.localStorage.setItem(NOTEBOOK_LOCAL_STORAGE, JSON.stringify(notebookStorage));
 
 }
 
 export function setDefaultNotebookPage(page) {
     const notebookStorage = getDefaultNotebook();
     notebookStorage.page = page;
-    saveDefaultNotebook(notebookStorage);
+    window.localStorage.setItem(NOTEBOOK_LOCAL_STORAGE, JSON.stringify(notebookStorage));
 }

src/plugins/plot/src/plot/MCTPlotController.js

@@ -67,10 +67,10 @@ define([
         }
         this.$canvas = this.$element.find('canvas');
 
+        this.listenTo(this.$canvas, 'click', this.onMouseClick, this);
         this.listenTo(this.$canvas, 'mousemove', this.trackMousePosition, this);
         this.listenTo(this.$canvas, 'mouseleave', this.untrackMousePosition, this);
         this.listenTo(this.$canvas, 'mousedown', this.onMouseDown, this);
-        this.listenTo(this.$canvas, 'wheel', this.wheelZoom, this);
 
         this.watchForMarquee();
     };
@@ -78,6 +78,7 @@ define([
     MCTPlotController.prototype.initialize = function () {
         this.$canvas = this.$element.find('canvas');
 
+        this.listenTo(this.$canvas, 'click', this.onMouseClick, this);
         this.listenTo(this.$canvas, 'mousemove', this.trackMousePosition, this);
         this.listenTo(this.$canvas, 'mouseleave', this.untrackMousePosition, this);
         this.listenTo(this.$canvas, 'mousedown', this.onMouseDown, this);
@@ -209,6 +210,23 @@ define([
         this.highlightValues(point);
     };
 
+    MCTPlotController.prototype.onMouseClick = function ($event) {
+        const isClick = this.isMouseClick();
+        if (this.pan) {
+            this.endPan($event);
+        }
+        if (this.marquee) {
+            this.endMarquee($event);
+        }
+        this.$scope.$apply();
+
+        if (!this.$scope.highlights.length || !isClick) {
+            return;
+        }
+
+        this.$scope.lockHighlightPoint = !this.$scope.lockHighlightPoint;
+    };
+
     MCTPlotController.prototype.highlightValues = function (point) {
         this.highlightPoint = point;
         this.$scope.$emit('plot:highlight:update', point);
@@ -256,23 +274,11 @@ define([
     MCTPlotController.prototype.onMouseUp = function ($event) {
         this.stopListening(this.$window, 'mouseup', this.onMouseUp, this);
         this.stopListening(this.$window, 'mousemove', this.trackMousePosition, this);
-
-        if (this.isMouseClick()) {
-            this.$scope.lockHighlightPoint = !this.$scope.lockHighlightPoint;
-        }
-
-        if (this.allowPan) {
-            return this.endPan($event);
-        }
-
-        if (this.allowMarquee) {
-            return this.endMarquee($event);
-        }
     };
 
     MCTPlotController.prototype.isMouseClick = function () {
         if (!this.marquee) {
-            return false;
+            return;
         }
 
         const { start, end } = this.marquee;

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

@@ -227,9 +227,8 @@ define([
     };
 
     PlotController.prototype.stopLoading = function () {
-        this.$scope.$evalAsync(() => {
-            this.$scope.pending -= 1;
-        });
+        this.$scope.pending -= 1;
+        this.$scope.$digest();
     };
 
     /**

src/plugins/plugins.js

@@ -51,8 +51,7 @@ define([
     './conditionWidget/plugin',
     './themes/espresso',
     './themes/maelstrom',
-    './themes/snow',
-    './windowLayout/plugin'
+    './themes/snow'
 ], function (
     _,
     UTCTimeSystem,
@@ -84,8 +83,7 @@ define([
     ConditionWidgetPlugin,
     Espresso,
     Maelstrom,
-    Snow,
-    WindowLayout
+    Snow
 ) {
     var bundleMap = {
         LocalStorage: 'platform/persistence/local',
@@ -194,7 +192,6 @@ define([
     plugins.Snow = Snow.default;
     plugins.Condition = ConditionPlugin.default;
     plugins.ConditionWidget = ConditionWidgetPlugin.default;
-    plugins.WindowLayout = WindowLayout.default;
 
     return plugins;
 });

src/plugins/remove/RemoveAction.js

@@ -29,11 +29,11 @@ export default class RemoveAction {
         this.openmct = openmct;
     }
 
-    invoke(objectPath) {
+    invoke(objectPath, context) {
         let object = objectPath[0];
         let parent = objectPath[1];
         this.showConfirmDialog(object).then(() => {
-            this.removeFromComposition(parent, object);
+            this.removeFromComposition(parent, object, context.sequenceNumber);
             if (this.inNavigationPath(object)) {
                 this.navigateTo(objectPath.slice(1));
             }
@@ -79,23 +79,21 @@ export default class RemoveAction {
         window.location.href = '#/browse/' + urlPath;
     }
 
-    removeFromComposition(parent, child) {
-        let composition = parent.composition.filter(id =>
-            !this.openmct.objects.areIdsEqual(id, child.identifier)
-        );
-
-        this.openmct.objects.mutate(parent, 'composition', composition);
+    removeFromComposition(parent, child, sequenceNumber) {
+        this.openmct.composition.get(parent).then(compositionCollection => {
+            compositionCollection.remove(child, sequenceNumber);
+        })
 
         if (this.inNavigationPath(child) && this.openmct.editor.isEditing()) {
             this.openmct.editor.save();
         }
 
-        const parentKeyString = this.openmct.objects.makeKeyString(parent.identifier);
-        const isAlias = parentKeyString !== child.location;
-
-        if (!isAlias) {
-            this.openmct.objects.mutate(child, 'location', null);
-        }
+        // Find another way of doing this with notebooks
+        // const parentKeyString = this.openmct.objects.makeKeyString(parent.identifier);
+        // const isAlias = parentKeyString !== child.location;
+        // if (!isAlias) {
+        //     this.openmct.objects.mutate(child, 'location', null);
+        // }
     }
 
     appliesTo(objectPath) {

src/plugins/tabs/components/tabs.vue

@@ -27,7 +27,7 @@
                 {'is-current': isCurrent(tab)},
                 tab.type.definition.cssClass
             ]"
-            @click="showTab(tab, index)"
+            @click="showTab(tab)"
         >
             <span class="c-button__label">{{ tab.domainObject.name }}</span>
         </button>
@@ -48,7 +48,6 @@
             </div>
         </div>
         <object-view
-            v-if="internalDomainObject.keep_alive ? currentTab : isCurrent(tab)"
             class="c-tabs-view__object"
             :object="tab.domainObject"
         />
@@ -58,6 +57,7 @@
 
 <script>
 import ObjectView from '../../../ui/components/ObjectView.vue';
+import _ from 'lodash';
 
 var unknownObjectType = {
     definition: {
@@ -73,7 +73,6 @@ export default {
     },
     data: function () {
         return {
-            internalDomainObject: this.domainObject,
             currentTab: {},
             tabsList: [],
             setCurrentTab: true,
@@ -86,17 +85,9 @@ export default {
             this.composition.on('add', this.addItem);
             this.composition.on('remove', this.removeItem);
             this.composition.on('reorder', this.onReorder);
-            this.composition.load().then(() => {
-                let currentTabIndex = this.domainObject.currentTabIndex;
-
-                if (currentTabIndex !== undefined && this.tabsList.length > currentTabIndex) {
-                    this.currentTab = this.tabsList[currentTabIndex];
-                }
-            });
+            this.composition.load();
         }
 
-        this.unsubscribe = this.openmct.objects.observe(this.internalDomainObject, '*', this.updateInternalDomainObject);
-
         document.addEventListener('dragstart', this.dragstart);
         document.addEventListener('dragend', this.dragend);
     },
@@ -105,25 +96,18 @@ export default {
         this.composition.off('remove', this.removeItem);
         this.composition.off('reorder', this.onReorder);
 
-        this.unsubscribe();
-
         document.removeEventListener('dragstart', this.dragstart);
         document.removeEventListener('dragend', this.dragend);
     },
     methods:{
-        showTab(tab, index) {
-            if (index !== undefined) {
-                this.storeCurrentTabIndex(index);
-            }
-
+        showTab(tab) {
             this.currentTab = tab;
         },
         addItem(domainObject) {
             let type = this.openmct.types.get(domainObject.type) || unknownObjectType,
                 tabItem = {
                     domainObject,
-                    type: type,
-                    key: this.openmct.objects.makeKeyString(domainObject.identifier)
+                    type: type
                 };
 
             this.tabsList.push(tabItem);
@@ -142,7 +126,7 @@ export default {
             this.tabsList.splice(pos, 1);
 
             if (this.isCurrent(tabToBeRemoved)) {
-                this.showTab(this.tabsList[this.tabsList.length - 1], this.tabsList.length - 1);
+                this.showTab(this.tabsList[this.tabsList.length - 1]);
             }
         },
         onReorder(reorderPlan) {
@@ -154,7 +138,6 @@ export default {
         },
         onDrop(e) {
             this.setCurrentTab = true;
-            this.storeCurrentTabIndex(this.tabsList.length);
         },
         dragstart(e) {
             if (e.dataTransfer.types.includes('openmct/domain-object-path')) {
@@ -172,13 +155,7 @@ export default {
             this.allowDrop = false;
         },
         isCurrent(tab) {
-            return this.currentTab.key === tab.key;
-        },
-        updateInternalDomainObject(domainObject) {
-            this.internalDomainObject = domainObject;
-        },
-        storeCurrentTabIndex(index) {
-            this.openmct.objects.mutate(this.internalDomainObject, 'currentTabIndex', index);
+            return _.isEqual(this.currentTab, tab)
         }
     }
 }

src/plugins/tabs/plugin.js

@@ -36,27 +36,7 @@ define([
                 cssClass: 'icon-tabs-view',
                 initialize(domainObject) {
                     domainObject.composition = [];
-                    domainObject.keep_alive = true;
-                },
-                form: [
-                    {
-                        "key": "keep_alive",
-                        "name": "Keep Tabs Alive",
-                        "control": "select",
-                        "options": [
-                            {
-                                'name': 'True',
-                                'value': true
-                            },
-                            {
-                                'name': 'False',
-                                'value': false
-                            }
-                        ],
-                        "required": true,
-                        "cssClass": "l-input"
-                    }
-                ]
+                }
             });
         };
     };

src/plugins/windowLayout/components/WindowLayout.vue

@@ -1,183 +0,0 @@
-<template>
-<div v-if="!isOpener"
-     class="c-indicator c-indicator--clickable icon-save s-status-caution"
->
-    <span class="label c-indicator__label">
-        <button @click="open2Windows">Open 2 Windows</button>
-        <button @click="closeAllWindows">Close Windows</button>
-        <button @click="openSavedWindows">Open Saved Windows</button>
-    </span>
-</div>
-</template>
-<script>
-export default {
-    inject: ['openmct'],
-    computed: {
-        isOpener() {
-            return window.opener;
-        }
-    },
-    mounted() {
-        this.openWindows = {};
-        this.windowFeatures = "menubar=yes,location=yes,tabs=yes, resizable=yes,scrollbars=yes, innerHeight=480,innerWidth=640,screenY=100";
-        window.addEventListener("message", this.receiveMessage, false);
-        if (window.opener) {
-            window.opener.postMessage({
-                status: 'READY',
-                name: window.name
-            },'*');
-            window.addEventListener('beforeunload', () => {
-                window.opener.postMessage({
-                    status: 'CLOSED',
-                    name: window.name
-                },'*');
-            });
-            window.addEventListener('blur', () => {
-                window.opener.postMessage({
-                    query: 'QUERY__SIZE',
-                    info: {
-                        innerHeight: window.innerHeight,
-                        innerWidth: window.innerWidth,
-                        screenLeft: window.screenLeft,
-                        screenTop: window.screenTop,
-                        screenWidth: screen.width,
-                        screenHeight: screen.height,
-                        screenAvailableWidth: screen.availWidth,
-                        screenAvailHeight: screen.availHeight,
-                        devicePixelRatio: window.devicePixelRatio,
-                        url: window.location.href
-                    },
-                    name: window.name
-                },'*');
-            });
-        }
-    },
-    methods: {
-        persistWindowInformation() {
-            window.localStorage.setItem('openmct-windowlayout-items',
-                JSON.stringify(this.getOpenWindowSpecifications()));
-        },
-        getScreenX() {
-            return !Object.keys(this.openWindows).length ? 100: (screen.width - (Object.keys(this.openWindows).length*640));
-        },
-        open2Windows() {
-            this.openWindow(`${this.windowFeatures},screenX=${this.getScreenX()}`);
-            this.openWindow(`${this.windowFeatures},screenX=${this.getScreenX()}`);
-        },
-        openWindow(windowFeatures) {
-            let newWindowName = `Open MCT Window ${Object.keys(this.openWindows).length+1}`;
-            this.openWindows[newWindowName] = { windowReference: window.open(window.location.href, newWindowName, windowFeatures)};
-        },
-        moveWindow() {
-            const key = Object.keys(this.openWindows)[0];
-            this.openWindows[key].postMessage({
-                command: 'moveTo',
-                params: [window.screenLeft + 40, window.screenTop + 40]
-            }, 'http://localhost:8080');
-        },
-        openSavedWindows() {
-            const persistedWindowObjs = window.localStorage.getItem('openmct-windowlayout-items');
-            if (persistedWindowObjs) {
-                const windowObjs = JSON.parse(persistedWindowObjs);
-                windowObjs.forEach(windowObj => {
-                    let newWindowName = windowObj.name;
-                    const features = `menubar=yes,location=yes,resizable=yes,scrollbars=yes,innerHeight=${windowObj.info.innerHeight || 480},innerWidth=${windowObj.info.innerWidth || 640},screenX=${windowObj.info.screenLeft || this.getScreenX()},screenY=${windowObj.info.screenTop || 100}`;
-                    const windowReference = window.open((windowObj.info.url || window.location.href), newWindowName, features);
-                    this.openWindows[newWindowName] = {
-                        windowReference,
-                        name: newWindowName,
-                        info: windowObj.info
-                    }
-                });
-            }
-        },
-        closeAllWindows() {
-            this.persistWindowInformation();
-            Object.keys(this.openWindows).forEach((windowName => {
-                const windowObj = this.openWindows[windowName];
-                windowObj.closedByOpener = true;
-                windowObj.windowReference.close();
-            }));
-        },
-        receiveMessage(event) {
-            const { data, origin, source} = event;
-            switch(origin) {
-            case 'http://localhost:8080':
-                if (data) {
-                    if (data.status === 'READY') {
-                        let newWindowReference = this.openWindows[data.name].windowReference;
-                        newWindowReference.postMessage({
-                            command: 'QUERY__SIZE'
-                        }, 'http://localhost:8080');
-                    } else if (data.status === 'CLOSED') {
-                        const closedByOpener = this.openWindows[data.name].closedByOpener;
-                        this.openWindows[data.name] = undefined;
-                        delete this.openWindows[data.name];
-                        if (!closedByOpener) {
-                            this.persistWindowInformation();
-                        }
-                    } else if (data.command) {
-                        switch(data.command) {
-                        case 'QUERY__SIZE':
-                            source.postMessage({
-                                query: data.command,
-                                info: {
-                                    innerHeight: window.innerHeight,
-                                    innerWidth: window.innerWidth,
-                                    screenLeft: window.screenLeft,
-                                    screenTop: window.screenTop,
-                                    screenWidth: screen.width,
-                                    screenHeight: screen.height,
-                                    screenAvailableWidth: screen.availWidth,
-                                    screenAvailHeight: screen.availHeight,
-                                    devicePixelRatio: window.devicePixelRatio,
-                                    url: window.location.href
-                                },
-                                name: window.name
-                            }, origin);
-                            break;
-                        default:
-                            window[data.command](...data.params);
-                            this.$nextTick(() => {
-                                source.postMessage({
-                                    query: data.command,
-                                    name: window.name
-                                }, origin);
-                            });
-                            break;
-                        }
-                    } else if (data.query) {
-                        if (data.info) {
-                            if (!this.openWindows[data.name]) {
-                                return;
-                            }
-                            this.openWindows[data.name].info = data.info;
-                            this.persistWindowInformation();
-                        } else {
-                            if (!this.openWindows[data.name]) {
-                                return;
-                            }
-                            let newWindowReference = this.openWindows[data.name].windowReference;
-                            newWindowReference.postMessage({
-                                command: 'QUERY__SIZE'
-                            }, 'http://localhost:8080');
-                        }
-                    }
-                }
-
-                break;
-            default:
-                break;
-            }
-        },
-        getOpenWindowSpecifications() {
-            return Object.keys(this.openWindows).map(key => {
-                return {
-                    name: key,
-                    info: this.openWindows[key].info
-                }
-            });
-        }
-    }
-}
-</script>

src/plugins/windowLayout/plugin.js

@@ -1,43 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2019, 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 Vue from 'vue';
-import WindowLayout from "./components/WindowLayout.vue";
-
-export default function plugin() {
-
-    return function install(openmct) {
-        let component = new Vue ({
-                provide: {
-                    openmct
-                },
-                components: {
-                    WindowLayout: WindowLayout
-                },
-                template: '<WindowLayout></WindowLayout>'
-            }),
-            indicator = {
-                element: component.$mount().$el
-            };
-
-        openmct.indicators.add(indicator);
-    };
-}

src/ui/components/ObjectLabel.vue

@@ -36,6 +36,10 @@ export default {
         navigateToPath: {
             type: String,
             default: undefined
+        },
+        sequenceNumber: {
+            type: Number,
+            default: undefined
         }
     },
     data() {

src/ui/layout/BrowseBar.vue

@@ -110,7 +110,8 @@ export default {
             domainObject: PLACEHOLDER_OBJECT,
             viewKey: undefined,
             isEditing: this.openmct.editor.isEditing(),
-            notebookEnabled: this.openmct.types.get('notebook')
+            notebookEnabled: this.openmct.types.get('notebook'),
+            sequenceNumber: undefined
         }
     },
     computed: {
@@ -267,7 +268,14 @@ export default {
             });
         },
         showContextMenu(event) {
-            this.openmct.contextMenu._showContextMenuForObjectPath(this.openmct.router.path, event.clientX, event.clientY);
+            this.openmct.contextMenu._showContextMenuForObjectPath(
+                this.openmct.router.path,
+                event.clientX,
+                event.clientY,
+                undefined,
+                {
+                    sequenceNumber: this.sequenceNumber
+                });
         },
         goToParent() {
             window.location.hash = this.parentUrl;

src/ui/layout/mct-tree.vue

@@ -34,6 +34,7 @@
             v-for="treeItem in allTreeItems"
             :key="treeItem.id"
             :node="treeItem"
+            :sequence-number="0"
         />
     </ul>
     <!-- end main tree -->
@@ -47,6 +48,7 @@
             v-for="treeItem in filteredTreeItems"
             :key="treeItem.id"
             :node="treeItem"
+            :sequence-number="0"
         />
     </ul>
     <!-- end search tree -->

src/ui/layout/tree-item.vue

@@ -13,6 +13,7 @@
             :domain-object="node.object"
             :object-path="node.objectPath"
             :navigate-to-path="navigateToPath"
+            :sequence-number="sequenceNumber"
         />
     </div>
     <ul
@@ -28,9 +29,10 @@
             </div>
         </li>
         <tree-item
-            v-for="child in children"
+            v-for="(child, index) in children"
             :key="child.id"
             :node="child"
+            :sequence-number="index"
         />
     </ul>
 </li>
@@ -53,6 +55,10 @@ export default {
         node: {
             type: Object,
             required: true
+        },
+        sequenceNumber: {
+            type: Number,
+            required: true
         }
     },
     data() {

src/ui/mixins/object-link.js

@@ -13,13 +13,20 @@ export default {
             if (!this.objectPath.length) {
                 return;
             }
+            let url;
+
             if (this.navigateToPath) {
-                return '#' + this.navigateToPath;
+                url = '#' + this.navigateToPath;
+            } else {
+                url = '#/browse/' + this.objectPath
+                    .map(o => o && this.openmct.objects.makeKeyString(o.identifier))
+                    .reverse()
+                    .join('/');
             }
-            return '#/browse/' + this.objectPath
-                .map(o => o && this.openmct.objects.makeKeyString(o.identifier))
-                .reverse()
-                .join('/');
+            if (this.sequenceNumber) {
+                url += `?sequenceNumber=${this.sequenceNumber}`;
+            }
+            return url;
         }
     }
 };

src/ui/preview/Preview.vue

@@ -35,8 +35,6 @@
 
 <script>
 import PreviewHeader from './preview-header.vue';
-import {STYLE_CONSTANTS} from "@/plugins/condition/utils/constants";
-import StyleRuleManager from "@/plugins/condition/StyleRuleManager";
 
 export default {
     components: {
@@ -71,14 +69,6 @@ export default {
     },
     destroyed() {
         this.view.destroy();
-        if (this.stopListeningStyles) {
-            this.stopListeningStyles();
-        }
-
-        if (this.styleRuleManager) {
-            this.styleRuleManager.destroy();
-            delete this.styleRuleManager;
-        }
     },
     methods: {
         clear() {
@@ -100,46 +90,6 @@ export default {
 
             this.view = this.currentView.view(this.domainObject, this.objectPath);
             this.view.show(this.viewContainer, false);
-            this.initObjectStyles();
-        },
-        initObjectStyles() {
-            if (!this.styleRuleManager) {
-                this.styleRuleManager = new StyleRuleManager((this.domainObject.configuration && this.domainObject.configuration.objectStyles), this.openmct, this.updateStyle.bind(this));
-            } else {
-                this.styleRuleManager.updateObjectStyleConfig(this.domainObject.configuration && this.domainObject.configuration.objectStyles);
-            }
-
-            if (this.stopListeningStyles) {
-                this.stopListeningStyles();
-            }
-
-            this.stopListeningStyles = this.openmct.objects.observe(this.domainObject, 'configuration.objectStyles', (newObjectStyle) => {
-                //Updating styles in the inspector view will trigger this so that the changes are reflected immediately
-                this.styleRuleManager.updateObjectStyleConfig(newObjectStyle);
-            });
-        },
-        updateStyle(styleObj) {
-            if (!styleObj) {
-                return;
-            }
-            let keys = Object.keys(styleObj);
-            keys.forEach(key => {
-                let firstChild = this.$refs.objectView.querySelector(':first-child');
-                if (firstChild) {
-                    if ((typeof styleObj[key] === 'string') && (styleObj[key].indexOf('__no_value') > -1)) {
-                        if (firstChild.style[key]) {
-                            firstChild.style[key] = '';
-                        }
-                    } else {
-                        if (!styleObj.isStyleInvisible && firstChild.classList.contains(STYLE_CONSTANTS.isStyleInvisible)) {
-                            firstChild.classList.remove(STYLE_CONSTANTS.isStyleInvisible);
-                        } else if (styleObj.isStyleInvisible && !firstChild.classList.contains(styleObj.isStyleInvisible)) {
-                            firstChild.classList.add(styleObj.isStyleInvisible);
-                        }
-                        firstChild.style[key] = styleObj[key];
-                    }
-                }
-            });
         }
     }
 }

src/ui/router/Browse.js

@@ -27,6 +27,13 @@ define([
                 return;
             }
 
+            if (newParams.sequenceNumber) {
+                openmct.layout.$refs.browseBar.sequenceNumber = parseInt(newParams.sequenceNumber);
+            } else {
+                openmct.layout.$refs.browseBar.sequenceNumber = undefined;
+            }
+
+
             if (changed.view && browseObject) {
                 let provider = openmct
                     .objectViews