Tools/Notes
1
0
Fork 0
mirror of https://github.com/TriliumNext/Notes.git synced 2025-09-19 02:10:04 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore(client/ts): port options/images

Browse Source
This commit is contained in:
Elian Doran 2025-01-11 11:13:11 +02:00
parent 6665a8d97f
commit 03241a8967
No known key found for this signature in database
1 changed files with 14 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/public/app/widgets/type_widgets/options/images/images.js → src/public/app/widgets/type_widgets/options/images/images.ts
View File

@ -1,5 +1,6 @@
import OptionsWidget from "../options_widget.js"; import OptionsWidget from "../options_widget.js";
import { t } from "../../../../services/i18n.js"; import { t } from "../../../../services/i18n.js";
import type { OptionMap } from "../../../../../../services/options_interface.js";
const TPL = ` const TPL = `
<div class="options-section"> <div class="options-section">
@ -11,14 +12,14 @@ const TPL = `
</style> </style>
<h4>${t("images.images_section_title")}</h4> <h4>${t("images.images_section_title")}</h4>
<label> <label>
<input class="download-images-automatically" type="checkbox" name="download-images-automatically"> <input class="download-images-automatically" type="checkbox" name="download-images-automatically">
${t("images.download_images_automatically")} ${t("images.download_images_automatically")}
</label> </label>
<p>${t("images.download_images_description")}</p> <p>${t("images.download_images_description")}</p>
<hr /> <hr />
<label> <label>
@ -31,7 +32,7 @@ const TPL = `
<label>${t("images.max_image_dimensions")}</label> <label>${t("images.max_image_dimensions")}</label>
<input class="image-max-width-height form-control options-number-input" type="number" min="1"> <input class="image-max-width-height form-control options-number-input" type="number" min="1">
</div> </div>
<div class="form-group"> <div class="form-group">
<label>${t("images.jpeg_quality_description")}</label> <label>${t("images.jpeg_quality_description")}</label>
<input class="image-jpeg-quality form-control options-number-input" min="10" max="100" type="number"> <input class="image-jpeg-quality form-control options-number-input" min="10" max="100" type="number">
@ -41,6 +42,13 @@ const TPL = `
`; `;
export default class ImageOptions extends OptionsWidget { export default class ImageOptions extends OptionsWidget {
private $imageMaxWidthHeight!: JQuery<HTMLElement>;
private $imageJpegQuality!: JQuery<HTMLElement>;
private $downloadImagesAutomatically!: JQuery<HTMLElement>;
private $enableImageCompression!: JQuery<HTMLElement>;
private $imageCompressionWrapper!: JQuery<HTMLElement>;
doRender() { doRender() {
this.$widget = $(TPL); this.$widget = $(TPL);
@ -49,7 +57,7 @@ export default class ImageOptions extends OptionsWidget {
this.$imageMaxWidthHeight.on("change", () => this.updateOption("imageMaxWidthHeight", this.$imageMaxWidthHeight.val())); this.$imageMaxWidthHeight.on("change", () => this.updateOption("imageMaxWidthHeight", this.$imageMaxWidthHeight.val()));
this.$imageJpegQuality.on("change", () => this.updateOption("imageJpegQuality", this.$imageJpegQuality.val().trim() || "75")); this.$imageJpegQuality.on("change", () => this.updateOption("imageJpegQuality", String(this.$imageJpegQuality.val()).trim() || "75"));
this.$downloadImagesAutomatically = this.$widget.find(".download-images-automatically"); this.$downloadImagesAutomatically = this.$widget.find(".download-images-automatically");
@ -64,7 +72,7 @@ export default class ImageOptions extends OptionsWidget {
}); });
} }
optionsLoaded(options) { optionsLoaded(options: OptionMap) {
this.$imageMaxWidthHeight.val(options.imageMaxWidthHeight); this.$imageMaxWidthHeight.val(options.imageMaxWidthHeight);
this.$imageJpegQuality.val(options.imageJpegQuality); this.$imageJpegQuality.val(options.imageJpegQuality);