WIP
This commit is contained in:
parent
5ad4782bfb
commit
bd29cc0c16
@ -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() {
|
||||
|
@ -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,6 +115,96 @@ function updateVisibility(opts) {
|
||||
}
|
||||
}
|
||||
|
||||
function populateDictionaries(opts) {
|
||||
const dictGroups = $('.dict-groups');
|
||||
dictGroups.empty();
|
||||
|
||||
const dictError = $('#dict-error');
|
||||
dictError.hide();
|
||||
|
||||
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']({
|
||||
title: row.title,
|
||||
version: row.version,
|
||||
hasTerms: row.hasTerms,
|
||||
hasKanji: row.hasKanji,
|
||||
enableTerms: dictOpts.enableTerms,
|
||||
enableKanji: dictOpts.enableKanji
|
||||
});
|
||||
|
||||
dictGroups.append($(html));
|
||||
});
|
||||
|
||||
$('.dict-enable-terms, .dict-enable.kanji').change(onOptionsChanged);
|
||||
$('.dict-delete').click(onDictionaryDelete);
|
||||
}).catch(error => {
|
||||
dictError.show().find('span').text(error);
|
||||
}).then(() => {
|
||||
dictLaggy.hide();
|
||||
});
|
||||
}
|
||||
|
||||
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 onDictionaryImport() {
|
||||
const dictImport = $(this);
|
||||
dictImport.prop('disabled', true);
|
||||
|
||||
const dictError = $('#dict-error');
|
||||
dictError.hide();
|
||||
|
||||
const progressbar = $('#dict-progress');
|
||||
progressbar.show();
|
||||
|
||||
const callback = (total, current) => {
|
||||
progressbar.find('div').css('width', `${current / total * 100.0}%`);
|
||||
};
|
||||
|
||||
database().importDictionary($('#dict-url').val(), callback).then(() => {
|
||||
return loadOptions().then(opts => populateDictionaries(opts));
|
||||
}).catch(error => {
|
||||
dictError.show().find('span').text(error);
|
||||
}).then(() => {
|
||||
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();
|
||||
@ -162,73 +239,6 @@ function populateAnkiDeckAndModel(opts) {
|
||||
});
|
||||
}
|
||||
|
||||
function populateDictionaries(opts) {
|
||||
const container = $('.dicts');
|
||||
container.empty();
|
||||
|
||||
const dictError = $('#dict-error');
|
||||
dictError.hide();
|
||||
|
||||
yomichan().translator.database.getDictionaries().then(rows => {
|
||||
rows.forEach(row => {
|
||||
const dictOpts = opts.dictionaries[row.title] || {enableTerms: true, enableKanji: false};
|
||||
const html = Handlebars.templates['dictionary.html']({
|
||||
title: row.title,
|
||||
version: row.version,
|
||||
hasTerms: row.hasTerms,
|
||||
hasKanji: row.hasKanji,
|
||||
enableTerms: dictOpts.enableTerms,
|
||||
enableKanji: dictOpts.enableKanji
|
||||
});
|
||||
|
||||
container.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);
|
||||
});
|
||||
});
|
||||
|
||||
container.find('.dict input').change(onOptionsChanged);
|
||||
}).catch(error => {
|
||||
dictError.show().find('span').text(error);
|
||||
});
|
||||
}
|
||||
|
||||
function onImportDictionary() {
|
||||
const dictInputs = $('#dict-import').find('input');
|
||||
dictInputs.prop('disabled', true);
|
||||
|
||||
const dictError = $('#dict-error');
|
||||
dictError.hide();
|
||||
|
||||
const progressbar = $('#dict-import-progress');
|
||||
const progressValue = progressbar.find('div');
|
||||
progressbar.show();
|
||||
|
||||
const callback = (total, current) => {
|
||||
$('.progress-bar').css('width', `${current / total * 100.0}%`);
|
||||
};
|
||||
|
||||
const dictUrl = $('#dict-import-url').val();
|
||||
yomichan().translator.database.importDictionary(dictUrl, callback).catch(error => {
|
||||
dictError.show().find('span').text(error);
|
||||
}).then(() => {
|
||||
dictInputs.prop('disabled', false);
|
||||
progressbar.hide();
|
||||
});
|
||||
}
|
||||
|
||||
function populateAnkiFields(element, opts) {
|
||||
const tab = element.closest('.tab-pane');
|
||||
const container = tab.find('tbody');
|
||||
@ -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);
|
||||
|
@ -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)))
|
||||
|
@ -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>
|
||||
|
@ -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>
|
||||
|
Loading…
Reference in New Issue
Block a user