Dictionary controller updates (#939)

* Check if element exists

* Add delete function

* Add support for deleting via popup menu

* Update how count visibility is updated

* Update dictionary deletion progress updates

* Update storage stats after dictionary deletion
This commit is contained in:
toasted-nutbread 2020-10-18 18:26:44 -04:00 committed by GitHub
parent 3e3c080a43
commit 8bf42fa69e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 63 additions and 17 deletions

View File

@ -49,6 +49,7 @@ class DictionaryEntry {
const allowSecondarySearchesCheckbox = node.querySelector('.dictionary-allow-secondary-searches'); const allowSecondarySearchesCheckbox = node.querySelector('.dictionary-allow-secondary-searches');
const priorityInput = node.querySelector('.dictionary-priority'); const priorityInput = node.querySelector('.dictionary-priority');
const deleteButton = node.querySelector('.dictionary-delete-button'); const deleteButton = node.querySelector('.dictionary-delete-button');
const menuButton = node.querySelector('.dictionary-menu-button');
const detailsTable = node.querySelector('.dictionary-details-table'); const detailsTable = node.querySelector('.dictionary-details-table');
const detailsToggleLink = node.querySelector('.dictionary-details-toggle-link'); const detailsToggleLink = node.querySelector('.dictionary-details-toggle-link');
const outdatedContainer = node.querySelector('.dictionary-outdated-notification'); const outdatedContainer = node.querySelector('.dictionary-outdated-notification');
@ -69,8 +70,15 @@ class DictionaryEntry {
allowSecondarySearchesCheckbox.dataset.setting = ObjectPropertyAccessor.getPathString(['dictionaries', title, 'allowSecondarySearches']); allowSecondarySearchesCheckbox.dataset.setting = ObjectPropertyAccessor.getPathString(['dictionaries', title, 'allowSecondarySearches']);
priorityInput.dataset.setting = ObjectPropertyAccessor.getPathString(['dictionaries', title, 'priority']); priorityInput.dataset.setting = ObjectPropertyAccessor.getPathString(['dictionaries', title, 'priority']);
if (deleteButton !== null) {
this._eventListeners.addEventListener(deleteButton, 'click', this._onDeleteButtonClicked.bind(this), false); this._eventListeners.addEventListener(deleteButton, 'click', this._onDeleteButtonClicked.bind(this), false);
}
if (menuButton !== null) {
this._eventListeners.addEventListener(menuButton, 'menuClosed', this._onMenuClosed.bind(this), false);
}
if (this._detailsContainer !== null) {
this._eventListeners.addEventListener(detailsToggleLink, 'click', this._onDetailsToggleLinkClicked.bind(this), false); this._eventListeners.addEventListener(detailsToggleLink, 'click', this._onDetailsToggleLinkClicked.bind(this), false);
}
this._eventListeners.addEventListener(priorityInput, 'settingChanged', this._onPriorityChanged.bind(this), false); this._eventListeners.addEventListener(priorityInput, 'settingChanged', this._onPriorityChanged.bind(this), false);
} }
@ -86,13 +94,25 @@ class DictionaryEntry {
const node = this._node.querySelector('.dictionary-counts'); const node = this._node.querySelector('.dictionary-counts');
node.textContent = JSON.stringify({info: this._dictionaryInfo, counts}, null, 4); node.textContent = JSON.stringify({info: this._dictionaryInfo, counts}, null, 4);
node.hidden = false; node.hidden = false;
const show = this._node.querySelector('.dictionary-details-toggle-link');
if (show !== null) { show.hidden = false; }
} }
// Private // Private
_onDeleteButtonClicked(e) { _onDeleteButtonClicked(e) {
e.preventDefault(); e.preventDefault();
this._dictionaryController.deleteDictionary(this.dictionaryTitle); this._delete();
}
_onMenuClosed(e) {
const {detail: {action}} = e;
switch (action) {
case 'remove':
this._delete();
break;
}
} }
_onDetailsToggleLinkClicked(e) { _onDetailsToggleLinkClicked(e) {
@ -132,12 +152,18 @@ class DictionaryEntry {
detailsTable.appendChild(fragment); detailsTable.appendChild(fragment);
return any; return any;
} }
_delete() {
this._dictionaryController.deleteDictionary(this.dictionaryTitle);
}
} }
class DictionaryController { class DictionaryController {
constructor(settingsController, modalController) { constructor(settingsController, modalController, storageController, statusFooter=null) {
this._settingsController = settingsController; this._settingsController = settingsController;
this._modalController = modalController; this._modalController = modalController;
this._storageController = storageController;
this._statusFooter = statusFooter;
this._dictionaries = null; this._dictionaries = null;
this._dictionaryEntries = []; this._dictionaryEntries = [];
this._databaseStateToken = null; this._databaseStateToken = null;
@ -327,33 +353,53 @@ class DictionaryController {
const index = this._dictionaryEntries.findIndex((entry) => entry.dictionaryTitle === dictionaryTitle); const index = this._dictionaryEntries.findIndex((entry) => entry.dictionaryTitle === dictionaryTitle);
if (index < 0) { return; } if (index < 0) { return; }
const entry = this._dictionaryEntries[index]; const storageController = this._storageController;
const node = entry.node; const statusFooter = this._statusFooter;
const progress = node.querySelector('.progress-container'); const {node} = this._dictionaryEntries[index];
const progressBar = node.querySelector('.progress-bar'); const progressSelector = '.dictionary-delete-progress';
const progressContainers = [
...node.querySelectorAll('.progress-container'),
...document.querySelectorAll(`#dictionaries ${progressSelector}`)
];
const progressBars = [
...node.querySelectorAll('.progress-bar'),
...document.querySelectorAll(`${progressSelector} .progress-bar`)
];
const infoLabels = document.querySelectorAll(`${progressSelector} .progress-info`);
const statusLabels = document.querySelectorAll(`${progressSelector} .progress-status`);
const prevention = this._settingsController.preventPageExit(); const prevention = this._settingsController.preventPageExit();
try { try {
this._isDeleting = true; this._isDeleting = true;
this._setButtonsEnabled(false); this._setButtonsEnabled(false);
progress.hidden = false;
const onProgress = ({processed, count, storeCount, storesProcesed}) => { const onProgress = ({processed, count, storeCount, storesProcesed}) => {
let percent = 0.0; const percent = (
if (count > 0 && storesProcesed > 0) { (count > 0 && storesProcesed > 0) ?
percent = (processed / count) * (storesProcesed / storeCount) * 100.0; (processed / count) * (storesProcesed / storeCount) * 100.0 :
} 0.0
progressBar.style.width = `${percent}%`; );
const cssString = `${percent}%`;
const statusString = `${percent.toFixed(0)}%`;
for (const progressBar of progressBars) { progressBar.style.width = cssString; }
for (const label of statusLabels) { label.textContent = statusString; }
}; };
onProgress({processed: 0, count: 1, storeCount: 1, storesProcesed: 0});
for (const progress of progressContainers) { progress.hidden = false; }
for (const label of infoLabels) { label.textContent = 'Deleting dictionary...'; }
if (statusFooter !== null) { statusFooter.setTaskActive(progressSelector, true); }
await this._deleteDictionaryInternal(dictionaryTitle, onProgress); await this._deleteDictionaryInternal(dictionaryTitle, onProgress);
await this._deleteDictionarySettings(dictionaryTitle); await this._deleteDictionarySettings(dictionaryTitle);
} catch (e) { } catch (e) {
yomichan.logError(e); yomichan.logError(e);
} finally { } finally {
prevention.end(); prevention.end();
progress.hidden = true; for (const progress of progressContainers) { progress.hidden = true; }
if (statusFooter !== null) { statusFooter.setTaskActive(progressSelector, false); }
this._setButtonsEnabled(true); this._setButtonsEnabled(true);
storageController.updateStats();
this._isDeleting = false; this._isDeleting = false;
} }
} }

View File

@ -83,7 +83,7 @@ async function setupEnvironmentInfo() {
const profileController = new ProfileController(settingsController, modalController); const profileController = new ProfileController(settingsController, modalController);
profileController.prepare(); profileController.prepare();
const dictionaryController = new DictionaryController(settingsController, modalController); const dictionaryController = new DictionaryController(settingsController, modalController, storageController);
dictionaryController.prepare(); dictionaryController.prepare();
const dictionaryImportController = new DictionaryImportController(settingsController, modalController, storageController); const dictionaryImportController = new DictionaryImportController(settingsController, modalController, storageController);