Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-26 07:46:30 +01:00
Code Issues Packages Projects Releases Activity

Merge pull request #1332 from TriliumNext/port_dialogs

Browse Source 
port dialogs
This commit is contained in:
Elian Doran
2025-03-05 14:21:02 +02:00
committed by GitHub
parent 17e3bd9f6d 883a67bcfe
commit 93e2515190
6 changed files with 65 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/public/app/components/app_context.ts
View File

@@ -24,6 +24,7 @@ import type NoteTreeWidget from "../widgets/note_tree.js";
import type { default as NoteContext, GetTextEditorCallback } from "./note_context.js";
import type { ContextMenuEvent } from "../menus/context_menu.js";
import type TypeWidget from "../widgets/type_widgets/type_widget.js";
import type EditableTextTypeWidget from "../widgets/type_widgets/editable_text.js";
interface Layout {
getRootWidget: (appContext: AppContext) => RootWidget;
@@ -132,10 +133,10 @@ export type CommandMappings = {
protectSubtree: ContextMenuCommandData;
unprotectSubtree: ContextMenuCommandData;
openBulkActionsDialog:
| ContextMenuCommandData
| {
selectedOrActiveNoteIds?: string[];
};
| ContextMenuCommandData
| {
selectedOrActiveNoteIds?: string[];
};
editBranchPrefix: ContextMenuCommandData;
convertNoteToAttachment: ContextMenuCommandData;
duplicateSubtree: ContextMenuCommandData;
@@ -361,6 +362,12 @@ type EventMappings = {
relationMapResetPanZoom: { ntxId: string | null | undefined };
relationMapResetZoomIn: { ntxId: string | null | undefined };
relationMapResetZoomOut: { ntxId: string | null | undefined };
activeNoteChangedEvent: {};
showAddLinkDialog: {
textTypeWidget: EditableTextTypeWidget;
text: string;
};
};
export type EventListener<T extends EventNames> = {

10
src/public/app/services/note_autocomplete.ts
View File

@@ -322,9 +322,7 @@ function init() {
$.fn.setSelectedNotePath = function (notePath) {
notePath = notePath || "";
$(this).attr(SELECTED_NOTE_PATH_KEY, notePath);
$(this).closest(".input-group").find(".go-to-selected-note-button").toggleClass("disabled", !notePath.trim()).attr("href", `#${notePath}`); // we also set href here so tooltip can be displayed
};
@@ -336,11 +334,9 @@ function init() {
}
};
$.fn.setSelectedExternalLink = function (externalLink) {
if (externalLink) {
// TODO: This doesn't seem to do anything with the external link, is it normal?
$(this).closest(".input-group").find(".go-to-selected-note-button").toggleClass("disabled", true);
}
$.fn.setSelectedExternalLink = function (externalLink: string | null) {
$(this).attr(SELECTED_EXTERNAL_LINK_KEY, externalLink);
$(this).closest(".input-group").find(".go-to-selected-note-button").toggleClass("disabled", true);
};
$.fn.setNote = async function (noteId) {

2
src/public/app/types.d.ts vendored
View File

@@ -84,7 +84,7 @@ declare global {
getSelectedNotePath(): string | undefined;
getSelectedNoteId(): string | null;
setSelectedNotePath(notePath: string | null | undefined);
getSelectedExternalLink(this: HTMLElement): string | undefined;
getSelectedExternalLink(): string | undefined;
setSelectedExternalLink(externalLink: string | null | undefined);
setNote(noteId: string);
markRegExp(regex: RegExp, opts: {

33
src/public/app/widgets/dialogs/about.js → src/public/app/widgets/dialogs/about.ts
View File

@@ -5,6 +5,15 @@ import openService from "../../services/open.js";
import server from "../../services/server.js";
import utils from "../../services/utils.js";
interface AppInfo {
appVersion: string;
dbVersion: number;
syncVersion: number;
buildDate: string;
buildRevision: string;
dataDirectory: string;
}
const TPL = `
<div class="about-dialog modal fade mx-auto" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg" role="document">
@@ -35,12 +44,10 @@ const TPL = `
<th>${t("about.build_date")}</th>
<td class="build-date"></td>
</tr>
<tr>
<th>${t("about.build_revision")}</th>
<td><a class="tn-link" href="" class="build-revision external" target="_blank"></a></td>
<td><a class="tn-link build-revision external" href="" target="_blank"></a></td>
</tr>
<tr>
<th>${t("about.data_directory")}</th>
<td class="data-directory"></td>
@@ -59,7 +66,14 @@ const TPL = `
`;
export default class AboutDialog extends BasicWidget {
doRender() {
private $appVersion!: JQuery<HTMLElement>;
private $dbVersion!: JQuery<HTMLElement>;
private $syncVersion!: JQuery<HTMLElement>;
private $buildDate!: JQuery<HTMLElement>;
private $buildRevision!: JQuery<HTMLElement>;
private $dataDirectory!: JQuery<HTMLElement>;
doRender(): void {
this.$widget = $(TPL);
this.$appVersion = this.$widget.find(".app-version");
this.$dbVersion = this.$widget.find(".db-version");
@@ -70,11 +84,11 @@ export default class AboutDialog extends BasicWidget {
}
async refresh() {
const appInfo = await server.get("app-info");
const appInfo = await server.get<AppInfo>("app-info");
this.$appVersion.text(appInfo.appVersion);
this.$dbVersion.text(appInfo.dbVersion);
this.$syncVersion.text(appInfo.syncVersion);
this.$dbVersion.text(appInfo.dbVersion.toString());
this.$syncVersion.text(appInfo.syncVersion.toString());
this.$buildDate.text(formatDateTime(appInfo.buildDate));
this.$buildRevision.text(appInfo.buildRevision);
this.$buildRevision.attr("href", `https://github.com/TriliumNext/Notes/commit/${appInfo.buildRevision}`);
@@ -84,9 +98,9 @@ export default class AboutDialog extends BasicWidget {
href: "#",
class: "tn-link",
text: appInfo.dataDirectory
})
}).prop("outerHTML")
);
this.$dataDirectory.find("a").on("click", (event) => {
this.$dataDirectory.find("a").on("click", (event: JQuery.ClickEvent) => {
event.preventDefault();
openService.openDirectory(appInfo.dataDirectory);
});
@@ -97,7 +111,6 @@ export default class AboutDialog extends BasicWidget {
async openAboutDialogEvent() {
await this.refresh();
utils.openDialog(this.$widget);
}
}

39
src/public/app/widgets/dialogs/add_link.js → src/public/app/widgets/dialogs/add_link.ts
View File

@@ -3,6 +3,9 @@ import treeService from "../../services/tree.js";
import noteAutocompleteService from "../../services/note_autocomplete.js";
import utils from "../../services/utils.js";
import BasicWidget from "../basic_widget.js";
import type { Suggestion } from "../../services/note_autocomplete.js";
import type { default as TextTypeWidget } from "../type_widgets/editable_text.js";
import type { EventData } from "../../components/app_context.js";
const TPL = `
<div class="add-link-dialog modal mx-auto" tabindex="-1" role="dialog">
@@ -41,7 +44,7 @@ const TPL = `
<br/>
<label>
${t("add_link.link_title")}
<input class="link-title form-control" style="width: 100%;">
</label>
</div>
@@ -56,6 +59,14 @@ const TPL = `
</div>`;
export default class AddLinkDialog extends BasicWidget {
private $form!: JQuery<HTMLElement>;
private $autoComplete!: JQuery<HTMLElement>;
private $linkTitle!: JQuery<HTMLElement>;
private $addLinkTitleSettings!: JQuery<HTMLElement>;
private $addLinkTitleRadios!: JQuery<HTMLElement>;
private $addLinkTitleFormGroup!: JQuery<HTMLElement>;
private textTypeWidget: TextTypeWidget | null = null;
doRender() {
this.$widget = $(TPL);
this.$form = this.$widget.find(".add-link-form");
@@ -65,20 +76,17 @@ export default class AddLinkDialog extends BasicWidget {
this.$addLinkTitleRadios = this.$widget.find(".add-link-title-radios");
this.$addLinkTitleFormGroup = this.$widget.find(".add-link-title-form-group");
/** @var TextTypeWidget */
this.textTypeWidget = null;
this.$form.on("submit", () => {
if (this.$autoComplete.getSelectedNotePath()) {
this.$widget.modal("hide");
const linkTitle = this.getLinkType() === "reference-link" ? null : this.$linkTitle.val();
this.textTypeWidget.addLink(this.$autoComplete.getSelectedNotePath(), linkTitle);
this.textTypeWidget?.addLink(this.$autoComplete.getSelectedNotePath()!, linkTitle);
} else if (this.$autoComplete.getSelectedExternalLink()) {
this.$widget.modal("hide");
this.textTypeWidget.addLink(this.$autoComplete.getSelectedExternalLink(), this.$linkTitle.val());
this.textTypeWidget?.addLink(this.$autoComplete.getSelectedExternalLink()!, this.$linkTitle.val(), true);
} else {
logError("No link to add.");
}
@@ -87,12 +95,12 @@ export default class AddLinkDialog extends BasicWidget {
});
}
async showAddLinkDialogEvent({ textTypeWidget, text = "" }) {
async showAddLinkDialogEvent({ textTypeWidget, text = "" }: EventData<"showAddLinkDialog">) {
this.textTypeWidget = textTypeWidget;
this.$addLinkTitleSettings.toggle(!this.textTypeWidget.hasSelection());
this.$addLinkTitleSettings.find("input[type=radio]").on("change", (e) => this.updateTitleSettingsVisibility(e));
this.$addLinkTitleSettings.find("input[type=radio]").on("change", () => this.updateTitleSettingsVisibility());
// with selection hyperlink is implied
if (this.textTypeWidget.hasSelection()) {
@@ -108,9 +116,8 @@ export default class AddLinkDialog extends BasicWidget {
this.$autoComplete.val("");
this.$linkTitle.val("");
const setDefaultLinkTitle = async (noteId) => {
const setDefaultLinkTitle = async (noteId: string) => {
const noteTitle = await treeService.getNoteTitle(noteId);
this.$linkTitle.val(noteTitle);
};
@@ -119,7 +126,7 @@ export default class AddLinkDialog extends BasicWidget {
allowCreatingNotes: true
});
this.$autoComplete.on("autocomplete:noteselected", (event, suggestion, dataset) => {
this.$autoComplete.on("autocomplete:noteselected", (event: JQuery.Event, suggestion: Suggestion) => {
if (!suggestion.notePath) {
return false;
}
@@ -133,7 +140,7 @@ export default class AddLinkDialog extends BasicWidget {
}
});
this.$autoComplete.on("autocomplete:externallinkselected", (event, suggestion, dataset) => {
this.$autoComplete.on("autocomplete:externallinkselected", (event: JQuery.Event, suggestion: Suggestion) => {
if (!suggestion.externalLink) {
return false;
}
@@ -143,11 +150,11 @@ export default class AddLinkDialog extends BasicWidget {
this.$linkTitle.val(suggestion.externalLink);
});
this.$autoComplete.on("autocomplete:cursorchanged", (event, suggestion, dataset) => {
this.$autoComplete.on("autocomplete:cursorchanged", (event: JQuery.Event, suggestion: Suggestion) => {
if (suggestion.externalLink) {
this.$linkTitle.val(suggestion.externalLink);
} else {
const noteId = treeService.getNoteIdFromUrl(suggestion.notePath);
const noteId = treeService.getNoteIdFromUrl(suggestion.notePath!);
if (noteId) {
setDefaultLinkTitle(noteId);
@@ -164,7 +171,7 @@ export default class AddLinkDialog extends BasicWidget {
this.$autoComplete.trigger("focus").trigger("select"); // to be able to quickly remove entered text
}
getLinkType() {
private getLinkType() {
if (this.$autoComplete.getSelectedExternalLink()) {
return "external-link";
}
@@ -172,7 +179,7 @@ export default class AddLinkDialog extends BasicWidget {
return this.$addLinkTitleSettings.find("input[type=radio]:checked").val();
}
updateTitleSettingsVisibility() {
private updateTitleSettingsVisibility() {
const linkType = this.getLinkType();
this.$addLinkTitleFormGroup.toggle(linkType !== "reference-link");

8
src/public/app/widgets/type_widgets/editable_text.js
View File

@@ -290,7 +290,7 @@ export default class EditableTextTypeWidget extends AbstractTextTypeWidget {
this.watchdog?.editor.editing.view.focus();
}
show() {}
show() { }
getEditor() {
return this.watchdog?.editor;
@@ -337,14 +337,14 @@ export default class EditableTextTypeWidget extends AbstractTextTypeWidget {
this.addTextToEditor(text);
}
async addLink(notePath, linkTitle) {
async addLink(notePath, linkTitle, externalLink = false) {
await this.initialized;
if (linkTitle) {
if (this.hasSelection()) {
this.watchdog.editor.execute("link", `#${notePath}`);
this.watchdog.editor.execute("link", externalLink ? `${notePath}` : `#${notePath}`);
} else {
await this.addLinkToEditor(`#${notePath}`, linkTitle);
await this.addLinkToEditor(externalLink ? `${notePath}` : `#${notePath}`, linkTitle);
}
} else {
this.watchdog.editor.execute("referenceLink", { href: "#" + notePath });