Add button and confirmation dialog for database purge

This commit is contained in:
toasted-nutbread 2019-11-02 14:30:17 -04:00
parent 2ab871e7ee
commit 3d78d5400d
2 changed files with 32 additions and 6 deletions

View File

@ -256,7 +256,8 @@ async function dictSettingsInitialize() {
);
dictionaryUI.save = () => apiOptionsSave();
document.querySelector('#dict-purge-link').addEventListener('click', (e) => onDictionaryPurge(e), false);
document.querySelector('#dict-purge-button').addEventListener('click', (e) => onDictionaryPurgeButtonClick(e), false);
document.querySelector('#dict-purge-confirm').addEventListener('click', (e) => onDictionaryPurge(e), false);
document.querySelector('#dict-file-button').addEventListener('click', (e) => onDictionaryImportButtonClick(e), false);
document.querySelector('#dict-file').addEventListener('change', (e) => onDictionaryImport(e), false);
document.querySelector('#dict-main').addEventListener('change', (e) => onDictionaryMainChanged(e), false);
@ -398,9 +399,16 @@ function onDictionaryImportButtonClick() {
dictFile.click();
}
function onDictionaryPurgeButtonClick(e) {
e.preventDefault();
$('#dict-purge-modal').modal('show');
}
async function onDictionaryPurge(e) {
e.preventDefault();
$('#dict-purge-modal').modal('hide');
const dictControls = $('#dict-importer, #dict-groups, #dict-groups-extra, #dict-main-group').hide();
const dictProgress = $('#dict-purge').show();

View File

@ -417,10 +417,7 @@
</div>
<p class="help-block">
Yomichan can import and use a variety of dictionary formats. Unneeded dictionaries can be disabled,
or you can simply <a href="#" id="dict-purge-link">purge the database</a> to delete everything.
</p>
<p class="help-block">
Yomichan can import and use a variety of dictionary formats. Unneeded dictionaries can be disabled.
Deleting individual dictionaries is not currently feasible due to limitations of browser database technology.
</p>
@ -449,10 +446,31 @@
<a href="https://foosoft.net/projects/yomichan" target="_blank" rel="noopener">download free dictionaries</a>
for use with this extension and to learn about importing proprietary EPWING dictionaries.
</p>
<button class="btn btn-primary" id="dict-file-button">Import Dictionary</button>
<div>
<button class="btn btn-primary" id="dict-file-button">Import Dictionary</button>
<button class="btn btn-danger" id="dict-purge-button">Purge Database</button>
</div>
<div hidden><input type="file" id="dict-file"></div>
</div>
<div class="modal fade" tabindex="-1" role="dialog" id="dict-purge-modal">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title">Confirm database purge</h4>
</div>
<div class="modal-body">
Are you sure you want to delete all data in the database?
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-danger" id="dict-purge-confirm">Purge Database</button>
</div>
</div>
</div>
</div>
<template id="dict-template"><div class="dict-group well well-sm">
<h4><span class="text-muted glyphicon glyphicon-book"></span> <span class="dict-title"></span> <small class="dict-revision"></small></h4>
<p class="text-warning" hidden>This dictionary is outdated and may not support new extension features; please import the latest version.</p>