59481800d466906fc4f5be900b676f6e4b611470
max
  Thu Dec 5 05:02:36 2024 -0800
small improvements for highlights: when old and new pos strings are mixed, make sure that the default color is used rather than color of the previous element. Also, avoid running getDb() all the time in a loop. One day, highlights will be stored in a custom track... refs #34911

diff --git src/hg/js/hgTracks.js src/hg/js/hgTracks.js
index 92ab9ca..1109b70 100644
--- src/hg/js/hgTracks.js
+++ src/hg/js/hgTracks.js
@@ -4744,68 +4744,72 @@
                 pos.start = newPos.start;
                 pos.end   = newPos.end;
             }
         }
     },
 
     drawHighlights: function()
     // highlight vertical region in imgTbl based on hgTracks.highlight (#709).
     // For PDF/hgRenderTracks output, the highlights are drawn by hgTracks.c:drawHighlights()
     {
         var pos;
         var hexColor = dragSelect.hlColorDefault;
         // if possible, re-use the color that the user picked last time
         if (hgTracks.prevHlColor)
             hexColor = hgTracks.prevHlColor;
+        var defHexColor = hexColor;
 
         $('.highlightItem').remove();
         if (hgTracks.highlight) {
             var hlArray = hgTracks.highlight.split("|"); // support multiple highlight items
             for (var i = 0; i < hlArray.length; i++) {
                 hlString = hlArray[i];
                 pos = parsePositionWithDb(hlString);
                 // UN-DISGUISE
                 imageV2.undisguiseHighlight(pos);
-                if (pos) {
-                    pos.start--;  // make start 0-based to match hgTracks.winStart
-                    if (pos.color)
-                        hexColor = pos.color;
-                }
 
-                if (pos && pos.chrom === hgTracks.chromName && pos.db === getDb() 
-                &&  pos.start <= hgTracks.imgBoxPortalEnd && pos.end >= hgTracks.imgBoxPortalStart) {
+                var db = getDb();
+
+                if (pos && pos.db===db && pos.chrom === hgTracks.chromName
+                &&  (pos.start-1) <= hgTracks.imgBoxPortalEnd && pos.end >= hgTracks.imgBoxPortalStart) {
+                    pos.start--;  // make start 0-based to match hgTracks.winStart
                     var portalWidthBases = hgTracks.imgBoxPortalEnd - hgTracks.imgBoxPortalStart;
                     var portal = $('#imgTbl td.tdData')[0];
                     var leftPixels = $(portal).offset().left + imageV2.LEFTADD;
                     var pixelsPerBase = ($(portal).width() - 2) / portalWidthBases;
                     var clippedStartBases = Math.max(pos.start, hgTracks.imgBoxPortalStart);
                     var clippedEndBases = Math.min(pos.end, hgTracks.imgBoxPortalEnd);
                     var widthPixels = (clippedEndBases - clippedStartBases) * pixelsPerBase;
                     if (hgTracks.revCmplDisp)
                         leftPixels += (hgTracks.imgBoxPortalEnd - clippedEndBases) * pixelsPerBase - 1;
                     else
                         leftPixels += (clippedStartBases - hgTracks.imgBoxPortalStart) * pixelsPerBase;
                     // Impossible to get perfect... Okay to overrun by a pixel on each side
                     leftPixels  = Math.floor(leftPixels);
                     widthPixels = Math.ceil(widthPixels);
                     if (widthPixels < 2) {
                         widthPixels = 3;
                         leftPixels -= 1;
                     }
     
                     var area = jQuery("<div id='highlightItem' class='highlightItem'></div>");
-                    $(area).css({ backgroundColor: hexColor, // display: 'none'
+                    if (pos.color)
+                        hexColor = pos.color;
+                    else
+                        hexColor = defHexColor;
+
+                    $(area).css({ backgroundColor: hexColor,
                                 left: leftPixels + 'px', top: $('#imgTbl').offset().top + 1 + 'px',
                                 width: widthPixels + 'px',
                                 height: $('#imgTbl').css('height') });
                     $(area).data({leftPixels: leftPixels, widthPixels: widthPixels});// needed by dragScroll
     
                     // Larry originally appended to imgTbl, but discovered that doesn't work on IE 8 and 9.
                     $('body').append($(area)); 
                     // z-index is done in css class, so highlight is beneath transparent data images.
                     // NOTE: ideally highlight would be below transparent blue-lines, but THAT is a  
                     // background-image so z-index can't get below it!  PS/PDF looks better for blue-lines!
                 }
             }
         }
     },