view added notes

11 files changed, 76 insertions, 17 deletions

diff --git a/ext/bg/js/anki-connect.js b/ext/bg/js/anki-connect.js
index 9759c8f5..173feefd 100644
--- a/ext/bg/js/anki-connect.js
+++ b/ext/bg/js/anki-connect.js
@@ -26,7 +26,7 @@ class AnkiConnect {
     }
 
     addNote(note) {
-        return this.checkVersion().then(() => this.ankiInvoke('addNote', {note}, null));
+        return this.checkVersion().then(() => this.ankiInvoke('addNote', {note}));
     }
 
     canAddNotes(notes) {
@@ -34,15 +34,19 @@ class AnkiConnect {
     }
 
     getDeckNames() {
-        return this.checkVersion().then(() => this.ankiInvoke('deckNames', {}, null));
+        return this.checkVersion().then(() => this.ankiInvoke('deckNames', {}));
     }
 
     getModelNames() {
-        return this.checkVersion().then(() => this.ankiInvoke('modelNames', {}, null));
+        return this.checkVersion().then(() => this.ankiInvoke('modelNames', {}));
     }
 
     getModelFieldNames(modelName) {
-        return this.checkVersion().then(() => this.ankiInvoke('modelFieldNames', {modelName}, null));
+        return this.checkVersion().then(() => this.ankiInvoke('modelFieldNames', {modelName}));
+    }
+
+    guiBrowse(query) {
+        return this.checkVersion().then(() => this.ankiInvoke('guiBrowse', {query}));
     }
 
     checkVersion() {
@@ -60,13 +64,13 @@ class AnkiConnect {
 
     ankiInvoke(action, params, pool) {
         return new Promise((resolve, reject) => {
-            if (pool !== null && this.asyncPools.hasOwnProperty(pool)) {
+            if (pool && this.asyncPools.hasOwnProperty(pool)) {
                 this.asyncPools[pool].abort();
             }
 
             const xhr = new XMLHttpRequest();
             xhr.addEventListener('loadend', () => {
-                if (pool !== null) {
+                if (pool) {
                     delete this.asyncPools[pool];
                 }
 
diff --git a/ext/bg/js/anki-null.js b/ext/bg/js/anki-null.js
index 99dc2f30..8dad6915 100644
--- a/ext/bg/js/anki-null.js
+++ b/ext/bg/js/anki-null.js
@@ -37,4 +37,8 @@ class AnkiNull {
     getModelFieldNames(modelName) {
         return Promise.resolve([]);
     }
+
+    guiBrowse(query) {
+        return Promise.resolve([]);
+    }
 }
diff --git a/ext/bg/js/display-window.js b/ext/bg/js/display-window.js
index ae97cd36..64e56f72 100644
--- a/ext/bg/js/display-window.js
+++ b/ext/bg/js/display-window.js
@@ -37,6 +37,10 @@ window.displayWindow = new class extends Display {
         return instYomi().definitionsAddable(definitions, modes).catch(() => []);
     }
 
+    noteView(noteId) {
+        return instYomi().noteView(noteId);
+    }
+
     templateRender(template, data) {
         return instYomi().templateRender(template, data);
     }
diff --git a/ext/bg/js/templates.js b/ext/bg/js/templates.js
index f10134ee..50686ed4 100644
--- a/ext/bg/js/templates.js
+++ b/ext/bg/js/templates.js
@@ -315,10 +315,10 @@ templates['fields.html'] = template({"1":function(container,depth0,helpers,parti
 templates['kanji.html'] = template({"1":function(container,depth0,helpers,partials,data) {
     var stack1, helper, alias1=depth0 != null ? depth0 : {};
 
-  return "<div class=\"entry\" data-type=\"kanji\">\n    <div class=\"actions\">\n        <img src=\"/mixed/img/entry-current.png\" class=\"current\" title=\"Current entry (Alt + Up/Down/Home/End/PgUp/PgDn)\" alt>\n"
+  return "<div class=\"entry\" data-type=\"kanji\">\n    <div class=\"actions\">\n"
     + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.addable : depth0),{"name":"if","hash":{},"fn":container.program(2, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
     + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.source : depth0),{"name":"if","hash":{},"fn":container.program(4, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
-    + "    </div>\n\n    <div class=\"glyph\">"
+    + "        <img src=\"/mixed/img/entry-current.png\" class=\"current\" title=\"Current entry (Alt + Up/Down/Home/End/PgUp/PgDn)\" alt>\n    </div>\n\n    <div class=\"glyph\">"
     + container.escapeExpression(((helper = (helper = helpers.character || (depth0 != null ? depth0.character : depth0)) != null ? helper : helpers.helperMissing),(typeof helper === "function" ? helper.call(alias1,{"name":"character","hash":{},"data":data}) : helper)))
     + "</div>\n\n    <div class=\"reading\">\n        <table>\n            <tr>\n                <th>Kunyomi:</th>\n                <td>\n"
     + ((stack1 = helpers.each.call(alias1,(depth0 != null ? depth0.kunyomi : depth0),{"name":"each","hash":{},"fn":container.program(6, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
@@ -332,7 +332,7 @@ templates['kanji.html'] = template({"1":function(container,depth0,helpers,partia
     + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.debug : depth0),{"name":"if","hash":{},"fn":container.program(18, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
     + "</div>\n";
 },"2":function(container,depth0,helpers,partials,data) {
-    return "        <a href=\"#\" class=\"action-add-note pending disabled\" data-mode=\"kanji\"><img src=\"/mixed/img/add-kanji.png\" title=\"Add Kanji (Alt + K)\" alt></a>\n";
+    return "        <a href=\"#\" class=\"action-view-note pending disabled\"><img src=\"/mixed/img/view-note.png\" title=\"View added note (Alt + V)\" alt></a>\n        <a href=\"#\" class=\"action-add-note pending disabled\" data-mode=\"kanji\"><img src=\"/mixed/img/add-kanji.png\" title=\"Add Kanji (Alt + K)\" alt></a>\n";
 },"4":function(container,depth0,helpers,partials,data) {
     return "        <a href=\"#\" class=\"source-term\"><img src=\"/mixed/img/source-term.png\" title=\"Source term (Alt + B)\" alt></a>\n";
 },"6":function(container,depth0,helpers,partials,data) {
@@ -486,10 +486,10 @@ templates['terms.html'] = template({"1":function(container,depth0,helpers,partia
 },"12":function(container,depth0,helpers,partials,data) {
     var stack1, alias1=depth0 != null ? depth0 : {};
 
-  return "<div class=\"entry\" data-type=\"term\">\n    <div class=\"actions\">\n        <img src=\"/mixed/img/entry-current.png\" class=\"current\" title=\"Current entry (Alt + Up/Down/Home/End/PgUp/PgDn)\" alt>\n"
+  return "<div class=\"entry\" data-type=\"term\">\n    <div class=\"actions\">\n"
     + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.addable : depth0),{"name":"if","hash":{},"fn":container.program(13, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
     + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.playback : depth0),{"name":"if","hash":{},"fn":container.program(15, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
-    + "    </div>\n\n"
+    + "        <img src=\"/mixed/img/entry-current.png\" class=\"current\" title=\"Current entry (Alt + Up/Down/Home/End/PgUp/PgDn)\" alt>\n    </div>\n\n"
     + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.reading : depth0),{"name":"if","hash":{},"fn":container.program(17, data, 0),"inverse":container.program(20, data, 0),"data":data})) != null ? stack1 : "")
     + "\n"
     + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.reasons : depth0),{"name":"if","hash":{},"fn":container.program(22, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
@@ -499,7 +499,7 @@ templates['terms.html'] = template({"1":function(container,depth0,helpers,partia
     + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.debug : depth0),{"name":"if","hash":{},"fn":container.program(34, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
     + "</div>\n";
 },"13":function(container,depth0,helpers,partials,data) {
-    return "        <a href=\"#\" class=\"action-add-note pending disabled\" data-mode=\"term-kanji\"><img src=\"/mixed/img/add-term-kanji.png\" title=\"Add expression (Alt + E)\" alt></a>\n        <a href=\"#\" class=\"action-add-note pending disabled\" data-mode=\"term-kana\"><img src=\"/mixed/img/add-term-kana.png\" title=\"Add reading (Alt + R)\" alt></a>\n";
+    return "        <a href=\"#\" class=\"action-view-note pending disabled\"><img src=\"/mixed/img/view-note.png\" title=\"View added note (Alt + V)\" alt></a>\n        <a href=\"#\" class=\"action-add-note pending disabled\" data-mode=\"term-kanji\"><img src=\"/mixed/img/add-term-kanji.png\" title=\"Add expression (Alt + E)\" alt></a>\n        <a href=\"#\" class=\"action-add-note pending disabled\" data-mode=\"term-kana\"><img src=\"/mixed/img/add-term-kana.png\" title=\"Add reading (Alt + R)\" alt></a>\n";
 },"15":function(container,depth0,helpers,partials,data) {
     return "        <a href=\"#\" class=\"action-play-audio\"><img src=\"/mixed/img/play-audio.png\" title=\"Play audio (Alt + P)\" alt></a>\n";
 },"17":function(container,depth0,helpers,partials,data) {
diff --git a/ext/bg/js/yomichan.js b/ext/bg/js/yomichan.js
index b4beb179..e0bdabc3 100644
--- a/ext/bg/js/yomichan.js
+++ b/ext/bg/js/yomichan.js
@@ -157,6 +157,10 @@ window.yomichan = new class {
         });
     }
 
+    noteView(noteId) {
+        return this.anki.guiBrowse(`nid:${noteId}`);
+    }
+
     templateRender(template, data) {
         return Promise.resolve(handlebarsRender(template, data));
     }
@@ -211,6 +215,10 @@ window.yomichan = new class {
 
             definitionsAddable: ({definitions, modes, callback}) => {
                 promiseCallback(this.definitionsAddable(definitions, modes), callback);
+            },
+
+            noteView: ({noteId}) => {
+                promiseCallback(this.noteView(noteId), callback);
             }
         };
 
diff --git a/ext/fg/js/display-frame.js b/ext/fg/js/display-frame.js
index 9fd09e74..b29a0379 100644
--- a/ext/fg/js/display-frame.js
+++ b/ext/fg/js/display-frame.js
@@ -31,6 +31,10 @@ window.displayFrame = new class extends Display {
         return bgDefinitionsAddable(definitions, modes);
     }
 
+    noteView(noteId) {
+        return bgNoteView(noteId);
+    }
+
     templateRender(template, data) {
         return bgTemplateRender(template, data);
     }
diff --git a/ext/fg/js/util.js b/ext/fg/js/util.js
index c6270ce6..e1b0e080 100644
--- a/ext/fg/js/util.js
+++ b/ext/fg/js/util.js
@@ -62,6 +62,9 @@ function bgDefinitionAdd(definition, mode) {
     return bgInvoke('definitionAdd', {definition, mode});
 }
 
+function bgNoteView(noteId) {
+    return bgInvoke('noteView', {noteId});
+}
 
 /*
  * Document
diff --git a/ext/mixed/img/view-note.png b/ext/mixed/img/view-note.png
new file mode 100644
index 00000000..7d863f94
--- /dev/null
+++ b/ext/mixed/img/view-note.png
diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js
index 7982c69f..da0cd351 100644
--- a/ext/mixed/js/display.js
+++ b/ext/mixed/js/display.js
@@ -40,6 +40,10 @@ class Display {
         throw 'override me';
     }
 
+    noteView(noteId) {
+        throw 'override me';
+    }
+
     templateRender(template, data) {
         throw 'override me';
     }
@@ -88,6 +92,7 @@ class Display {
             this.entryScroll(context && context.index || 0);
 
             $('.action-add-note').click(this.onAddNote.bind(this));
+            $('.action-view-note').click(this.onViewNote.bind(this));
             $('.action-play-audio').click(this.onPlayAudio.bind(this));
             $('.kanji-link').click(this.onKanjiLookup.bind(this));
 
@@ -134,7 +139,7 @@ class Display {
 
     adderButtonsUpdate(modes, sequence) {
         return this.definitionsAddable(this.definitions, modes).then(states => {
-            if (states === null || sequence !== this.sequence) {
+            if (!states || sequence !== this.sequence) {
                 return;
             }
 
@@ -211,6 +216,13 @@ class Display {
         this.noteAdd(this.definitions[index], link.data('mode'));
     }
 
+    onViewNote(e) {
+        e.preventDefault();
+        const link = $(e.currentTarget);
+        const index = Display.entryIndexFind(link);
+        this.noteView(link.data('noteId'));
+    }
+
     onKeyDown(e) {
         const noteTryAdd = mode => {
             const button = Display.adderButtonFind(this.index, mode);
@@ -219,6 +231,13 @@ class Display {
             }
         };
 
+        const noteTryView = mode => {
+            const button = Display.viewerButtonFind(this.index);
+            if (button.length !== 0 && !button.hasClass('disabled')) {
+                this.noteView(button.data('noteId'));
+            }
+        };
+
         const handlers = {
             27: /* escape */ () => {
                 this.clearSearch();
@@ -303,6 +322,12 @@ class Display {
 
                     return true;
                 }
+            },
+
+            86: /* v */ () => {
+                if (e.altKey) {
+                    noteTryView();
+                }
             }
         };
 
@@ -326,10 +351,11 @@ class Display {
 
     noteAdd(definition, mode) {
         this.spinner.show();
-        return this.definitionAdd(definition, mode).then(success => {
-            if (success) {
+        return this.definitionAdd(definition, mode).then(noteId => {
+            if (noteId) {
                 const index = this.definitions.indexOf(definition);
                 Display.adderButtonFind(index, mode).addClass('disabled');
+                Display.viewerButtonFind(index).removeClass('pending disabled').data('noteId', noteId);
             } else {
                 this.handleError('note could not be added');
             }
@@ -375,4 +401,8 @@ class Display {
     static adderButtonFind(index, mode) {
         return $('.entry').eq(index).find(`.action-add-note[data-mode="${mode}"]`);
     }
+
+    static viewerButtonFind(index) {
+        return $('.entry').eq(index).find('.action-view-note');
+    }
 }
diff --git a/tmpl/kanji.html b/tmpl/kanji.html
index 28e4b8a4..bb62f488 100644
--- a/tmpl/kanji.html
+++ b/tmpl/kanji.html
@@ -1,13 +1,14 @@
 {{#*inline "kanji"}}
 <div class="entry" data-type="kanji">
     <div class="actions">
-        <img src="/mixed/img/entry-current.png" class="current" title="Current entry (Alt + Up/Down/Home/End/PgUp/PgDn)" alt>
         {{#if addable}}
+        <a href="#" class="action-view-note pending disabled"><img src="/mixed/img/view-note.png" title="View added note (Alt + V)" alt></a>
         <a href="#" class="action-add-note pending disabled" data-mode="kanji"><img src="/mixed/img/add-kanji.png" title="Add Kanji (Alt + K)" alt></a>
         {{/if}}
         {{#if source}}
         <a href="#" class="source-term"><img src="/mixed/img/source-term.png" title="Source term (Alt + B)" alt></a>
         {{/if}}
+        <img src="/mixed/img/entry-current.png" class="current" title="Current entry (Alt + Up/Down/Home/End/PgUp/PgDn)" alt>
     </div>
 
     <div class="glyph">{{character}}</div>
diff --git a/tmpl/terms.html b/tmpl/terms.html
index bf656cfb..db36e5cc 100644
--- a/tmpl/terms.html
+++ b/tmpl/terms.html
@@ -20,14 +20,15 @@
 {{#*inline "term"}}
 <div class="entry" data-type="term">
     <div class="actions">
-        <img src="/mixed/img/entry-current.png" class="current" title="Current entry (Alt + Up/Down/Home/End/PgUp/PgDn)" alt>
         {{#if addable}}
+        <a href="#" class="action-view-note pending disabled"><img src="/mixed/img/view-note.png" title="View added note (Alt + V)" alt></a>
         <a href="#" class="action-add-note pending disabled" data-mode="term-kanji"><img src="/mixed/img/add-term-kanji.png" title="Add expression (Alt + E)" alt></a>
         <a href="#" class="action-add-note pending disabled" data-mode="term-kana"><img src="/mixed/img/add-term-kana.png" title="Add reading (Alt + R)" alt></a>
         {{/if}}
         {{#if playback}}
         <a href="#" class="action-play-audio"><img src="/mixed/img/play-audio.png" title="Play audio (Alt + P)" alt></a>
         {{/if}}
+        <img src="/mixed/img/entry-current.png" class="current" title="Current entry (Alt + Up/Down/Home/End/PgUp/PgDn)" alt>
     </div>
 
     {{#if reading}}