diff options
| -rw-r--r-- | ext/bg/js/options-form.js | 18 | ||||
| -rw-r--r-- | ext/bg/options.html | 21 |
2 files changed, 13 insertions, 26 deletions
diff --git a/ext/bg/js/options-form.js b/ext/bg/js/options-form.js index f66a678c..6731c007 100644 --- a/ext/bg/js/options-form.js +++ b/ext/bg/js/options-form.js @@ -120,9 +120,7 @@ function updateVisibility(opts) { } function populateAnkiDeckAndModel(opts) { - $('.status-dlg').hide(); - - const ankiSpinner = $('#ankiSpinner'); + const ankiSpinner = $('#anki-spinner'); ankiSpinner.show(); const ankiFormat = $('#anki-format'); @@ -146,12 +144,10 @@ function populateAnkiDeckAndModel(opts) { }).then(() => { return populateAnkiFields($('#anki-kanji-model').val(opts.ankiKanjiModel), opts); }).then(() => { + $('#anki-error').hide(); ankiFormat.show(); - if (opts.ankiMethod !== 'none') { - $('#success-dlg').show(); - } }).catch(error => { - $('#error-dlg').show().find('span').text(error); + $('#anki-error').show().find('span').text(error); }).then(() => { ankiSpinner.hide(); }); @@ -218,6 +214,7 @@ function onOptionsChanged(e) { saveOptions(optsNew).then(() => { yomichan().setOptions(optsNew); updateVisibility(optsNew); + if (optsNew.ankiMethod !== optsOld.ankiMethod) { populateAnkiDeckAndModel(optsNew); } @@ -233,16 +230,15 @@ function onAnkiModelChanged(e) { getFormValues().then(({optsNew, optsOld}) => { optsNew[modelIdToFieldOptKey($(this).id)] = {}; - const ankiSpinner = $('#ankiSpinner'); + const ankiSpinner = $('#anki-spinner'); ankiSpinner.show(); populateAnkiFields($(this), optsNew).then(() => { saveOptions(optsNew).then(() => yomichan().setOptions(optsNew)); }).catch(error => { - $('#success-dlg').hide(); - $('#error-dlg').show().find('span').text(error); + $('#anki-error').show().find('span').text(error); }).then(() => { - $('#success-dlg').show(); + $('#anki-error').hide(); ankiSpinner.hide(); }); }); diff --git a/ext/bg/options.html b/ext/bg/options.html index 4d67716e..b79332af 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, #options-advanced { + #anki-spinner, #anki-general, #anki-error, #options-advanced { display: none; } @@ -16,10 +16,6 @@ border-right: 1px #ddd solid; padding: 10px; } - - .status-dlg { - display: none; - } </style> </head> <body> @@ -91,6 +87,11 @@ <h3>Anki Options</h3> + <div class="alert alert-danger" id="anki-error"> + <strong>Error</strong> + <span></span> + </div> + <div class="form-group"> <label class="control-label" for="anki-method">Connection method</label> <select class="form-control" id="anki-method"> @@ -100,16 +101,6 @@ </select> </div> - <div class="alert alert-danger status-dlg" id="error-dlg"> - <strong>Error</strong> - <span>Unable to connect</span> - </div> - - <div class="alert alert-success status-dlg" id="success-dlg"> - <strong>Success</strong> - <span>Connection established</span> - </div> - <form class="form-horizontal" id="anki-general"> <div class="form-group anki-login"> <label for="anki-username" class="control-label col-sm-2">Username</label> |