Dropzone: Add "Copy link" button for new uploads (#22517)
Once an attachment is successfully uploaded via Dropzone, display a "Copy link" under the "Remove file" button. Once the button is clicked, depending if the attachment is an image or a file, the appropriate markup is written to the clipboard, so it can be conveniently pasted in the description.
This commit is contained in:
parent
151b1a9508
commit
9f919cf083
1 changed files with 15 additions and 0 deletions
|
@ -167,6 +167,21 @@ export function initGlobalDropzone() {
|
|||
file.uuid = data.uuid;
|
||||
const input = $(`<input id="${data.uuid}" name="files" type="hidden">`).val(data.uuid);
|
||||
$dropzone.find('.files').append(input);
|
||||
// Create a "Copy Link" element, to conveniently copy the image
|
||||
// or file link as Markdown to the clipboard
|
||||
const copyLinkElement = document.createElement('a');
|
||||
copyLinkElement.className = 'dz-remove';
|
||||
copyLinkElement.href = '#';
|
||||
copyLinkElement.innerHTML = '<i class="fa fa-copy"></i> Copy link';
|
||||
copyLinkElement.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
let fileMarkdown = `[${file.name}](/attachments/${file.uuid})`;
|
||||
if (file.type.startsWith('image/')) {
|
||||
fileMarkdown = `!${fileMarkdown}`;
|
||||
}
|
||||
navigator.clipboard.writeText(fileMarkdown);
|
||||
});
|
||||
file.previewTemplate.appendChild(copyLinkElement);
|
||||
});
|
||||
this.on('removedfile', (file) => {
|
||||
$(`#${file.uuid}`).remove();
|
||||
|
|
Reference in a new issue