2c9786155a4a3134fdef9c08b03148f1b9c988ec
max
  Thu Jul 16 06:11:45 2020 -0700
fixing highlight problems with chrom names that contain a period or colon, #25887

diff --git src/hg/js/hgTracks.js src/hg/js/hgTracks.js
index 44afbba..423536a 100644
--- src/hg/js/hgTracks.js
+++ src/hg/js/hgTracks.js
@@ -973,32 +973,32 @@
         $(form).attr('method','get');
     },
 
     restoreFromBackButton: function()
     // Re-enabling vis dropdowns is necessary because initForAjax() disables them on submit.
     {
         $('select.normalText,select.hiddenText').attr('disabled',false);
     }
 };
 
   ////////////////////////////////////////////////////////////
  // dragSelect is also known as dragZoom or shift-dragZoom //
 ////////////////////////////////////////////////////////////
 var dragSelect = {
 
-    hlColorDefault: '#aaedff', // default highlight color, if nothing specified
-    hlColor :       '#aaedff', // current highlight color
+    hlColorDefault: '#a5e7f8', // default highlight color, if nothing specified
+    hlColor :       '#a5e7f8', // current highlight color
     areaSelector:    null, // formerly "imgAreaSelect". jQuery element used for imgAreaSelect
     originalCursor:  null,
     startTime:       null,
     escPressed :     false,  // flag is set when user presses Escape
 
     selectStart: function (img, selection)
     {
         initVars();
         dragSelect.escPressed = false;
         if (rightClick.menu) {
             rightClick.menu.hide();
         }
         var now = new Date();
         dragSelect.startTime = now.getTime();
         posting.blockMapClicks();
@@ -1039,31 +1039,31 @@
             }
         }
         return null;
     },
 
     highlightThisRegion: function(newPosition, doAdd, hlColor)
     // set highlighting newPosition in server-side cart and apply the highlighting in local UI.
     {
         var hlColorName = hlColor; // js convention: do not assign to argument variables
         if (hlColor==="" || hlColor===null || hlColor===undefined)
             hlColorName = dragSelect.hlColor;
 
         var pos = parsePosition(newPosition);
         var start = pos.start;
         var end = pos.end;
-        var newHighlight = getDb() + "." + pos.chrom + ":" + start + "-" + end + hlColorName;
+        var newHighlight = getDb() + "#" + pos.chrom + "#" + start + "#" + end + hlColorName;
         newHighlight = imageV2.disguiseHighlight(newHighlight);
         var oldHighlight = hgTracks.highlight;
         if (oldHighlight===undefined || doAdd===undefined || doAdd===false || oldHighlight==="") {
             // just set/overwrite the old highlight position, this used to be the default
             hgTracks.highlight = newHighlight;
         }
         else {
             // add to the end of a |-separated list
             hgTracks.highlight = oldHighlight+"|"+newHighlight;
         }
         // we include enableHighlightingDialog because it may have been changed by the dialog
         var cartSettings = {             'highlight': hgTracks.highlight, 
                           'enableHighlightingDialog': hgTracks.enableHighlightingDialog ? 1 : 0 };
 
         if (hgTracks.windows && !hgTracks.virtualSingleChrom) {
@@ -1080,31 +1080,31 @@
                     var ce = e - w.virtStart + w.winStart;
                     if (nonVirtChrom === "") {
                         nonVirtChrom = w.chromName;
                         nonVirtStart = cs; 
                         nonVirtEnd   = ce;
                     } else {
                         if (w.chromName === nonVirtChrom) {
                             nonVirtEnd = Math.max(ce, nonVirtEnd);
                         } else {
                             break;
                         }
                     }
                 }
             }
             if (nonVirtChrom !== "")
-                cartSettings.nonVirtHighlight = getDb() + '.' + nonVirtChrom + ':' + nonVirtStart + '-' + (nonVirtEnd+1) + hlColorName;
+                cartSettings.nonVirtHighlight = getDb() + '#' + nonVirtChrom + '#' + nonVirtStart + '#' + (nonVirtEnd+1) + hlColorName;
         } else if (hgTracks.windows && hgTracks.virtualSingleChrom) {
                 cartSettings.nonVirtHighlight = hgTracks.highlight;
         }
         // TODO if not virt, do we need to erase cart nonVirtHighlight ?
         cart.setVarsObj(cartSettings);
         imageV2.highlightRegion();
     },
 
     selectionEndDialog: function (newPosition)
     // Let user choose between zoom-in and highlighting.
     {   
         // if the user hit Escape just before, do not show this dialog
         if (dragSelect.startTime===null)
             return;
         var dragSelectDialog = $("#dragSelectDialog")[0];
@@ -4187,31 +4187,31 @@
     },
 
     disguiseHighlight: function(position)
     // disguise highlight position
     {
         pos = parsePositionWithDb(position);
         // DISGUISE
         if (hgTracks.virtualSingleChrom && (pos.chrom.search("virt") === 0)) {
             var positionStr = pos.chrom+":"+pos.start+"-"+pos.end;
             var newPosition = genomePos.disguisePosition(positionStr);
             var newPos = parsePosition(newPosition);
             pos.chrom = newPos.chrom;
             pos.start = newPos.start;
             pos.end   = newPos.end;
         }
-        return pos.db+"."+pos.chrom+":"+pos.start+"-"+pos.end+pos.color;
+        return pos.db+"#"+pos.chrom+"#"+pos.start+"#"+pos.end+pos.color;
     },
 
     undisguiseHighlight: function(pos)
     // undisguise highlight pos
     {
         // UN-DISGUISE
         if (hgTracks.virtualSingleChrom && (pos.chrom.search("virt") !== 0)) {
             var position = pos.chrom+":"+pos.start+"-"+pos.end;
             var newPosition = genomePos.undisguisePosition(position);
             var newPos = parsePosition(newPosition);
             if (newPos) {
                 pos.chrom = newPos.chrom;
                 pos.start = newPos.start;
                 pos.end   = newPos.end;
             }