blob: 6103fec62b6f8497e91f663081a3a2324a0517a7 [file] [log] [blame] [edit]
// 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);
});
})();