aboutsummaryrefslogtreecommitdiff
path: root/ext/bg/js
diff options
context:
space:
mode:
authortoasted-nutbread <toasted-nutbread@users.noreply.github.com>2020-12-20 13:59:30 -0500
committerGitHub <noreply@github.com>2020-12-20 13:59:30 -0500
commit4f6309842f0926edb90907a3502c36ead465fc42 (patch)
treea5c4ef5d3be20958e111de640d4064be8ac8e99d /ext/bg/js
parent7dd06e1a64bf563ac083ab2e3ca45fb71ed40a8b (diff)
Dictionary display updates (#1146)
* Display dictionary-list as flex * Move styles * Move enabled toggle * Update details * Disable sorting based on priority * Update styles * Update title color when disabled * Update display style of secondary search dictionaries
Diffstat (limited to 'ext/bg/js')
-rw-r--r--ext/bg/js/settings/dictionary-controller.js10
-rw-r--r--ext/bg/js/settings2/secondary-search-dictionary-controller.js16
2 files changed, 18 insertions, 8 deletions
diff --git a/ext/bg/js/settings/dictionary-controller.js b/ext/bg/js/settings/dictionary-controller.js
index 2592e6a2..1029685e 100644
--- a/ext/bg/js/settings/dictionary-controller.js
+++ b/ext/bg/js/settings/dictionary-controller.js
@@ -74,6 +74,7 @@ class DictionaryEntry {
}
if (enabledCheckbox !== null) {
enabledCheckbox.dataset.setting = ObjectPropertyAccessor.getPathString(['dictionaries', title, 'enabled']);
+ this._eventListeners.addEventListener(enabledCheckbox, 'settingChanged', this._onEnabledChanged.bind(this), false);
}
if (priorityInput !== null) {
priorityInput.dataset.setting = ObjectPropertyAccessor.getPathString(['dictionaries', title, 'priority']);
@@ -91,9 +92,6 @@ class DictionaryEntry {
if (detailsToggleLink !== null && this._detailsContainer !== null) {
this._eventListeners.addEventListener(detailsToggleLink, 'click', this._onDetailsToggleLinkClicked.bind(this), false);
}
- if (priorityInput !== null) {
- this._eventListeners.addEventListener(priorityInput, 'settingChanged', this._onPriorityChanged.bind(this), false);
- }
}
cleanup() {
@@ -122,7 +120,7 @@ class DictionaryEntry {
const {detail: {menu}} = e;
const showDetails = menu.querySelector('.popup-menu-item[data-menu-action="showDetails"]');
const hideDetails = menu.querySelector('.popup-menu-item[data-menu-action="hideDetails"]');
- const hasDetails = (this._detailsContainer !== null && (this._hasDetails || this._hasCounts));
+ const hasDetails = (this._detailsContainer !== null);
const detailsVisible = (hasDetails && !this._detailsContainer.hidden);
if (showDetails !== null) {
showDetails.hidden = detailsVisible;
@@ -154,9 +152,9 @@ class DictionaryEntry {
this._detailsContainer.hidden = !this._detailsContainer.hidden;
}
- _onPriorityChanged(e) {
+ _onEnabledChanged(e) {
const {detail: {value}} = e;
- this._node.style.order = `${-value}`;
+ this._node.dataset.enabled = `${value}`;
}
_setupDetails(detailsTable) {
diff --git a/ext/bg/js/settings2/secondary-search-dictionary-controller.js b/ext/bg/js/settings2/secondary-search-dictionary-controller.js
index d3820364..8b6ea9d9 100644
--- a/ext/bg/js/settings2/secondary-search-dictionary-controller.js
+++ b/ext/bg/js/settings2/secondary-search-dictionary-controller.js
@@ -24,6 +24,7 @@ class SecondarySearchDictionaryController {
this._settingsController = settingsController;
this._getDictionaryInfoToken = null;
this._container = null;
+ this._eventListeners = new EventListenerCollection();
}
async prepare() {
@@ -37,6 +38,8 @@ class SecondarySearchDictionaryController {
// Private
async _onDatabaseUpdated() {
+ this._eventListeners.removeAllEventListeners();
+
const token = {};
this._getDictionaryInfoToken = token;
const dictionaries = await this._settingsController.getDictionaryInfo();
@@ -44,18 +47,27 @@ class SecondarySearchDictionaryController {
this._getDictionaryInfoToken = null;
const fragment = document.createDocumentFragment();
- for (const {title} of dictionaries) {
+ for (const {title, revision} of dictionaries) {
const node = this._settingsController.instantiateTemplate('secondary-search-dictionary');
fragment.appendChild(node);
- const nameNode = node.querySelector('.dictionary-name');
+ const nameNode = node.querySelector('.dictionary-title');
nameNode.textContent = title;
+ const versionNode = node.querySelector('.dictionary-version');
+ versionNode.textContent = `rev.${revision}`;
+
const toggle = node.querySelector('.dictionary-allow-secondary-searches');
toggle.dataset.setting = ObjectPropertyAccessor.getPathString(['dictionaries', title, 'allowSecondarySearches']);
+ this._eventListeners.addEventListener(toggle, 'settingChanged', this._onEnabledChanged.bind(this, node), false);
}
this._container.textContent = '';
this._container.appendChild(fragment);
}
+
+ _onEnabledChanged(node, e) {
+ const {detail: {value}} = e;
+ node.dataset.enabled = `${value}`;
+ }
} \ No newline at end of file