Adding tabs
This commit is contained in:
parent
f1850defa6
commit
10226663bd
@ -38,16 +38,16 @@ function formToOptions() {
|
||||
function updateAnkiFormDataVis(opts) {
|
||||
if (opts.enableAnkiConnect) {
|
||||
updateAnkiFormData();
|
||||
$('.options-anki').show();
|
||||
$('.options-anki').fadeIn();
|
||||
} else {
|
||||
$('.options-anki').hide();
|
||||
$('.options-anki').fadeOut();
|
||||
}
|
||||
}
|
||||
|
||||
function updateAnkiFormData() {
|
||||
const yomichan = chrome.extension.getBackgroundPage().yomichan;
|
||||
|
||||
const ankiDeck = $('#ankiDeck');
|
||||
const ankiDeck = $('.ankiDeck');
|
||||
ankiDeck.find('option').remove();
|
||||
yomichan.api_getDeckNames({callback: (names) => {
|
||||
if (names !== null) {
|
||||
@ -55,7 +55,7 @@ function updateAnkiFormData() {
|
||||
}
|
||||
}});
|
||||
|
||||
const ankiModel = $('#ankiModel');
|
||||
const ankiModel = $('.ankiModel');
|
||||
ankiModel.find('option').remove();
|
||||
yomichan.api_getModelNames({callback: (names) => {
|
||||
if (names !== null) {
|
||||
|
@ -19,7 +19,8 @@
|
||||
|
||||
<div class="options-general">
|
||||
<h2>General</h2>
|
||||
<div class="form-horizontal">
|
||||
|
||||
<form class="form-horizontal">
|
||||
<div class="form-group">
|
||||
<label for="scanLength" class="control-label col-sm-2">Scan length</label>
|
||||
<div class="col-sm-10"><input type="number" value="20" min="1" id="scanLength" class="form-control"></div>
|
||||
@ -56,35 +57,53 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="options-anki">
|
||||
<h2>Anki</h2>
|
||||
|
||||
<div class="form-horizontal">
|
||||
<div class="form-group">
|
||||
<label class="col-sm-2 control-label">Profile</label>
|
||||
<div class="col-sm-10">
|
||||
<label class="radio-inline"><input type="radio" name="ankiProfile" checked>Vocab</label>
|
||||
<label class="radio-inline"><input type="radio" name="ankiProfile">Kanji</label>
|
||||
</div>
|
||||
</div>
|
||||
<form class="form-horizontal">
|
||||
<ul class="nav nav-tabs">
|
||||
<li class="active"><a href="#vocab" data-toggle="tab">Vocabulary</a></li>
|
||||
<li><a href="#kanji" data-toggle="tab">Kanji</a></li>
|
||||
</ul>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-2 control-label" for="ankiDeck">Deck</label>
|
||||
<div class="col-sm-10">
|
||||
<select class="form-control" id="ankiDeck"></select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-content">
|
||||
<div id="vocab" class="tab-pane fade in active">
|
||||
<div class="form-group">
|
||||
<label class="col-sm-2 control-label" for="ankiVocabDeck">Deck</label>
|
||||
<div class="col-sm-10">
|
||||
<select class="form-control ankiDeck" id="ankiVocabDeck"></select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-2 control-label" for="ankiModel">Model</label>
|
||||
<div class="col-sm-10">
|
||||
<select class="form-control" id="ankiModel"></select>
|
||||
<div class="form-group">
|
||||
<label class="col-sm-2 control-label" for="ankiVocabModel">Model</label>
|
||||
<div class="col-sm-10">
|
||||
<select class="form-control ankiModel" id="ankiVocabModel"></select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="kanji" class="tab-pane fade">
|
||||
<div class="form-group">
|
||||
<label class="col-sm-2 control-label" for="ankiKanjiDeck">Deck</label>
|
||||
<div class="col-sm-10">
|
||||
<select class="form-control ankiDeck" id="ankiKanjiDeck"></select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-2 control-label" for="ankiKanjiModel">Model</label>
|
||||
<div class="col-sm-10">
|
||||
<select class="form-control ankiModel" id="ankiKanjiModel"></select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
|
||||
<div style="text-align: right;">
|
||||
|
Loading…
Reference in New Issue
Block a user