WIP

ext/bg/background.html

@@ -5,6 +5,7 @@
     <script src="../lib/dexie.min.js"></script>
     <script src="js/ankiweb.js"></script>
     <script src="js/ankiconnect.js"></script>
+    <script src="js/ankinull.js"></script>
     <script src="js/templates.js"></script>
     <script src="js/util.js"></script>
     <script src="js/dictionary.js"></script>

ext/bg/js/ankiconnect.js

@@ -19,58 +19,40 @@
 class AnkiConnect {
     constructor() {
         this.asyncPools = {};
-        this.pluginVersion = null;
+        this.localVersion = 1;
-        this.apiVersion = 1;
+        this.remoteVersion = null;
     }
 
     addNote(note) {
-        return this.ankiInvokeSafe('addNote', {note}, null);
+        return this.checkVersion().then(() => this.ankiInvoke('addNote', {note}, null));
     }
 
     canAddNotes(notes) {
-        return this.ankiInvokeSafe('canAddNotes', {notes}, 'notes');
+        return this.checkVersion().then(() => this.ankiInvoke('canAddNotes', {notes}, 'notes'));
     }
 
     getDeckNames() {
-        return this.ankiInvokeSafe('deckNames', {}, null);
+        return this.checkVersion().then(() => this.ankiInvoke('deckNames', {}, null));
     }
 
     getModelNames() {
-        return this.ankiInvokeSafe('modelNames', {}, null);
+        return this.checkVersion().then(() => this.ankiInvoke('modelNames', {}, null));
     }
 
     getModelFieldNames(modelName) {
-        return this.ankiInvokeSafe('modelFieldNames', {modelName}, null);
+        return this.checkVersion().then(() => this.ankiInvoke('modelFieldNames', {modelName}, null));
     }
 
-    getStatus() {
+    checkVersion() {
-        return this.getVersion().then(version => {
+        if (this.localVersion === this.remoteVersion) {
-            if (version === null) {
+            return Promise.resolve(true);
-                return 'disconnected';
-            } else if (version === this.apiVersion) {
-                return 'ready';
-            } else {
-                return 'mismatch';
-            }
-        });
         }
 
-    getVersion() {
+        return this.ankiInvoke('version', {}, null).then(version => {
-        return this.ankiInvoke('version', {}, null);
+            this.remoteVersion = version;
+            if (this.remoteVersion !== this.localVersion) {
+                return Promise.reject('browser extension and anki plugin version mismatch');
             }
-
-    ankiInvokeSafe(action, params, pool) {
-        if (this.pluginVersion === this.apiVersion) {
-            return this.ankiInvoke(action, params, pool);
-        }
-
-        return this.getVersion().then(version => {
-            if (version === this.apiVersion) {
-                this.pluginVersion = version;
-                return this.ankiInvoke(action, params, pool);
-            }
-
-            return null;
         });
     }
 

ext/bg/js/ankinull.js

@@ -0,0 +1,39 @@
+/*
+ * Copyright (C) 2016  Alex Yatskov <alex@foosoft.net>
+ * Author: Alex Yatskov <alex@foosoft.net>
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+class AnkiNull {
+    addNote(note) {
+        return Promise.reject('unsupported action');
+    }
+
+    canAddNotes(notes) {
+        return Promise.resolve([]);
+    }
+
+    getDeckNames() {
+        return Promise.resolve([]);
+    }
+
+    getModelNames() {
+        return Promise.resolve([]);
+    }
+
+    getModelFieldNames(modelName) {
+        return Promise.resolve([]);
+    }
+}

ext/bg/js/ankiweb.js

@@ -21,7 +21,7 @@ class AnkiWeb {
         this.username = username;
         this.password = password;
         this.noteInfo = null;
-        this.logged = false;
+        this.logged = true;
     }
 
     addNote(note) {

ext/bg/js/options-form.js

@@ -104,47 +104,51 @@ function getAnkiOptions() {
 }
 
 function populateAnkiDeckAndModel(opts) {
-    const yomi = yomichan();
+    const anki = yomichan().anki;
 
+    const populateDecks = () => {
         const ankiDeck = $('.anki-deck');
         ankiDeck.find('option').remove();
-    yomi.api_getDeckNames({callback: names => {
+        return anki.getDeckNames().then(names => {
-        if (names !== null) {
             names.forEach(name => ankiDeck.append($('<option/>', {value: name, text: name})));
-        }
-
             $('#anki-term-deck').val(opts.ankiTermDeck);
             $('#anki-kanji-deck').val(opts.ankiKanjiDeck);
-    }});
+        });
+    };
 
+    const populateModels = () => {
         const ankiModel = $('.anki-model');
         ankiModel.find('option').remove();
-    yomi.api_getModelNames({callback: names => {
+        return anki.getModelNames().then(names => {
-        if (names !== null) {
             names.forEach(name => ankiModel.append($('<option/>', {value: name, text: name})));
-        }
-
             populateAnkiFields($('#anki-term-model').val(opts.ankiTermModel), opts);
             populateAnkiFields($('#anki-kanji-model').val(opts.ankiKanjiModel), opts);
-    }});
+        });
+    };
+
+    return populateDecks().then(populateModels);
 }
 
-function updateAnkiStatus() {
+function updateVisibility(opts) {
-    // $('.error-dlg').hide();
+    switch (opts.ankiMethod) {
+        case 'ankiweb':
+            $('.options-anki-general').show();
+            $('.options-anki-login').show();
+            break;
+        case 'ankiconnect':
+            $('.options-anki-general').show();
+            $('.options-anki-login').hide();
+            break;
+        default:
+            $('.options-anki-general').hide();
+            break;
+    }
 
-    // yomichan().api_getVersion({callback: version => {
+    if (opts.showAdvancedOptions) {
-    //     if (version === null) {
+        $('.options-advanced').show();
-    //         $('.error-dlg-connection').show();
+    } else {
-    //         $('.options-anki-controls').hide();
+        $('.options-advanced').hide();
-    //     } else if (version !== yomichan().getApiVersion()) {
+    }
-    //         $('.error-dlg-version').show();
-    //         $('.options-anki-controls').hide();
-    //     } else {
-    //         $('.options-anki-controls').show();
-    //     }
-    // }});
-
-    $('.options-anki-controls').show();
 }
 
 function populateAnkiFields(element, opts) {
@@ -196,33 +200,20 @@ function populateAnkiFields(element, opts) {
 }
 
 function onOptionsBasicChanged(e) {
-    if (!e.originalEvent && !e.isTrigger) {
+    if (e.originalEvent || e.isTrigger) {
-        return;
-    }
-
         getBasicOptions().then(({optsNew, optsOld}) => {
             saveOptions(optsNew).then(() => {
                 yomichan().setOptions(optsNew);
-            if (!optsOld.enableAnkiConnect && optsNew.enableAnkiConnect) {
+                updateVisibility(optsNew);
-                updateAnkiStatus();
-                populateAnkiDeckAndModel(optsNew);
-                $('.options-anki').show();
-            } else if (optsOld.enableAnkiConnect && !optsNew.enableAnkiConnect) {
-                $('.options-anki').hide();
-            }
-
-            if (optsNew.showAdvancedOptions) {
-                $('.options-advanced').show();
-            } else {
-                $('.options-advanced').hide();
-            }
             });
         });
+    }
 }
 
 function onOptionsAnkiChanged(e) {
     if (e.originalEvent || e.isTrigger) {
         getAnkiOptions().then(({optsNew, optsOld}) => {
+            updateVisibility(optsNew);
             saveOptions(optsNew).then(() => yomichan().setOptions(optsNew));
         });
     }
@@ -258,13 +249,7 @@ $(document).ready(() => {
         $('.options-anki').not('.anki-model').change(onOptionsAnkiChanged);
         $('.anki-model').change(onAnkiModelChanged);
 
-        if (opts.showAdvancedOptions) {
-            $('.options-advanced').show();
-        }
-
-        updateAnkiStatus();
         populateAnkiDeckAndModel(opts);
-
+        updateVisibility(opts);
-        $('.options-anki').show();
     });
 });

ext/bg/js/yomichan.js

@@ -23,7 +23,7 @@ class Yomichan {
         Handlebars.registerHelper('kanjiLinks', kanjiLinks);
 
         this.translator = new Translator();
-        this.anki = null;
+        this.anki = new AnkiNull();
         this.options = null;
         this.importTabId = null;
         this.setState('disabled');
@@ -109,7 +109,7 @@ class Yomichan {
                 this.anki = new AnkiConnect();
                 break;
             default:
-                this.anki = null;
+                this.anki = new AnkiNull();
                 break;
         }
 
@@ -251,19 +251,11 @@ class Yomichan {
     }
 
     api_addDefinition({definition, mode, callback}) {
-        if (this.anki === null) {
-            callback(null);
-        } else {
         const note = this.formatNote(definition, mode);
         this.anki.addNote(note).then(callback);
     }
-    }
 
     api_canAddDefinitions({definitions, modes, callback}) {
-        if (this.anki === null) {
-            callback(null);
-        }
-        else {
         const notes = [];
         for (const definition of definitions) {
             for (const mode of modes) {
@@ -287,31 +279,18 @@ class Yomichan {
             callback(states);
         });
     }
-    }
 
     api_getDeckNames({callback}) {
-        if (this.anki === null) {
-            callback(null);
-        } else {
         this.anki.getDeckNames().then(callback);
     }
-    }
 
     api_getModelNames({callback}) {
-        if (this.anki === null) {
-            callback(null);
-        } else {
         this.anki.getModelNames().then(callback);
     }
-    }
 
     api_getModelFieldNames({modelName, callback}) {
-        if (this.anki === null) {
-            callback(null);
-        } else {
         this.anki.getModelFieldNames(modelName).then(callback);
     }
-    }
 }
 
 window.yomichan = new Yomichan();

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>
-            .options-anki, .options-advanced {
+            .options-anki-general, .options-anki-login, .options-advanced {
                 display: none;
             }
 
@@ -90,7 +90,7 @@
                 <h3>Anki Options</h3>
 
                 <div class="form-group">
-                    <label class="control-label" for="anki-method">Integration method</label>
+                    <label class="control-label" for="anki-method">Connection method</label>
                     <select class="form-control" id="anki-method">
                         <option value="none">None</option>
                         <option value="ankiweb">AnkiWeb</option>
@@ -102,18 +102,14 @@
                     <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>
-                <div class="alert alert-warning error-dlg error-dlg-version">
-                    <strong>Unsupported Version</strong><br>
-                    The installed version of the <a href="https://foosoft.net/projects/anki-connect">AnkiConnect</a> extension for <a href="http://ankisrs.net/">Anki</a> is not compatible with this release; please update it.
-                </div>
 
-                <form class="form-horizontal options-anki-controls">
+                <form class="form-horizontal options-anki-general">
-                    <div class="form-group">
+                    <div class="form-group options-anki-login">
                         <label for="anki-username" class="control-label col-sm-2">Username</label>
                         <div class="col-sm-10"><input type="text" id="anki-username" class="form-control"></div>
                     </div>
 
-                    <div class="form-group">
+                    <div class="form-group options-anki-login">
                         <label for="anki-password" class="control-label col-sm-2">Password</label>
                         <div class="col-sm-10"><input type="password" id="anki-password" class="form-control"></div>
                     </div>