2 files changed, 37 insertions, 7 deletions
diff --git a/ext/bg/js/options-form.js b/ext/bg/js/options-form.js
index fec2494a..a77419ff 100644
--- a/ext/bg/js/options-form.js
+++ b/ext/bg/js/options-form.js
@@ -43,6 +43,25 @@ function updateVisibility() {
     }
 }
 
+function updateAnkiPage() {
+    const yomichan = chrome.extension.getBackgroundPage().yomichan;
+
+    $('#ankiDeck').find('option').remove();
+    $('#ankiModel').find('option').remove();
+
+    yomichan.getDeckNames((names) => {
+        names.forEach((name) => {
+            $('#ankiDeck').append($('<option/>', {value: name, text: name}));
+        });
+    });
+
+    yomichan.getModelNames((names) => {
+        names.forEach((name) => {
+            $('#ankiModel').append($('<option/>', {value: name, text: name}));
+        });
+    });
+}
+
 function onOptionsChanged() {
     updateVisibility();
     const opts = formToOptions();
@@ -55,6 +74,7 @@ $(document).ready(() => {
     loadOptions((opts) => {
         optionsToForm(opts);
         updateVisibility();
+        updateAnkiPage();
         $('input').on('input paste change', onOptionsChanged);
     });
 });
diff --git a/ext/bg/js/yomichan.js b/ext/bg/js/yomichan.js
index 14d311c0..88280ab0 100644
--- a/ext/bg/js/yomichan.js
+++ b/ext/bg/js/yomichan.js
@@ -51,19 +51,29 @@ class Yomichan {
 
     onMessage(request, sender, callback) {
         const {action, params} = request, handlers = {
-            canAddNotes: ({definitions, modes}) => this.ankiInvoke('canAddNotes', {definitions: definitions, modes: modes}, 'notes', callback),
-            addNote:     ({definition, mode}) => this.ankiInvoke('addNote', {definition: definition, mode: mode}, null, callback),
-            findKanji:   (text) => callback(this.translator.findKanji(text)),
-            findTerm:    (text) => callback(this.translator.findTerm(text)),
-            getOptions:  () => callback(this.options),
-            getState:    () => callback(this.state),
-            renderText:  ({data, template}) => callback(Handlebars.templates[template](data))
+            addNote:       ({definition, mode}) => this.ankiInvoke('addNote', {definition: definition, mode: mode}, null, callback),
+            canAddNotes:   ({definitions, modes}) => this.ankiInvoke('canAddNotes', {definitions: definitions, modes: modes}, 'notes', callback),
+            findKanji:     (text) => callback(this.translator.findKanji(text)),
+            findTerm:      (text) => callback(this.translator.findTerm(text)),
+            getDeckNames:  () => this.getDeckNames(callback),
+            getModelNames: () => this.getModelNames(callback),
+            getOptions:    () => callback(this.options),
+            getState:      () => callback(this.state),
+            renderText:    ({data, template}) => callback(Handlebars.templates[template](data))
         };
 
         handlers[action].call(this, params);
         return true;
     }
 
+    getDeckNames(callback) {
+        this.ankiInvoke('deckNames', {}, null, callback);
+    }
+
+    getModelNames(callback) {
+        this.ankiInvoke('modelNames', {}, null, callback);
+    }
+
     onBrowserAction(tab) {
         switch (this.state) {
             case 'disabled':