From 73ad5577844e042470c41055ba9fa6d26ec73001 Mon Sep 17 00:00:00 2001
From: Charles Dagenais <dagenais.charles@gmail.com>
Date: Wed, 21 Sep 2022 21:41:51 -0400
Subject: [PATCH] improve "open" button behaviour for files when in browser

---
 src/public/app/services/note_content_renderer.js    |  2 +-
 src/public/app/services/open.js                     | 13 +++++++++++--
 src/public/app/services/root_command_executor.js    |  5 +++--
 src/public/app/services/tab_manager.js              |  6 ++++++
 .../app/widgets/ribbon_widgets/file_properties.js   |  2 +-
 .../app/widgets/ribbon_widgets/image_properties.js  |  2 +-
 6 files changed, 23 insertions(+), 7 deletions(-)

diff --git a/src/public/app/services/note_content_renderer.js b/src/public/app/services/note_content_renderer.js
index 61966b0b4..749047a4b 100644
--- a/src/public/app/services/note_content_renderer.js
+++ b/src/public/app/services/note_content_renderer.js
@@ -74,7 +74,7 @@ async function getRenderedContent(note, options = {}) {
         const $openButton = $('<button class="file-open btn btn-primary" type="button">Open</button>');
 
         $downloadButton.on('click', () => openService.downloadFileNote(note.noteId));
-        $openButton.on('click', () => openService.openNoteExternally(note.noteId));
+        $openButton.on('click', () => openService.openNoteExternally(note.noteId, note.mime));
 
         // open doesn't work for protected notes since it works through browser which isn't in protected session
         $openButton.toggle(!note.isProtected);
diff --git a/src/public/app/services/open.js b/src/public/app/services/open.js
index 86d5f0af5..ed2493cbb 100644
--- a/src/public/app/services/open.js
+++ b/src/public/app/services/open.js
@@ -4,6 +4,9 @@ import server from "./server.js";
 function getFileUrl(noteId) {
     return getUrlForDownload("api/notes/" + noteId + "/download");
 }
+function getOpenFileUrl(noteId) {
+    return getUrlForDownload("api/notes/" + noteId + "/open");
+}
 
 function download(url) {
     if (utils.isElectron()) {
@@ -21,7 +24,7 @@ function downloadFileNote(noteId) {
     download(url);
 }
 
-async function openNoteExternally(noteId) {
+async function openNoteExternally(noteId, mime) {
     if (utils.isElectron()) {
         const resp = await server.post("notes/" + noteId + "/save-to-tmp-dir");
 
@@ -34,7 +37,13 @@ async function openNoteExternally(noteId) {
         }
     }
     else {
-        window.location.href = getFileUrl(noteId);
+        // allow browser to handle opening common file
+         if (mime === "application/pdf" ||  mime.startsWith("image") || mime.startsWith("audio") || mime.startsWith("video")){
+            window.open(getOpenFileUrl(noteId));
+        }
+         else {
+            window.location.href = getFileUrl(noteId);
+        }
     }
 }
 
diff --git a/src/public/app/services/root_command_executor.js b/src/public/app/services/root_command_executor.js
index f87f5e7b2..85e1e3632 100644
--- a/src/public/app/services/root_command_executor.js
+++ b/src/public/app/services/root_command_executor.js
@@ -45,9 +45,10 @@ export default class RootCommandExecutor extends Component {
 
     openNoteExternallyCommand() {
         const noteId = appContext.tabManager.getActiveContextNoteId();
-
+        const mime = appContext.tabManager.getActiveContextNoteMime()
+        
         if (noteId) {
-            openService.openNoteExternally(noteId);
+            openService.openNoteExternally(noteId, mime);
         }
     }
 
diff --git a/src/public/app/services/tab_manager.js b/src/public/app/services/tab_manager.js
index 9f8189a17..f5fcf2279 100644
--- a/src/public/app/services/tab_manager.js
+++ b/src/public/app/services/tab_manager.js
@@ -197,6 +197,12 @@ export default class TabManager extends Component {
 
         return activeNote ? activeNote.type : null;
     }
+    /** @returns {string|null} */
+    getActiveContextNoteMime() {
+        const activeNote = this.getActiveContextNote();
+
+        return activeNote ? activeNote.mime : null;
+    }
 
     async switchToNoteContext(ntxId, notePath) {
         const noteContext = this.noteContexts.find(nc => nc.ntxId === ntxId)
diff --git a/src/public/app/widgets/ribbon_widgets/file_properties.js b/src/public/app/widgets/ribbon_widgets/file_properties.js
index 752a1c6b4..536fa7af7 100644
--- a/src/public/app/widgets/ribbon_widgets/file_properties.js
+++ b/src/public/app/widgets/ribbon_widgets/file_properties.js
@@ -90,7 +90,7 @@ export default class FilePropertiesWidget extends NoteContextAwareWidget {
         this.$uploadNewRevisionInput = this.$widget.find(".file-upload-new-revision-input");
 
         this.$downloadButton.on('click', () => openService.downloadFileNote(this.noteId));
-        this.$openButton.on('click', () => openService.openNoteExternally(this.noteId));
+        this.$openButton.on('click', () => openService.openNoteExternally(this.noteId, this.note.mime));
 
         this.$uploadNewRevisionButton.on("click", () => {
             this.$uploadNewRevisionInput.trigger("click");
diff --git a/src/public/app/widgets/ribbon_widgets/image_properties.js b/src/public/app/widgets/ribbon_widgets/image_properties.js
index 838325d0e..cc30e214f 100644
--- a/src/public/app/widgets/ribbon_widgets/image_properties.js
+++ b/src/public/app/widgets/ribbon_widgets/image_properties.js
@@ -69,7 +69,7 @@ export default class ImagePropertiesWidget extends NoteContextAwareWidget {
         this.$fileSize = this.$widget.find(".image-filesize");
 
         this.$openButton = this.$widget.find(".image-open");
-        this.$openButton.on('click', () => openService.openNoteExternally(this.noteId));
+        this.$openButton.on('click', () => openService.openNoteExternally(this.noteId, this.note.mime ));
 
         this.$imageDownloadButton = this.$widget.find(".image-download");
         this.$imageDownloadButton.on('click', () => openService.downloadFileNote(this.noteId));