Fossil SCM
Automatically set the element ID for dynamically created copy buttons to "copy-IDTARGET" (analogous to the TH1 copybtn function).
Commit
42972005c42a31a4dd8ab4e052876a88d13e99a6134d66f37485b87bbb91b36d
Parent
b19a9826082cf84…
2 files changed
+6
-5
+1
-1
+6
-5
| --- src/copybtn.js | ||
| +++ src/copybtn.js | ||
| @@ -1,10 +1,11 @@ | ||
| 1 | 1 | /* Manage "Copy Buttons" linked to target elements, to copy the text (or, parts |
| 2 | 2 | ** thereof) of the target elements to the clipboard. |
| 3 | 3 | ** |
| 4 | 4 | ** Newly created buttons are <span> elements with an SVG background icon, |
| 5 | -** defined by the "copy-button" class in the default CSS style sheet. | |
| 5 | +** defined by the "copy-button" class in the default CSS style sheet, and are | |
| 6 | +** assigned the element ID "copy-<idTarget>". | |
| 6 | 7 | ** |
| 7 | 8 | ** To simplify customization, the only properties modified for HTML-defined |
| 8 | 9 | ** buttons are the "onclick" handler, and the "transition" and "opacity" styles |
| 9 | 10 | ** (used for animation). |
| 10 | 11 | ** |
| @@ -17,17 +18,17 @@ | ||
| 17 | 18 | ** <cchLength>, respectively. Set <cchLength> to "-1" to explicitly remove the |
| 18 | 19 | ** previous copy length limit. |
| 19 | 20 | ** |
| 20 | 21 | ** HTML snippet for statically created buttons: |
| 21 | 22 | ** |
| 22 | -** <span class="copy-button" id="idButton" | |
| 23 | -** data-copytarget="idTarget" data-copylength="cchLength"></span> | |
| 23 | +** <span class="copy-button" id="copy-<idTarget>" | |
| 24 | +** data-copytarget="<idTarget>" data-copylength="<cchLength>"></span> | |
| 24 | 25 | */ |
| 25 | -function makeCopyButton(idButton,idTarget,cchLength){ | |
| 26 | +function makeCopyButton(idTarget,cchLength){ | |
| 26 | 27 | var elButton = document.createElement("span"); |
| 27 | 28 | elButton.className = "copy-button"; |
| 28 | - elButton.id = idButton; | |
| 29 | + elButton.id = "copy-" + idTarget; | |
| 29 | 30 | initCopyButton(elButton,idTarget,cchLength); |
| 30 | 31 | return elButton; |
| 31 | 32 | } |
| 32 | 33 | function initCopyButtonById(idButton,idTarget,cchLength){ |
| 33 | 34 | var elButton = document.getElementById(idButton); |
| 34 | 35 |
| --- src/copybtn.js | |
| +++ src/copybtn.js | |
| @@ -1,10 +1,11 @@ | |
| 1 | /* Manage "Copy Buttons" linked to target elements, to copy the text (or, parts |
| 2 | ** thereof) of the target elements to the clipboard. |
| 3 | ** |
| 4 | ** Newly created buttons are <span> elements with an SVG background icon, |
| 5 | ** defined by the "copy-button" class in the default CSS style sheet. |
| 6 | ** |
| 7 | ** To simplify customization, the only properties modified for HTML-defined |
| 8 | ** buttons are the "onclick" handler, and the "transition" and "opacity" styles |
| 9 | ** (used for animation). |
| 10 | ** |
| @@ -17,17 +18,17 @@ | |
| 17 | ** <cchLength>, respectively. Set <cchLength> to "-1" to explicitly remove the |
| 18 | ** previous copy length limit. |
| 19 | ** |
| 20 | ** HTML snippet for statically created buttons: |
| 21 | ** |
| 22 | ** <span class="copy-button" id="idButton" |
| 23 | ** data-copytarget="idTarget" data-copylength="cchLength"></span> |
| 24 | */ |
| 25 | function makeCopyButton(idButton,idTarget,cchLength){ |
| 26 | var elButton = document.createElement("span"); |
| 27 | elButton.className = "copy-button"; |
| 28 | elButton.id = idButton; |
| 29 | initCopyButton(elButton,idTarget,cchLength); |
| 30 | return elButton; |
| 31 | } |
| 32 | function initCopyButtonById(idButton,idTarget,cchLength){ |
| 33 | var elButton = document.getElementById(idButton); |
| 34 |
| --- src/copybtn.js | |
| +++ src/copybtn.js | |
| @@ -1,10 +1,11 @@ | |
| 1 | /* Manage "Copy Buttons" linked to target elements, to copy the text (or, parts |
| 2 | ** thereof) of the target elements to the clipboard. |
| 3 | ** |
| 4 | ** Newly created buttons are <span> elements with an SVG background icon, |
| 5 | ** defined by the "copy-button" class in the default CSS style sheet, and are |
| 6 | ** assigned the element ID "copy-<idTarget>". |
| 7 | ** |
| 8 | ** To simplify customization, the only properties modified for HTML-defined |
| 9 | ** buttons are the "onclick" handler, and the "transition" and "opacity" styles |
| 10 | ** (used for animation). |
| 11 | ** |
| @@ -17,17 +18,17 @@ | |
| 18 | ** <cchLength>, respectively. Set <cchLength> to "-1" to explicitly remove the |
| 19 | ** previous copy length limit. |
| 20 | ** |
| 21 | ** HTML snippet for statically created buttons: |
| 22 | ** |
| 23 | ** <span class="copy-button" id="copy-<idTarget>" |
| 24 | ** data-copytarget="<idTarget>" data-copylength="<cchLength>"></span> |
| 25 | */ |
| 26 | function makeCopyButton(idTarget,cchLength){ |
| 27 | var elButton = document.createElement("span"); |
| 28 | elButton.className = "copy-button"; |
| 29 | elButton.id = "copy-" + idTarget; |
| 30 | initCopyButton(elButton,idTarget,cchLength); |
| 31 | return elButton; |
| 32 | } |
| 33 | function initCopyButtonById(idButton,idTarget,cchLength){ |
| 34 | var elButton = document.getElementById(idButton); |
| 35 |
+1
-1
| --- src/graph.js | ||
| +++ src/graph.js | ||
| @@ -630,11 +630,11 @@ | ||
| 630 | 630 | tooltipObj.style.color = s.getPropertyValue('color') |
| 631 | 631 | tooltipObj.style.visibility = "hidden" |
| 632 | 632 | tooltipObj.innerHTML = html |
| 633 | 633 | tooltipObj.appendChild(document.createTextNode(' ')); |
| 634 | 634 | tooltipObj.appendChild( |
| 635 | - makeCopyButton("copy-tooltip-link","tooltip-link",0)); | |
| 635 | + makeCopyButton("tooltip-link",0)); | |
| 636 | 636 | tooltipObj.style.display = "inline" |
| 637 | 637 | tooltipObj.style.position = "absolute" |
| 638 | 638 | var x = tooltipInfo.posX + 4 + window.pageXOffset |
| 639 | 639 | - absoluteX(tooltipObj.offsetParent) |
| 640 | 640 | tooltipObj.style.left = x+"px" |
| 641 | 641 |
| --- src/graph.js | |
| +++ src/graph.js | |
| @@ -630,11 +630,11 @@ | |
| 630 | tooltipObj.style.color = s.getPropertyValue('color') |
| 631 | tooltipObj.style.visibility = "hidden" |
| 632 | tooltipObj.innerHTML = html |
| 633 | tooltipObj.appendChild(document.createTextNode(' ')); |
| 634 | tooltipObj.appendChild( |
| 635 | makeCopyButton("copy-tooltip-link","tooltip-link",0)); |
| 636 | tooltipObj.style.display = "inline" |
| 637 | tooltipObj.style.position = "absolute" |
| 638 | var x = tooltipInfo.posX + 4 + window.pageXOffset |
| 639 | - absoluteX(tooltipObj.offsetParent) |
| 640 | tooltipObj.style.left = x+"px" |
| 641 |
| --- src/graph.js | |
| +++ src/graph.js | |
| @@ -630,11 +630,11 @@ | |
| 630 | tooltipObj.style.color = s.getPropertyValue('color') |
| 631 | tooltipObj.style.visibility = "hidden" |
| 632 | tooltipObj.innerHTML = html |
| 633 | tooltipObj.appendChild(document.createTextNode(' ')); |
| 634 | tooltipObj.appendChild( |
| 635 | makeCopyButton("tooltip-link",0)); |
| 636 | tooltipObj.style.display = "inline" |
| 637 | tooltipObj.style.position = "absolute" |
| 638 | var x = tooltipInfo.posX + 4 + window.pageXOffset |
| 639 | - absoluteX(tooltipObj.offsetParent) |
| 640 | tooltipObj.style.left = x+"px" |
| 641 |