gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-20 15:19:01 +02:00
Code Issues Actions 19 Packages Projects Releases Wiki Activity

refactor(book_properties): move rendering to book_properties

Browse Source
This commit is contained in:
Elian Doran 2025-07-09 20:37:05 +03:00
parent 196bba9cda
commit 51b7955ccd
No known key found for this signature in database
2 changed files with 54 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
apps/client/src/widgets/ribbon_widgets/book_properties.ts
View File

@ -3,7 +3,8 @@ import attributeService from "../../services/attributes.js";
import { t } from "../../services/i18n.js";
import type FNote from "../../entities/fnote.js";
import type { EventData } from "../../components/app_context.js";
import { bookPropertiesConfig, renderBookProperty } from "./book_properties_config.js";
import { bookPropertiesConfig, BookProperty } from "./book_properties_config.js";
import attributes from "../../services/attributes.js";
const TPL = /*html*/`
<div class="book-properties-widget">
@ -98,10 +99,7 @@ export default class BookPropertiesWidget extends NoteContextAwareWidget {
const bookPropertiesData = bookPropertiesConfig[viewType];
if (bookPropertiesData) {
for (const property of bookPropertiesData.properties) {
this.$propertiesContainer.append(renderBookProperty(property, {
note: this.note,
triggerCommand: this.triggerCommand.bind(this)
}));
this.$propertiesContainer.append(this.renderBookProperty(property));
this.labelsToWatch.push(property.bindToLabel);
}
}
@ -126,4 +124,54 @@ export default class BookPropertiesWidget extends NoteContextAwareWidget {
this.refresh();
}
}
renderBookProperty(property: BookProperty) {
const $container = $("<div>");
const note = this.note;
if (!note) {
return $container;
}
switch (property.type) {
case "checkbox":
const $label = $("<label>").text(property.label);
const $checkbox = $("<input>", {
type: "checkbox",
class: "form-check-input",
});
$checkbox.on("change", () => {
if ($checkbox.prop("checked")) {
attributes.setLabel(note.noteId, property.bindToLabel);
} else {
attributes.removeOwnedLabelByName(note, property.bindToLabel);
}
});
$checkbox.prop("checked", note.hasOwnedLabel(property.bindToLabel));
$label.prepend($checkbox);
$container.append($label);
break;
case "button":
const $button = $("<button>", {
type: "button",
class: "btn btn-sm"
}).text(property.label);
if (property.title) {
$button.attr("title", property.title);
}
if (property.icon) {
$button.prepend($("<span>", { class: property.icon }));
}
$button.on("click", () => {
property.onClick({
note,
triggerCommand: this.triggerCommand.bind(this)
});
});
$container.append($button);
break;
}
return $container;
}
}

44
apps/client/src/widgets/ribbon_widgets/book_properties_config.ts
View File

@ -4,7 +4,7 @@ import attributes from "../../services/attributes";
import { ViewTypeOptions } from "../../services/note_list_renderer"
import NoteContextAwareWidget from "../note_context_aware_widget";
type BookProperty = CheckBoxProperty | ButtonProperty;
export type BookProperty = CheckBoxProperty | ButtonProperty;
interface BookConfig {
properties: BookProperty[];
@ -79,45 +79,3 @@ export const bookPropertiesConfig: Record<ViewTypeOptions, BookConfig> = {
]
}
};
export function renderBookProperty(property: BookProperty, context: BookContext) {
const $container = $("<div>");
const { note } = context;
switch (property.type) {
case "checkbox":
const $label = $("<label>").text(property.label);
const $checkbox = $("<input>", {
type: "checkbox",
class: "form-check-input",
});
$checkbox.on("change", () => {
if ($checkbox.prop("checked")) {
attributes.setLabel(note.noteId, property.bindToLabel);
} else {
attributes.removeOwnedLabelByName(note, property.bindToLabel);
}
});
$checkbox.prop("checked", note.hasOwnedLabel(property.bindToLabel));
$label.prepend($checkbox);
$container.append($label);
break;
case "button":
const $button = $("<button>", {
type: "button",
class: "btn btn-sm"
}).text(property.label);
if (property.title) {
$button.attr("title", property.title);
}
if (property.icon) {
$button.prepend($("<span>", { class: property.icon }));
}
$button.on("click", () => {
property.onClick(context);
});
$container.append($button);
break;
}
return $container;
}