From 8eaf44735a9e3a0f2a12095c6bbfdfe4e26bf31c Mon Sep 17 00:00:00 2001
From: zadam <zadam.apps@gmail.com>
Date: Tue, 7 May 2019 22:33:53 +0200
Subject: [PATCH] context menu on link to open in new tab

---
 src/public/javascripts/dialogs/add_link.js    |  7 ++-
 src/public/javascripts/services/link.js       | 47 +++++++++++++------
 .../javascripts/services/note_detail.js       |  8 +++-
 3 files changed, 43 insertions(+), 19 deletions(-)

diff --git a/src/public/javascripts/dialogs/add_link.js b/src/public/javascripts/dialogs/add_link.js
index cde8f5d18..a6078e295 100644
--- a/src/public/javascripts/dialogs/add_link.js
+++ b/src/public/javascripts/dialogs/add_link.js
@@ -2,7 +2,6 @@ import cloningService from '../services/cloning.js';
 import linkService from '../services/link.js';
 import noteDetailService from '../services/note_detail.js';
 import treeUtils from '../services/tree_utils.js';
-import noteDetailText from "../services/note_detail_text.js";
 import noteAutocompleteService from "../services/note_autocomplete.js";
 
 const $dialog = $("#add-link-dialog");
@@ -96,7 +95,7 @@ $form.submit(() => {
             const linkHref = '#' + notePath;
 
             if (hasSelection()) {
-                const editor = noteDetailText.getEditor();
+                const editor = noteDetailService.getActiveComponent().getEditor();
 
                 editor.execute('link', linkHref);
             }
@@ -128,7 +127,7 @@ $form.submit(() => {
 
 // returns true if user selected some text, false if there's no selection
 function hasSelection() {
-    const model = noteDetailText.getEditor().model;
+    const model = noteDetailService.getActiveComponent().getEditor().model;
     const selection = model.document.selection;
 
     return !selection.isCollapsed;
@@ -147,7 +146,7 @@ $linkTypes.change(linkTypeChanged);
 
 // return back focus to note text detail after quitting add link
 // the problem is that cursor position is reset
-$dialog.on("hidden.bs.modal", () => noteDetailText.focus());
+$dialog.on("hidden.bs.modal", () => noteDetailService.getActiveComponent().focus());
 
 export default {
     showDialog,
diff --git a/src/public/javascripts/services/link.js b/src/public/javascripts/services/link.js
index 8b2a5e524..8074b5dd1 100644
--- a/src/public/javascripts/services/link.js
+++ b/src/public/javascripts/services/link.js
@@ -1,6 +1,7 @@
 import treeService from './tree.js';
-import noteDetailText from './note_detail_text.js';
 import treeUtils from './tree_utils.js';
+import contextMenuService from "./context_menu.js";
+import noteDetailService from "./note_detail.js";
 
 function getNotePathFromUrl(url) {
     const notePathMatch = /#(root[A-Za-z0-9/]*)$/.exec(url);
@@ -13,16 +14,6 @@ function getNotePathFromUrl(url) {
     }
 }
 
-function getNotePathFromLabel(label) {
-    const notePathMatch = / \((root[A-Za-z0-9/]*)\)/.exec(label);
-
-    if (notePathMatch !== null) {
-        return notePathMatch[1];
-    }
-
-    return null;
-}
-
 async function createNoteLink(notePath, noteTitle = null) {
     if (!noteTitle) {
         const noteId = treeUtils.getNoteIdFromNotePath(notePath);
@@ -71,7 +62,7 @@ function goToLink(e) {
 }
 
 function addLinkToEditor(linkTitle, linkHref) {
-    const editor = noteDetailText.getEditor();
+    const editor = noteDetailService.getActiveComponent().getEditor();
 
     editor.model.change( writer => {
         const insertPosition = editor.model.document.selection.getFirstPosition();
@@ -80,7 +71,7 @@ function addLinkToEditor(linkTitle, linkHref) {
 }
 
 function addTextToEditor(text) {
-    const editor = noteDetailText.getEditor();
+    const editor = noteDetailService.getActiveComponent().getEditor();
 
     editor.model.change(writer => {
         const insertPosition = editor.model.document.selection.getFirstPosition();
@@ -102,6 +93,35 @@ function init() {
     };
 }
 
+function noteContextMenu(e) {
+    const $link = $(e.target);
+
+    const notePath = getNotePathFromLink($link);
+
+    if (!notePath) {
+        return;
+    }
+
+    e.preventDefault();
+
+    contextMenuService.initContextMenu(e, {
+        getContextMenuItems: () => {
+            return [
+                {title: "Open note in new tab", cmd: "openNoteInNewTab", uiIcon: "empty"}
+            ];
+        },
+        selectContextMenuItem: (e, cmd) => {
+            if (cmd === 'openNoteInNewTab') {
+                noteDetailService.loadNoteDetail(notePath.split("/").pop(), true);
+            }
+        }
+    });
+}
+
+$(document).on('contextmenu', '.note-detail-text a', noteContextMenu);
+$(document).on('contextmenu', "a[data-action='note']", noteContextMenu);
+$(document).on('contextmenu', ".note-detail-render a", noteContextMenu);
+
 // when click on link popup, in case of internal link, just go the the referenced note instead of default behavior
 // of opening the link in new window/tab
 $(document).on('click', "a[data-action='note']", goToLink);
@@ -124,7 +144,6 @@ $(document).on('click', 'span.ck-button__label', e => {
 });
 
 export default {
-    getNotePathFromLabel,
     getNotePathFromUrl,
     createNoteLink,
     addLinkToEditor,
diff --git a/src/public/javascripts/services/note_detail.js b/src/public/javascripts/services/note_detail.js
index d4ac2a856..c0ad40fd0 100644
--- a/src/public/javascripts/services/note_detail.js
+++ b/src/public/javascripts/services/note_detail.js
@@ -84,6 +84,10 @@ async function saveNotesIfChanged() {
 /** @type {NoteContext[]} */
 let noteContexts = [];
 
+function getActiveComponent() {
+    return getActiveContext().getComponent();
+}
+
 /** @returns {NoteContext} */
 function getActiveContext() {
     for (const ctx of noteContexts) {
@@ -320,6 +324,7 @@ export default {
     openInTab,
     switchToNote,
     loadNote,
+    loadNoteDetail,
     getActiveNote,
     getActiveNoteContent,
     getActiveNoteType,
@@ -329,5 +334,6 @@ export default {
     saveNotesIfChanged,
     onNoteChange,
     addDetailLoadedListener,
-    getActiveContext
+    getActiveContext,
+    getActiveComponent
 };
\ No newline at end of file