Previous colors build out

igvteam · Nov 20, 2024 · 5db6eb7 · 5db6eb7
1 parent 1601493
commit 5db6eb7
Show file tree

Hide file tree

Showing 6 changed files with 18 additions and 22 deletions.
diff --git a/css/_igv-ui-colorpicker.scss b/css/_igv-ui-colorpicker.scss
@@ -22,10 +22,11 @@ $igv-color-swatch-border-width: 2px;
 
   // recent colors
   >div:nth-child(3) {
+    display: flex;
     flex-direction: column;
     flex-wrap: nowrap;
     justify-content: flex-start;
-    align-items: center;
+    align-items: flex-start;
 
     width: 100%;
     padding-bottom: .25rem;

diff --git a/css/igv.css b/css/igv.css
diff --git a/js/browser.js b/js/browser.js
@@ -161,8 +161,8 @@ class Browser {
         // Region of interest
         this.roiManager = new ROIManager(this)
 
-        // previous colors for colorPicker
-        this.previousColors = []
+        // previous track colors for colorPicker
+        this.previousTrackColors = []
     }
 
     get doShowROITable() {

diff --git a/js/embedCss.js b/js/embedCss.js
diff --git a/js/trackView.js b/js/trackView.js
@@ -266,7 +266,7 @@ class TrackView {
                     }
             }
 
-            this.browser.genericColorPicker.configure(initialTrackColor, colorHandlers[colorSelection])
+            this.browser.genericColorPicker.configure(initialTrackColor, this.browser.previousTrackColors, colorHandlers[colorSelection])
             this.browser.genericColorPicker.show()
 
         }

diff --git a/js/ui/components/genericColorPicker.js b/js/ui/components/genericColorPicker.js
@@ -33,7 +33,7 @@ class GenericColorPicker extends GenericContainer {
 
     }
 
-    configure(initialTrackColor, colorHandler) {
+    configure(initialTrackColor, previousTrackColors, colorHandler) {
 
         this.colorSwatchContainer.innerHTML = ''
 
@@ -48,28 +48,20 @@ class GenericColorPicker extends GenericContainer {
             this.decorateSwatch(swatch, hexColorString, colorHandler)
         }
 
-        // Populate RecentColors
-        let recentColors = []
-        if (initialTrackColor) {
-            recentColors.push(initialTrackColor)
-        }
-
-        if (recentColors.length > 0) {
-
-            // Only unique colors
-            recentColors = [...new Set(recentColors)]
+        // Populate Previous Colors
+        if (previousTrackColors.length > 0) {
 
             this.recentColorsContainer.style.display = 'flex'
 
-            for (const hexColorString of recentColors) {
+            for (const hexColorString of previousTrackColors) {
                 const swatch = DOMUtils.div({class: 'igv-ui-color-swatch'})
                 this.recentColorsSwatches.appendChild(swatch)
                 this.decorateSwatch(swatch, hexColorString, colorHandler)
             }
         }
 
-        // Present MoreColors Colorpicker
-        this.decorateMoreColorsButton(this.moreColorsContainer, colorHandler)
+        // Present MoreColors picker
+        this.decorateMoreColorsButton(this.moreColorsContainer, previousTrackColors, colorHandler)
 
     }
 
@@ -89,14 +81,16 @@ class GenericColorPicker extends GenericContainer {
 
     }
 
-    decorateMoreColorsButton(moreColorsContainer, colorHandler) {
+    decorateMoreColorsButton(moreColorsContainer, previousTrackColors, colorHandler) {
 
         moreColorsContainer.innerText = 'More Colors ...'
 
         moreColorsContainer.addEventListener('click', event => {
             event.stopPropagation()
             createAndPresentMoreColorsPicker(moreColorsContainer, hexColorString => {
-                // previousColors.push(hexColorString)
+                previousTrackColors.push(hexColorString)
+                // const uniques = [...new Set(previousTrackColors)]
+                // previousTrackColors = uniques.slice(0)
                 colorHandler(hexColorString)
             })
         })