improve text instructions and copy button

This commit is contained in:
Bruno Windels
2020-12-04 19:35:01 +01:00
parent e5743471f4
commit 166f5ded77
7 changed files with 60 additions and 24 deletions
+11 -7
View File
@@ -22,15 +22,20 @@ function selectNode(node) {
selection.addRange(range);
}
export function copy(text, parent) {
const span = document.createElement("span");
span.innerText = text;
parent.appendChild(span);
selectNode(span);
const result = document.execCommand("copy");
parent.removeChild(span);
return result;
}
export function copyButton(t, getCopyText, label, classNames) {
return t.button({className: `${classNames} icon copy`, onClick: evt => {
const button = evt.target;
const text = getCopyText();
const span = document.createElement("span");
span.innerText = text;
button.parentElement.appendChild(span);
selectNode(span);
if (document.execCommand("copy")) {
if (copy(getCopyText(), button)) {
button.innerText = "Copied!";
button.classList.remove("copy");
button.classList.add("tick");
@@ -40,6 +45,5 @@ export function copyButton(t, getCopyText, label, classNames) {
button.innerText = label;
}, 2000);
}
span.parentElement.removeChild(span);
}}, label);
}