summaryrefslogtreecommitdiff
path: root/ext/js/settings/translation-text-replacements-controller.js
diff options
context:
space:
mode:
authortoasted-nutbread <toasted-nutbread@users.noreply.github.com>2021-02-14 23:10:01 -0500
committerGitHub <noreply@github.com>2021-02-14 23:10:01 -0500
commit450912c1098b0ec4c0ec29b7aec8b47143cfd6fc (patch)
tree6aae6ab69e037915faf7681991952113ad6d6094 /ext/js/settings/translation-text-replacements-controller.js
parentd6332d2bc723f9aa60f2c886564bef49a6b91b84 (diff)
Move js/settings (#1397)
* Move js/settings to js/pages/settings * Fix script ordering
Diffstat (limited to 'ext/js/settings/translation-text-replacements-controller.js')
-rw-r--r--ext/js/settings/translation-text-replacements-controller.js242
1 files changed, 0 insertions, 242 deletions
diff --git a/ext/js/settings/translation-text-replacements-controller.js b/ext/js/settings/translation-text-replacements-controller.js
deleted file mode 100644
index 8d13f7e9..00000000
--- a/ext/js/settings/translation-text-replacements-controller.js
+++ /dev/null
@@ -1,242 +0,0 @@
-/*
- * Copyright (C) 2021 Yomichan Authors
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with this program. If not, see <https://www.gnu.org/licenses/>.
- */
-
-class TranslationTextReplacementsController {
- constructor(settingsController) {
- this._settingsController = settingsController;
- this._entryContainer = null;
- this._entries = [];
- }
-
- async prepare() {
- this._entryContainer = document.querySelector('#translation-text-replacement-list');
- const addButton = document.querySelector('#translation-text-replacement-add');
-
- addButton.addEventListener('click', this._onAdd.bind(this), false);
- this._settingsController.on('optionsChanged', this._onOptionsChanged.bind(this));
-
- await this._updateOptions();
- }
-
-
- async addGroup() {
- const options = await this._settingsController.getOptions();
- const {groups} = options.translation.textReplacements;
- const newEntry = this._createNewEntry();
- const target = (
- (groups.length === 0) ?
- {
- action: 'splice',
- path: 'translation.textReplacements.groups',
- start: 0,
- deleteCount: 0,
- items: [[newEntry]]
- } :
- {
- action: 'splice',
- path: 'translation.textReplacements.groups[0]',
- start: groups[0].length,
- deleteCount: 0,
- items: [newEntry]
- }
- );
-
- await this._settingsController.modifyProfileSettings([target]);
- await this._updateOptions();
- }
-
- async deleteGroup(index) {
- const options = await this._settingsController.getOptions();
- const {groups} = options.translation.textReplacements;
- if (groups.length === 0) { return false; }
-
- const group0 = groups[0];
- if (index < 0 || index >= group0.length) { return false; }
-
- const target = (
- (group0.length > 1) ?
- {
- action: 'splice',
- path: 'translation.textReplacements.groups[0]',
- start: index,
- deleteCount: 1,
- items: []
- } :
- {
- action: 'splice',
- path: 'translation.textReplacements.groups',
- start: 0,
- deleteCount: group0.length,
- items: []
- }
- );
-
- await this._settingsController.modifyProfileSettings([target]);
- await this._updateOptions();
- return true;
- }
-
- // Private
-
- _onOptionsChanged({options}) {
- for (const entry of this._entries) {
- entry.cleanup();
- }
- this._entries = [];
-
- const {groups} = options.translation.textReplacements;
- if (groups.length > 0) {
- const group0 = groups[0];
- for (let i = 0, ii = group0.length; i < ii; ++i) {
- const data = group0[i];
- const node = this._settingsController.instantiateTemplate('translation-text-replacement-entry');
- this._entryContainer.appendChild(node);
- const entry = new TranslationTextReplacementsEntry(this, node, i, data);
- this._entries.push(entry);
- entry.prepare();
- }
- }
- }
-
- _onAdd() {
- this.addGroup();
- }
-
- async _updateOptions() {
- const options = await this._settingsController.getOptions();
- this._onOptionsChanged({options});
- }
-
- _createNewEntry() {
- return {pattern: '', ignoreCase: false, replacement: ''};
- }
-}
-
-class TranslationTextReplacementsEntry {
- constructor(parent, node, index) {
- this._parent = parent;
- this._node = node;
- this._index = index;
- this._eventListeners = new EventListenerCollection();
- this._patternInput = null;
- this._replacementInput = null;
- this._ignoreCaseToggle = null;
- this._testInput = null;
- this._testOutput = null;
- }
-
- prepare() {
- const patternInput = this._node.querySelector('.translation-text-replacement-pattern');
- const replacementInput = this._node.querySelector('.translation-text-replacement-replacement');
- const ignoreCaseToggle = this._node.querySelector('.translation-text-replacement-pattern-ignore-case');
- const menuButton = this._node.querySelector('.translation-text-replacement-button');
- const testInput = this._node.querySelector('.translation-text-replacement-test-input');
- const testOutput = this._node.querySelector('.translation-text-replacement-test-output');
-
- this._patternInput = patternInput;
- this._replacementInput = replacementInput;
- this._ignoreCaseToggle = ignoreCaseToggle;
- this._testInput = testInput;
- this._testOutput = testOutput;
-
- const pathBase = `translation.textReplacements.groups[0][${this._index}]`;
- patternInput.dataset.setting = `${pathBase}.pattern`;
- replacementInput.dataset.setting = `${pathBase}.replacement`;
- ignoreCaseToggle.dataset.setting = `${pathBase}.ignoreCase`;
-
- this._eventListeners.addEventListener(menuButton, 'menuOpen', this._onMenuOpen.bind(this), false);
- this._eventListeners.addEventListener(menuButton, 'menuClose', this._onMenuClose.bind(this), false);
- this._eventListeners.addEventListener(patternInput, 'settingChanged', this._onPatternChanged.bind(this), false);
- this._eventListeners.addEventListener(ignoreCaseToggle, 'settingChanged', this._updateTestInput.bind(this), false);
- this._eventListeners.addEventListener(replacementInput, 'settingChanged', this._updateTestInput.bind(this), false);
- this._eventListeners.addEventListener(testInput, 'input', this._updateTestInput.bind(this), false);
- }
-
- cleanup() {
- this._eventListeners.removeAllEventListeners();
- if (this._node.parentNode !== null) {
- this._node.parentNode.removeChild(this._node);
- }
- }
-
- // Private
-
- _onMenuOpen(e) {
- const bodyNode = e.detail.menu.bodyNode;
- const testVisible = this._isTestVisible();
- bodyNode.querySelector('[data-menu-action=showTest]').hidden = testVisible;
- bodyNode.querySelector('[data-menu-action=hideTest]').hidden = !testVisible;
- }
-
- _onMenuClose(e) {
- switch (e.detail.action) {
- case 'remove':
- this._parent.deleteGroup(this._index);
- break;
- case 'showTest':
- this._setTestVisible(true);
- break;
- case 'hideTest':
- this._setTestVisible(false);
- break;
- }
- }
-
- _onPatternChanged({detail: {value}}) {
- this._validatePattern(value);
- this._updateTestInput();
- }
-
- _validatePattern(value) {
- let okay = false;
- try {
- new RegExp(value, 'g');
- okay = true;
- } catch (e) {
- // NOP
- }
-
- this._patternInput.dataset.invalid = `${!okay}`;
- }
-
- _isTestVisible() {
- return this._node.dataset.testVisible === 'true';
- }
-
- _setTestVisible(visible) {
- this._node.dataset.testVisible = `${visible}`;
- this._updateTestInput();
- }
-
- _updateTestInput() {
- if (!this._isTestVisible()) { return; }
-
- const ignoreCase = this._ignoreCaseToggle.checked;
- const pattern = this._patternInput.value;
- let regex;
- try {
- regex = new RegExp(pattern, ignoreCase ? 'gi' : 'g');
- } catch (e) {
- return;
- }
-
- const replacement = this._replacementInput.value;
- const input = this._testInput.value;
- const output = input.replace(regex, replacement);
- this._testOutput.value = output;
- }
-}