mirror of
https://github.com/nunocoracao/blowfish.git
synced 2026-01-30 16:31:52 +01:00
feat(codeblock): add title support
This commit is contained in:
@@ -2,31 +2,26 @@ var scriptBundle = document.getElementById("script-bundle");
|
||||
var copyText = scriptBundle?.getAttribute("data-copy") || "Copy";
|
||||
var copiedText = scriptBundle?.getAttribute("data-copied") || "Copied";
|
||||
|
||||
function createCopyButton(highlightDiv) {
|
||||
function createCopyButton(highlightWrapper) {
|
||||
const button = document.createElement("button");
|
||||
button.className = "copy-button";
|
||||
button.type = "button";
|
||||
button.ariaLabel = copyText;
|
||||
button.innerText = copyText;
|
||||
button.addEventListener("click", () => copyCodeToClipboard(button, highlightDiv));
|
||||
|
||||
highlightDiv.insertBefore(button, highlightDiv.firstChild);
|
||||
const wrapper = document.createElement("div");
|
||||
wrapper.className = "highlight-wrapper";
|
||||
highlightDiv.parentNode.insertBefore(wrapper, highlightDiv);
|
||||
wrapper.appendChild(highlightDiv);
|
||||
button.addEventListener("click", () => copyCodeToClipboard(button, highlightWrapper));
|
||||
highlightWrapper.insertBefore(button, highlightWrapper.firstChild);
|
||||
}
|
||||
|
||||
async function copyCodeToClipboard(button, highlightDiv) {
|
||||
const codeToCopy = getCodeText(highlightDiv);
|
||||
async function copyCodeToClipboard(button, highlightWrapper) {
|
||||
const codeToCopy = getCodeText(highlightWrapper);
|
||||
|
||||
function fallback(codeToCopy, highlightDiv) {
|
||||
function fallback(codeToCopy, highlightWrapper) {
|
||||
const textArea = document.createElement("textArea");
|
||||
textArea.contentEditable = "true";
|
||||
textArea.readOnly = "false";
|
||||
textArea.className = "copy-textarea";
|
||||
textArea.value = codeToCopy;
|
||||
highlightDiv.insertBefore(textArea, highlightDiv.firstChild);
|
||||
highlightWrapper.insertBefore(textArea, highlightWrapper.firstChild);
|
||||
const range = document.createRange();
|
||||
range.selectNodeContents(textArea);
|
||||
const sel = window.getSelection();
|
||||
@@ -34,7 +29,7 @@ async function copyCodeToClipboard(button, highlightDiv) {
|
||||
sel.addRange(range);
|
||||
textArea.setSelectionRange(0, 999999);
|
||||
document.execCommand("copy");
|
||||
highlightDiv.removeChild(textArea);
|
||||
highlightWrapper.removeChild(textArea);
|
||||
}
|
||||
|
||||
try {
|
||||
@@ -42,10 +37,10 @@ async function copyCodeToClipboard(button, highlightDiv) {
|
||||
if (result.state == "granted" || result.state == "prompt") {
|
||||
await navigator.clipboard.writeText(codeToCopy);
|
||||
} else {
|
||||
fallback(codeToCopy, highlightDiv);
|
||||
fallback(codeToCopy, highlightWrapper);
|
||||
}
|
||||
} catch (_) {
|
||||
fallback(codeToCopy, highlightDiv);
|
||||
fallback(codeToCopy, highlightWrapper);
|
||||
} finally {
|
||||
button.blur();
|
||||
button.innerText = copiedText;
|
||||
@@ -55,7 +50,10 @@ async function copyCodeToClipboard(button, highlightDiv) {
|
||||
}
|
||||
}
|
||||
|
||||
function getCodeText(highlightDiv) {
|
||||
function getCodeText(highlightWrapper) {
|
||||
const highlightDiv = highlightWrapper.querySelector(".highlight");
|
||||
if (!highlightDiv) return "";
|
||||
|
||||
const codeBlock = highlightDiv.querySelector("code");
|
||||
const inlineLines = codeBlock?.querySelectorAll(".cl"); // linenos=inline
|
||||
const tableCodeCell = highlightDiv?.querySelector(".lntable .lntd:last-child code"); // linenos=table
|
||||
@@ -75,5 +73,5 @@ function getCodeText(highlightDiv) {
|
||||
}
|
||||
|
||||
window.addEventListener("DOMContentLoaded", (event) => {
|
||||
document.querySelectorAll(".highlight").forEach((highlightDiv) => createCopyButton(highlightDiv));
|
||||
document.querySelectorAll(".highlight-wrapper").forEach((highlightWrapper) => createCopyButton(highlightWrapper));
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user