From 3255607b09a635f2b57dc5525446617e13398359 Mon Sep 17 00:00:00 2001 From: zadam Date: Thu, 16 Jun 2022 15:15:42 +0200 Subject: [PATCH] converted markdown import dialog to new pattern --- src/public/app/dialogs/markdown_import.js | 62 ------------- src/public/app/layouts/desktop_layout.js | 4 +- src/public/app/services/glob.js | 6 +- .../app/services/root_command_executor.js | 2 +- .../app/widgets/dialogs/markdown_import.js | 92 +++++++++++++++++++ src/views/desktop.ejs | 1 - src/views/dialogs/markdown_import.ejs | 20 ---- 7 files changed, 97 insertions(+), 90 deletions(-) delete mode 100644 src/public/app/dialogs/markdown_import.js create mode 100644 src/public/app/widgets/dialogs/markdown_import.js delete mode 100644 src/views/dialogs/markdown_import.ejs diff --git a/src/public/app/dialogs/markdown_import.js b/src/public/app/dialogs/markdown_import.js deleted file mode 100644 index 285f6808e..000000000 --- a/src/public/app/dialogs/markdown_import.js +++ /dev/null @@ -1,62 +0,0 @@ -import libraryLoader from "../services/library_loader.js"; -import toastService from "../services/toast.js"; -import utils from "../services/utils.js"; -import appContext from "../services/app_context.js"; - -const $dialog = $('#markdown-import-dialog'); -const $importTextarea = $('#markdown-import-textarea'); -const $importButton = $('#markdown-import-button'); - -async function convertMarkdownToHtml(text) { - await libraryLoader.requireLibrary(libraryLoader.COMMONMARK); - - const reader = new commonmark.Parser(); - const writer = new commonmark.HtmlRenderer(); - const parsed = reader.parse(text); - - const result = writer.render(parsed); - - appContext.triggerCommand('executeWithTextEditor', { - callback: textEditor => { - const viewFragment = textEditor.data.processor.toView(result); - const modelFragment = textEditor.data.toModel(viewFragment); - - textEditor.model.insertContent(modelFragment, textEditor.model.document.selection); - - toastService.showMessage("Markdown content has been imported into the document."); - }, - ntxId: this.ntxId - }); -} - -export async function importMarkdownInline() { - if (appContext.tabManager.getActiveContextNoteType() !== 'text') { - return; - } - - if (utils.isElectron()) { - const {clipboard} = utils.dynamicRequire('electron'); - const text = clipboard.readText(); - - convertMarkdownToHtml(text); - } - else { - utils.openDialog($dialog); - } -} - -async function sendForm() { - const text = $importTextarea.val(); - - $dialog.modal('hide'); - - await convertMarkdownToHtml(text); - - $importTextarea.val(''); -} - -$importButton.on('click', sendForm); - -$dialog.on('shown.bs.modal', () => $importTextarea.trigger('focus')); - -utils.bindElShortcut($dialog, 'ctrl+return', sendForm); diff --git a/src/public/app/layouts/desktop_layout.js b/src/public/app/layouts/desktop_layout.js index cf7e50436..ccd7702ab 100644 --- a/src/public/app/layouts/desktop_layout.js +++ b/src/public/app/layouts/desktop_layout.js @@ -67,6 +67,7 @@ import CloneToDialog from "../widgets/dialogs/clone_to.js"; import MoveToDialog from "../widgets/dialogs/move_to.js"; import ImportDialog from "../widgets/dialogs/import.js"; import ExportDialog from "../widgets/dialogs/export.js"; +import MarkdownImportDialog from "../widgets/dialogs/markdown_import.js"; export default class DesktopLayout { constructor(customWidgets) { @@ -208,6 +209,7 @@ export default class DesktopLayout { .child(new CloneToDialog()) .child(new MoveToDialog()) .child(new ImportDialog()) - .child(new ExportDialog()); + .child(new ExportDialog()) + .child(new MarkdownImportDialog()); } } diff --git a/src/public/app/services/glob.js b/src/public/app/services/glob.js index c34f86352..7a22d4ad3 100644 --- a/src/public/app/services/glob.js +++ b/src/public/app/services/glob.js @@ -23,11 +23,7 @@ function setupGlobs() { window.glob.treeCache = froca; // compatibility for CKEditor builds for a while // for CKEditor integration (button on block toolbar) - window.glob.importMarkdownInline = async () => { - const dialog = await import("../dialogs/markdown_import.js"); - - dialog.importMarkdownInline(); - }; + window.glob.importMarkdownInline = async () => appContext.triggerCommand("importMarkdownInline"); window.glob.SEARCH_HELP_TEXT = ` Search tips - also see diff --git a/src/public/app/services/root_command_executor.js b/src/public/app/services/root_command_executor.js index 65332502a..4a275c278 100644 --- a/src/public/app/services/root_command_executor.js +++ b/src/public/app/services/root_command_executor.js @@ -13,7 +13,7 @@ export default class RootCommandExecutor extends Component { } pasteMarkdownIntoTextCommand() { - import("../dialogs/markdown_import.js").then(d => d.importMarkdownInline()); + import("../widgets/dialogs/markdown_import.js").then(d => d.importMarkdownInline()); } editReadOnlyNoteCommand() { diff --git a/src/public/app/widgets/dialogs/markdown_import.js b/src/public/app/widgets/dialogs/markdown_import.js new file mode 100644 index 000000000..d6b514136 --- /dev/null +++ b/src/public/app/widgets/dialogs/markdown_import.js @@ -0,0 +1,92 @@ +import libraryLoader from "../../services/library_loader.js"; +import toastService from "../../services/toast.js"; +import utils from "../../services/utils.js"; +import appContext from "../../services/app_context.js"; +import BasicWidget from "../basic_widget.js"; + +const TPL = ` +`; + +export default class MarkdownImportDialog extends BasicWidget { + constructor() { + super(); + + this.lastOpenedTs = 0; + } + + doRender() { + this.$widget = $(TPL); + this.$importTextarea = this.$widget.find('.markdown-import-textarea'); + this.$importButton = this.$widget.find('.markdown-import-button'); + + this.$importButton.on('click', () => this.sendForm()); + + this.$widget.on('shown.bs.modal', () => this.$importTextarea.trigger('focus')); + + utils.bindElShortcut(this.$widget, 'ctrl+return', () => this.sendForm()); + } + + async convertMarkdownToHtml(text) { + await libraryLoader.requireLibrary(libraryLoader.COMMONMARK); + + const reader = new commonmark.Parser(); + const writer = new commonmark.HtmlRenderer(); + const parsed = reader.parse(text); + + const result = writer.render(parsed); + + const textEditor = await appContext.tabManager.getActiveContext().getTextEditor(); + + const viewFragment = textEditor.data.processor.toView(result); + const modelFragment = textEditor.data.toModel(viewFragment); + + textEditor.model.insertContent(modelFragment, textEditor.model.document.selection); + + toastService.showMessage("Markdown content has been imported into the document."); + } + + async importMarkdownInlineEvent() { + if (appContext.tabManager.getActiveContextNoteType() !== 'text') { + return; + } + + if (utils.isElectron()) { + const {clipboard} = utils.dynamicRequire('electron'); + const text = clipboard.readText(); + + this.convertMarkdownToHtml(text); + } + else { + utils.openDialog(this.$widget); + } + } + + async sendForm() { + const text = this.$importTextarea.val(); + + this.$widget.modal('hide'); + + await this.convertMarkdownToHtml(text); + + this.$importTextarea.val(''); + } +} diff --git a/src/views/desktop.ejs b/src/views/desktop.ejs index 568fd80cf..2545d801f 100644 --- a/src/views/desktop.ejs +++ b/src/views/desktop.ejs @@ -17,7 +17,6 @@ -<%- include('dialogs/markdown_import.ejs') %> <%- include('dialogs/note_revisions.ejs') %> <%- include('dialogs/options.ejs') %> <%- include('dialogs/protected_session_password.ejs') %> diff --git a/src/views/dialogs/markdown_import.ejs b/src/views/dialogs/markdown_import.ejs deleted file mode 100644 index 8d93949b3..000000000 --- a/src/views/dialogs/markdown_import.ejs +++ /dev/null @@ -1,20 +0,0 @@ -