Many hyperlinks are disabled.
Use anonymous login
to enable hyperlinks.
Overview
| Comment: | Give a visual feedback when the copy icon is clicked. |
|---|---|
| Downloads: | Tarball | ZIP archive |
| Timelines: | family | ancestors | descendants | both | tooltip-copyhash |
| Files: | files | file ages | folders |
| SHA3-256: |
3783706f674ae78079c9aa4a954e8de1 |
| User & Date: | florian 2019-05-29 12:47:00.000 |
Context
|
2019-05-29
| ||
| 12:55 | More consistent naming of variables in the newly added Javascript part. ... (check-in: c887a1bb00 user: florian tags: tooltip-copyhash) | |
| 12:47 | Give a visual feedback when the copy icon is clicked. ... (check-in: 3783706f67 user: florian tags: tooltip-copyhash) | |
| 12:39 | Introduce the "copy-button" CSS class with the SVG icon as the background image, to simplify the Javascript part. ... (check-in: b0795ff620 user: florian tags: tooltip-copyhash) | |
Changes
Changes to src/graph.js.
| ︙ | ︙ | |||
623 624 625 626 627 628 629 |
tooltipObj.style.backgroundColor = s.getPropertyValue('background-color')
}
tooltipObj.style.borderColor =
tooltipObj.style.color = s.getPropertyValue('color')
tooltipObj.style.visibility = "hidden"
tooltipObj.innerHTML = html
tooltipObj.appendChild(document.createTextNode(' '));
| | | 623 624 625 626 627 628 629 630 631 632 633 634 635 636 637 |
tooltipObj.style.backgroundColor = s.getPropertyValue('background-color')
}
tooltipObj.style.borderColor =
tooltipObj.style.color = s.getPropertyValue('color')
tooltipObj.style.visibility = "hidden"
tooltipObj.innerHTML = html
tooltipObj.appendChild(document.createTextNode(' '));
tooltipObj.appendChild(makeCopyButton("tooltip-copybtn","tooltip-link"));
tooltipObj.style.display = "inline"
tooltipObj.style.position = "absolute"
var x = tooltipInfo.posX + 4 + window.pageXOffset
- absoluteX(tooltipObj.offsetParent)
tooltipObj.style.left = x+"px"
var y = tooltipInfo.posY + window.pageYOffset
- tooltipObj.clientHeight - 4
|
| ︙ | ︙ | |||
761 762 763 764 765 766 767 768 769 770 771 772 773 774 775 776 777 778 779 780 781 782 783 784 |
function makeCopyButton(idButton,idTarget){
var button = document.getElementById(idButton);
if( !button ){
button = document.createElement("span");
button.className = "copy-button";
button.id = idButton;
}
if( idTarget ) button.setAttribute("data-copytarget",idTarget);
button.onclick = clickCopyButton;
return button;
}
/* The onclick handler for the "Copy Text" button. */
var lockCopyText = false;
function clickCopyButton(e){
e.preventDefault(); /* Mandatory for <a> and <button>. */
e.stopPropagation();
if( lockCopyText ) return;
lockCopyText = true;
var idTarget = this.getAttribute("data-copytarget");
var elTarget = document.getElementById(idTarget);
if( elTarget ){
var text = elTarget.innerText;
copyTextToClipboard(text);
}
| > > > > > > > > > > | > | 761 762 763 764 765 766 767 768 769 770 771 772 773 774 775 776 777 778 779 780 781 782 783 784 785 786 787 788 789 790 791 792 793 794 795 796 797 798 799 800 801 802 803 |
function makeCopyButton(idButton,idTarget){
var button = document.getElementById(idButton);
if( !button ){
button = document.createElement("span");
button.className = "copy-button";
button.id = idButton;
}
button.style.transition = "";
button.style.opacity = 1;
if( idTarget ) button.setAttribute("data-copytarget",idTarget);
button.onclick = clickCopyButton;
return button;
}
/* The onclick handler for the "Copy Text" button. */
var lockCopyText = false;
function clickCopyButton(e){
e.preventDefault(); /* Mandatory for <a> and <button>. */
e.stopPropagation();
if( lockCopyText ) return;
lockCopyText = true;
this.style.transition = "opacity 400ms ease-in-out";
this.style.opacity = 0;
var idTarget = this.getAttribute("data-copytarget");
var elTarget = document.getElementById(idTarget);
if( elTarget ){
var text = elTarget.innerText;
copyTextToClipboard(text);
}
setTimeout(function(id){
var elButton = document.getElementById(id);
if( elButton ){
elButton.style.transition = "";
elButton.style.opacity = 1;
}
lockCopyText = false;
}.bind(null,this.id),400);
}
/* Create a temporary <textarea> element and copy the contents to clipboard. */
function copyTextToClipboard(text){
var textArea = document.createElement("textarea");
textArea.style.position = 'fixed';
textArea.style.top = 0;
textArea.style.left = 0;
|
| ︙ | ︙ |