This commit is contained in:
Alex Yatskov 2016-10-16 12:12:31 -07:00
parent 9f67e5e584
commit 9eaadd2a6e
3 changed files with 86 additions and 60 deletions

View File

@ -51,7 +51,7 @@ class AnkiConnect {
return this.ankiInvoke('version', {}, null).then(version => { return this.ankiInvoke('version', {}, null).then(version => {
this.remoteVersion = version; this.remoteVersion = version;
if (this.remoteVersion !== this.localVersion) { if (this.remoteVersion !== this.localVersion) {
return Promise.reject('browser extension and anki plugin version mismatch'); return Promise.reject('extension and plugin version mismatch');
} }
}); });
} }
@ -68,8 +68,11 @@ class AnkiConnect {
delete this.asyncPools[pool]; delete this.asyncPools[pool];
} }
const resp = xhr.responseText; if (xhr.responseText) {
resolve(resp ? JSON.parse(resp) : null); resolve(JSON.parse(resp));
} else {
reject('unable to connect to plugin');
}
}); });
xhr.open('POST', 'http://127.0.0.1:8765'); xhr.open('POST', 'http://127.0.0.1:8765');

View File

@ -130,6 +130,9 @@ function updateVisibility(opts) {
} }
function populateAnkiDeckAndModel(opts) { function populateAnkiDeckAndModel(opts) {
$('.options-anki-format').hide();
$('.status-dlg').hide();
const ankiDeck = $('.anki-deck'); const ankiDeck = $('.anki-deck');
ankiDeck.find('option').remove(); ankiDeck.find('option').remove();
@ -147,6 +150,14 @@ function populateAnkiDeckAndModel(opts) {
populateAnkiFields($('#anki-term-model').val(opts.ankiTermModel), opts); populateAnkiFields($('#anki-term-model').val(opts.ankiTermModel), opts);
}).then(() => { }).then(() => {
populateAnkiFields($('#anki-kanji-model').val(opts.ankiKanjiModel), opts); populateAnkiFields($('#anki-kanji-model').val(opts.ankiKanjiModel), opts);
}).then(() => {
$('.options-anki-format').show();
if (opts.ankiMethod !== 'none') {
$('#success-dlg').show();
}
}).catch(error => {
$('#error-dlg').show();
$('#error-dlg span').text(error);
}); });
} }
@ -213,7 +224,12 @@ function onOptionsAnkiChanged(e) {
if (e.originalEvent || e.isTrigger) { if (e.originalEvent || e.isTrigger) {
getAnkiOptions().then(({optsNew, optsOld}) => { getAnkiOptions().then(({optsNew, optsOld}) => {
updateVisibility(optsNew); updateVisibility(optsNew);
saveOptions(optsNew).then(() => yomichan().setOptions(optsNew)); saveOptions(optsNew).then(() => {
yomichan().setOptions(optsNew);
if (optsNew.ankiMethod !== optsOld.ankiMethod) {
populateAnkiDeckAndModel(optsNew);
}
});
}); });
} }
} }
@ -245,8 +261,8 @@ $(document).ready(() => {
$('#sentence-extent').val(opts.sentenceExtent); $('#sentence-extent').val(opts.sentenceExtent);
$('.options-basic').change(onOptionsBasicChanged); $('.options-basic').change(onOptionsBasicChanged);
$('.options-anki').not('.anki-model').change(onOptionsAnkiChanged);
$('.anki-model').change(onAnkiModelChanged); $('.anki-model').change(onAnkiModelChanged);
$('.options-anki').not('.anki-model').change(onOptionsAnkiChanged);
populateAnkiDeckAndModel(opts); populateAnkiDeckAndModel(opts);
updateVisibility(opts); updateVisibility(opts);

View File

@ -17,7 +17,7 @@
padding: 10px; padding: 10px;
} }
.error-dlg { .status-dlg {
display: none; display: none;
} }
</style> </style>
@ -89,6 +89,16 @@
<div class="options-anki"> <div class="options-anki">
<h3>Anki Options</h3> <h3>Anki Options</h3>
<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>
<div class="form-group"> <div class="form-group">
<label class="control-label" for="anki-method">Connection method</label> <label class="control-label" for="anki-method">Connection method</label>
<select class="form-control" id="anki-method"> <select class="form-control" id="anki-method">
@ -98,11 +108,6 @@
</select> </select>
</div> </div>
<div class="alert alert-danger error-dlg error-dlg-connection">
<strong>Unable to Connect</strong><br>
Is the <a href="https://foosoft.net/projects/anki-connect">AnkiConnect</a> extension for <a href="http://ankisrs.net/">Anki</a> installed and running? This software is required for Anki-related features.
</div>
<form class="form-horizontal options-anki-general"> <form class="form-horizontal options-anki-general">
<div class="form-group options-anki-login"> <div class="form-group options-anki-login">
<label for="anki-username" class="control-label col-sm-2">Username</label> <label for="anki-username" class="control-label col-sm-2">Username</label>
@ -124,64 +129,66 @@
<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>
<ul class="nav nav-tabs col-sm-offset-2 col-sm-10"> <div class="options-anki-format">
<li class="active"><a href="#term" data-toggle="tab">Terms</a></li> <ul class="nav nav-tabs col-sm-offset-2 col-sm-10">
<li><a href="#kanji" data-toggle="tab">Kanji</a></li> <li class="active"><a href="#term" data-toggle="tab">Terms</a></li>
</ul> <li><a href="#kanji" data-toggle="tab">Kanji</a></li>
</ul>
<div class="tab-content col-sm-offset-2 col-sm-10"> <div class="tab-content col-sm-offset-2 col-sm-10">
<div id="term" class="tab-pane fade in active"> <div id="term" class="tab-pane fade in active">
<div class="form-group"> <div class="form-group">
<label class="col-sm-2 control-label" for="anki-term-deck">Deck</label> <label class="col-sm-2 control-label" for="anki-term-deck">Deck</label>
<div class="col-sm-10"> <div class="col-sm-10">
<select class="form-control anki-deck" id="anki-term-deck"></select> <select class="form-control anki-deck" id="anki-term-deck"></select>
</div>
</div> </div>
<div class="form-group">
<label class="col-sm-2 control-label" for="anki-term-model">Model</label>
<div class="col-sm-10">
<select class="form-control anki-model" id="anki-term-model"></select>
</div>
</div>
<table class="table table-bordered anki-fields">
<thead>
<tr>
<th>Field</th>
<th>Value</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div> </div>
<div class="form-group"> <div id="kanji" class="tab-pane fade">
<label class="col-sm-2 control-label" for="anki-term-model">Model</label> <div class="form-group">
<div class="col-sm-10"> <label class="col-sm-2 control-label" for="anki-kanji-deck">Deck</label>
<select class="form-control anki-model" id="anki-term-model"></select> <div class="col-sm-10">
<select class="form-control anki-deck" id="anki-kanji-deck"></select>
</div>
</div> </div>
</div>
<table class="table table-bordered anki-fields"> <div class="form-group">
<thead> <label class="col-sm-2 control-label" for="anki-kanji-model">Model</label>
<tr> <div class="col-sm-10">
<th>Field</th> <select class="form-control anki-model" id="anki-kanji-model"></select>
<th>Value</th> </div>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<div id="kanji" class="tab-pane fade">
<div class="form-group">
<label class="col-sm-2 control-label" for="anki-kanji-deck">Deck</label>
<div class="col-sm-10">
<select class="form-control anki-deck" id="anki-kanji-deck"></select>
</div> </div>
</div>
<div class="form-group"> <table class="table table-bordered anki-fields">
<label class="col-sm-2 control-label" for="anki-kanji-model">Model</label> <thead>
<div class="col-sm-10"> <tr>
<select class="form-control anki-model" id="anki-kanji-model"></select> <th>Field</th>
</div> <th>Value</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div> </div>
<table class="table table-bordered anki-fields">
<thead>
<tr>
<th>Field</th>
<th>Value</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div> </div>
</div> </div>
</form> </form>