mirror of
https://github.com/zadam/trilium.git
synced 2025-11-08 15:39:02 +01:00
feat(time_selector): use time_selector in note_erasure_timeout
This commit is contained in:
parent
c0714a92d5
commit
e0e530b219
@ -3,76 +3,40 @@ import server from "../../../../services/server.js";
|
|||||||
import toastService from "../../../../services/toast.js";
|
import toastService from "../../../../services/toast.js";
|
||||||
import { t } from "../../../../services/i18n.js";
|
import { t } from "../../../../services/i18n.js";
|
||||||
import type { OptionMap } from "../../../../../../services/options_interface.js";
|
import type { OptionMap } from "../../../../../../services/options_interface.js";
|
||||||
|
import TimeSelector from "../time_selector.js";
|
||||||
|
|
||||||
const TPL = `
|
const TPL = `
|
||||||
<div class="options-section">
|
<div class="options-section">
|
||||||
<h4>${t("note_erasure_timeout.note_erasure_timeout_title")}</h4>
|
<h4>${t("note_erasure_timeout.note_erasure_timeout_title")}</h4>
|
||||||
|
|
||||||
<p>${t("note_erasure_timeout.note_erasure_description")}</p>
|
<p>${t("note_erasure_timeout.note_erasure_description")}</p>
|
||||||
|
`;
|
||||||
|
|
||||||
<div class="form-group">
|
const TPL2 = `
|
||||||
<label for="erase-entities-after-time">${t("note_erasure_timeout.erase_notes_after")}</label>
|
|
||||||
<div class="d-flex gap-2">
|
|
||||||
<input id="erase-entities-after-time" class="form-control options-number-input" type="number" min="0" steps="1" required>
|
|
||||||
<!-- TriliumNextTODO: i18n the strings when refactoring this to a standalone widget -->
|
|
||||||
<select id="erase-entities-after-time-scale" class="form-select duration-selector" required>
|
|
||||||
<option value="1">${t("duration.seconds")}</option>
|
|
||||||
<option value="60">${t("duration.minutes")}</option>
|
|
||||||
<option value="3600">${t("duration.hours")}</option>
|
|
||||||
<option value="86400">${t("duration.days")}</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p>${t("note_erasure_timeout.manual_erasing_description")}</p>
|
<p>${t("note_erasure_timeout.manual_erasing_description")}</p>
|
||||||
|
|
||||||
<button id="erase-deleted-notes-now-button" class="btn btn-secondary">${t("note_erasure_timeout.erase_deleted_notes_now")}</button>
|
<button id="erase-deleted-notes-now-button" class="btn btn-secondary">${t("note_erasure_timeout.erase_deleted_notes_now")}</button>
|
||||||
|
|
||||||
<style>
|
|
||||||
.duration-selector {
|
|
||||||
width: auto;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</div>`;
|
</div>`;
|
||||||
|
|
||||||
export default class NoteErasureTimeoutOptions extends OptionsWidget {
|
export default class NoteErasureTimeoutOptions extends TimeSelector {
|
||||||
|
|
||||||
private $eraseEntitiesAfterTime!: JQuery<HTMLInputElement>;
|
|
||||||
private $eraseEntitiesAfterTimeScale!: JQuery<HTMLSelectElement>;
|
|
||||||
private $eraseDeletedNotesButton!: JQuery<HTMLButtonElement>;
|
private $eraseDeletedNotesButton!: JQuery<HTMLButtonElement>;
|
||||||
private eraseEntitiesAfterTimeInSeconds!: string | number;
|
|
||||||
|
constructor() {
|
||||||
|
super( {
|
||||||
|
widgetId: "erase-entities-after",
|
||||||
|
widgetLabelId: "note_erasure_timeout.erase_notes_after",
|
||||||
|
optionValueId: "eraseEntitiesAfterTimeInSeconds",
|
||||||
|
optionTimeScaleId: "eraseEntitiesAfterTimeScale"
|
||||||
|
})
|
||||||
|
super.doRender();
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
doRender() {
|
doRender() {
|
||||||
this.$widget = $(TPL);
|
|
||||||
this.$eraseEntitiesAfterTime = this.$widget.find("#erase-entities-after-time");
|
|
||||||
this.$eraseEntitiesAfterTimeScale = this.$widget.find("#erase-entities-after-time-scale");
|
|
||||||
|
|
||||||
this.$eraseEntitiesAfterTime.on("change", () => {
|
this.$widget = $(TPL).append(this.$widget).append(TPL2);
|
||||||
const time = this.$eraseEntitiesAfterTime.val();
|
|
||||||
const timeScale = this.$eraseEntitiesAfterTimeScale.val();
|
|
||||||
|
|
||||||
if (!this.handleTimeValidation() || typeof timeScale !== "string" || !time) return;
|
|
||||||
|
|
||||||
this.eraseEntitiesAfterTimeInSeconds = this.convertTime(time, timeScale).toOption();
|
|
||||||
this.updateOption("eraseEntitiesAfterTimeInSeconds", this.eraseEntitiesAfterTimeInSeconds);
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
this.$eraseEntitiesAfterTimeScale.on("change", () => {
|
|
||||||
|
|
||||||
const timeScale = this.$eraseEntitiesAfterTimeScale.val();
|
|
||||||
|
|
||||||
if (!this.handleTimeValidation() || typeof timeScale !== "string") return;
|
|
||||||
|
|
||||||
//calculate the new displayed value
|
|
||||||
const displayedTime = this.convertTime(this.eraseEntitiesAfterTimeInSeconds, timeScale).toDisplay();
|
|
||||||
|
|
||||||
this.updateOption("eraseEntitiesAfterTimeScale", timeScale);
|
|
||||||
this.$eraseEntitiesAfterTime.val(displayedTime).trigger("change");
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
this.$eraseDeletedNotesButton = this.$widget.find("#erase-deleted-notes-now-button");
|
this.$eraseDeletedNotesButton = this.$widget.find("#erase-deleted-notes-now-button");
|
||||||
|
|
||||||
this.$eraseDeletedNotesButton.on("click", () => {
|
this.$eraseDeletedNotesButton.on("click", () => {
|
||||||
server.post("notes/erase-deleted-notes-now").then(() => {
|
server.post("notes/erase-deleted-notes-now").then(() => {
|
||||||
toastService.showMessage(t("note_erasure_timeout.deleted_notes_erased"));
|
toastService.showMessage(t("note_erasure_timeout.deleted_notes_erased"));
|
||||||
@ -80,41 +44,4 @@ export default class NoteErasureTimeoutOptions extends OptionsWidget {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
async optionsLoaded(options: OptionMap) {
|
|
||||||
this.eraseEntitiesAfterTimeInSeconds = options.eraseEntitiesAfterTimeInSeconds;
|
|
||||||
|
|
||||||
const displayedTime = this.convertTime(options.eraseEntitiesAfterTimeInSeconds, options.eraseEntitiesAfterTimeScale).toDisplay();
|
|
||||||
this.$eraseEntitiesAfterTime.val(displayedTime);
|
|
||||||
this.$eraseEntitiesAfterTimeScale.val(options.eraseEntitiesAfterTimeScale);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
convertTime(time: string | number, timeScale: string | number) {
|
|
||||||
|
|
||||||
const value = typeof time === "number" ? time : parseInt(time);
|
|
||||||
if (Number.isNaN(value)) {
|
|
||||||
throw new Error(`Time needs to be a valid integer, but received: ${time}`);
|
|
||||||
}
|
|
||||||
|
|
||||||
const operand = typeof timeScale === "number" ? timeScale : parseInt(timeScale);
|
|
||||||
if (Number.isNaN(operand) || operand < 1) {
|
|
||||||
throw new Error(`TimeScale needs to be a valid integer >= 1, but received: ${timeScale}`);
|
|
||||||
}
|
|
||||||
|
|
||||||
return {
|
|
||||||
toOption: () => Math.ceil(value * operand),
|
|
||||||
toDisplay: () => Math.ceil(value / operand),
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
handleTimeValidation() {
|
|
||||||
if (this.$eraseEntitiesAfterTime.is(":invalid")) {
|
|
||||||
// TriliumNextTODO: i18n
|
|
||||||
toastService.showMessage("The entered time value is not a valid number.");
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user