Improve copy button script formatting

This commit is contained in:
Em (Ethan) Ruszanowski 2024-01-29 18:38:53 -05:00
parent d5d4df98a8
commit d7010dafd1
Signed by: em
GPG key ID: C725D6E571252B96

View file

@ -1,47 +1,55 @@
/*
* A nice little clipboard script provided by crykn. Thanks!
/*
* A nice little clipboard script provided by Crykn. Thanks!
*/
function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
return new Promise((resolve) => setTimeout(resolve, ms));
}
async function onClickEffect(btn, style) {
btn.removeClass("btn-light");
btn.addClass(style);
await sleep(250);
btn.removeClass(style);
btn.addClass("btn-light");
btn.removeClass("btn-light");
btn.addClass(style);
await sleep(250);
btn.removeClass(style);
btn.addClass("btn-light");
}
$(document).ready(function() {
// Create butons
$(".page__content pre > code").each(function() {
$(this).parent().prepend(
$(document.createElement('button')).prop({
type: 'button',
innerHTML: '<i class="far fa-copy"></i>',
})
.attr('title', 'Copy to clipboard')
.addClass('btn')
.addClass('btn--primary')
.css('position', 'absolute')
.css('right', '1em')
// Click listener
.on('click', function() {
let codeElement = $(this).parent().children('code').first();
$(document).ready(function () {
// Create button
$(".page__content pre > code").each(function () {
$(this)
.parent()
.prepend(
$(document.createElement("button"))
.prop({
type: "button",
innerHTML: '<i class="far fa-copy"></i>',
})
.attr("title", "Copy to clipboard")
.addClass("btn")
.addClass("btn--primary")
.css("position", "absolute")
.css("right", "1em")
// Click listener
.on("click", function () {
let codeElement = $(this).parent().children("code").first();
if (!codeElement) {
throw new Error("Unexpected error! No corresponding code block was found for this button.");
}
if (!codeElement) {
throw new Error(
"Unexpected error! No corresponding code block was found for this button."
);
}
// Blink effect
onClickEffect($(this), "btn--success")
// Blink effect
onClickEffect($(this), "btn--success");
// Copy to clipoard function
navigator.clipboard.writeText($(codeElement).text()).then(() => true, () => true);
return true;
})
);
});
// Copy to clipoard function
navigator.clipboard.writeText($(codeElement).text()).then(
() => true,
() => true
);
return true;
})
);
});
});