diff options
| -rw-r--r-- | ext/bg/js/options-form.js | 2 | ||||
| -rw-r--r-- | ext/bg/options.html | 79 |
2 files changed, 53 insertions, 28 deletions
diff --git a/ext/bg/js/options-form.js b/ext/bg/js/options-form.js index 53e65b6f..fec2494a 100644 --- a/ext/bg/js/options-form.js +++ b/ext/bg/js/options-form.js @@ -53,8 +53,8 @@ function onOptionsChanged() { $(document).ready(() => { loadOptions((opts) => { - updateVisibility(); optionsToForm(opts); + updateVisibility(); $('input').on('input paste change', onOptionsChanged); }); }); diff --git a/ext/bg/options.html b/ext/bg/options.html index b00d2d90..95236e6d 100644 --- a/ext/bg/options.html +++ b/ext/bg/options.html @@ -5,6 +5,11 @@ <title>Yomichan Options</title> <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> + .options-anki { + display: none; + } + </style> </head> <body> <div class="container"> @@ -14,52 +19,72 @@ <div class="options-general"> <h2>General</h2> - <div> - <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> - </div> + <div 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> + </div> - <div class="form-group"> - <div class="col-sm-offset-2 col-sm-10"> - <div class="checkbox"> - <label><input type="checkbox" id="activateOnStartup"> Activate on startup</label> - </div> + <div class="form-group"> + <div class="col-sm-offset-2 col-sm-10"> + <div class="checkbox"> + <label><input type="checkbox" id="activateOnStartup"> Activate on startup</label> </div> </div> + </div> - <div class="form-group"> - <div class="col-sm-offset-2 col-sm-10"> - <div class="checkbox"> - <label><input type="checkbox" id="loadEnamDict"> Load <a href="http://www.edrdg.org/enamdict/enamdict_doc.html">ENAMDICT</a> (requires restart)</label> - </div> + <div class="form-group"> + <div class="col-sm-offset-2 col-sm-10"> + <div class="checkbox"> + <label><input type="checkbox" id="loadEnasmict"> Load <a href="http://www.edrdg.org/enasmict/enasmict_doc.html">ENAsmICT</a> (requires restart)</label> </div> </div> + </div> - <div class="form-group"> - <div class="col-sm-offset-2 col-sm-10"> - <div class="checkbox"> - <label><input type="checkbox" id="selectMatchedText" checked> Select matched text</label> - </div> + <div class="form-group"> + <div class="col-sm-offset-2 col-sm-10"> + <div class="checkbox"> + <label><input type="checkbox" id="selectMatchedText" checked> Select matched text</label> </div> </div> + </div> - <div class="form-group"> - <div class="col-sm-offset-2 col-sm-10"> - <div class="checkbox"> - <label><input type="checkbox" id="enableAnkiConnect" checked> Enable <a href="https://foosoft.net/projects/yomichan">AnkiConnect</a></label> - </div> + <div class="form-group"> + <div class="col-sm-offset-2 col-sm-10"> + <div class="checkbox"> + <label><input type="checkbox" id="enableAnkiConnect"> Enable <a href="https://foosoft.net/projects/yomichan">AnkiConnect</a></label> </div> </div> - </form> + </div> </div> </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> + + <div class="form-group"> + <label class="col-sm-2 control-label" for="ankiDeck">Deck</label> + <div class="col-sm-10"> + <select class="form-control" name="ankiDeck"></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" name="ankiDeck"></select> + </div> + </div> + </div> </div> <div style="text-align: right;"> |