Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dropzone: Add "Copy link" button for new uploads #22517

Merged
merged 4 commits into from Jan 19, 2023
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
15 changes: 15 additions & 0 deletions web_src/js/features/common-global.js
Expand Up @@ -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';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

FWIW, we shouldn't use FontAwesome in new code any more, but SVG octicon.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

And for me, personally I would never put a dz-remove class on the Copy button.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since this was merged, should I do another PR addressing this feedback?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah it would be worth doing so if you can. Thanks!

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();
Expand Down