set cursor: pointer and fix tooltips after re-entry at edges of charts. close #749.

Author: leeoniya

site/static/index.html

@@ -95,7 +95,29 @@
 
             const fmtDate = uPlot.fmtDate("{M}/{D}/{YY} {h}:{mm}:{ss} {AA}");
 
+            let over;
+
+            let tooltipVisible = false;
+
+            function showTooltip() {
+                if (!tooltipVisible) {
+                    tooltip.style.display = "block";
+                    over.style.cursor = "pointer";
+                    tooltipVisible = true;
+                }
+            }
+
+            function hideTooltip() {
+                if (tooltipVisible) {
+                    tooltip.style.display = "none";
+                    over.style.cursor = null;
+                    tooltipVisible = false;
+                }
+            }
+
             function setTooltip(u) {
+                showTooltip();
+
                 let top = u.valToPos(u.data[seriesIdx][dataIdx], 'y');
                 let lft = u.valToPos(u.data[        0][dataIdx], 'x');
 
@@ -124,7 +146,8 @@
                 hooks: {
                     ready: [
                         u => {
-                            let over = u.root.querySelector(".u-over");
+                            over = u.root.querySelector(".u-over");
+
                             tooltipLeftOffset = parseFloat(over.style.left);
                             tooltipTopOffset = parseFloat(over.style.top);
                             u.root.querySelector(".u-wrap").appendChild(tooltip);
@@ -151,11 +174,11 @@
                         u => {
                             let c = u.cursor;
 
-                            if (c.idx != dataIdx) {
+                            if (dataIdx != c.idx) {
                                 dataIdx = c.idx;
 
                                 if (seriesIdx != null)
-                                    setTooltip(u, setTooltip);
+                                    setTooltip(u);
                             }
                         }
                     ],
@@ -165,11 +188,9 @@
                                 seriesIdx = sidx;
 
                                 if (sidx == null)
-                                    tooltip.style.display = "none";
-                                else if (dataIdx != null) {
-                                    tooltip.style.display = "block";
+                                    hideTooltip();
+                                else if (dataIdx != null)
                                     setTooltip(u);
-                                }
                             }
                         }
                     ],