#425 Description Item fixes (#426)

* #425 Description Item fixes * Remove outdated comment
NASA-AMMOS · Sep 8, 2023 · 50472e1 · 50472e1
1 parent d7dfce4
commit 50472e1
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 7 deletions.
diff --git a/src/css/mmgisUI.css b/src/css/mmgisUI.css
@@ -769,6 +769,19 @@
     background-color: var(--color-a2);
 }
 
+.hideScrollbar::-webkit-scrollbar-track {
+    background-color: Transparent;
+}
+
+.hideScrollbar::-webkit-scrollbar {
+    width: 0px;
+    height: 0px;
+}
+
+.hideScrollbar::-webkit-scrollbar-thumb {
+    border-radius: 0px;
+}
+
 ::-webkit-scrollbar {
     width: 14px;
     height: 14px;

diff --git a/src/essence/Ancillary/Description.js b/src/essence/Ancillary/Description.js
@@ -69,18 +69,23 @@ const Description = {
         this.inited = true
         if (this.waitingOnUpdate) this.updateInfo()
     },
-    updateInfo() {
-        this.waitingOnUpdate = false
-        if (!this.inited) {
-            this.waitingOnUpdate = true
-            return
+    updateInfo(force) {
+        if (force !== true) {
+            this.waitingOnUpdate = false
+            if (!this.inited) {
+                this.waitingOnUpdate = true
+                return
+            }
         }
 
+        this.descInfoCont.html('')
+
         let infos = []
 
         for (let layer in this.L_.layers.data) {
             let l = this.L_.layers.data[layer]
             if (
+                this.L_.layers.on[layer] === true &&
                 this.L_.layers.layer[layer] &&
                 l.hasOwnProperty('variables') &&
                 l.variables.hasOwnProperty('info') &&

diff --git a/src/essence/Basics/Layers_/Layers_.js b/src/essence/Basics/Layers_/Layers_.js
@@ -228,6 +228,14 @@ const L_ = {
         Object.keys(L_._onLayerToggleSubscriptions).forEach((k) => {
             L_._onLayerToggleSubscriptions[k](s.name, !on)
         })
+
+        // Always reupdate layer infos at the end to keep them in sync
+        Description.updateInfo()
+
+        // Deselect active feature if its layer is being turned off
+        if (L_.activeFeature && L_.activeFeature.layerName === s.name && on) {
+            L_.setActiveFeature(null)
+        }
     },
     toggleLayerHelper: async function (
         s,

diff --git a/src/essence/Basics/UserInterface_/UserInterface_.css b/src/essence/Basics/UserInterface_/UserInterface_.css
@@ -24,11 +24,20 @@
     pointer-events: auto;
 }
 
+#main-container > #topBar > #topBarLeft {
+    flex: 1;
+    pointer-events: none;
+    overflow-x: auto;
+    overflow-y: hidden;
+    margin-right: 8px;
+}
 #main-container > #topBar > #topBarLeft,
 #main-container > #topBar > #topBarRight {
     display: flex;
 }
-
+#main-container > #topBar #topBarSecondary {
+    flex: 1;
+}
 #main-container > #topBar #topBarMain,
 #main-container > #topBar #topBarSecondary {
     display: flex;

diff --git a/src/essence/Basics/UserInterface_/UserInterface_.js b/src/essence/Basics/UserInterface_/UserInterface_.js
@@ -60,7 +60,7 @@ var UserInterface = {
         // prettier-ignore
         const topBarMarkup = [
             "<div id='topBar'>",
-                "<div id='topBarLeft'>",
+                "<div id='topBarLeft' class='hideScrollbar'>",
                     "<div id='topBarMain'>",
                         "<div id='topBarTitle'>",
                             `<div id='topBarTitleName' tabindex='200'>`,
@@ -84,6 +84,11 @@ var UserInterface = {
         //TopBar
         $('#main-container').append(topBarMarkup)
 
+        $('#topBarLeft').on('wheel', function (e) {
+            e.preventDefault()
+            this.scrollLeft += e.originalEvent.deltaY
+        })
+
         this.rightPanel = d3
             .select('body')
             .append('div')