mirror of
https://github.com/TriliumNext/Notes.git
synced 2025-08-10 02:02:29 +08:00
make options UI properly read from translations file
Bugs remaining: - extra whitespace under heading - existing list is filled with `\n` instead of delimiters - [reset to default] triggers "500 PUT options. Option 'allowedHtmlTags' is not allowed to be changed"
This commit is contained in:
maphew
parent
91b48095e4
commit
f3b398570e
@ -25,6 +25,7 @@ import NoteErasureTimeoutOptions from "./options/other/note_erasure_timeout.js";
|
||||
import RevisionsSnapshotIntervalOptions from "./options/other/revisions_snapshot_interval.js";
|
||||
import RevisionSnapshotsLimitOptions from "./options/other/revision_snapshots_limit.js";
|
||||
import NetworkConnectionsOptions from "./options/other/network_connections.js";
|
||||
import HtmlImportTagsOptions from "./options/other/html_import_tags.js";
|
||||
import AdvancedSyncOptions from "./options/advanced/sync.js";
|
||||
import DatabaseIntegrityCheckOptions from "./options/advanced/database_integrity_check.js";
|
||||
import ConsistencyChecksOptions from "./options/advanced/consistency_checks.js";
|
||||
@ -94,7 +95,8 @@ const CONTENT_WIDGETS = {
|
||||
AttachmentErasureTimeoutOptions,
|
||||
RevisionsSnapshotIntervalOptions,
|
||||
RevisionSnapshotsLimitOptions,
|
||||
NetworkConnectionsOptions
|
||||
NetworkConnectionsOptions,
|
||||
HtmlImportTagsOptions
|
||||
],
|
||||
_optionsAdvanced: [
|
||||
DatabaseIntegrityCheckOptions,
|
||||
|
||||
@ -3,26 +3,39 @@ import { t } from "../../../../services/i18n.js";
|
||||
|
||||
const TPL = `
|
||||
<div class="options-section">
|
||||
<h4>${t("options.html_import_tags.title")}</h4>
|
||||
<h4>${t("import.html_import_tags.title")}</h4>
|
||||
|
||||
<p class="form-text">${t("options.html_import_tags.description")}</p>
|
||||
<p class="form-text">${t("import.html_import_tags.description")}</p>
|
||||
|
||||
<div class="mb-3">
|
||||
<textarea class="allowed-html-tags form-control" style="height: 150px; font-family: monospace;"
|
||||
placeholder="${t("options.html_import_tags.placeholder")}"></textarea>
|
||||
placeholder="${t("import.html_import_tags.placeholder")}"></textarea>
|
||||
|
||||
<div class="form-text">
|
||||
${t("options.html_import_tags.help")}
|
||||
${t("import.html_import_tags.help")}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button class="btn btn-sm btn-secondary reset-to-default">
|
||||
${t("options.html_import_tags.reset_button")}
|
||||
${t("import.html_import_tags.reset_button")}
|
||||
</button>
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
const defaultTags = [
|
||||
'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'blockquote', 'p', 'a', 'ul', 'ol',
|
||||
'li', 'b', 'i', 'strong', 'em', 'strike', 's', 'del', 'abbr', 'code', 'hr', 'br', 'div',
|
||||
'table', 'thead', 'caption', 'tbody', 'tfoot', 'tr', 'th', 'td', 'pre', 'section', 'img',
|
||||
'figure', 'figcaption', 'span', 'label', 'input', 'details', 'summary', 'address', 'aside', 'footer',
|
||||
'header', 'hgroup', 'main', 'nav', 'dl', 'dt', 'menu', 'bdi', 'bdo', 'dfn', 'kbd', 'mark', 'q', 'time',
|
||||
'var', 'wbr', 'area', 'map', 'track', 'video', 'audio', 'picture', 'del', 'ins',
|
||||
'en-media',
|
||||
'acronym', 'article', 'big', 'button', 'cite', 'col', 'colgroup', 'data', 'dd',
|
||||
'fieldset', 'form', 'legend', 'meter', 'noscript', 'option', 'progress', 'rp',
|
||||
'samp', 'small', 'sub', 'sup', 'template', 'textarea', 'tt'
|
||||
];
|
||||
|
||||
export default class HtmlImportTagsOptions extends OptionsWidget {
|
||||
doRender() {
|
||||
this.$widget = $(TPL);
|
||||
@ -31,46 +44,41 @@ export default class HtmlImportTagsOptions extends OptionsWidget {
|
||||
this.$allowedTags = this.$widget.find('.allowed-html-tags');
|
||||
this.$resetButton = this.$widget.find('.reset-to-default');
|
||||
|
||||
this.loadTags();
|
||||
|
||||
this.$allowedTags.on('change', () => this.saveTags());
|
||||
this.$resetButton.on('click', () => this.resetToDefault());
|
||||
|
||||
// Load initial tags
|
||||
this.refresh();
|
||||
}
|
||||
|
||||
loadTags() {
|
||||
async optionsLoaded(options) {
|
||||
try {
|
||||
const tags = JSON.parse(this.getOption('allowedHtmlTags'));
|
||||
this.$allowedTags.val(tags.join('\\n'));
|
||||
if (options.allowedHtmlTags) {
|
||||
const tags = JSON.parse(options.allowedHtmlTags);
|
||||
this.$allowedTags.val(tags.join('\\n'));
|
||||
} else {
|
||||
// If no tags are set, show the defaults
|
||||
this.$allowedTags.val(defaultTags.join('\\n'));
|
||||
}
|
||||
}
|
||||
catch (e) {
|
||||
console.error('Could not load HTML tags:', e);
|
||||
// On error, show the defaults
|
||||
this.$allowedTags.val(defaultTags.join('\\n'));
|
||||
}
|
||||
}
|
||||
|
||||
async saveTags() {
|
||||
const tagsText = this.$allowedTags.val();
|
||||
const tags = tagsText.split('\\n')
|
||||
const tags = tagsText.split(/[,\\s]+/) // Split on commas, spaces, or newlines
|
||||
.map(tag => tag.trim())
|
||||
.filter(tag => tag.length > 0);
|
||||
|
||||
await this.updateOption('allowedHtmlTags', JSON.stringify(tags));
|
||||
}
|
||||
|
||||
resetToDefault() {
|
||||
const defaultTags = [
|
||||
'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'blockquote', 'p', 'a', 'ul', 'ol',
|
||||
'li', 'b', 'i', 'strong', 'em', 'strike', 's', 'del', 'abbr', 'code', 'hr', 'br', 'div',
|
||||
'table', 'thead', 'caption', 'tbody', 'tfoot', 'tr', 'th', 'td', 'pre', 'section', 'img',
|
||||
'figure', 'figcaption', 'span', 'label', 'input', 'details', 'summary', 'address', 'aside', 'footer',
|
||||
'header', 'hgroup', 'main', 'nav', 'dl', 'dt', 'menu', 'bdi', 'bdo', 'dfn', 'kbd', 'mark', 'q', 'time',
|
||||
'var', 'wbr', 'area', 'map', 'track', 'video', 'audio', 'picture', 'del', 'ins',
|
||||
'en-media',
|
||||
'acronym', 'article', 'big', 'button', 'cite', 'col', 'colgroup', 'data', 'dd',
|
||||
'fieldset', 'form', 'legend', 'meter', 'noscript', 'option', 'progress', 'rp',
|
||||
'samp', 'small', 'sub', 'sup', 'template', 'textarea', 'tt'
|
||||
];
|
||||
|
||||
this.$allowedTags.val(defaultTags.join('\\n'));
|
||||
this.saveTags();
|
||||
async resetToDefault() {
|
||||
this.$allowedTags.val(defaultTags.join('\\n')); // Use actual newlines
|
||||
await this.saveTags();
|
||||
}
|
||||
}
|
||||
|
||||
@ -174,10 +174,10 @@
|
||||
"failed": "Import failed: {{message}}.",
|
||||
"html_import_tags": {
|
||||
"title": "HTML Import Tags",
|
||||
"description": "Configure which HTML tags are preserved when importing notes.",
|
||||
"description": "Configure which HTML tags should be preserved when importing notes. Tags not in this list will be removed during import.",
|
||||
"placeholder": "Enter HTML tags, one per line",
|
||||
"help": "Enter HTML tags to preserve during import. Some tags (like 'script') are always removed for security.",
|
||||
"reset_button": "Reset to Default"
|
||||
"reset_button": "Reset to Default List"
|
||||
}
|
||||
},
|
||||
"include_note": {
|
||||
|
||||
@ -136,7 +136,7 @@ const defaultOptions: DefaultOption[] = [
|
||||
// Text note configuration
|
||||
{ name: "textNoteEditorType", value: "ckeditor-balloon", isSynced: true },
|
||||
|
||||
// HTML sanitization configuration
|
||||
// HTML import configuration
|
||||
{ name: "allowedHtmlTags", value: JSON.stringify([
|
||||
'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'blockquote', 'p', 'a', 'ul', 'ol',
|
||||
'li', 'b', 'i', 'strong', 'em', 'strike', 's', 'del', 'abbr', 'code', 'hr', 'br', 'div',
|
||||
@ -148,7 +148,7 @@ const defaultOptions: DefaultOption[] = [
|
||||
'acronym', 'article', 'big', 'button', 'cite', 'col', 'colgroup', 'data', 'dd',
|
||||
'fieldset', 'form', 'legend', 'meter', 'noscript', 'option', 'progress', 'rp',
|
||||
'samp', 'small', 'sub', 'sup', 'template', 'textarea', 'tt'
|
||||
]), isSynced: true }
|
||||
]), isSynced: true },
|
||||
];
|
||||
|
||||
/**
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user