pages/assets/js/copy_code.js
George 92ac10ad82
Changed mermaid support in template (#1992)
Fix #1609

---------

Signed-off-by: George Araujo <george.gcac@gmail.com>
Co-authored-by: Maruan Al-Shedivat <maruan@genesistherapeutics.ai>
2024-01-02 18:35:57 -03:00

47 lines
2.0 KiB
JavaScript

// create element for copy button in code blocks
var codeBlocks = document.querySelectorAll('pre');
codeBlocks.forEach(function (codeBlock) {
if ((codeBlock.querySelector('pre:not(.lineno)') || codeBlock.querySelector('code')) && codeBlock.querySelector('code:not(.language-mermaid)')) {
// create copy button
var copyButton = document.createElement('button');
copyButton.className = 'copy';
copyButton.type = 'button';
copyButton.ariaLabel = 'Copy code to clipboard';
copyButton.innerText = 'Copy';
copyButton.innerHTML = '<i class="fa-solid fa-clipboard"></i>';
// get code from code block and copy to clipboard
copyButton.addEventListener('click', function () {
// check if code block has line numbers
// i.e. `kramdown.syntax_highlighter_opts.block.line_numbers` set to true in _config.yml
// or using `jekyll highlight` liquid tag with `linenos` option
if (codeBlock.querySelector('pre:not(.lineno)')) {
// get code from code block ignoring line numbers
var code = codeBlock.querySelector('pre:not(.lineno)').innerText.trim();
} else { // if (codeBlock.querySelector('code')) {
// get code from code block when line numbers are not displayed
var code = codeBlock.querySelector('code').innerText.trim();
}
window.navigator.clipboard.writeText(code);
copyButton.innerText = 'Copied';
copyButton.innerHTML = '<i class="fa-solid fa-clipboard-check"></i>';
var waitFor = 3000;
setTimeout(function () {
copyButton.innerText = 'Copy';
copyButton.innerHTML = '<i class="fa-solid fa-clipboard"></i>';
}, waitFor);
});
// create wrapper div
var wrapper = document.createElement('div');
wrapper.className = 'code-display-wrapper';
// add copy button and code block to wrapper div
const parent = codeBlock.parentElement;
parent.insertBefore(wrapper, codeBlock);
wrapper.append(codeBlock);
wrapper.append(copyButton);
}
});