Fossil SCM

Explicitly query the client mouse coordinates, to fix the positioning of tooltips for nodes in IE.

florian 2019-05-28 12:15 tooltip-experiments
Commit ac199e7a8aece7e778011ecb3a3021e462ba90ef9c7953169cf279b36ed7c1db
1 file changed +8 -8
+8 -8
--- src/graph.js
+++ src/graph.js
@@ -157,12 +157,12 @@
157157
** element, so clear the dwell timer, and record the new element id and
158158
** mouse position. */
159159
stopDwellTimer();
160160
if(ix >= 0){
161161
tooltipInfo.ixHover = ix;
162
- tooltipInfo.posX = e.x;
163
- tooltipInfo.posY = e.y;
162
+ tooltipInfo.posX = e.clientX;
163
+ tooltipInfo.posY = e.clientY;
164164
stopCloseTimer();
165165
if(tooltipInfo.dwellTimeout>0){
166166
tooltipInfo.idTimer = setTimeout(function() {
167167
tooltipInfo.idTimer = 0;
168168
stopCloseTimer();
@@ -188,12 +188,12 @@
188188
function nodeHover(e){
189189
/* Invoked by mousemove events over a graph node */
190190
e.stopPropagation()
191191
if(tooltipInfo.ixHover==-2) return
192192
tooltipInfo.ixHover = -2
193
- tooltipInfo.posX = e.x
194
- tooltipInfo.posY = e.y
193
+ tooltipInfo.posX = e.clientX
194
+ tooltipInfo.posY = e.clientY
195195
tooltipInfo.nodeHover = this
196196
stopCloseTimer();
197197
if(tooltipInfo.dwellTimeout>0){
198198
tooltipInfo.idTimer = setTimeout(function() {
199199
tooltipInfo.idTimer = 0;
@@ -557,12 +557,12 @@
557557
}
558558
function findTxIndex(e){
559559
/* Look at all the graph elements. If any graph elements that is near
560560
** the click-point "e" and has a "data-ix" attribute, then return
561561
** the value of that attribute. Otherwise return -1 */
562
- var x = e.x + window.pageXOffset - absoluteX(canvasDiv);
563
- var y = e.y + window.pageYOffset - absoluteY(canvasDiv);
562
+ var x = e.clientX + window.pageXOffset - absoluteX(canvasDiv);
563
+ var y = e.clientY + window.pageYOffset - absoluteY(canvasDiv);
564564
var aNode = canvasDiv.childNodes
565565
var nNode = aNode.length;
566566
var i;
567567
for(i=0;i<nNode;i++){
568568
var n = aNode[i]
@@ -583,12 +583,12 @@
583583
dest += encodeURIComponent(tx.rowinfo[ix].h)
584584
return dest
585585
}
586586
function clickOnGraph(e){
587587
tooltipInfo.ixHover = findTxIndex(e);
588
- tooltipInfo.posX = e.x;
589
- tooltipInfo.posY = e.y;
588
+ tooltipInfo.posX = e.clientX;
589
+ tooltipInfo.posY = e.clientY;
590590
showGraphTooltip();
591591
}
592592
function showGraphTooltip(){
593593
var html = null
594594
var ix = -1
595595
--- src/graph.js
+++ src/graph.js
@@ -157,12 +157,12 @@
157 ** element, so clear the dwell timer, and record the new element id and
158 ** mouse position. */
159 stopDwellTimer();
160 if(ix >= 0){
161 tooltipInfo.ixHover = ix;
162 tooltipInfo.posX = e.x;
163 tooltipInfo.posY = e.y;
164 stopCloseTimer();
165 if(tooltipInfo.dwellTimeout>0){
166 tooltipInfo.idTimer = setTimeout(function() {
167 tooltipInfo.idTimer = 0;
168 stopCloseTimer();
@@ -188,12 +188,12 @@
188 function nodeHover(e){
189 /* Invoked by mousemove events over a graph node */
190 e.stopPropagation()
191 if(tooltipInfo.ixHover==-2) return
192 tooltipInfo.ixHover = -2
193 tooltipInfo.posX = e.x
194 tooltipInfo.posY = e.y
195 tooltipInfo.nodeHover = this
196 stopCloseTimer();
197 if(tooltipInfo.dwellTimeout>0){
198 tooltipInfo.idTimer = setTimeout(function() {
199 tooltipInfo.idTimer = 0;
@@ -557,12 +557,12 @@
557 }
558 function findTxIndex(e){
559 /* Look at all the graph elements. If any graph elements that is near
560 ** the click-point "e" and has a "data-ix" attribute, then return
561 ** the value of that attribute. Otherwise return -1 */
562 var x = e.x + window.pageXOffset - absoluteX(canvasDiv);
563 var y = e.y + window.pageYOffset - absoluteY(canvasDiv);
564 var aNode = canvasDiv.childNodes
565 var nNode = aNode.length;
566 var i;
567 for(i=0;i<nNode;i++){
568 var n = aNode[i]
@@ -583,12 +583,12 @@
583 dest += encodeURIComponent(tx.rowinfo[ix].h)
584 return dest
585 }
586 function clickOnGraph(e){
587 tooltipInfo.ixHover = findTxIndex(e);
588 tooltipInfo.posX = e.x;
589 tooltipInfo.posY = e.y;
590 showGraphTooltip();
591 }
592 function showGraphTooltip(){
593 var html = null
594 var ix = -1
595
--- src/graph.js
+++ src/graph.js
@@ -157,12 +157,12 @@
157 ** element, so clear the dwell timer, and record the new element id and
158 ** mouse position. */
159 stopDwellTimer();
160 if(ix >= 0){
161 tooltipInfo.ixHover = ix;
162 tooltipInfo.posX = e.clientX;
163 tooltipInfo.posY = e.clientY;
164 stopCloseTimer();
165 if(tooltipInfo.dwellTimeout>0){
166 tooltipInfo.idTimer = setTimeout(function() {
167 tooltipInfo.idTimer = 0;
168 stopCloseTimer();
@@ -188,12 +188,12 @@
188 function nodeHover(e){
189 /* Invoked by mousemove events over a graph node */
190 e.stopPropagation()
191 if(tooltipInfo.ixHover==-2) return
192 tooltipInfo.ixHover = -2
193 tooltipInfo.posX = e.clientX
194 tooltipInfo.posY = e.clientY
195 tooltipInfo.nodeHover = this
196 stopCloseTimer();
197 if(tooltipInfo.dwellTimeout>0){
198 tooltipInfo.idTimer = setTimeout(function() {
199 tooltipInfo.idTimer = 0;
@@ -557,12 +557,12 @@
557 }
558 function findTxIndex(e){
559 /* Look at all the graph elements. If any graph elements that is near
560 ** the click-point "e" and has a "data-ix" attribute, then return
561 ** the value of that attribute. Otherwise return -1 */
562 var x = e.clientX + window.pageXOffset - absoluteX(canvasDiv);
563 var y = e.clientY + window.pageYOffset - absoluteY(canvasDiv);
564 var aNode = canvasDiv.childNodes
565 var nNode = aNode.length;
566 var i;
567 for(i=0;i<nNode;i++){
568 var n = aNode[i]
@@ -583,12 +583,12 @@
583 dest += encodeURIComponent(tx.rowinfo[ix].h)
584 return dest
585 }
586 function clickOnGraph(e){
587 tooltipInfo.ixHover = findTxIndex(e);
588 tooltipInfo.posX = e.clientX;
589 tooltipInfo.posY = e.clientY;
590 showGraphTooltip();
591 }
592 function showGraphTooltip(){
593 var html = null
594 var ix = -1
595

Keyboard Shortcuts

Open search /
Next entry (timeline) j
Previous entry (timeline) k
Open focused entry Enter
Show this help ?
Toggle theme Top nav button