diff options
| -rw-r--r-- | ext/bg/js/database.js | 4 | ||||
| -rw-r--r-- | ext/bg/js/options-form.js | 196 | ||||
| -rw-r--r-- | ext/bg/js/templates.js | 2 | ||||
| -rw-r--r-- | ext/bg/options.html | 16 | ||||
| -rw-r--r-- | tmpl/dictionary.html | 2 |
5 files changed, 110 insertions, 110 deletions
diff --git a/ext/bg/js/database.js b/ext/bg/js/database.js index 7cf92c44..79a0a7a1 100644 --- a/ext/bg/js/database.js +++ b/ext/bg/js/database.js @@ -20,7 +20,7 @@ class Database { constructor() { this.db = null; - this.dbVer = 7; + this.dbVer = 6; this.entities = null; } @@ -37,6 +37,8 @@ class Database { dictionaries: '++, title, version', meta: 'name, value', }); + + return Promise.resolve(); } prepare() { diff --git a/ext/bg/js/options-form.js b/ext/bg/js/options-form.js index ce829698..795cdaff 100644 --- a/ext/bg/js/options-form.js +++ b/ext/bg/js/options-form.js @@ -21,6 +21,10 @@ function yomichan() { return chrome.extension.getBackgroundPage().yomichan; } +function database() { + return yomichan().translator.database; +} + function anki() { return yomichan().anki; } @@ -43,25 +47,8 @@ function modelIdToFieldOptKey(id) { function modelIdToMarkers(id) { return { - 'anki-term-model': [ - 'audio', - 'expression', - 'expression-furigana', - 'glossary', - 'glossary-list', - 'reading', - 'sentence', - 'tags', - 'url' - ], - 'anki-kanji-model': [ - 'character', - 'glossary', - 'glossary-list', - 'kunyomi', - 'onyomi', - 'url' - ], + 'anki-term-model': ['audio', 'expression', 'expression-furigana', 'glossary', 'glossary-list', 'reading', 'sentence', 'tags', 'url'], + 'anki-kanji-model': ['character', 'glossary', 'glossary-list', 'kunyomi', 'onyomi', 'url'], }[id]; } @@ -91,7 +78,7 @@ function getFormValues() { optsNew.ankiKanjiModel = $('#anki-kanji-model').val(); optsNew.ankiKanjiFields = fieldsToDict($('#kanji .anki-field-value')); - $('.dict').each((index, element) => { + $('.dict-group').each((index, element) => { const dictionary = $(element); const title = dictionary.data('title'); const enableTerms = dictionary.find('.dict-enable-terms').prop('checked'); @@ -128,48 +115,17 @@ function updateVisibility(opts) { } } -function populateAnkiDeckAndModel(opts) { - const ankiSpinner = $('#anki-spinner'); - ankiSpinner.show(); - - const ankiFormat = $('#anki-format'); - ankiFormat.hide(); - - const ankiDeck = $('.anki-deck'); - ankiDeck.find('option').remove(); - - const ankiModel = $('.anki-model'); - ankiModel.find('option').remove(); - - return anki().getDeckNames().then(names => { - names.forEach(name => ankiDeck.append($('<option/>', {value: name, text: name}))); - $('#anki-term-deck').val(opts.ankiTermDeck); - $('#anki-kanji-deck').val(opts.ankiKanjiDeck); - }).then(() => { - return anki().getModelNames(); - }).then(names => { - names.forEach(name => ankiModel.append($('<option/>', {value: name, text: name}))); - return populateAnkiFields($('#anki-term-model').val(opts.ankiTermModel), opts); - }).then(() => { - return populateAnkiFields($('#anki-kanji-model').val(opts.ankiKanjiModel), opts); - }).then(() => { - $('#anki-error').hide(); - ankiFormat.show(); - }).catch(error => { - $('#anki-error').show().find('span').text(error); - }).then(() => { - ankiSpinner.hide(); - }); -} - function populateDictionaries(opts) { - const container = $('.dicts'); - container.empty(); + const dictGroups = $('.dict-groups'); + dictGroups.empty(); const dictError = $('#dict-error'); dictError.hide(); - yomichan().translator.database.getDictionaries().then(rows => { + const dictLaggy = $('#dict-laggy'); + dictLaggy.show(); + + database().getDictionaries().then(rows => { rows.forEach(row => { const dictOpts = opts.dictionaries[row.title] || {enableTerms: true, enableKanji: false}; const html = Handlebars.templates['dictionary.html']({ @@ -181,51 +137,105 @@ function populateDictionaries(opts) { enableKanji: dictOpts.enableKanji }); - container.append($(html)); + dictGroups.append($(html)); }); - $('.dict-delete').click(e => { - const button = $(e.target); - const dict = button.closest('.dict'); - const title = dict.data('title'); - - button.prop('disabled', true); - yomichan().translator.database.deleteDictionary(title).then(() => { - dict.slideUp(); - }).catch(error => { - dictError.show().find('span').text(error); - }).then(() => { - button.prop('disabled', false); - }); - }); + $('.dict-enable-terms, .dict-enable.kanji').change(onOptionsChanged); + $('.dict-delete').click(onDictionaryDelete); + }).catch(error => { + dictError.show().find('span').text(error); + }).then(() => { + dictLaggy.hide(); + }); +} - container.find('.dict input').change(onOptionsChanged); +function onDictionaryDelete() { + const dictDelete = $(this); + dictDelete.prop('disabled', true); + + const dictGroup = dictDelete.closest('.dict-group'); + database().deleteDictionary(dictGroup.data('title')).then(() => { + dictGroup.slideUp(); }).catch(error => { dictError.show().find('span').text(error); + dictDelete.prop('disabled', false); }); } -function onImportDictionary() { - const dictInputs = $('#dict-import').find('input'); - dictInputs.prop('disabled', true); +function onDictionaryImport() { + const dictImport = $(this); + dictImport.prop('disabled', true); const dictError = $('#dict-error'); dictError.hide(); - const progressbar = $('#dict-import-progress'); - const progressValue = progressbar.find('div'); + const progressbar = $('#dict-progress'); progressbar.show(); const callback = (total, current) => { - $('.progress-bar').css('width', `${current / total * 100.0}%`); + progressbar.find('div').css('width', `${current / total * 100.0}%`); }; - const dictUrl = $('#dict-import-url').val(); - yomichan().translator.database.importDictionary(dictUrl, callback).catch(error => { + database().importDictionary($('#dict-url').val(), callback).then(() => { + return loadOptions().then(opts => populateDictionaries(opts)); + }).catch(error => { dictError.show().find('span').text(error); }).then(() => { - dictInputs.prop('disabled', false); progressbar.hide(); + dictImport.prop('disabled', false); + }); +} + +function onDictionarySetUrl(e) { + e.preventDefault(); + + const dictUrl = $('#dict-url'); + const url = $(this).data('url'); + + if (url.includes('/')) { + dictUrl.val(url); + } else { + dictUrl.val(chrome.extension.getURL(`bg/data/${url}/index.json`)); + } + + dictUrl.trigger('input'); +} + +function onDictionaryUpdateUrl() { + $('#dict-import').prop('disabled', $(this).val().length === 0); +} + +function populateAnkiDeckAndModel(opts) { + const ankiSpinner = $('#anki-spinner'); + ankiSpinner.show(); + + const ankiFormat = $('#anki-format'); + ankiFormat.hide(); + + const ankiDeck = $('.anki-deck'); + ankiDeck.find('option').remove(); + + const ankiModel = $('.anki-model'); + ankiModel.find('option').remove(); + + return anki().getDeckNames().then(names => { + names.forEach(name => ankiDeck.append($('<option/>', {value: name, text: name}))); + $('#anki-term-deck').val(opts.ankiTermDeck); + $('#anki-kanji-deck').val(opts.ankiKanjiDeck); + }).then(() => { + return anki().getModelNames(); + }).then(names => { + names.forEach(name => ankiModel.append($('<option/>', {value: name, text: name}))); + return populateAnkiFields($('#anki-term-model').val(opts.ankiTermModel), opts); + }).then(() => { + return populateAnkiFields($('#anki-kanji-model').val(opts.ankiKanjiModel), opts); + }).then(() => { + $('#anki-error').hide(); + ankiFormat.show(); + }).catch(error => { + $('#anki-error').show().find('span').text(error); + }).then(() => { + ankiSpinner.hide(); }); } @@ -333,25 +343,9 @@ $(document).ready(() => { $('input, select').not('.anki-model').change(onOptionsChanged); $('.anki-model').change(onAnkiModelChanged); - $('#dict-import a').click(e => { - e.preventDefault(); - const control = $('#dict-import-url'); - const url = $(e.target).data('url'); - if (url.includes('/')) { - control.val(url); - } else { - control.val(chrome.extension.getURL(`bg/data/${url}/index.json`)); - } - control.trigger('input'); - }); - - const dictImportUrl = $('#dict-import-url'); - dictImportUrl.on('input', () => { - const disable = dictImportUrl.val().trim().length === 0; - $('#dict-import-start').prop('disabled', disable); - }); - - $('#dict-import-start').click(onImportDictionary); + $('#dict-importer a').click(onDictionarySetUrl); + $('#dict-import').click(onDictionaryImport); + $('#dict-url').on('input', onDictionaryUpdateUrl); populateDictionaries(opts); populateAnkiDeckAndModel(opts); diff --git a/ext/bg/js/templates.js b/ext/bg/js/templates.js index ce44de8d..206ed605 100644 --- a/ext/bg/js/templates.js +++ b/ext/bg/js/templates.js @@ -7,7 +7,7 @@ templates['dictionary.html'] = template({"1":function(container,depth0,helpers,p },"compiler":[7,">= 4.0.0"],"main":function(container,depth0,helpers,partials,data) { var stack1, helper, alias1=depth0 != null ? depth0 : {}, alias2=helpers.helperMissing, alias3="function", alias4=container.escapeExpression; - return "<div class=\"dict well well-sm\" data-title=\"" + return "<div class=\"dict-group well well-sm\" data-title=\"" + alias4(((helper = (helper = helpers.title || (depth0 != null ? depth0.title : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"title","hash":{},"data":data}) : helper))) + "\">\n <div class=\"row\">\n <div class=\"col-xs-8\">\n <h4><span class=\"text-muted glyphicon glyphicon-book\"></span> " + alias4(((helper = (helper = helpers.title || (depth0 != null ? depth0.title : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"title","hash":{},"data":data}) : helper))) diff --git a/ext/bg/options.html b/ext/bg/options.html index 8c19ac8f..651f5723 100644 --- a/ext/bg/options.html +++ b/ext/bg/options.html @@ -6,7 +6,7 @@ <link rel="stylesheet" type="text/css" href="../lib/bootstrap-3.3.6-dist/css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="../lib/bootstrap-3.3.6-dist/css/bootstrap-theme.min.css"> <style> - #anki-spinner, #anki-general, #anki-error, #dict-error, #dict-import-progress, #options-advanced { + #anki-spinner, #anki-general, #anki-error, #dict-error, #dict-progress, #dict-laggy, #options-advanced { display: none; } @@ -65,18 +65,22 @@ <div> <h3>Dictionaries</h3> - <div class="dicts"></div> + <div class="dict-groups"></div> <div class="alert alert-danger" id="dict-error"> <strong>Error:</strong> <span></span> </div> - <div class="progress" id="dict-import-progress"> + <div class="alert alert-warning" id="dict-laggy"> + The dictionary database appears to be busy; please wait for currently executing tasks to complete. + </div> + + <div class="progress" id="dict-progress"> <div class="progress-bar progress-bar-striped" style="width: 0%"></div> </div> - <div class="input-group" id="dict-import"> + <div class="input-group" id="dict-importer"> <div class="input-group-btn"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button> <ul class="dropdown-menu"> @@ -87,9 +91,9 @@ <li><a href="#" data-url="http://localhost:9876/index.json">Local dictionary</a></li> </ul> </div> - <input type="text" id="dict-import-url" class="form-control" placeholder="Dictionary import URL"> + <input type="text" id="dict-url" class="form-control" placeholder="Dictionary import URL"> <div class="input-group-btn disabled"> - <button type="button" id="dict-import-start" class="btn btn-primary" disabled>Import</button> + <button type="button" id="dict-import" class="btn btn-primary" disabled>Import</button> </div> </div> </div> diff --git a/tmpl/dictionary.html b/tmpl/dictionary.html index 526e856b..035c0755 100644 --- a/tmpl/dictionary.html +++ b/tmpl/dictionary.html @@ -1,4 +1,4 @@ -<div class="dict well well-sm" data-title="{{title}}"> +<div class="dict-group well well-sm" data-title="{{title}}"> <div class="row"> <div class="col-xs-8"> <h4><span class="text-muted glyphicon glyphicon-book"></span> {{title}} <small>v.{{version}}</small></h4> |