Strip away library name from Canvas element in MetaEditor when librar…

…y viewed (#1793) Co-authored-by: Patrik Meijer <patrik.meijer@vanderbilt.edu>
webgme · Mar 20, 2024 · 1d2b748 · 1d2b748
1 parent 8af9c31
commit 1d2b748
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 7 deletions.
diff --git a/src/client/decorators/MetaDecorator/DiagramDesigner/MetaDecorator.DiagramDesignerWidget.js b/src/client/decorators/MetaDecorator/DiagramDesigner/MetaDecorator.DiagramDesignerWidget.js
@@ -231,9 +231,13 @@ define([
             newName = '';
 
         if (nodeObj) {
-            // newName = nodeObj.getAttribute(nodePropertyNames.Attributes.name) || '';
             newName = nodeObj.getFullyQualifiedName();
 
+            if (this._metaInfo.selectedLibrary) {
+                // Trim selected library plus additional dot.
+                newName = newName.substring(this._metaInfo.selectedLibrary.length + 1);
+            }
+
             if (this.name !== newName) {
                 this.name = newName;
                 this._refreshName();

diff --git a/src/client/js/Panels/MetaEditor/MetaEditorControl.js b/src/client/js/Panels/MetaEditor/MetaEditorControl.js
@@ -467,7 +467,7 @@ define(['js/logger',
 
             objDesc.decoratorClass = decClass;
             objDesc.control = this;
-            objDesc.metaInfo = {};
+            objDesc.metaInfo = { selectedLibrary: this._selectedLibrary };
             objDesc.metaInfo[CONSTANTS.GME_ID] = gmeID;
             //each meta specific registry customization will be stored in the MetaContainer node's main META SET
             // (MetaEditorConstants.META_ASPECT_SET_NAME)
@@ -2105,8 +2105,13 @@ define(['js/logger',
         len = metaAspectSheetsRegistry.length;
         for (i = 0; i < len; i += 1) {
             setName = metaAspectSheetsRegistry[i].SetID;
+            const { title } = metaAspectSheetsRegistry[i];
+            const tabInfo = {
+                title,
+                backgroundText: this._selectedLibrary ? `${this._selectedLibrary }.${title}` : title
+            };
 
-            sheetID = this.diagramDesigner.addTab(metaAspectSheetsRegistry[i].title, true, true);
+            sheetID = this.diagramDesigner.addTab(tabInfo, true, true);
 
             this._sheets[sheetID] = setName;
             this._tabIdxToTitle[sheetID] = metaAspectSheetsRegistry[i].title;

diff --git a/src/client/js/Panels/ModelEditor/ModelEditorControl.js b/src/client/js/Panels/ModelEditor/ModelEditorControl.js
@@ -1190,7 +1190,12 @@ define(['js/logger',
             this.designerCanvas.addMultipleTabsBegin();
 
             for (i = 0; i < aspects.length; i += 1) {
-                tabID = this.designerCanvas.addTab(aspects[i]);
+                const tabInfo = {
+                    title: aspects[i],
+                    backgroundText: this._selectedLibrary ? `${this._selectedLibrary}.${aspects[i]}` : aspects[i]
+                };
+
+                tabID = this.designerCanvas.addTab(tabInfo);
 
                 this._aspects[tabID] = aspects[i];
 

diff --git a/src/client/js/Widgets/DiagramDesigner/DiagramDesignerWidget.Tabs.js b/src/client/js/Widgets/DiagramDesigner/DiagramDesignerWidget.Tabs.js
@@ -172,11 +172,26 @@ define([
         li.find('a').append(deleteBtn);
     };
 
-    DiagramDesignerWidgetTabs.prototype.addTab = function (title, deletable, renamable) {
+    DiagramDesignerWidgetTabs.prototype.addTab = function (titleOrDesc, deletable, renamable) {
         var self = this,
             li = TAB_LI_BASE.clone();
 
+        let title = '';
+        let backgroundText = '';
+
+        if (typeof titleOrDesc === 'string') {
+            title = titleOrDesc;
+        } else {
+            title = titleOrDesc.title;
+            backgroundText = titleOrDesc.backgroundText;
+        }
+
         li.find('.tab-title').attr('title', title).text(title);
+
+        if (backgroundText) {
+            li.find('.tab-title').data('backgroundText', backgroundText);
+        }
+
         li.data(TAB_ID, this._tabCounter + '');
         this._tabCounter += 1;
 
@@ -268,9 +283,10 @@ define([
                 liToSelect.addClass('active');
                 liToSelect.find('.delete-tab-btn').removeClass('hidden');
                 this._selectedTab = liToSelect.data(TAB_ID);
+                const activeTabTitleEl = this.$ulTabTab.find('li.active').first().find('.tab-title');
+                const backgroundText = activeTabTitleEl.data('backgroundText') || activeTabTitleEl.text();
 
-                this.setBackgroundText(this.$ulTabTab.find('li.active').first().find('.tab-title').text()
-                    .toUpperCase());
+                this.setBackgroundText(backgroundText.toUpperCase());
             }
 
             //select in DropDown