get the code copy button working again

This commit is contained in:
John Bowdre 2023-11-04 20:49:39 -05:00
parent 997261e4ee
commit bf40277e96
3 changed files with 16 additions and 8 deletions

View file

@ -16,10 +16,18 @@ function createCopyButton(highlightDiv) {
document.querySelectorAll(".highlight").forEach((highlightDiv) => createCopyButton(highlightDiv));
async function copyCodeToClipboard(button, highlightDiv) {
// Need to get just the last-child of each .line element to avoid copying the line numbers
const nodeListToCopy = highlightDiv.querySelectorAll(":last-child > .chroma > code > .line > :last-child");
// Reduce the nodeList to a string of text with each line separated by a newline
const codeToCopy = Array.from(nodeListToCopy).reduce((accumulator, line) => accumulator + line.innerText, "");
// capture all code lines in the selected block which aren't classed `cmd_return`
let codeToCopy = highlightDiv.querySelectorAll(":last-child > .torchlight > code > .line:not(.cmd_return)");
// now remove the first-child of each line which has class `line-number`
codeToCopy = Array.from(codeToCopy).reduce((accumulator, line) => {
if (line.firstChild.className != "line-number") {
return accumulator + line.innerText + "\n"; }
else {
return accumulator + Array.from(line.children).filter(
(child) => child.className != "line-number").reduce(
(accumulator, child) => accumulator + child.innerText, "") + "\n";
}
}, "");
try {
var result = await navigator.permissions.query({ name: "clipboard-write" });
if (result.state == "granted" || result.state == "prompt") {

View file

@ -4,6 +4,6 @@
<br><a target="_blank" href="https://github.com/jbowdre/runtimeterror">View source</a>.</p>
{{ if (findRE "<pre" .Content 1) }}
<!-- {{ $jsCopy := resources.Get "js/code-copy-button.js" | minify }}
<script src="{{ $jsCopy.RelPermalink }}"></script> -->
{{ $jsCopy := resources.Get "js/code-copy-button.js" | minify }}
<script src="{{ $jsCopy.RelPermalink }}"></script>
{{ end }}

View file

@ -25,6 +25,6 @@
{{ if (findRE "<pre" .Content 1) }}
{{ $syntax := resources.Get "css/torchlight.css" | minify }}
<link href="{{ $syntax.RelPermalink }}" rel="stylesheet">
<!-- {{ $copyCss := resources.Get "css/code-copy-button.css" | minify }}
<link href="{{ $copyCss.RelPermalink }}" rel="stylesheet"> -->
{{ $copyCss := resources.Get "css/code-copy-button.css" | minify }}
<link href="{{ $copyCss.RelPermalink }}" rel="stylesheet">
{{ end }}