Many hyperlinks are disabled.
Use anonymous login
to enable hyperlinks.
Overview
Comment: | Improvements to tooltip handling. |
---|---|
Downloads: | Tarball | ZIP archive | SQL archive |
Timelines: | family | ancestors | descendants | both | trunk |
Files: | files | file ages | folders |
SHA3-256: |
3a8abf492ab21ab4e838377b0228635a |
User & Date: | drh 2019-06-12 09:41:26 |
Context
2019-06-12
| ||
12:11 | Avoid attaching a database file that already exists. ... (check-in: 052c5f24 user: drh tags: trunk) | |
09:41 | Improvements to tooltip handling. ... (check-in: 3a8abf49 user: drh tags: trunk) | |
2019-06-11
| ||
06:59 | Fix the test whether the currently hovered element is the owner of the tooltip. ... (Closed-Leaf check-in: 49bee969 user: florian tags: tooltip-tweaks) | |
2019-06-10
| ||
01:53 | Simplifications to the copybtn.js script. ... (check-in: 5f0479d0 user: drh tags: trunk) | |
Changes
Changes to src/graph.js.
︙ | ︙ | |||
114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 | ixHover: -1, /* The mouse is over a thick riser arrow for ** tx.rowinfo[ixHover]. Or -2 when the mouse is ** over a graph node. Or -1 when the mouse is not ** over anything. */ ixActive: -1, /* The item shown in the tooltip is tx.rowinfo[ixActive]. ** ixActive is -1 if the tooltip is not visible */ nodeHover: null, /* Graph node under mouse when ixHover==-2 */ posX: 0, posY: 0 /* The last mouse position. */ }; /* Functions used to control the tooltip popup and its timer */ function onKeyDown(event){ /* Hide the tooltip when ESC key pressed */ var key = event.which || event.keyCode; if( key==27 ){ event.stopPropagation(); hideGraphTooltip(); } } function hideGraphTooltip(){ /* Hide the tooltip */ document.removeEventListener('keydown',onKeyDown,/* useCapture == */true); stopCloseTimer(); tooltipObj.style.display = "none"; tooltipInfo.ixActive = -1; } document.body.onunload = hideGraphTooltip function stopDwellTimer(){ if(tooltipInfo.idTimer!=0){ clearTimeout(tooltipInfo.idTimer); tooltipInfo.idTimer = 0; } | > > | 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 | ixHover: -1, /* The mouse is over a thick riser arrow for ** tx.rowinfo[ixHover]. Or -2 when the mouse is ** over a graph node. Or -1 when the mouse is not ** over anything. */ ixActive: -1, /* The item shown in the tooltip is tx.rowinfo[ixActive]. ** ixActive is -1 if the tooltip is not visible */ nodeHover: null, /* Graph node under mouse when ixHover==-2 */ idNodeActive: 0, /* Element ID of the graph node with the tooltip. */ posX: 0, posY: 0 /* The last mouse position. */ }; /* Functions used to control the tooltip popup and its timer */ function onKeyDown(event){ /* Hide the tooltip when ESC key pressed */ var key = event.which || event.keyCode; if( key==27 ){ event.stopPropagation(); hideGraphTooltip(); } } function hideGraphTooltip(){ /* Hide the tooltip */ document.removeEventListener('keydown',onKeyDown,/* useCapture == */true); stopCloseTimer(); tooltipObj.style.display = "none"; tooltipInfo.ixActive = -1; tooltipInfo.idNodeActive = 0; } document.body.onunload = hideGraphTooltip function stopDwellTimer(){ if(tooltipInfo.idTimer!=0){ clearTimeout(tooltipInfo.idTimer); tooltipInfo.idTimer = 0; } |
︙ | ︙ | |||
167 168 169 170 171 172 173 | tooltipInfo.closeTimeout = tx.closeTimeout tooltipInfo.hashDigits = tx.hashDigits topObj.onclick = clickOnGraph topObj.ondblclick = dblclickOnGraph topObj.onmousemove = function(e) { var ix = findTxIndex(e); topObj.style.cursor = (ix<0) ? "" : "pointer" | < < < < < < < < < < < < < < < < < < | < < < < < < < > > > > > > | > > > | > | | < < | | | 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 | tooltipInfo.closeTimeout = tx.closeTimeout tooltipInfo.hashDigits = tx.hashDigits topObj.onclick = clickOnGraph topObj.ondblclick = dblclickOnGraph topObj.onmousemove = function(e) { var ix = findTxIndex(e); topObj.style.cursor = (ix<0) ? "" : "pointer" mouseOverGraph(e,ix,null); }; topObj.onmouseleave = function(e) { /* Hide the tooltip if the mouse is outside the "timelineTableN" element, ** and outside the tooltip. */ if(e.relatedTarget && e.relatedTarget != tooltipObj){ tooltipInfo.ixHover = -1; hideGraphTooltip(); stopDwellTimer(); stopCloseTimer(); } }; function mouseOverNode(e){ /* Invoked by mousemove events over a graph node */ e.stopPropagation() mouseOverGraph(e,-2,this) } /* Combined mousemove handler for graph nodes and rails. */ function mouseOverGraph(e,ix,node){ stopDwellTimer(); // Mouse movement: reset the dwell timer. var ownTooltip = // Check if the hovered element already has the tooltip. (ix>=0 && ix==tooltipInfo.ixActive) || (ix==-2 && tooltipInfo.idNodeActive==node.id); if(ownTooltip) stopCloseTimer(); // ownTooltip: clear the close timer. else resumeCloseTimer(); // !ownTooltip: resume the close timer. tooltipInfo.ixHover = ix; tooltipInfo.nodeHover = node; tooltipInfo.posX = e.clientX; tooltipInfo.posY = e.clientY; if(ix!=-1 && !ownTooltip && tooltipInfo.dwellTimeout>0){ // Go dwell timer. tooltipInfo.idTimer = setTimeout(function(){ tooltipInfo.idTimer = 0; stopCloseTimer(); showGraphTooltip(); },tooltipInfo.dwellTimeout); } } var canvasDiv; |
︙ | ︙ | |||
609 610 611 612 613 614 615 616 617 618 619 620 621 622 623 624 625 626 627 628 629 630 631 632 633 634 635 636 637 638 639 640 641 642 643 644 645 646 647 648 649 650 651 652 | var br = tx.rowinfo[ix].br var dest = tx.baseUrl + "/timeline?r=" + encodeURIComponent(br) dest += tx.fileDiff ? "&m&cf=" : "&m&c=" dest += encodeURIComponent(tx.rowinfo[ix].h) return dest } function clickOnGraph(e){ tooltipInfo.ixHover = findTxIndex(e); tooltipInfo.posX = e.clientX; tooltipInfo.posY = e.clientY; showGraphTooltip(); } function showGraphTooltip(){ var html = null var ix = -1 if( tooltipInfo.ixHover==-2 ){ ix = parseInt(tooltipInfo.nodeHover.id.match(/\d+$/)[0],10)-tx.iTopRow var h = tx.rowinfo[ix].h var dest = tx.baseUrl + "/info/" + h h = h.slice(0,tooltipInfo.hashDigits); // Assume single-byte characters. if( tx.fileDiff ){ html = "artifact <a id=\"tooltip-link\" href=\""+dest+"\">"+h+"</a>" }else{ html = "check-in <a id=\"tooltip-link\" href=\""+dest+"\">"+h+"</a>" } tooltipInfo.ixActive = -2; }else if( tooltipInfo.ixHover>=0 ){ ix = tooltipInfo.ixHover var br = tx.rowinfo[ix].br var dest = branchHyperlink(ix) var hbr = br.replace(/&/g, "&") .replace(/</g, "<") .replace(/>/g, ">") .replace(/"/g, """) .replace(/'/g, "'"); html = "branch <a id=\"tooltip-link\" href=\""+dest+"\">"+hbr+"</a>" tooltipInfo.ixActive = ix; } if( html ){ /* Setup while hidden, to ensure proper dimensions. */ var s = getComputedStyle(document.body) if( tx.rowinfo[ix].bg.length ){ tooltipObj.style.backgroundColor = tx.rowinfo[ix].bg }else{ | > > > > | 594 595 596 597 598 599 600 601 602 603 604 605 606 607 608 609 610 611 612 613 614 615 616 617 618 619 620 621 622 623 624 625 626 627 628 629 630 631 632 633 634 635 636 637 638 639 640 641 | var br = tx.rowinfo[ix].br var dest = tx.baseUrl + "/timeline?r=" + encodeURIComponent(br) dest += tx.fileDiff ? "&m&cf=" : "&m&c=" dest += encodeURIComponent(tx.rowinfo[ix].h) return dest } function clickOnGraph(e){ stopCloseTimer(); stopDwellTimer(); tooltipInfo.ixHover = findTxIndex(e); tooltipInfo.posX = e.clientX; tooltipInfo.posY = e.clientY; showGraphTooltip(); } function showGraphTooltip(){ var html = null var ix = -1 if( tooltipInfo.ixHover==-2 ){ ix = parseInt(tooltipInfo.nodeHover.id.match(/\d+$/)[0],10)-tx.iTopRow var h = tx.rowinfo[ix].h var dest = tx.baseUrl + "/info/" + h h = h.slice(0,tooltipInfo.hashDigits); // Assume single-byte characters. if( tx.fileDiff ){ html = "artifact <a id=\"tooltip-link\" href=\""+dest+"\">"+h+"</a>" }else{ html = "check-in <a id=\"tooltip-link\" href=\""+dest+"\">"+h+"</a>" } tooltipInfo.ixActive = -2; tooltipInfo.idNodeActive = tooltipInfo.nodeHover.id; }else if( tooltipInfo.ixHover>=0 ){ ix = tooltipInfo.ixHover var br = tx.rowinfo[ix].br var dest = branchHyperlink(ix) var hbr = br.replace(/&/g, "&") .replace(/</g, "<") .replace(/>/g, ">") .replace(/"/g, """) .replace(/'/g, "'"); html = "branch <a id=\"tooltip-link\" href=\""+dest+"\">"+hbr+"</a>" tooltipInfo.ixActive = ix; tooltipInfo.idNodeActive = 0; } if( html ){ /* Setup while hidden, to ensure proper dimensions. */ var s = getComputedStyle(document.body) if( tx.rowinfo[ix].bg.length ){ tooltipObj.style.backgroundColor = tx.rowinfo[ix].bg }else{ |
︙ | ︙ |
Changes to src/timeline.c.
︙ | ︙ | |||
868 869 870 871 872 873 874 | @ "omitDescenders": %d(omitDescenders), @ "fileDiff": %d(fileDiff), @ "scrollToSelect": %d(scrollToSelect), @ "nrail": %d(pGraph->mxRail+1), @ "baseUrl": "%R", @ "dwellTimeout": %d(dwellTimeout), @ "closeTimeout": %d(closeTimeout), | | | 868 869 870 871 872 873 874 875 876 877 878 879 880 881 882 | @ "omitDescenders": %d(omitDescenders), @ "fileDiff": %d(fileDiff), @ "scrollToSelect": %d(scrollToSelect), @ "nrail": %d(pGraph->mxRail+1), @ "baseUrl": "%R", @ "dwellTimeout": %d(dwellTimeout), @ "closeTimeout": %d(closeTimeout), @ "hashDigits": %d(hash_digits(1)), @ "bottomRowId": "btm-%d(iTableId)", if( pGraph->nRow==0 ){ @ "rowinfo": null }else{ @ "rowinfo": [ } |
︙ | ︙ |