Tools/Notes
1
0
Fork 0
mirror of https://github.com/TriliumNext/Notes.git synced 2025-07-29 19:12:27 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore(client/ts): port abstract_button

Browse Source
This commit is contained in:
Elian Doran 2025-01-07 11:11:38 +02:00
parent 5a3a31ff1c
commit 6905e1536e
No known key found for this signature in database
2 changed files with 27 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/public/app/widgets/buttons/abstract_button.js → src/public/app/widgets/buttons/abstract_button.ts
View File

@ -4,7 +4,22 @@ const TPL = `<button class="button-widget bx"
data-bs-toggle="tooltip" data-bs-toggle="tooltip"
title=""></button>`; title=""></button>`;
type TitlePlacement = "top" | "bottom" | "left" | "right";
type StringOrCallback = (() => string);
type ContextMenuHandler = (e: JQuery.ContextMenuEvent<any, any, any, any> | null) => void;
interface Settings {
titlePlacement: TitlePlacement;
title: string | StringOrCallback | null;
icon: string | StringOrCallback | null;
onContextMenu: ContextMenuHandler | null;
}
export default class AbstractButtonWidget extends NoteContextAwareWidget { export default class AbstractButtonWidget extends NoteContextAwareWidget {
private settings: Settings;
private tooltip!: bootstrap.Tooltip;
isEnabled() { isEnabled() {
return true; return true;
} }
@ -22,6 +37,8 @@ export default class AbstractButtonWidget extends NoteContextAwareWidget {
doRender() { doRender() {
this.$widget = $(TPL); this.$widget = $(TPL);
// Fix once bootstrap is available as non-UMD
//@ts-ignore
this.tooltip = new bootstrap.Tooltip(this.$widget, { this.tooltip = new bootstrap.Tooltip(this.$widget, {
html: true, html: true,
title: () => this.getTitle(), title: () => this.getTitle(),
@ -34,7 +51,9 @@ export default class AbstractButtonWidget extends NoteContextAwareWidget {
this.$widget.on("contextmenu", e => { this.$widget.on("contextmenu", e => {
this.tooltip.hide(); this.tooltip.hide();
this.settings.onContextMenu(e); if (this.settings.onContextMenu) {
this.settings.onContextMenu(e);
}
return false; // blocks default browser right click menu return false; // blocks default browser right click menu
}); });
@ -60,32 +79,31 @@ export default class AbstractButtonWidget extends NoteContextAwareWidget {
? this.settings.icon() ? this.settings.icon()
: this.settings.icon; : this.settings.icon;
this.$widget.addClass(icon); if (icon) {
this.$widget.addClass(icon);
}
} }
initialRenderCompleteEvent() { initialRenderCompleteEvent() {
this.refreshIcon(); this.refreshIcon();
} }
/** @param {string|function} icon */ icon(icon: StringOrCallback) {
icon(icon) {
this.settings.icon = icon; this.settings.icon = icon;
return this; return this;
} }
/** @param {string|function} title */ title(title: StringOrCallback) {
title(title) {
this.settings.title = title; this.settings.title = title;
return this; return this;
} }
/** @param {string} placement - "top", "bottom", "left", "right" */ titlePlacement(placement: TitlePlacement) {
titlePlacement(placement) {
this.settings.titlePlacement = placement; this.settings.titlePlacement = placement;
return this; return this;
} }
onContextMenu(handler) { onContextMenu(handler: ContextMenuHandler) {
this.settings.onContextMenu = handler; this.settings.onContextMenu = handler;
return this; return this;
} }

1
src/public/app/widgets/right_panel_widget.ts
View File

@ -15,7 +15,6 @@ const WIDGET_TPL = `
/** /**
* This widget manages rendering panels in the right-hand pane. * This widget manages rendering panels in the right-hand pane.
* @extends {NoteContextAwareWidget}
*/ */
class RightPanelWidget extends NoteContextAwareWidget { class RightPanelWidget extends NoteContextAwareWidget {