chore(client/ts): port options/text_notes

This commit is contained in:
Elian Doran 2025-01-11 11:21:14 +02:00
parent 677760282c
commit 7e61af1cc3
No known key found for this signature in database
5 changed files with 37 additions and 15 deletions

View File

@ -1,3 +1,4 @@
import type { OptionMap } from "../../../../../../services/options_interface.js";
import { t } from "../../../../services/i18n.js";
import utils from "../../../../services/utils.js";
import OptionsWidget from "../options_widget.js";
@ -39,6 +40,10 @@ const TPL = `
`;
export default class EditorOptions extends OptionsWidget {
private $body!: JQuery<HTMLElement>;
private $multilineToolbarCheckbox!: JQuery<HTMLElement>;
doRender() {
this.$widget = $(TPL);
this.$body = $("body");
@ -52,7 +57,7 @@ export default class EditorOptions extends OptionsWidget {
this.$multilineToolbarCheckbox.on("change", () => this.updateCheckboxOption("textNoteEditorMultilineToolbar", this.$multilineToolbarCheckbox));
}
async optionsLoaded(options) {
async optionsLoaded(options: OptionMap) {
this.$widget.find(`input[name="editor-type"][value="${options.textNoteEditorType}"]`).prop("checked", "true");
this.setCheckboxState(this.$multilineToolbarCheckbox, options.textNoteEditorMultilineToolbar);
}

View File

@ -1,5 +1,6 @@
import OptionsWidget from "../options_widget.js";
import { t } from "../../../../services/i18n.js";
import type { OptionMap } from "../../../../../../services/options_interface.js";
const TPL = `
<div class="options-section">
@ -13,12 +14,16 @@ const TPL = `
</div>`;
export default class HeadingStyleOptions extends OptionsWidget {
private $body!: JQuery<HTMLElement>;
private $headingStyle!: JQuery<HTMLElement>;
doRender() {
this.$widget = $(TPL);
this.$body = $("body");
this.$headingStyle = this.$widget.find(".heading-style");
this.$headingStyle.on("change", () => {
const newHeadingStyle = this.$headingStyle.val();
const newHeadingStyle = String(this.$headingStyle.val());
this.toggleBodyClass("heading-style-", newHeadingStyle);
@ -26,11 +31,11 @@ export default class HeadingStyleOptions extends OptionsWidget {
});
}
async optionsLoaded(options) {
async optionsLoaded(options: OptionMap) {
this.$headingStyle.val(options.headingStyle);
}
toggleBodyClass(prefix, value) {
toggleBodyClass(prefix: string, value: string) {
for (const clazz of Array.from(this.$body[0].classList)) {
// create copy to safely iterate over while removing classes
if (clazz.startsWith(prefix)) {

View File

@ -1,5 +1,6 @@
import OptionsWidget from "../options_widget.js";
import { t } from "../../../../services/i18n.js";
import type { OptionMap } from "../../../../../../services/options_interface.js";
const TPL = `
<div class="options-section">
@ -25,6 +26,9 @@ const TPL = `
</div>`;
export default class HighlightsListOptions extends OptionsWidget {
private $hlt!: JQuery<HTMLInputElement>;
doRender() {
this.$widget = $(TPL);
this.$hlt = this.$widget.find("input.highlights-list-check");
@ -32,14 +36,14 @@ export default class HighlightsListOptions extends OptionsWidget {
const hltVals = this.$widget
.find('input.highlights-list-check[type="checkbox"]:checked')
.map(function () {
return this.value;
return (this as HTMLInputElement).value;
})
.get();
this.updateOption("highlightsList", JSON.stringify(hltVals));
});
}
async optionsLoaded(options) {
async optionsLoaded(options: OptionMap) {
const hltVals = JSON.parse(options.highlightsList);
this.$widget.find('input.highlights-list-check[type="checkbox"]').each(function () {
if ($.inArray($(this).val(), hltVals) !== -1) {

View File

@ -1,5 +1,6 @@
import OptionsWidget from "../options_widget.js";
import { t } from "../../../../services/i18n.js";
import type { OptionMap } from "../../../../../../services/options_interface.js";
const TPL = `
<div class="options-section">
@ -17,13 +18,16 @@ const TPL = `
</div>`;
export default class TableOfContentsOptions extends OptionsWidget {
private $minTocHeadings!: JQuery<HTMLElement>;
doRender() {
this.$widget = $(TPL);
this.$minTocHeadings = this.$widget.find(".min-toc-headings");
this.$minTocHeadings.on("change", () => this.updateOption("minTocHeadings", this.$minTocHeadings.val()));
}
async optionsLoaded(options) {
async optionsLoaded(options: OptionMap) {
this.$minTocHeadings.val(options.minTocHeadings);
}
}

View File

@ -1,5 +1,6 @@
import OptionsWidget from "../options_widget.js";
import { t } from "../../../../services/i18n.js";
import type { OptionMap } from "../../../../../../services/options_interface.js";
const TPL = `
<div class="options-section">
@ -14,13 +15,16 @@ const TPL = `
</div>`;
export default class TextAutoReadOnlySizeOptions extends OptionsWidget {
private $autoReadonlySizeText!: JQuery<HTMLElement>;
doRender() {
this.$widget = $(TPL);
this.$autoReadonlySizeText = this.$widget.find(".auto-readonly-size-text");
this.$autoReadonlySizeText.on("change", () => this.updateOption("autoReadonlySizeText", this.$autoReadonlySizeText.val()));
}
async optionsLoaded(options) {
async optionsLoaded(options: OptionMap) {
this.$autoReadonlySizeText.val(options.autoReadonlySizeText);
}
}