diff --git a/src/public/javascripts/services/note_detail_image.js b/src/public/javascripts/services/note_detail_image.js
index cee8e3eb6..df9074298 100644
--- a/src/public/javascripts/services/note_detail_image.js
+++ b/src/public/javascripts/services/note_detail_image.js
@@ -1,12 +1,13 @@
import utils from "./utils.js";
-import server from "./server.js";
import protectedSessionHolder from "./protected_session_holder.js";
import noteDetailService from "./note_detail.js";
+import infoService from "./info.js";
const $component = $('#note-detail-image');
const $imageView = $('#note-detail-image-view');
const $imageDownload = $("#image-download");
+const $copyToClipboardDownload = $("#image-copy-to-clipboard");
async function show() {
const currentNote = noteDetailService.getCurrentNote();
@@ -18,6 +19,35 @@ async function show() {
$imageDownload.click(() => utils.download(getFileUrl()));
+function selectImage(element) {
+ const selection = window.getSelection();
+ const range = document.createRange();
+ range.selectNodeContents(element);
+ selection.removeAllRanges();
+ selection.addRange(range);
+}
+
+$copyToClipboardDownload.click(() => {
+ $component.attr('contenteditable','true');
+
+ try {
+ selectImage($component.get(0));
+
+ const success = document.execCommand('copy');
+
+ if (success) {
+ infoService.showMessage("Image copied to the clipboard");
+ }
+ else {
+ infoService.showAndLogError("Could not copy the image to clipboard.");
+ }
+ }
+ finally {
+ window.getSelection().removeAllRanges();
+ $component.removeAttr('contenteditable');
+ }
+});
+
function getFileUrl() {
// electron needs absolute URL so we extract current host, port, protocol
return utils.getHost() + "/api/notes/" + noteDetailService.getCurrentNoteId()
diff --git a/src/views/details/image.ejs b/src/views/details/image.ejs
index a767ed5a3..e08f5ab1c 100644
--- a/src/views/details/image.ejs
+++ b/src/views/details/image.ejs
@@ -3,5 +3,9 @@
-
+
+
+
+
+
\ No newline at end of file