| // Simple "copy to clipboard" button for code blocks. | |
| // Adds a button to each <div class="highlight"> block. | |
| (function () { | |
| "use strict"; | |
| function addCopyButton(block) { | |
| var button = document.createElement("button"); | |
| button.className = "copybutton"; | |
| button.title = "Copy"; | |
| button.setAttribute("aria-label", "Copy code to clipboard"); | |
| button.innerHTML = | |
| '<svg aria-hidden="true" height="16" viewBox="0 0 16 16" width="16">' + | |
| '<path d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 ' + | |
| "0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 " + | |
| "0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z" + | |
| '"/><path d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 ' + | |
| "1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 " + | |
| ".138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z" + | |
| '"/></svg>'; | |
| button.addEventListener("click", function () { | |
| var code = block.querySelector("pre").innerText; | |
| navigator.clipboard.writeText(code).then( | |
| function () { | |
| button.classList.add("copied"); | |
| setTimeout(function () { | |
| button.classList.remove("copied"); | |
| }, 2000); | |
| }, | |
| function () { | |
| // Fallback for older browsers. | |
| var ta = document.createElement("textarea"); | |
| ta.value = code; | |
| ta.style.position = "fixed"; | |
| ta.style.opacity = "0"; | |
| document.body.appendChild(ta); | |
| ta.focus(); | |
| ta.select(); | |
| document.execCommand("copy"); | |
| document.body.removeChild(ta); | |
| button.classList.add("copied"); | |
| setTimeout(function () { | |
| button.classList.remove("copied"); | |
| }, 2000); | |
| } | |
| ); | |
| }); | |
| block.style.position = "relative"; | |
| block.appendChild(button); | |
| } | |
| document.addEventListener("DOMContentLoaded", function () { | |
| document.querySelectorAll("div.highlight").forEach(addCopyButton); | |
| }); | |
| })(); |