mirror of
https://github.com/zadam/trilium.git
synced 2025-03-01 14:22:32 +01:00
converted jump to note dialog to new pattern
This commit is contained in:
zadam
parent
5ccaf8b3b9
commit
6ebf7ae94e
@ -1,60 +0,0 @@
|
||||
import noteAutocompleteService from '../services/note_autocomplete.js';
|
||||
import utils from "../services/utils.js";
|
||||
import appContext from "../services/app_context.js";
|
||||
|
||||
const $dialog = $("#jump-to-note-dialog");
|
||||
const $autoComplete = $("#jump-to-note-autocomplete");
|
||||
const $showInFullTextButton = $("#show-in-full-text-button");
|
||||
|
||||
let lastOpenedTs = 0;
|
||||
const KEEP_LAST_SEARCH_FOR_X_SECONDS = 120;
|
||||
|
||||
export async function showDialog() {
|
||||
utils.openDialog($dialog);
|
||||
|
||||
noteAutocompleteService.initNoteAutocomplete($autoComplete, { hideGoToSelectedNoteButton: true })
|
||||
// clear any event listener added in previous invocation of this function
|
||||
.off('autocomplete:noteselected')
|
||||
.on('autocomplete:noteselected', function(event, suggestion, dataset) {
|
||||
if (!suggestion.notePath) {
|
||||
return false;
|
||||
}
|
||||
|
||||
appContext.tabManager.getActiveContext().setNote(suggestion.notePath);
|
||||
});
|
||||
|
||||
// if you open the Jump To dialog soon after using it previously it can often mean that you
|
||||
// actually want to search for the same thing (e.g. you opened the wrong note at first try)
|
||||
// so we'll keep the content.
|
||||
// if it's outside of this time limit then we assume it's a completely new search and show recent notes instead.
|
||||
if (Date.now() - lastOpenedTs > KEEP_LAST_SEARCH_FOR_X_SECONDS * 1000) {
|
||||
noteAutocompleteService.showRecentNotes($autoComplete);
|
||||
}
|
||||
else {
|
||||
$autoComplete
|
||||
// hack, the actual search value is stored in <pre> element next to the search input
|
||||
// this is important because the search input value is replaced with the suggestion note's title
|
||||
.autocomplete("val", $autoComplete.next().text())
|
||||
.trigger('focus')
|
||||
.trigger('select');
|
||||
}
|
||||
|
||||
lastOpenedTs = Date.now();
|
||||
}
|
||||
|
||||
function showInFullText(e) {
|
||||
// stop from propagating upwards (dangerous especially with ctrl+enter executable javascript notes)
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
|
||||
const searchString = $autoComplete.val();
|
||||
|
||||
appContext.triggerCommand('searchNotes', {searchString});
|
||||
|
||||
$dialog.modal('hide');
|
||||
}
|
||||
|
||||
|
||||
$showInFullTextButton.on('click', showInFullText);
|
||||
|
||||
utils.bindElShortcut($dialog, 'ctrl+return', showInFullText);
|
||||
@ -61,6 +61,7 @@ import SortChildNotesDialog from "../widgets/dialogs/sort_child_notes.js";
|
||||
import PasswordNoteSetDialog from "../widgets/dialogs/password_not_set.js";
|
||||
import IncludeNoteDialog from "../widgets/dialogs/include_note.js";
|
||||
import NoteTypeChooserDialog from "../widgets/dialogs/note_type_chooser.js";
|
||||
import JumpToNoteDialog from "../widgets/dialogs/jump_to_note.js";
|
||||
|
||||
export default class DesktopLayout {
|
||||
constructor(customWidgets) {
|
||||
@ -196,6 +197,7 @@ export default class DesktopLayout {
|
||||
.child(new SortChildNotesDialog())
|
||||
.child(new PasswordNoteSetDialog())
|
||||
.child(new IncludeNoteDialog())
|
||||
.child(new NoteTypeChooserDialog());
|
||||
.child(new NoteTypeChooserDialog())
|
||||
.child(new JumpToNoteDialog());
|
||||
}
|
||||
}
|
||||
|
||||
@ -8,10 +8,6 @@ import options from "./options.js";
|
||||
import froca from "./froca.js";
|
||||
|
||||
export default class RootCommandExecutor extends Component {
|
||||
jumpToNoteCommand() {
|
||||
import("../dialogs/jump_to_note.js").then(d => d.showDialog());
|
||||
}
|
||||
|
||||
showNoteRevisionsCommand() {
|
||||
import("../dialogs/note_revisions.js").then(d => d.showCurrentNoteRevisions());
|
||||
}
|
||||
|
||||
96
src/public/app/widgets/dialogs/jump_to_note.js
Normal file
96
src/public/app/widgets/dialogs/jump_to_note.js
Normal file
@ -0,0 +1,96 @@
|
||||
import noteAutocompleteService from '../../services/note_autocomplete.js';
|
||||
import utils from "../../services/utils.js";
|
||||
import appContext from "../../services/app_context.js";
|
||||
import BasicWidget from "../basic_widget.js";
|
||||
|
||||
const TPL = `<div class="jump-to-note-dialog modal 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">Jump to note</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="form-group">
|
||||
<label for="jump-to-note-autocomplete">Note</label>
|
||||
<div class="input-group">
|
||||
<input class="jump-to-note-autocomplete form-control" placeholder="search for note by its name">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button class="show-in-full-text-button btn btn-sm">Search in full text <kbd>Ctrl+Enter</kbd></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
const KEEP_LAST_SEARCH_FOR_X_SECONDS = 120;
|
||||
|
||||
export default class JumpToNoteDialog extends BasicWidget {
|
||||
constructor() {
|
||||
super();
|
||||
|
||||
this.lastOpenedTs = 0;
|
||||
}
|
||||
|
||||
doRender() {
|
||||
this.$widget = $(TPL);
|
||||
this.$autoComplete = this.$widget.find(".jump-to-note-autocomplete");
|
||||
this.$showInFullTextButton = this.$widget.find(".show-in-full-text-button");
|
||||
this.$showInFullTextButton.on('click', e => this.showInFullText(e));
|
||||
|
||||
utils.bindElShortcut(this.$widget, 'ctrl+return', e => this.showInFullText(e));
|
||||
}
|
||||
|
||||
async jumpToNoteEvent() {
|
||||
utils.openDialog(this.$widget);
|
||||
|
||||
// first open dialog, then refresh since refresh is doing focus which should be visible
|
||||
this.refresh();
|
||||
|
||||
this.lastOpenedTs = Date.now();
|
||||
}
|
||||
|
||||
async refresh() {
|
||||
noteAutocompleteService.initNoteAutocomplete(this.$autoComplete, {hideGoToSelectedNoteButton: true})
|
||||
// clear any event listener added in previous invocation of this function
|
||||
.off('autocomplete:noteselected')
|
||||
.on('autocomplete:noteselected', function (event, suggestion, dataset) {
|
||||
if (!suggestion.notePath) {
|
||||
return false;
|
||||
}
|
||||
|
||||
appContext.tabManager.getActiveContext().setNote(suggestion.notePath);
|
||||
});
|
||||
|
||||
// if you open the Jump To dialog soon after using it previously it can often mean that you
|
||||
// actually want to search for the same thing (e.g. you opened the wrong note at first try)
|
||||
// so we'll keep the content.
|
||||
// if it's outside of this time limit then we assume it's a completely new search and show recent notes instead.
|
||||
if (Date.now() - this.lastOpenedTs > KEEP_LAST_SEARCH_FOR_X_SECONDS * 1000) {
|
||||
noteAutocompleteService.showRecentNotes(this.$autoComplete);
|
||||
} else {
|
||||
this.$autoComplete
|
||||
// hack, the actual search value is stored in <pre> element next to the search input
|
||||
// this is important because the search input value is replaced with the suggestion note's title
|
||||
.autocomplete("val", this.$autoComplete.next().text())
|
||||
.trigger('focus')
|
||||
.trigger('select');
|
||||
}
|
||||
}
|
||||
|
||||
showInFullText(e) {
|
||||
// stop from propagating upwards (dangerous especially with ctrl+enter executable javascript notes)
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
|
||||
const searchString = this.$autoComplete.val();
|
||||
|
||||
this.triggerCommand('searchNotes', {searchString});
|
||||
|
||||
this.$widget.modal('hide');
|
||||
}
|
||||
}
|
||||
@ -20,7 +20,6 @@
|
||||
<%- include('dialogs/add_link.ejs') %>
|
||||
<%- include('dialogs/export.ejs') %>
|
||||
<%- include('dialogs/import.ejs') %>
|
||||
<%- include('dialogs/jump_to_note.ejs') %>
|
||||
<%- include('dialogs/markdown_import.ejs') %>
|
||||
<%- include('dialogs/note_revisions.ejs') %>
|
||||
<%- include('dialogs/options.ejs') %>
|
||||
|
||||
@ -1,23 +0,0 @@
|
||||
<div id="jump-to-note-dialog" class="modal 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">Jump to note</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="form-group">
|
||||
<label for="jump-to-note-autocomplete">Note</label>
|
||||
<div class="input-group">
|
||||
<input id="jump-to-note-autocomplete" class="form-control" placeholder="search for note by its name">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button id="show-in-full-text-button" class="btn btn-sm">Search in full text <kbd>Ctrl+Enter</kbd></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Loading…
x
Reference in New Issue
Block a user