e016f7eae81edd3cfac1f65219dc6c18e91c7e22
chmalee
  Wed May 22 10:47:12 2024 -0700
Unify the different color pickers (drag select highlights, track item highlights and track item colors) into hui.js. Ensure the text box and palette selector work, refs #24507

diff --git src/hg/js/utils.js src/hg/js/utils.js
index 417134d..20152b3 100644
--- src/hg/js/utils.js
+++ src/hg/js/utils.js
@@ -977,34 +977,36 @@
             }
         }
         if (name && name !== "Submit" && val !== undefined && val !== null) {
             urlData[name] = val;
         }
     });
     // special case the vcfSampleOrder variable because it is a hidden input type that
     // changes based on click-drag
     $(inp).filter('[name$="vcfSampleOrder"]').each(function (i) {
         var name  = $(this).attr('name');
         var val = $(this).val();
         if (name && name !== "Submit" && val !== undefined && val !== null) {
             urlData[name] = val;
         }
     });
-    // special case the highlight color picker
-    $(inp).filter('[id=hgTrackUiHighlightPicker]').each(function(i) {
-        var name = subtrackName + ".highlightColor";
-        var val = $("#hgTrackUiHighlightInput").val();
+    // special case the highlight/color picker inputs
+    $(inp).filter('[id^=colorPicker],[id^=colorInput]').each(function(i) {
+        // remove the prefix that lets us recognize this setting, what remains
+        // is specific to the track or for the back end
+        var name = $(this)[0].id.replace("colorPicker.", "").replace("colorInput.", "");
+        var val = $(this).val();
         urlData[name] = val;
     });
     $(sel).filter('[name]:enabled').each(function (i) {
         var name  = $(this).attr('name');
         var val = $(this).val();
         if (name && val !== undefined && val !== null) {
             if (subtrackName && name === subtrackName) {
                 if (val === 'hide') {
                    urlData[name+"_sel"] = 0;    // Can't delete "_sel" because default takes over
                    urlData[name]        = "[]"; // Can delete vis because
                 } else {                        //     subtrack vis should be inherited.
                     urlData[name+"_sel"] = 1;
                     urlData[name]        = val;
                 }
             } else {
@@ -4331,35 +4333,15 @@
                 searchObj[db].results[searchTerm] = extra;
                 if (searchList.length >= 5) {
                     let toDelete = searchList.pop();
                     delete searchObj[db].results[toDelete];
                 }
             }
             searchList.unshift(searchTerm);
             searchObj.stack = searchList;
         } else {
             searchObj[db] = {"stack": [searchTerm], "results": {}};
             searchObj[db].results[searchTerm] = extra;
         }
         window.localStorage.setItem("searchStack", JSON.stringify(searchObj));
     }
 }
-
-function activateColorPicker (inputFieldId, colorPickerId) 
-/* connect a color picker to a text input field with the color hex value */
-{
-    var opt = {
-        hideAfterPaletteSelect : true,
-        color : $(inputFieldId).val(),
-        showPalette: true,
-        showInput: true,
-        showSelectionPalette: true,
-        showInitial: true,
-        preferredFormat: "hex",
-        localStorageKey: "genomebrowser",
-        change: function() { var color = $(colorPickerId).spectrum("get"); $(inputFieldId).val(color); },
-    };
-    $(colorPickerId).spectrum(opt);
-    // update the color picker if you change the input box
-    $(inputFieldId).change(function(){ $(colorPickerId).spectrum("set", $(inputFieldId).val()); });
-}
-