diff --git a/src/plugins/notebook/components/NotebookEmbed.vue b/src/plugins/notebook/components/NotebookEmbed.vue
index 49cace8f2e..baf79c5b15 100644
--- a/src/plugins/notebook/components/NotebookEmbed.vue
+++ b/src/plugins/notebook/components/NotebookEmbed.vue
@@ -12,14 +12,15 @@
{{ embed.name }}
-
+
-
@@ -32,17 +33,14 @@ import PreviewAction from '../../../ui/preview/PreviewAction';
import RemoveDialog from '../utils/removeDialog';
import PainterroInstance from '../utils/painterroInstance';
import SnapshotTemplate from './snapshot-template.html';
+import objectPathToUrl from '@/tools/url';
import { updateNotebookImageDomainObject } from '../utils/notebook-image';
import ImageExporter from '../../../exporters/ImageExporter';
-import PopupMenu from './PopupMenu.vue';
import Vue from 'vue';
export default {
- components: {
- PopupMenu
- },
inject: ['openmct', 'snapshotContainer'],
props: {
embed: {
@@ -72,7 +70,8 @@ export default {
},
data() {
return {
- popupMenuItems: []
+ menuActions: [],
+ objectPath: []
};
},
computed: {
@@ -88,37 +87,87 @@ export default {
watch: {
isLocked(value) {
if (value === true) {
- let index = this.popupMenuItems.findIndex((item) => item.id === 'removeEmbed');
+ let index = this.menuActions.findIndex((item) => item.id === 'removeEmbed');
- this.$delete(this.popupMenuItems, index);
+ this.$delete(this.menuActions, index);
}
}
},
- mounted() {
- this.addPopupMenuItems();
+ async mounted() {
+ await this.setEmbedObjectPath();
+ this.addmenuActions();
this.imageExporter = new ImageExporter(this.openmct);
},
methods: {
- addPopupMenuItems() {
- const removeEmbed = {
- id: 'removeEmbed',
- cssClass: 'icon-trash',
- name: this.removeActionString,
- callback: this.getRemoveDialog.bind(this)
- };
- const preview = {
- id: 'preview',
- cssClass: 'icon-eye-open',
- name: 'Preview',
- callback: this.previewEmbed.bind(this)
+ showMenuItems(event) {
+ const x = event.x;
+ const y = event.y;
+
+ const menuOptions = {
+ menuClass: 'c-ne__embed__actions-menu'
+ // placement: this.openmct.menus.menuPlacement.TOP_RIGHT
};
- this.popupMenuItems = [preview];
+ this.openmct.menus.showSuperMenu(x, y, this.menuActions, menuOptions);
+ },
+ addmenuActions() {
+ if (this.embed.snapshot) {
+ const viewSnapshot = {
+ id: 'viewSnapshot',
+ cssClass: 'icon-camera',
+ name: 'View Snapshot',
+ description: 'description',
+ onItemClicked: () => this.openSnapshot()
+ };
- if (!this.isLocked) {
- this.popupMenuItems.unshift(removeEmbed);
+ this.menuActions = [viewSnapshot];
}
+ const navigateToItem = {
+ id: 'navigateToItem',
+ cssClass: this.embed.cssClass,
+ name: 'Navigate to Item',
+ description: 'description',
+ onItemClicked: () => this.navigateToItem()
+ };
+
+ const navigateToItemInTime = {
+ id: 'navigateToItemInTime',
+ cssClass: 'icon-telemetry',
+ name: 'Navigate to Item in Time',
+ description: 'description',
+ onItemClicked: () => this.navigateToItemInTime()
+ };
+
+ const quickView = {
+ id: 'quickView',
+ cssClass: 'icon-eye-open',
+ name: 'Quick View',
+ description: 'description',
+ onItemClicked: () => this.previewEmbed()
+ };
+
+ this.menuActions = this.menuActions.concat([quickView, navigateToItem, navigateToItemInTime]);
+
+ if (!this.isLocked) {
+ const removeEmbed = {
+ id: 'removeEmbed',
+ cssClass: 'icon-trash',
+ name: this.removeActionString,
+ description: 'description',
+ onItemClicked: this.getRemoveDialog.bind(this)
+ };
+
+ this.menuActions.push(removeEmbed);
+ }
+
+ },
+ async setEmbedObjectPath() {
+ this.objectPath = await this.openmct.objects.getOriginalPath(this.embed.domainObject.identifier);
+
+ if (this.objectPath[this.objectPath.length -1].type === 'root') {
+ this.objectPath.pop();
+ }
},
annotateSnapshot() {
const annotateVue = new Vue({
@@ -179,7 +228,11 @@ export default {
painterroInstance.show(object.configuration.fullSizeImageURL);
});
},
- changeLocation() {
+ navigateToItem() {
+ const url = objectPathToUrl(this.openmct, this.objectPath);
+ this.openmct.router.navigate(url);
+ },
+ navigateToItemInTime() {
const hash = this.embed.historicLink;
const bounds = this.openmct.time.bounds();