From 402718d293fd2a354418a05d0c1d1d66a9339d51 Mon Sep 17 00:00:00 2001
From: zadam <zadam.apps@gmail.com>
Date: Sun, 9 Feb 2020 10:00:13 +0100
Subject: [PATCH] return focus to the previously focused element after closing
 the dialog, fixes #861

---
 package-lock.json                             |  2 +-
 src/public/javascripts/dialogs/about.js       |  6 +--
 src/public/javascripts/dialogs/add_link.js    |  6 +--
 src/public/javascripts/dialogs/attributes.js  |  6 +--
 src/public/javascripts/dialogs/backend_log.js |  6 +--
 .../javascripts/dialogs/branch_prefix.js      |  6 +--
 src/public/javascripts/dialogs/clone_to.js    |  6 +--
 src/public/javascripts/dialogs/export.js      |  6 +--
 src/public/javascripts/dialogs/help.js        |  6 +--
 src/public/javascripts/dialogs/import.js      |  6 +--
 .../javascripts/dialogs/include_note.js       |  6 +--
 src/public/javascripts/dialogs/info.js        |  6 +--
 .../javascripts/dialogs/jump_to_note.js       |  6 +--
 src/public/javascripts/dialogs/link_map.js    |  6 +--
 .../javascripts/dialogs/markdown_import.js    |  4 +-
 src/public/javascripts/dialogs/move_to.js     |  8 +---
 src/public/javascripts/dialogs/note_info.js   |  6 +--
 .../javascripts/dialogs/note_revisions.js     |  6 +--
 src/public/javascripts/dialogs/note_source.js |  6 +--
 src/public/javascripts/dialogs/options.js     |  6 +--
 src/public/javascripts/dialogs/prompt.js      |  6 +--
 .../javascripts/dialogs/protected_session.js  |  3 +-
 .../javascripts/dialogs/recent_changes.js     |  6 +--
 src/public/javascripts/dialogs/sql_console.js |  6 +--
 .../javascripts/services/search_notes.js      |  5 +++
 src/public/javascripts/services/utils.js      | 44 +++++++++++++++++++
 26 files changed, 74 insertions(+), 112 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 526e39421..c34def86c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "trilium",
-  "version": "0.40.1",
+  "version": "0.40.2",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
diff --git a/src/public/javascripts/dialogs/about.js b/src/public/javascripts/dialogs/about.js
index 3a07d95c6..0b48712e4 100644
--- a/src/public/javascripts/dialogs/about.js
+++ b/src/public/javascripts/dialogs/about.js
@@ -10,8 +10,6 @@ const $buildRevision = $("#build-revision");
 const $dataDirectory = $("#data-directory");
 
 export async function showDialog() {
-    utils.closeActiveDialog();
-
     const appInfo = await server.get('app-info');
 
     $appVersion.text(appInfo.appVersion);
@@ -22,7 +20,5 @@ export async function showDialog() {
     $buildRevision.attr('href', 'https://github.com/zadam/trilium/commit/' + appInfo.buildRevision);
     $dataDirectory.text(appInfo.dataDirectory);
 
-    glob.activeDialog = $dialog;
-
-    $dialog.modal();
+    utils.openDialog($dialog);
 }
\ No newline at end of file
diff --git a/src/public/javascripts/dialogs/add_link.js b/src/public/javascripts/dialogs/add_link.js
index be8e8f244..a5b69f9e3 100644
--- a/src/public/javascripts/dialogs/add_link.js
+++ b/src/public/javascripts/dialogs/add_link.js
@@ -11,13 +11,9 @@ const $linkTitle = $("#link-title");
 const $addLinkTitleFormGroup = $("#add-link-title-form-group");
 
 export async function showDialog() {
-    utils.closeActiveDialog();
-
     $addLinkTitleFormGroup.toggle(!hasSelection());
 
-    glob.activeDialog = $dialog;
-
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     $autoComplete.val('').trigger('focus');
     $linkTitle.val('');
diff --git a/src/public/javascripts/dialogs/attributes.js b/src/public/javascripts/dialogs/attributes.js
index 171c01a29..21303746c 100644
--- a/src/public/javascripts/dialogs/attributes.js
+++ b/src/public/javascripts/dialogs/attributes.js
@@ -287,8 +287,6 @@ function initKoPlugins() {
 }
 
 export async function showDialog() {
-    utils.closeActiveDialog();
-
     await libraryLoader.requireLibrary(libraryLoader.KNOCKOUT);
 
     // lazily apply bindings on first use
@@ -300,11 +298,9 @@ export async function showDialog() {
         ko.applyBindings(attributesModel, $dialog[0]);
     }
 
-    glob.activeDialog = $dialog;
-
     await attributesModel.loadAttributes();
 
-    $dialog.modal();
+    utils.openDialog($dialog);
 }
 
 $dialog.on('focus', '.attribute-name', function (e) {
diff --git a/src/public/javascripts/dialogs/backend_log.js b/src/public/javascripts/dialogs/backend_log.js
index f899b90e0..ac145f13d 100644
--- a/src/public/javascripts/dialogs/backend_log.js
+++ b/src/public/javascripts/dialogs/backend_log.js
@@ -6,11 +6,7 @@ const $backendLogTextArea = $("#backend-log-textarea");
 const $refreshBackendLog = $("#refresh-backend-log-button");
 
 export async function showDialog() {
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     load();
 }
diff --git a/src/public/javascripts/dialogs/branch_prefix.js b/src/public/javascripts/dialogs/branch_prefix.js
index e9aa1cd64..d8cb2502e 100644
--- a/src/public/javascripts/dialogs/branch_prefix.js
+++ b/src/public/javascripts/dialogs/branch_prefix.js
@@ -13,10 +13,6 @@ const $noteTitle = $('#branch-prefix-note-title');
 let branchId;
 
 export async function showDialog(node) {
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
     branchId = node.data.branchId;
     const branch = treeCache.getBranch(branchId);
 
@@ -30,7 +26,7 @@ export async function showDialog(node) {
         return;
     }
 
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     $treePrefixInput.val(branch.prefix);
 
diff --git a/src/public/javascripts/dialogs/clone_to.js b/src/public/javascripts/dialogs/clone_to.js
index 147e5c8bd..a456483e0 100644
--- a/src/public/javascripts/dialogs/clone_to.js
+++ b/src/public/javascripts/dialogs/clone_to.js
@@ -22,11 +22,7 @@ export async function showDialog(noteIds) {
         }
     }
 
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     $noteAutoComplete.val('').trigger('focus');
 
diff --git a/src/public/javascripts/dialogs/export.js b/src/public/javascripts/dialogs/export.js
index fc8b392be..40f19df3c 100644
--- a/src/public/javascripts/dialogs/export.js
+++ b/src/public/javascripts/dialogs/export.js
@@ -17,8 +17,6 @@ let taskId = '';
 let branchId = null;
 
 export async function showDialog(node, defaultType) {
-    utils.closeActiveDialog();
-
     // each opening of the dialog resets the taskId so we don't associate it with previous exports anymore
     taskId = '';
     $exportButton.removeAttr("disabled");
@@ -38,9 +36,7 @@ export async function showDialog(node, defaultType) {
 
     $("#opml-v2").prop("checked", true); // setting default
 
-    glob.activeDialog = $dialog;
-
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     branchId = node.data.branchId;
 
diff --git a/src/public/javascripts/dialogs/help.js b/src/public/javascripts/dialogs/help.js
index ccf73dfbc..ed8d90a48 100644
--- a/src/public/javascripts/dialogs/help.js
+++ b/src/public/javascripts/dialogs/help.js
@@ -3,9 +3,5 @@ import utils from "../services/utils.js";
 const $dialog = $("#help-dialog");
 
 export async function showDialog() {
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
-    $dialog.modal();
+    utils.openDialog($dialog);
 }
\ No newline at end of file
diff --git a/src/public/javascripts/dialogs/import.js b/src/public/javascripts/dialogs/import.js
index d527bd6fe..04dd0dd1a 100644
--- a/src/public/javascripts/dialogs/import.js
+++ b/src/public/javascripts/dialogs/import.js
@@ -16,8 +16,6 @@ const $explodeArchivesCheckbox = $("#explode-archives-checkbox");
 let parentNoteId = null;
 
 export async function showDialog(node) {
-    utils.closeActiveDialog();
-
     $fileUploadInput.val('').trigger('change'); // to trigger Import button disabling listener below
 
     $safeImportCheckbox.prop("checked", true);
@@ -26,13 +24,11 @@ export async function showDialog(node) {
     $codeImportedAsCodeCheckbox.prop("checked", true);
     $explodeArchivesCheckbox.prop("checked", true);
 
-    glob.activeDialog = $dialog;
-
     parentNoteId = node.data.noteId;
 
     $noteTitle.text(await treeUtils.getNoteTitle(parentNoteId));
 
-    $dialog.modal();
+    utils.openDialog($dialog);
 }
 
 $form.on('submit', () => {
diff --git a/src/public/javascripts/dialogs/include_note.js b/src/public/javascripts/dialogs/include_note.js
index bf89179b5..de4a35118 100644
--- a/src/public/javascripts/dialogs/include_note.js
+++ b/src/public/javascripts/dialogs/include_note.js
@@ -10,13 +10,9 @@ let callback = null;
 export async function showDialog(cb) {
     callback = cb;
 
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
     $autoComplete.val('');
 
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     noteAutocompleteService.initNoteAutocomplete($autoComplete, { hideGoToSelectedNoteButton: true });
     noteAutocompleteService.showRecentNotes($autoComplete);
diff --git a/src/public/javascripts/dialogs/info.js b/src/public/javascripts/dialogs/info.js
index b3901344b..0db595f55 100644
--- a/src/public/javascripts/dialogs/info.js
+++ b/src/public/javascripts/dialogs/info.js
@@ -10,13 +10,9 @@ let $originallyFocused; // element focused before the dialog was opened so we ca
 export function info(message) {
     $originallyFocused = $(':focus');
 
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
     $infoContent.text(message);
 
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     return new Promise((res, rej) => { resolve = res; });
 }
diff --git a/src/public/javascripts/dialogs/jump_to_note.js b/src/public/javascripts/dialogs/jump_to_note.js
index 751280635..729773a7c 100644
--- a/src/public/javascripts/dialogs/jump_to_note.js
+++ b/src/public/javascripts/dialogs/jump_to_note.js
@@ -8,13 +8,9 @@ const $autoComplete = $("#jump-to-note-autocomplete");
 const $showInFullTextButton = $("#show-in-full-text-button");
 
 export async function showDialog() {
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
     $autoComplete.val('');
 
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     noteAutocompleteService.initNoteAutocomplete($autoComplete, { hideGoToSelectedNoteButton: true })
         .on('autocomplete:selected', function(event, suggestion, dataset) {
diff --git a/src/public/javascripts/dialogs/link_map.js b/src/public/javascripts/dialogs/link_map.js
index 4a3937a53..25d1f5ae4 100644
--- a/src/public/javascripts/dialogs/link_map.js
+++ b/src/public/javascripts/dialogs/link_map.js
@@ -16,10 +16,6 @@ function getOptions() {
 }
 
 export async function showDialog() {
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
     // set default settings
     $maxNotesInput.val(20);
 
@@ -27,7 +23,7 @@ export async function showDialog() {
 
     $linkMapContainer.empty();
 
-    $dialog.modal();
+    utils.openDialog($dialog);
 }
 
 $dialog.on('shown.bs.modal', () => {
diff --git a/src/public/javascripts/dialogs/markdown_import.js b/src/public/javascripts/dialogs/markdown_import.js
index 02465e34a..021bea45b 100644
--- a/src/public/javascripts/dialogs/markdown_import.js
+++ b/src/public/javascripts/dialogs/markdown_import.js
@@ -37,9 +37,7 @@ export async function importMarkdownInline() {
         convertMarkdownToHtml(text);
     }
     else {
-        glob.activeDialog = $dialog;
-
-        $dialog.modal();
+        utils.openDialog($dialog);
     }
 }
 
diff --git a/src/public/javascripts/dialogs/move_to.js b/src/public/javascripts/dialogs/move_to.js
index 68d570880..4c6c6f782 100644
--- a/src/public/javascripts/dialogs/move_to.js
+++ b/src/public/javascripts/dialogs/move_to.js
@@ -1,7 +1,5 @@
 import noteAutocompleteService from "../services/note_autocomplete.js";
 import utils from "../services/utils.js";
-import cloningService from "../services/cloning.js";
-import treeUtils from "../services/tree_utils.js";
 import toastService from "../services/toast.js";
 import treeCache from "../services/tree_cache.js";
 import treeChangesService from "../services/branches.js";
@@ -18,11 +16,7 @@ let movedNodes;
 export async function showDialog(nodes) {
     movedNodes = nodes;
 
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     $noteAutoComplete.val('').trigger('focus');
 
diff --git a/src/public/javascripts/dialogs/note_info.js b/src/public/javascripts/dialogs/note_info.js
index 0b300a3eb..0eb57149e 100644
--- a/src/public/javascripts/dialogs/note_info.js
+++ b/src/public/javascripts/dialogs/note_info.js
@@ -10,11 +10,7 @@ const $mime = $("#note-info-mime");
 const $okButton = $("#note-info-ok-button");
 
 export function showDialog() {
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     const activeNote = noteDetailService.getActiveTabNote();
 
diff --git a/src/public/javascripts/dialogs/note_revisions.js b/src/public/javascripts/dialogs/note_revisions.js
index 8656bfe9b..3fe0f6343 100644
--- a/src/public/javascripts/dialogs/note_revisions.js
+++ b/src/public/javascripts/dialogs/note_revisions.js
@@ -29,11 +29,7 @@ export async function showCurrentNoteRevisions() {
 }
 
 export async function showNoteRevisionsDialog(noteId, noteRevisionId) {
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     await loadNoteRevisions(noteId, noteRevisionId);
 }
diff --git a/src/public/javascripts/dialogs/note_source.js b/src/public/javascripts/dialogs/note_source.js
index 76ead802b..ef551d0bf 100644
--- a/src/public/javascripts/dialogs/note_source.js
+++ b/src/public/javascripts/dialogs/note_source.js
@@ -5,11 +5,7 @@ const $dialog = $("#note-source-dialog");
 const $noteSource = $("#note-source");
 
 export function showDialog() {
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     const noteText = noteDetailService.getActiveTabNote().content;
 
diff --git a/src/public/javascripts/dialogs/options.js b/src/public/javascripts/dialogs/options.js
index a3f33959a..bcb71c043 100644
--- a/src/public/javascripts/dialogs/options.js
+++ b/src/public/javascripts/dialogs/options.js
@@ -6,13 +6,9 @@ import utils from "../services/utils.js";
 const $dialog = $("#options-dialog");
 
 export async function showDialog() {
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
     const options = await server.get('options');
 
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     (await Promise.all([
         import('./options/advanced.js'),
diff --git a/src/public/javascripts/dialogs/prompt.js b/src/public/javascripts/dialogs/prompt.js
index ca0567f40..34acfdaa5 100644
--- a/src/public/javascripts/dialogs/prompt.js
+++ b/src/public/javascripts/dialogs/prompt.js
@@ -12,10 +12,6 @@ let resolve;
 let shownCb;
 
 export function ask({ message, defaultValue, shown }) {
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
     shownCb = shown;
 
     $question = $("<label>")
@@ -34,7 +30,7 @@ export function ask({ message, defaultValue, shown }) {
             .append($question)
             .append($answer));
 
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     return new Promise((res, rej) => { resolve = res; });
 }
diff --git a/src/public/javascripts/dialogs/protected_session.js b/src/public/javascripts/dialogs/protected_session.js
index 04c7c6f3e..a4822b8cf 100644
--- a/src/public/javascripts/dialogs/protected_session.js
+++ b/src/public/javascripts/dialogs/protected_session.js
@@ -1,11 +1,12 @@
 import protectedSessionService from "../services/protected_session.js";
+import utils from "../services/utils.js";
 
 const $dialog = $("#protected-session-password-dialog");
 const $passwordForm = $dialog.find(".protected-session-password-form");
 const $passwordInput = $dialog.find(".protected-session-password");
 
 export function show() {
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     $passwordInput.trigger('focus');
 }
diff --git a/src/public/javascripts/dialogs/recent_changes.js b/src/public/javascripts/dialogs/recent_changes.js
index 51a65982a..e07f3228e 100644
--- a/src/public/javascripts/dialogs/recent_changes.js
+++ b/src/public/javascripts/dialogs/recent_changes.js
@@ -8,11 +8,7 @@ const $dialog = $("#recent-changes-dialog");
 const $content = $("#recent-changes-content");
 
 export async function showDialog() {
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
-    $dialog.modal();
+    utils.openDialog($dialog);
 
     const result = await server.get('recent-changes');
 
diff --git a/src/public/javascripts/dialogs/sql_console.js b/src/public/javascripts/dialogs/sql_console.js
index ef296ba15..39b2e6861 100644
--- a/src/public/javascripts/dialogs/sql_console.js
+++ b/src/public/javascripts/dialogs/sql_console.js
@@ -14,13 +14,9 @@ let codeEditor;
 $dialog.on("shown.bs.modal", e => initEditor());
 
 export async function showDialog() {
-    utils.closeActiveDialog();
-
-    glob.activeDialog = $dialog;
-
     await showTableSchemas();
 
-    $dialog.modal();
+    utils.openDialog($dialog);
 }
 
 async function initEditor() {
diff --git a/src/public/javascripts/services/search_notes.js b/src/public/javascripts/services/search_notes.js
index a11cb29b8..82fd5b24c 100644
--- a/src/public/javascripts/services/search_notes.js
+++ b/src/public/javascripts/services/search_notes.js
@@ -2,6 +2,7 @@ import treeService from './tree.js';
 import treeCache from "./tree_cache.js";
 import server from './server.js';
 import toastService from "./toast.js";
+import utils from "./utils.js";
 
 const $searchInput = $("input[name='search-text']");
 const $resetSearchButton = $("#reset-search-button");
@@ -28,6 +29,8 @@ const helpText = `
 </p>`;
 
 function showSearch() {
+    utils.saveFocusedElement();
+
     $searchBox.slideDown();
 
     $searchBox.tooltip({
@@ -49,6 +52,8 @@ function hideSearch() {
 
     $searchResults.hide();
     $searchBox.slideUp();
+
+    utils.focusSavedElement();
 }
 
 function toggleSearch() {
diff --git a/src/public/javascripts/services/utils.js b/src/public/javascripts/services/utils.js
index b4b51a0f9..7fb8ce265 100644
--- a/src/public/javascripts/services/utils.js
+++ b/src/public/javascripts/services/utils.js
@@ -209,9 +209,50 @@ function getMimeTypeClass(mime) {
 function closeActiveDialog() {
     if (glob.activeDialog) {
         glob.activeDialog.modal('hide');
+        glob.activeDialog = null;
     }
 }
 
+let $lastFocusedElement = null;
+
+function saveFocusedElement() {
+    $lastFocusedElement = $(":focus");
+}
+
+function focusSavedElement() {
+    if (!$lastFocusedElement) {
+        return;
+    }
+
+    if ($lastFocusedElement.hasClass("ck")) {
+        // must handle CKEditor separately because of this bug: https://github.com/ckeditor/ckeditor5/issues/607
+
+        import("./note_detail.js").then(noteDetail => {
+            noteDetail.default.getActiveEditor().editing.view.focus();
+        });
+    } else {
+        $lastFocusedElement.focus();
+    }
+
+    $lastFocusedElement = null;
+}
+
+function openDialog($dialog) {
+    closeActiveDialog();
+
+    glob.activeDialog = $dialog;
+
+    saveFocusedElement();
+
+    $dialog.modal();
+
+    $dialog.on('hidden.bs.modal', () => {
+        if (!glob.activeDialog || glob.activeDialog === $dialog) {
+            focusSavedElement();
+        }
+    });
+}
+
 function isHtmlEmpty(html) {
     html = html.toLowerCase();
 
@@ -281,6 +322,9 @@ export default {
     getNoteTypeClass,
     getMimeTypeClass,
     closeActiveDialog,
+    openDialog,
+    saveFocusedElement,
+    focusSavedElement,
     isHtmlEmpty,
     clearBrowserCache,
     getUrlForDownload,