a5c5763cfadceb5a8894268830f34a830833aeaa
chmalee
  Wed Oct 18 11:44:55 2023 -0700
Fix mouseover coordinate setting when mousing over the grey bar button on hgTracks to take into the mouse position rather than just the element bounding rectangle, because we can cover as much of the grey button as we want, refs Max email

diff --git src/hg/js/utils.js src/hg/js/utils.js
index f0d1114..97c6f2c 100644
--- src/hg/js/utils.js
+++ src/hg/js/utils.js
@@ -3861,45 +3861,57 @@
     *     it would extend past the screen in which case it would go left/below appropriately.
     *     the refEl takes up the whole screen, in which case we can cover the refEl
     *     with no consequence */
     rect = boundingRect(refEl);
     refX = rect.x; refY = rect.y;
     refWidth = rect.width; refHeight = rect.height;
     refRight = rect.right; refLeft = rect.left;
     refTop = rect.top; refBottom = rect.bottom;
     let windowWidth = window.innerWidth;
     let windowHeight = window.innerHeight;
 
     // figure out how large the mouseover will be
     // use firstChild because popUpEl should be a div with a sole child in it
     let popUpRect = popUpEl.firstChild.getBoundingClientRect();
     // position the popUp to the right and above the cursor by default
-    let topOffset = refTop - popUpRect.height;
+    let topOffset;
+    if (refEl.coords !== undefined && refEl.coords.length > 0 && refEl.coords.split(",").length == 4) {
+        // boundingRect has determined exactly as close as we can get to the item without covering
+        topOffset = refTop - popUpRect.height;
+    } else {
+        // just use the mouseY position for placement, the -5 accounts for cursor size
+        topOffset = mouseY - window.scrollY - popUpRect.height - 5;
+    }
     let leftOffset = mouseX + 15; // add 15 for large cursor sizes
 
     // first case, refEl takes the whole width of the image, so not a big deal to cover some of it
     // this is most common for the track labels
     if (mouseX + popUpRect.width >= (windowWidth - 25)) {
         // move to the left
         leftOffset = mouseX - popUpRect.width;
     }
     // or the mouse is on the right third of the screen
     if (mouseX > (windowWidth* 0.66)) {
         // move to the left
         leftOffset = mouseX - popUpRect.width;
     }
 
+    // the page is scrolled or otherwise off the screen
+    if (topOffset <= 0) {
+        topOffset = mouseY - window.scrollY + popUpRect.height;
+    }
+
     if (leftOffset < 0) {
         throw new Error("trying to position off of screen to left");
     }
     popUpEl.style.left = leftOffset + "px";
     popUpEl.style.top = topOffset + "px";
 }
 
 // the current mouseover timer, for showing the mouseover after a delay
 var mouseoverTimer;
 // the timer for when a user is moving the mouse after already bringing up
 // a pop up, there may be many items close together and we want the user
 // to bring up those mouseovers
 var mousemoveTimer;
 // flags to help figure out what state the users mouse is in:
 // hovered an item, moving to new item, moving to popup, moving away from popup/item