mirror of
https://github.com/zadam/trilium.git
synced 2024-09-20 23:55:59 +08:00
converted note source dialog to new pattern
This commit is contained in:
parent
b678d87c80
commit
7ba619c71d
|
@ -1,25 +1,54 @@
|
||||||
import appContext from "../services/app_context.js";
|
import appContext from "../services/app_context.js";
|
||||||
|
import BasicWidget from "../widgets/basic_widget.js";
|
||||||
import utils from "../services/utils.js";
|
import utils from "../services/utils.js";
|
||||||
|
|
||||||
const $dialog = $("#note-source-dialog");
|
const TPL = `
|
||||||
const $noteSource = $("#note-source");
|
<div class="note-source-dialog modal fade mx-auto" tabindex="-1" role="dialog">
|
||||||
|
<style>
|
||||||
|
.note-source-dialog .note-source {
|
||||||
|
height: 98%;
|
||||||
|
width: 100%;
|
||||||
|
min-height: 500px;
|
||||||
|
overflow: scroll;
|
||||||
|
line-height: 0.7;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
export async function showDialog() {
|
<div class="modal-dialog modal-lg" role="document">
|
||||||
utils.openDialog($dialog);
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<h5 class="modal-title">Note source</h5>
|
||||||
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||||
|
<span aria-hidden="true">×</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
<textarea readonly="readonly" class="note-source"></textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>`;
|
||||||
|
|
||||||
|
export default class NoteSourceDialog extends BasicWidget {
|
||||||
|
doRender() {
|
||||||
|
this.$widget = $(TPL);
|
||||||
|
this.$noteSource = this.$widget.find(".note-source");
|
||||||
|
}
|
||||||
|
|
||||||
|
async refresh() {
|
||||||
const noteCompletement = await appContext.tabManager.getActiveContext().getNoteComplement();
|
const noteCompletement = await appContext.tabManager.getActiveContext().getNoteComplement();
|
||||||
|
|
||||||
$noteSource.text(formatHtml(noteCompletement.content));
|
this.$noteSource.text(this.formatHtml(noteCompletement.content));
|
||||||
}
|
}
|
||||||
|
|
||||||
function formatHtml(str) {
|
formatHtml(str) {
|
||||||
const div = document.createElement('div');
|
const div = document.createElement('div');
|
||||||
div.innerHTML = str.trim();
|
div.innerHTML = str.trim();
|
||||||
|
|
||||||
return formatNode(div, 0).innerHTML.trim();
|
return this.formatNode(div, 0).innerHTML.trim();
|
||||||
}
|
}
|
||||||
|
|
||||||
function formatNode(node, level) {
|
formatNode(node, level) {
|
||||||
const indentBefore = new Array(level++ + 1).join(' ');
|
const indentBefore = new Array(level++ + 1).join(' ');
|
||||||
const indentAfter = new Array(level - 1).join(' ');
|
const indentAfter = new Array(level - 1).join(' ');
|
||||||
let textNode;
|
let textNode;
|
||||||
|
@ -28,7 +57,7 @@ function formatNode(node, level) {
|
||||||
textNode = document.createTextNode('\n' + indentBefore);
|
textNode = document.createTextNode('\n' + indentBefore);
|
||||||
node.insertBefore(textNode, node.children[i]);
|
node.insertBefore(textNode, node.children[i]);
|
||||||
|
|
||||||
formatNode(node.children[i], level);
|
this.formatNode(node.children[i], level);
|
||||||
|
|
||||||
if (node.lastElementChild === node.children[i]) {
|
if (node.lastElementChild === node.children[i]) {
|
||||||
textNode = document.createTextNode('\n' + indentAfter);
|
textNode = document.createTextNode('\n' + indentAfter);
|
||||||
|
@ -37,4 +66,11 @@ function formatNode(node, level) {
|
||||||
}
|
}
|
||||||
|
|
||||||
return node;
|
return node;
|
||||||
|
}
|
||||||
|
|
||||||
|
async openNoteSourceDialogEvent() {
|
||||||
|
await this.refresh();
|
||||||
|
|
||||||
|
utils.openDialog(this.$widget);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -52,6 +52,7 @@ import FindWidget from "../widgets/find.js";
|
||||||
import TocWidget from "../widgets/toc.js";
|
import TocWidget from "../widgets/toc.js";
|
||||||
import BulkActionsDialog from "../widgets/dialogs/bulk_actions.js";
|
import BulkActionsDialog from "../widgets/dialogs/bulk_actions.js";
|
||||||
import AboutDialog from "../widgets/dialogs/about.js";
|
import AboutDialog from "../widgets/dialogs/about.js";
|
||||||
|
import NoteSourceDialog from "../dialogs/note_source.js";
|
||||||
|
|
||||||
export default class DesktopLayout {
|
export default class DesktopLayout {
|
||||||
constructor(customWidgets) {
|
constructor(customWidgets) {
|
||||||
|
@ -178,6 +179,7 @@ export default class DesktopLayout {
|
||||||
)
|
)
|
||||||
)
|
)
|
||||||
.child(new BulkActionsDialog())
|
.child(new BulkActionsDialog())
|
||||||
.child(new AboutDialog());
|
.child(new AboutDialog())
|
||||||
|
.child(new NoteSourceDialog());
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -20,10 +20,6 @@ export default class RootCommandExecutor extends Component {
|
||||||
import("../dialogs/note_revisions.js").then(d => d.showCurrentNoteRevisions());
|
import("../dialogs/note_revisions.js").then(d => d.showCurrentNoteRevisions());
|
||||||
}
|
}
|
||||||
|
|
||||||
showNoteSourceCommand() {
|
|
||||||
import("../dialogs/note_source.js").then(d => d.showDialog());
|
|
||||||
}
|
|
||||||
|
|
||||||
pasteMarkdownIntoTextCommand() {
|
pasteMarkdownIntoTextCommand() {
|
||||||
import("../dialogs/markdown_import.js").then(d => d.importMarkdownInline());
|
import("../dialogs/markdown_import.js").then(d => d.importMarkdownInline());
|
||||||
}
|
}
|
||||||
|
|
|
@ -26,7 +26,7 @@ const TPL = `
|
||||||
<div class="dropdown-menu dropdown-menu-right">
|
<div class="dropdown-menu dropdown-menu-right">
|
||||||
<a data-trigger-command="renderActiveNote" class="dropdown-item render-note-button"><kbd data-command="renderActiveNote"></kbd> Re-render note</a>
|
<a data-trigger-command="renderActiveNote" class="dropdown-item render-note-button"><kbd data-command="renderActiveNote"></kbd> Re-render note</a>
|
||||||
<a data-trigger-command="findInText" class="dropdown-item find-in-text-button">Search in note <kbd data-command="findInText"></a>
|
<a data-trigger-command="findInText" class="dropdown-item find-in-text-button">Search in note <kbd data-command="findInText"></a>
|
||||||
<a data-trigger-command="showNoteSource" class="dropdown-item show-source-button"><kbd data-command="showNoteSource"></kbd> Note source</a>
|
<a data-trigger-command="openNoteSourceDialog" class="dropdown-item show-source-button"><kbd data-command="showNoteSource"></kbd> Note source</a>
|
||||||
<a data-trigger-command="openNoteExternally" class="dropdown-item open-note-externally-button"><kbd data-command="openNoteExternally"></kbd> Open note externally</a>
|
<a data-trigger-command="openNoteExternally" class="dropdown-item open-note-externally-button"><kbd data-command="openNoteExternally"></kbd> Open note externally</a>
|
||||||
<a class="dropdown-item import-files-button">Import files</a>
|
<a class="dropdown-item import-files-button">Import files</a>
|
||||||
<a class="dropdown-item export-note-button">Export note</a>
|
<a class="dropdown-item export-note-button">Export note</a>
|
||||||
|
|
|
@ -10,7 +10,7 @@ export default class ShowNoteSourceButton extends ButtonWidget {
|
||||||
|
|
||||||
this.icon('bx bx-code')
|
this.icon('bx bx-code')
|
||||||
.title("Show Note Source")
|
.title("Show Note Source")
|
||||||
.command("showNoteSource")
|
.command("openNoteSourceDialog")
|
||||||
.titlePlacement("bottom");
|
.titlePlacement("bottom");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -54,8 +54,6 @@ const TPL = `
|
||||||
export default class AboutDialog extends BasicWidget {
|
export default class AboutDialog extends BasicWidget {
|
||||||
doRender() {
|
doRender() {
|
||||||
this.$widget = $(TPL);
|
this.$widget = $(TPL);
|
||||||
|
|
||||||
this.$dialog = this.$widget.find(".about-dialog");
|
|
||||||
this.$appVersion = this.$widget.find(".app-version");
|
this.$appVersion = this.$widget.find(".app-version");
|
||||||
this.$dbVersion = this.$widget.find(".db-version");
|
this.$dbVersion = this.$widget.find(".db-version");
|
||||||
this.$syncVersion = this.$widget.find(".sync-version");
|
this.$syncVersion = this.$widget.find(".sync-version");
|
||||||
|
|
|
@ -169,12 +169,6 @@ div.ui-tooltip {
|
||||||
float: right;
|
float: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
#note-source {
|
|
||||||
height: 98%;
|
|
||||||
width: 100%;
|
|
||||||
overflow: scroll;
|
|
||||||
}
|
|
||||||
|
|
||||||
.suppressed {
|
.suppressed {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
|
@ -24,7 +24,6 @@
|
||||||
<%- include('dialogs/jump_to_note.ejs') %>
|
<%- include('dialogs/jump_to_note.ejs') %>
|
||||||
<%- include('dialogs/markdown_import.ejs') %>
|
<%- include('dialogs/markdown_import.ejs') %>
|
||||||
<%- include('dialogs/note_revisions.ejs') %>
|
<%- include('dialogs/note_revisions.ejs') %>
|
||||||
<%- include('dialogs/note_source.ejs') %>
|
|
||||||
<%- include('dialogs/options.ejs') %>
|
<%- include('dialogs/options.ejs') %>
|
||||||
<%- include('dialogs/protected_session_password.ejs') %>
|
<%- include('dialogs/protected_session_password.ejs') %>
|
||||||
<%- include('dialogs/recent_changes.ejs') %>
|
<%- include('dialogs/recent_changes.ejs') %>
|
||||||
|
|
|
@ -1,15 +0,0 @@
|
||||||
<div id="note-source-dialog" class="modal fade mx-auto" tabindex="-1" role="dialog">
|
|
||||||
<div class="modal-dialog modal-lg" role="document">
|
|
||||||
<div class="modal-content">
|
|
||||||
<div class="modal-header">
|
|
||||||
<h5 class="modal-title">Note source</h5>
|
|
||||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
||||||
<span aria-hidden="true">×</span>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="modal-body">
|
|
||||||
<textarea id="note-source" readonly="readonly" style="min-height: 500px;"></textarea>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
Loading…
Reference in a new issue