Add support for reordering dictionary options (#1641)
This commit is contained in:
parent
076e201225
commit
0b554c936a
@ -51,6 +51,7 @@ class DictionaryEntry {
|
|||||||
this._priorityInput.dataset.setting = `dictionaries[${index}].priority`;
|
this._priorityInput.dataset.setting = `dictionaries[${index}].priority`;
|
||||||
this._enabledCheckbox.dataset.setting = `dictionaries[${index}].enabled`;
|
this._enabledCheckbox.dataset.setting = `dictionaries[${index}].enabled`;
|
||||||
this._eventListeners.addEventListener(this._enabledCheckbox, 'settingChanged', this._onEnabledChanged.bind(this), false);
|
this._eventListeners.addEventListener(this._enabledCheckbox, 'settingChanged', this._onEnabledChanged.bind(this), false);
|
||||||
|
this._eventListeners.addEventListener(this._menuButton, 'menuOpen', this._onMenuOpen.bind(this), false);
|
||||||
this._eventListeners.addEventListener(this._menuButton, 'menuClose', this._onMenuClose.bind(this), false);
|
this._eventListeners.addEventListener(this._menuButton, 'menuClose', this._onMenuClose.bind(this), false);
|
||||||
this._eventListeners.addEventListener(this._outdatedButton, 'click', this._onOutdatedButtonClick.bind(this), false);
|
this._eventListeners.addEventListener(this._outdatedButton, 'click', this._onOutdatedButtonClick.bind(this), false);
|
||||||
this._eventListeners.addEventListener(this._integrityButton, 'click', this._onIntegrityButtonClick.bind(this), false);
|
this._eventListeners.addEventListener(this._integrityButton, 'click', this._onIntegrityButtonClick.bind(this), false);
|
||||||
@ -77,6 +78,13 @@ class DictionaryEntry {
|
|||||||
|
|
||||||
// Private
|
// Private
|
||||||
|
|
||||||
|
_onMenuOpen(e) {
|
||||||
|
const bodyNode = e.detail.menu.bodyNode;
|
||||||
|
const count = this._dictionaryController.dictionaryOptionCount;
|
||||||
|
this._setMenuActionEnabled(bodyNode, 'moveUp', this._index > 0);
|
||||||
|
this._setMenuActionEnabled(bodyNode, 'moveDown', this._index < count - 1);
|
||||||
|
}
|
||||||
|
|
||||||
_onMenuClose(e) {
|
_onMenuClose(e) {
|
||||||
switch (e.detail.action) {
|
switch (e.detail.action) {
|
||||||
case 'delete':
|
case 'delete':
|
||||||
@ -85,6 +93,12 @@ class DictionaryEntry {
|
|||||||
case 'showDetails':
|
case 'showDetails':
|
||||||
this._showDetails();
|
this._showDetails();
|
||||||
break;
|
break;
|
||||||
|
case 'moveUp':
|
||||||
|
this._move(-1);
|
||||||
|
break;
|
||||||
|
case 'moveDown':
|
||||||
|
this._move(1);
|
||||||
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -148,6 +162,16 @@ class DictionaryEntry {
|
|||||||
_delete() {
|
_delete() {
|
||||||
this._dictionaryController.deleteDictionary(this.dictionaryTitle);
|
this._dictionaryController.deleteDictionary(this.dictionaryTitle);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
_move(offset) {
|
||||||
|
this._dictionaryController.swapDictionaryOptions(this._index, this._index + offset);
|
||||||
|
}
|
||||||
|
|
||||||
|
_setMenuActionEnabled(menu, action, enabled) {
|
||||||
|
const element = menu.querySelector(`[data-menu-action="${action}"]`);
|
||||||
|
if (element === null) { return; }
|
||||||
|
element.disabled = !enabled;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
class DictionaryExtraInfo {
|
class DictionaryExtraInfo {
|
||||||
@ -226,6 +250,10 @@ class DictionaryController {
|
|||||||
return this._modalController;
|
return this._modalController;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
get dictionaryOptionCount() {
|
||||||
|
return this._dictionaryEntries.length;
|
||||||
|
}
|
||||||
|
|
||||||
async prepare() {
|
async prepare() {
|
||||||
this._checkIntegrityButton = document.querySelector('#dictionary-check-integrity');
|
this._checkIntegrityButton = document.querySelector('#dictionary-check-integrity');
|
||||||
this._dictionaryEntryContainer = document.querySelector('#dictionary-list');
|
this._dictionaryEntryContainer = document.querySelector('#dictionary-list');
|
||||||
@ -257,6 +285,25 @@ class DictionaryController {
|
|||||||
modal.setVisible(true);
|
modal.setVisible(true);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async swapDictionaryOptions(index1, index2) {
|
||||||
|
const options = await this._settingsController.getOptions();
|
||||||
|
const {dictionaries} = options;
|
||||||
|
if (
|
||||||
|
index1 < 0 || index1 >= dictionaries.length ||
|
||||||
|
index2 < 0 || index2 >= dictionaries.length
|
||||||
|
) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
await this._settingsController.modifyProfileSettings([{
|
||||||
|
action: 'swap',
|
||||||
|
path1: `dictionaries[${index1}]`,
|
||||||
|
path2: `dictionaries[${index2}]`
|
||||||
|
}]);
|
||||||
|
|
||||||
|
await this._updateEntries();
|
||||||
|
}
|
||||||
|
|
||||||
instantiateTemplate(name) {
|
instantiateTemplate(name) {
|
||||||
return this._settingsController.instantiateTemplate(name);
|
return this._settingsController.instantiateTemplate(name);
|
||||||
}
|
}
|
||||||
|
@ -2266,6 +2266,8 @@
|
|||||||
|
|
||||||
<template id="dictionary-menu-template"><div class="popup-menu-container" tabindex="-1" role="dialog"><div class="popup-menu"><div class="popup-menu-body">
|
<template id="dictionary-menu-template"><div class="popup-menu-container" tabindex="-1" role="dialog"><div class="popup-menu"><div class="popup-menu-body">
|
||||||
<button class="popup-menu-item" data-menu-action="showDetails">Details…</button>
|
<button class="popup-menu-item" data-menu-action="showDetails">Details…</button>
|
||||||
|
<button class="popup-menu-item" data-menu-action="moveUp">Move up</button>
|
||||||
|
<button class="popup-menu-item" data-menu-action="moveDown">Move down</button>
|
||||||
<button class="popup-menu-item" data-menu-action="delete">Delete</button>
|
<button class="popup-menu-item" data-menu-action="delete">Delete</button>
|
||||||
</div></div></div></template>
|
</div></div></div></template>
|
||||||
|
|
||||||
|
@ -358,6 +358,8 @@
|
|||||||
|
|
||||||
<template id="dictionary-menu-template"><div class="popup-menu-container" tabindex="-1" role="dialog"><div class="popup-menu"><div class="popup-menu-body">
|
<template id="dictionary-menu-template"><div class="popup-menu-container" tabindex="-1" role="dialog"><div class="popup-menu"><div class="popup-menu-body">
|
||||||
<button class="popup-menu-item" data-menu-action="showDetails">Details…</button>
|
<button class="popup-menu-item" data-menu-action="showDetails">Details…</button>
|
||||||
|
<button class="popup-menu-item" data-menu-action="moveUp">Move up</button>
|
||||||
|
<button class="popup-menu-item" data-menu-action="moveDown">Move down</button>
|
||||||
<button class="popup-menu-item" data-menu-action="delete">Delete</button>
|
<button class="popup-menu-item" data-menu-action="delete">Delete</button>
|
||||||
</div></div></div></template>
|
</div></div></div></template>
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user