alex/yomichan
1
Fork 0
Code Releases Activity

Cleanup

Browse Source
This commit is contained in:
Alex Yatskov 2016-10-16 18:34:31 -07:00
parent 16cdb1f13e
commit 1fe2626443
2 changed files with 61 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

87
ext/bg/js/options-form.js
View File

@ -65,29 +65,19 @@ function modelIdToMarkers(id) {
}[id]; }[id];
} }
function getBasicOptions() { function getFormValues() {
return loadOptions().then(optsOld => { return loadOptions().then(optsOld => {
const optsNew = $.extend({}, optsOld); const optsNew = $.extend({}, optsOld);
optsNew.activateOnStartup = $('#activate-on-startup').prop('checked'); optsNew.activateOnStartup = $('#activate-on-startup').prop('checked');
optsNew.showAdvancedOptions = $('#show-advanced-options').prop('checked');
optsNew.enableAudioPlayback = $('#enable-audio-playback').prop('checked'); optsNew.enableAudioPlayback = $('#enable-audio-playback').prop('checked');
optsNew.showAdvancedOptions = $('#show-advanced-options').prop('checked');
optsNew.holdShiftToScan = $('#hold-shift-to-scan').prop('checked'); optsNew.holdShiftToScan = $('#hold-shift-to-scan').prop('checked');
optsNew.selectMatchedText = $('#select-matched-text').prop('checked'); optsNew.selectMatchedText = $('#select-matched-text').prop('checked');
optsNew.scanDelay = parseInt($('#scan-delay').val(), 10); optsNew.scanDelay = parseInt($('#scan-delay').val(), 10);
optsNew.scanLength = parseInt($('#scan-length').val(), 10); optsNew.scanLength = parseInt($('#scan-length').val(), 10);
return {
optsNew: sanitizeOptions(optsNew),
optsOld: sanitizeOptions(optsOld)
};
});
}
function getAnkiOptions() {
return loadOptions().then(optsOld => {
const optsNew = $.extend({}, optsOld);
optsNew.ankiMethod = $('#anki-method').val(); optsNew.ankiMethod = $('#anki-method').val();
optsNew.ankiUsername = $('#anki-username').val(); optsNew.ankiUsername = $('#anki-username').val();
optsNew.ankiPassword = $('#anki-password').val(); optsNew.ankiPassword = $('#anki-password').val();
@ -110,15 +100,15 @@ function getAnkiOptions() {
function updateVisibility(opts) { function updateVisibility(opts) {
switch (opts.ankiMethod) { switch (opts.ankiMethod) {
case 'ankiweb': case 'ankiweb':
$('#options-anki-general').show(); $('#anki-general').show();
$('#options-anki-login').show(); $('.anki-login').show();
break; break;
case 'ankiconnect': case 'ankiconnect':
$('#options-anki-general').show(); $('#anki-general').show();
$('#options-anki-login').hide(); $('.anki-login').hide();
break; break;
default: default:
$('#options-anki-general').hide(); $('#anki-general').hide();
break; break;
} }
@ -135,7 +125,7 @@ function populateAnkiDeckAndModel(opts) {
const ankiSpinner = $('#ankiSpinner'); const ankiSpinner = $('#ankiSpinner');
ankiSpinner.show(); ankiSpinner.show();
const ankiFormat = $('#options-anki-format'); const ankiFormat = $('#anki-format');
ankiFormat.hide(); ankiFormat.hide();
const ankiDeck = $('.anki-deck'); const ankiDeck = $('.anki-deck');
@ -168,6 +158,9 @@ function populateAnkiDeckAndModel(opts) {
} }
function populateAnkiFields(element, opts) { function populateAnkiFields(element, opts) {
const table = element.closest('.tab-pane').find('.anki-fields');
table.find('tbody').remove();
const modelName = element.val(); const modelName = element.val();
if (modelName === null) { if (modelName === null) {
return Promise.resolve(); return Promise.resolve();
@ -178,9 +171,6 @@ function populateAnkiFields(element, opts) {
const markers = modelIdToMarkers(modelId); const markers = modelIdToMarkers(modelId);
return anki().getModelFieldNames(modelName).then(names => { return anki().getModelFieldNames(modelName).then(names => {
const table = element.closest('.tab-pane').find('.anki-fields');
table.find('tbody').remove();
const tbody = $('<tbody>'); const tbody = $('<tbody>');
names.forEach(name => { names.forEach(name => {
const button = $('<button>', {type: 'button', class: 'btn btn-default dropdown-toggle'}); const button = $('<button>', {type: 'button', class: 'btn btn-default dropdown-toggle'});
@ -201,7 +191,11 @@ function populateAnkiFields(element, opts) {
groupBtn.append(markerItems); groupBtn.append(markerItems);
const group = $('<div>', {class: 'input-group'}); const group = $('<div>', {class: 'input-group'});
group.append($('<input>', {type: 'text', class: 'anki-field-value form-control', value: opts[optKey][name] || ''}).data('field', name).change(onOptionsAnkiChanged)); group.append($('<input>', {
type: 'text',
class: 'anki-field-value form-control',
value: opts[optKey][name] || ''
}).data('field', name).change(onOptionsChanged));
group.append(groupBtn); group.append(groupBtn);
const row = $('<tr>'); const row = $('<tr>');
@ -215,39 +209,43 @@ function populateAnkiFields(element, opts) {
}); });
} }
function onOptionsBasicChanged(e) { function onOptionsChanged(e) {
if (e.originalEvent || e.isTrigger) { if (!e.originalEvent && !e.isTrigger) {
getBasicOptions().then(({optsNew, optsOld}) => { return;
saveOptions(optsNew).then(() => {
yomichan().setOptions(optsNew);
updateVisibility(optsNew);
});
});
} }
}
function onOptionsAnkiChanged(e) { getFormValues().then(({optsNew, optsOld}) => {
if (e.originalEvent || e.isTrigger) {
getAnkiOptions().then(({optsNew, optsOld}) => {
updateVisibility(optsNew);
saveOptions(optsNew).then(() => { saveOptions(optsNew).then(() => {
yomichan().setOptions(optsNew); yomichan().setOptions(optsNew);
updateVisibility(optsNew);
if (optsNew.ankiMethod !== optsOld.ankiMethod) { if (optsNew.ankiMethod !== optsOld.ankiMethod) {
populateAnkiDeckAndModel(optsNew); populateAnkiDeckAndModel(optsNew);
} }
}); });
}); });
}
} }
function onAnkiModelChanged(e) { function onAnkiModelChanged(e) {
if (e.originalEvent) { if (!e.originalEvent) {
getAnkiOptions().then(({optsNew, optsOld}) => { return;
optsNew[modelIdToFieldOptKey($(this).id)] = {};
populateAnkiFields($(this), optsNew);
saveOptions(optsNew).then(() => yomichan().setOptions(optsNew));
});
} }
getFormValues().then(({optsNew, optsOld}) => {
optsNew[modelIdToFieldOptKey($(this).id)] = {};
const ankiSpinner = $('#ankiSpinner');
ankiSpinner.show();
populateAnkiFields($(this), optsNew).then(() => {
saveOptions(optsNew).then(() => yomichan().setOptions(optsNew));
}).catch(error => {
$('#success-dlg').hide();
$('#error-dlg').show().find('span').text(error);
}).then(() => {
$('#success-dlg').show();
ankiSpinner.hide();
});
});
} }
$(document).ready(() => { $(document).ready(() => {
@ -266,8 +264,7 @@ $(document).ready(() => {
$('#anki-card-tags').val(opts.ankiCardTags.join(' ')); $('#anki-card-tags').val(opts.ankiCardTags.join(' '));
$('#sentence-extent').val(opts.sentenceExtent); $('#sentence-extent').val(opts.sentenceExtent);
$('#options-general, #options-scanning').change(onOptionsBasicChanged); $('input, select').not('.anki-model').change(onOptionsChanged);
$('#options-anki').not('.anki-model').change(onOptionsAnkiChanged);
$('.anki-model').change(onAnkiModelChanged); $('.anki-model').change(onAnkiModelChanged);
populateAnkiDeckAndModel(opts); populateAnkiDeckAndModel(opts);

24
ext/bg/options.html
View File

@ -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.min.css">
<link rel="stylesheet" type="text/css" href="../lib/bootstrap-3.3.6-dist/css/bootstrap-theme.min.css"> <link rel="stylesheet" type="text/css" href="../lib/bootstrap-3.3.6-dist/css/bootstrap-theme.min.css">
<style> <style>
#anki-spinner, #options-anki-general, #options-anki-login, #options-advanced { #anki-spinner, #anki-general, #options-advanced {
display: none; display: none;
} }
@ -24,7 +24,7 @@
</head> </head>
<body> <body>
<div class="container"> <div class="container">
<div id="options-general"> <div>
<h3>General Options</h3> <h3>General Options</h3>
<form class="form-horizontal"> <form class="form-horizontal">
@ -54,7 +54,7 @@
</form> </form>
</div> </div>
<div id="options-scanning"> <div>
<h3>Scanning Options</h3> <h3>Scanning Options</h3>
<form class="form-horizontal"> <form class="form-horizontal">
@ -86,7 +86,7 @@
</form> </form>
</div> </div>
<div id="options-anki"> <div>
<img src="img/spinner.gif" class="pull-right" id="anki-spinner" alt> <img src="img/spinner.gif" class="pull-right" id="anki-spinner" alt>
<h3>Anki Options</h3> <h3>Anki Options</h3>
@ -110,17 +110,15 @@
<span>Connection established</span> <span>Connection established</span>
</div> </div>
<form class="form-horizontal" id="options-anki-general"> <form class="form-horizontal" id="anki-general">
<div id="options-anki-login"> <div class="form-group anki-login">
<div class="form-group">
<label for="anki-username" class="control-label col-sm-2">Username</label> <label for="anki-username" class="control-label col-sm-2">Username</label>
<div class="col-sm-10"><input type="text" id="anki-username" class="form-control"></div> <div class="col-sm-10"><input type="text" id="anki-username" class="form-control anki-credential"></div>
</div> </div>
<div class="form-group"> <div class="form-group anki-login">
<label for="anki-password" class="control-label col-sm-2">Password</label> <label for="anki-password" class="control-label col-sm-2">Password</label>
<div class="col-sm-10"><input type="password" id="anki-password" class="form-control"></div> <div class="col-sm-10"><input type="password" id="anki-password" class="form-control anki-credential"></div>
</div>
</div> </div>
<div class="form-group"> <div class="form-group">
@ -133,7 +131,7 @@
<div class="col-sm-10"><input type="number" min="1" id="sentence-extent" class="form-control"></div> <div class="col-sm-10"><input type="number" min="1" id="sentence-extent" class="form-control"></div>
</div> </div>
<div id="options-anki-format"> <div id="anki-format">
<ul class="nav nav-tabs col-sm-offset-2 col-sm-10"> <ul class="nav nav-tabs col-sm-offset-2 col-sm-10">
<li class="active"><a href="#term" data-toggle="tab">Terms</a></li> <li class="active"><a href="#term" data-toggle="tab">Terms</a></li>
<li><a href="#kanji" data-toggle="tab">Kanji</a></li> <li><a href="#kanji" data-toggle="tab">Kanji</a></li>
@ -198,7 +196,7 @@
</form> </form>
</div> </div>
<div style="text-align: right;"> <div class="pull-right">
<small><a href="https://foosoft.net/projects/yomichan-chrome">Homepage</a> &bull; <a href="legal.html">Legal</a></small> <small><a href="https://foosoft.net/projects/yomichan-chrome">Homepage</a> &bull; <a href="legal.html">Legal</a></small>
</div> </div>
</div> </div>