Refactor copy
button event handler (#29379)
Use "closest" instead of "for-loop" (cherry picked from commit 736c98be5c2bed26cef9f7f679c49a95af8161ef)
This commit is contained in:
parent
110b06f88b
commit
29517c54e6
|
@ -5,37 +5,30 @@ import {clippie} from 'clippie';
|
|||
const {copy_success, copy_error} = window.config.i18n;
|
||||
|
||||
// Enable clipboard copy from HTML attributes. These properties are supported:
|
||||
// - data-clipboard-text: Direct text to copy, has highest precedence
|
||||
// - data-clipboard-text: Direct text to copy
|
||||
// - data-clipboard-target: Holds a selector for a <input> or <textarea> whose content is copied
|
||||
// - data-clipboard-text-type: When set to 'url' will convert relative to absolute urls
|
||||
export function initGlobalCopyToClipboardListener() {
|
||||
document.addEventListener('click', (e) => {
|
||||
let target = e.target;
|
||||
// In case <button data-clipboard-text><svg></button>, so we just search
|
||||
// up to 3 levels for performance
|
||||
for (let i = 0; i < 3 && target; i++) {
|
||||
let text = target.getAttribute('data-clipboard-text');
|
||||
document.addEventListener('click', async (e) => {
|
||||
const target = e.target.closest('[data-clipboard-text], [data-clipboard-target]');
|
||||
if (!target) return;
|
||||
|
||||
if (!text && target.getAttribute('data-clipboard-target')) {
|
||||
text = document.querySelector(target.getAttribute('data-clipboard-target'))?.value;
|
||||
}
|
||||
e.preventDefault();
|
||||
|
||||
if (text && target.getAttribute('data-clipboard-text-type') === 'url') {
|
||||
text = toAbsoluteUrl(text);
|
||||
}
|
||||
let text;
|
||||
if (target.hasAttribute('data-clipboard-text')) {
|
||||
text = target.getAttribute('data-clipboard-text');
|
||||
} else {
|
||||
text = document.querySelector(target.getAttribute('data-clipboard-target'))?.value;
|
||||
}
|
||||
|
||||
if (text) {
|
||||
e.preventDefault();
|
||||
if (text && target.getAttribute('data-clipboard-text-type') === 'url') {
|
||||
text = toAbsoluteUrl(text);
|
||||
}
|
||||
|
||||
(async() => {
|
||||
const success = await clippie(text);
|
||||
showTemporaryTooltip(target, success ? copy_success : copy_error);
|
||||
})();
|
||||
|
||||
break;
|
||||
}
|
||||
|
||||
target = target.parentElement;
|
||||
if (text) {
|
||||
const success = await clippie(text);
|
||||
showTemporaryTooltip(target, success ? copy_success : copy_error);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue