[Notebook] V2.0 development #2666 (#2755)

* Notebook v2.0
Co-authored-by: charlesh88 <charlesh88@gmail.com>

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

@@ -0,0 +1,194 @@
+import objectLink from '../../../ui/mixins/object-link';
+
+const TIME_BOUNDS = {
+    START_BOUND: 'tc.startBound',
+    END_BOUND: 'tc.endBound',
+    START_DELTA: 'tc.startDelta',
+    END_DELTA: 'tc.endDelta'
+}
+
+export const getHistoricLinkInFixedMode = (openmct, bounds, historicLink) => {
+    if (historicLink.includes('tc.mode=fixed')) {
+        return historicLink;
+    }
+
+    openmct.time.getAllClocks().forEach(clock => {
+        if (historicLink.includes(`tc.mode=${clock.key}`)) {
+            historicLink.replace(`tc.mode=${clock.key}`, 'tc.mode=fixed');
+
+            return;
+        }
+    });
+
+    const params = historicLink.split('&').map(param => {
+        if (param.includes(TIME_BOUNDS.START_BOUND)
+                || param.includes(TIME_BOUNDS.START_DELTA)) {
+            param = `${TIME_BOUNDS.START_BOUND}=${bounds.start}`;
+        }
+
+        if (param.includes(TIME_BOUNDS.END_BOUND)
+                || param.includes(TIME_BOUNDS.END_DELTA)) {
+            param = `${TIME_BOUNDS.END_BOUND}=${bounds.end}`;
+        }
+
+        return param;
+    });
+
+    return params.join('&');
+}
+
+export const getNotebookDefaultEntries = (notebookStorage, domainObject) => {
+    if (!notebookStorage || !domainObject) {
+        return null;
+    }
+
+    const defaultSection = notebookStorage.section;
+    const defaultPage = notebookStorage.page;
+    if (!defaultSection || !defaultPage) {
+        return null;
+    }
+
+    const configuration = domainObject.configuration;
+    const entries = configuration.entries || {};
+
+    let section = entries[defaultSection.id];
+    if (!section) {
+        section = {};
+        entries[defaultSection.id] = section;
+    }
+
+    let page = entries[defaultSection.id][defaultPage.id];
+    if (!page) {
+        page = [];
+        entries[defaultSection.id][defaultPage.id] = [];
+    }
+
+    return entries[defaultSection.id][defaultPage.id];
+}
+
+export const createNewEmbed = (snapshotMeta, snapshot = '') => {
+    const {
+        bounds,
+        link,
+        objectPath,
+        openmct
+    } = snapshotMeta;
+    const domainObject = objectPath[0];
+    const domainObjectType = openmct.types.get(domainObject.type);
+
+    const cssClass = domainObjectType && domainObjectType.definition
+        ? domainObjectType.definition.cssClass
+        : 'icon-object-unknown';
+    const date = Date.now();
+    const historicLink = link
+        ? getHistoricLinkInFixedMode(openmct, bounds, link)
+        : objectLink.computed.objectLink.call({ objectPath, openmct });
+    const name = domainObject.name;
+    const type = domainObject.identifier.key;
+
+    return {
+        bounds,
+        createdOn: date,
+        cssClass,
+        domainObject,
+        historicLink,
+        id: 'embed-' + date,
+        name,
+        snapshot,
+        type
+    };
+}
+
+export const addNotebookEntry = (openmct, domainObject, notebookStorage, embed = null) => {
+    if (!openmct || !domainObject || !notebookStorage) {
+        return;
+    }
+
+    const date = Date.now();
+    const configuration = domainObject.configuration;
+    const entries = configuration.entries || {};
+
+    if (!entries) {
+        return;
+    }
+
+    const embeds = embed
+        ? [embed]
+        : [];
+
+    const defaultEntries = getNotebookDefaultEntries(notebookStorage, domainObject);
+    const id = `entry-${date}`;
+    defaultEntries.push({
+        id,
+        createdOn: date,
+        text: '',
+        embeds
+    });
+
+    openmct.objects.mutate(domainObject, 'configuration.entries', entries);
+
+    return id;
+}
+
+export const getNotebookEntries = (domainObject, selectedSection, selectedPage) => {
+    if (!domainObject || !selectedSection || !selectedPage) {
+        return null;
+    }
+
+    const configuration = domainObject.configuration;
+    const entries = configuration.entries || {};
+
+    let section = entries[selectedSection.id];
+    if (!section) {
+        return null;
+    }
+
+    let page = entries[selectedSection.id][selectedPage.id];
+    if (!page) {
+        return null;
+    }
+
+    return entries[selectedSection.id][selectedPage.id];
+}
+
+export const getEntryPosById = (entryId, domainObject, selectedSection, selectedPage) => {
+    if (!domainObject || !selectedSection || !selectedPage) {
+        return;
+    }
+
+    const entries = getNotebookEntries(domainObject, selectedSection, selectedPage);
+    let foundId = -1;
+    entries.forEach((element, index) => {
+        if (element.id === entryId) {
+            foundId = index;
+
+            return;
+        }
+    });
+
+    return foundId;
+}
+
+export const deleteNotebookEntries = (openmct, domainObject, selectedSection, selectedPage) => {
+    if (!domainObject || !selectedSection) {
+        return;
+    }
+
+    const configuration = domainObject.configuration;
+    const entries = configuration.entries || {};
+
+    // Delete entire section
+    if (!selectedPage) {
+        delete entries[selectedSection.id];
+
+        return;
+    }
+
+    let section = entries[selectedSection.id];
+    if (!section) {
+        return;
+    }
+
+    delete entries[selectedSection.id][selectedPage.id];
+    openmct.objects.mutate(domainObject, 'configuration.entries', entries);
+}

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

@@ -0,0 +1,40 @@
+const NOTEBOOK_LOCAL_STORAGE = 'notebook-storage';
+
+export function clearDefaultNotebook() {
+    window.localStorage.setItem(NOTEBOOK_LOCAL_STORAGE, null);
+}
+
+export function getDefaultNotebook() {
+    const notebookStorage = window.localStorage.getItem(NOTEBOOK_LOCAL_STORAGE);
+
+    return JSON.parse(notebookStorage);
+}
+
+export function setDefaultNotebook(domainObject, section, page) {
+    const notebookMeta = {
+        name: domainObject.name,
+        identifier: domainObject.identifier
+    };
+
+    const notebookStorage = {
+        notebookMeta,
+        section,
+        page
+    }
+
+    window.localStorage.setItem(NOTEBOOK_LOCAL_STORAGE, JSON.stringify(notebookStorage));
+}
+
+export function setDefaultNotebookSection(section) {
+    const notebookStorage = getDefaultNotebook();
+
+    notebookStorage.section = section;
+    window.localStorage.setItem(NOTEBOOK_LOCAL_STORAGE, JSON.stringify(notebookStorage));
+
+}
+
+export function setDefaultNotebookPage(page) {
+    const notebookStorage = getDefaultNotebook();
+    notebookStorage.page = page;
+    window.localStorage.setItem(NOTEBOOK_LOCAL_STORAGE, JSON.stringify(notebookStorage));
+}

src/plugins/notebook/utils/popup-menu.js

@@ -0,0 +1,45 @@
+import $ from 'zepto';
+
+export const togglePopupMenu = (event, openmct) => {
+    event.preventDefault();
+
+    const body = $(document.body);
+    const container = $(event.target.parentElement.parentElement);
+    const classList = document.querySelector('body').classList;
+    const isPhone = Array.from(classList).includes('phone');
+    const isTablet = Array.from(classList).includes('tablet');
+
+    const initiatingEvent = isPhone || isTablet
+        ? 'touchstart'
+        : 'mousedown';
+    const menu = container.find('.menu-element');
+    let dismissExistingMenu;
+
+    function dismiss() {
+        container.find('.hide-menu').append(menu);
+        body.off(initiatingEvent, menuClickHandler);
+        dismissExistingMenu = undefined;
+    }
+
+    function menuClickHandler(e) {
+        window.setTimeout(() => {
+            dismiss();
+        }, 100);
+    }
+
+    // Dismiss any menu which was already showing
+    if (dismissExistingMenu) {
+        dismissExistingMenu();
+    }
+
+    // ...and record the presence of this menu.
+    dismissExistingMenu = dismiss;
+
+    const popupService = openmct.$injector.get('popupService');
+    popupService.display(menu, [event.pageX,event.pageY], {
+        marginX: 0,
+        marginY: -50
+    });
+
+    body.on(initiatingEvent, menuClickHandler);
+}