ADDED src/copybtn.js Index: src/copybtn.js ================================================================== --- src/copybtn.js +++ src/copybtn.js @@ -0,0 +1,135 @@ +/* Manage "Copy Buttons" linked to target elements, to copy the text (or, parts +** thereof) of the target elements to the clipboard. +** +** Newly created buttons are elements with an SVG background icon, +** defined by the "copy-button" class in the default CSS style sheet. +** +** To simplify customization, the only properties modified for HTML-defined +** buttons are the "onclick" handler, and the "transition" and "opacity" styles +** (used for animation). +** +** For HTML-defined buttons, either initCopyButtonById(), or initCopyButton(), +** needs to be called to attach the "onclick" handler (done automatically from +** a handler attached to the "DOMContentLoaded" event). +** +** The initialization functions do not overwrite the "data-copytarget" and +** "data-copylength" attributes with empty or null values for and +** , respectively. Set to "-1" to explicitly remove the +** previous copy length limit. +** +** HTML snippet for statically created buttons: +** +** +*/ +function makeCopyButton(idButton,idTarget,cchLength){ + var elButton = document.createElement("span"); + elButton.className = "copy-button"; + elButton.id = idButton; + initCopyButton(elButton,idTarget,cchLength); + return elButton; +} +function initCopyButtonById(idButton,idTarget,cchLength){ + var elButton = document.getElementById(idButton); + if( elButton ) initCopyButton(elButton,idTarget,cchLength); + return elButton; +} +function initCopyButton(elButton,idTarget,cchLength){ + elButton.style.transition = ""; + elButton.style.opacity = 1; + if( idTarget ) elButton.setAttribute("data-copytarget",idTarget); + if( cchLength ) elButton.setAttribute("data-copylength",cchLength); + elButton.onclick = clickCopyButton; + return elButton; +} +onContentLoaded(function(){ + var aButtons = document.getElementsByClassName("copy-button"); + for ( var i=0; i and