mirror of
https://github.com/zadam/trilium.git
synced 2025-11-16 10:15:52 +01:00
fix all dropdowns and tooltips, fix some translations
This commit is contained in:
@@ -30,13 +30,12 @@ const TPL = `
|
||||
</style>
|
||||
|
||||
<div class="input-group-prepend">
|
||||
<button class="btn btn-outline-secondary search-button" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<button class="btn btn-outline-secondary search-button" type="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<span class="bx bx-search"></span>
|
||||
</button>
|
||||
<div class="dropdown-menu dropdown-menu-left"></div>
|
||||
</div>
|
||||
<input type="text" class="form-control form-control-sm search-string" placeholder="Quick search">
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
const MAX_DISPLAYED_NOTES = 15;
|
||||
@@ -44,21 +43,20 @@ const MAX_DISPLAYED_NOTES = 15;
|
||||
export default class QuickSearchWidget extends BasicWidget {
|
||||
doRender() {
|
||||
this.$widget = $(TPL);
|
||||
this.dropdown = bootstrap.Dropdown.getOrCreateInstance(this.$widget.find("[data-bs-toggle='dropdown']"));
|
||||
|
||||
this.$searchString = this.$widget.find('.search-string');
|
||||
this.$dropdownMenu = this.$widget.find('.dropdown-menu');
|
||||
this.$dropdownToggle = this.$widget.find('.search-button');
|
||||
this.$dropdownToggle.dropdown();
|
||||
|
||||
this.$widget.find('.input-group-prepend').on('shown.bs.dropdown', () => this.search());
|
||||
|
||||
if(utils.isMobile()) {
|
||||
this.$searchString.keydown(e =>{
|
||||
if(e.which === 13) {
|
||||
if (utils.isMobile()) {
|
||||
this.$searchString.keydown(e => {
|
||||
if (e.which === 13) {
|
||||
if (this.$dropdownMenu.is(":visible")) {
|
||||
this.search(); // just update already visible dropdown
|
||||
} else {
|
||||
this.$dropdownToggle.dropdown('show');
|
||||
this.dropdown.show();
|
||||
}
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
@@ -70,7 +68,7 @@ export default class QuickSearchWidget extends BasicWidget {
|
||||
if (this.$dropdownMenu.is(":visible")) {
|
||||
this.search(); // just update already visible dropdown
|
||||
} else {
|
||||
this.$dropdownToggle.dropdown('show');
|
||||
this.dropdown.show();
|
||||
}
|
||||
|
||||
this.$searchString.focus();
|
||||
@@ -81,7 +79,7 @@ export default class QuickSearchWidget extends BasicWidget {
|
||||
});
|
||||
|
||||
shortcutService.bindElShortcut(this.$searchString, 'esc', () => {
|
||||
this.$dropdownToggle.dropdown('hide');
|
||||
this.dropdown.hide();
|
||||
});
|
||||
|
||||
return this.$widget;
|
||||
@@ -91,25 +89,25 @@ export default class QuickSearchWidget extends BasicWidget {
|
||||
const searchString = this.$searchString.val().trim();
|
||||
|
||||
if (!searchString) {
|
||||
this.$dropdownToggle.dropdown("hide");
|
||||
this.dropdown.hide();
|
||||
return;
|
||||
}
|
||||
|
||||
this.$dropdownMenu.empty();
|
||||
this.$dropdownMenu.append('<span class="dropdown-item disabled"><span class="bx bx-loader bx-spin"></span> Searching ...</span>');
|
||||
|
||||
const {searchResultNoteIds, error} = await server.get(`quick-search/${encodeURIComponent(searchString)}`);
|
||||
const { searchResultNoteIds, error } = await server.get(`quick-search/${encodeURIComponent(searchString)}`);
|
||||
|
||||
if (error) {
|
||||
this.$searchString.tooltip({
|
||||
let tooltip = new bootstrap.Tooltip(this.$searchString, {
|
||||
trigger: 'manual',
|
||||
title: `Search error: ${error}`,
|
||||
placement: 'right'
|
||||
});
|
||||
|
||||
this.$searchString.tooltip("show");
|
||||
tooltip.show();
|
||||
|
||||
setTimeout(() => this.$searchString.tooltip("dispose"), 4000);
|
||||
setTimeout(() => tooltip.dispose(), 4000);
|
||||
}
|
||||
|
||||
const displayedNoteIds = searchResultNoteIds.slice(0, Math.min(MAX_DISPLAYED_NOTES, searchResultNoteIds.length));
|
||||
@@ -121,11 +119,11 @@ export default class QuickSearchWidget extends BasicWidget {
|
||||
}
|
||||
|
||||
for (const note of await froca.getNotes(displayedNoteIds)) {
|
||||
const $link = await linkService.createLink(note.noteId, {showNotePath: true});
|
||||
const $link = await linkService.createLink(note.noteId, { showNotePath: true });
|
||||
$link.addClass('dropdown-item');
|
||||
$link.attr("tabIndex", "0");
|
||||
$link.on('click', e => {
|
||||
this.$dropdownToggle.dropdown("hide");
|
||||
this.dropdown.hide();
|
||||
|
||||
if (!e.target || e.target.nodeName !== 'A') {
|
||||
// click on the link is handled by link handling, but we want the whole item clickable
|
||||
@@ -133,7 +131,7 @@ export default class QuickSearchWidget extends BasicWidget {
|
||||
}
|
||||
});
|
||||
shortcutService.bindElShortcut($link, 'return', () => {
|
||||
this.$dropdownToggle.dropdown("hide");
|
||||
this.dropdown.hide();
|
||||
|
||||
appContext.tabManager.getActiveContext().setNote(note.noteId);
|
||||
});
|
||||
@@ -156,11 +154,11 @@ export default class QuickSearchWidget extends BasicWidget {
|
||||
|
||||
shortcutService.bindElShortcut(this.$dropdownMenu.find('.dropdown-item:first'), 'up', () => this.$searchString.focus());
|
||||
|
||||
this.$dropdownToggle.dropdown('update');
|
||||
this.dropdown.update();
|
||||
}
|
||||
|
||||
async showInFullSearch() {
|
||||
this.$dropdownToggle.dropdown("hide");
|
||||
this.dropdown.hide();
|
||||
|
||||
await appContext.triggerCommand('searchNotes', {
|
||||
searchString: this.$searchString.val()
|
||||
|
||||
Reference in New Issue
Block a user