Plumbing

ext/bg/js/yomichan.js

@@ -49,8 +49,7 @@ class Yomichan {
     }
 
     onMessage(request, sender, callback) {
-        const {action, data} = request;
-        const handlers = {
+        const {action, data} = request, handlers = {
             findKanji:  ({text}) => this.translator.onFindKanji(text),
             findTerm:   ({text}) => this.translator.findTerm(text),
             getState:   () => this.state,

ext/fg/js/client.js

@@ -77,9 +77,11 @@ class Client {
     }
 
     onFrameMessage(e) {
-        // const {action, data} = e.data;
-        // switch (action) {
-        // }
+        const {action, data} = e.data, handlers = {
+            displayKanji: this.displayKanji
+        };
+
+        handlers[action].call(this, data);
     }
 
     searchAt(point) {
@@ -134,6 +136,10 @@ class Client {
         this.lastRange = null;
     }
 
+    displayKanji(kanji) {
+        this.popup.setContent(kanji);
+    }
+
     setEnabled(enabled) {
         if (!(this.enabled = enabled)) {
             this.hidePopup();

ext/fg/js/frame.js

@@ -17,15 +17,11 @@
  */
 
 
-function onKanjiQuery(kanji) {
-    alert(kanji);
-}
-
 function registerKanjiLinks() {
     for (const link of [].slice.call(document.getElementsByClassName('kanji-link'))) {
         link.addEventListener('click', (e) => {
             e.preventDefault();
-            onKanjiQuery(e.target.innerHTML);
+            window.parent.postMessage({action: 'displayKanji', data: e.target.innerHTML}, '*');
         });
     }
 }