3 files changed, 24 insertions, 30 deletions

diff --git a/ext/bg/js/yomichan.js b/ext/bg/js/yomichan.js
index e8bd07b6..5be24622 100644
--- a/ext/bg/js/yomichan.js
+++ b/ext/bg/js/yomichan.js
@@ -40,6 +40,8 @@ class Yomichan {
         chrome.runtime.onInstalled.addListener(this.onInstalled.bind(this));
         chrome.runtime.onMessage.addListener(this.onMessage.bind(this));
         chrome.browserAction.onClicked.addListener(this.onBrowserAction.bind(this));
+        chrome.tabs.onCreated.addListener(this.onTabReady.bind(this));
+        chrome.tabs.onUpdated.addListener(this.onTabReady.bind(this));
 
         loadOptions((opts) => {
             this.setOptions(opts);
@@ -66,6 +68,11 @@ class Yomichan {
         return true;
     }
 
+    onTabReady(tab) {
+        this.tabInvoke(tab, 'setOptions', this.options);
+        this.tabInvoke(tab, 'setEnabled', this.state === 'enabled');
+    }
+
     onBrowserAction(tab) {
         switch (this.state) {
             case 'disabled':
@@ -97,26 +104,30 @@ class Yomichan {
                 break;
         }
 
-        this.notifyTabs('state', this.state);
+        this.tabInvokeAll('setEnabled', this.state === 'enabled');
     }
 
     setOptions(options) {
         this.options = options;
-        this.notifyTabs('options', this.options);
+        this.tabInvokeAll('setOptions', this.options);
     }
 
     getApiVersion() {
         return 1;
     }
 
-    notifyTabs(name, value) {
+    tabInvokeAll(action, params) {
         chrome.tabs.query({}, (tabs) => {
             for (let tab of tabs) {
-                chrome.tabs.sendMessage(tab.id, {name, value}, () => null);
+                this.tabInvoke(tab.id, action, params);
             }
         });
     }
 
+    tabInvoke(tabId, action, params) {
+        chrome.tabs.sendMessage(tabId, {action, params}, () => null);
+    }
+
     ankiInvokeSafe(action, params, pool, callback) {
         this.api_getVersion({callback: (version) => {
             if (version === this.getApiVersion()) {
diff --git a/ext/fg/js/api.js b/ext/fg/js/api.js
index 5d060311..7316c604 100644
--- a/ext/fg/js/api.js
+++ b/ext/fg/js/api.js
@@ -33,14 +33,6 @@ function bgRenderText(data, template, callback) {
     bgSendMessage('renderText', {data, template}, callback);
 }
 
-function bgGetOptions(callback) {
-    bgSendMessage('getOptions', {}, callback);
-}
-
-function bgGetState(callback) {
-    bgSendMessage('getState', {}, callback);
-}
-
 function bgCanAddDefinitions(definitions, modes, callback) {
     bgSendMessage('canAddDefinitions', {definitions, modes}, callback);
 }
diff --git a/ext/fg/js/client.js b/ext/fg/js/client.js
index 60aa6883..37377984 100644
--- a/ext/fg/js/client.js
+++ b/ext/fg/js/client.js
@@ -38,11 +38,6 @@ class Client {
         window.addEventListener('keydown', this.onKeyDown.bind(this));
         window.addEventListener('scroll', (e) => this.hidePopup());
         window.addEventListener('resize', (e) => this.hidePopup());
-
-        bgGetOptions((opts) => {
-            this.setOptions(opts);
-            bgGetState((state) => this.setEnabled(state === 'enabled'));
-        });
     }
 
     onKeyDown(e) {
@@ -67,14 +62,10 @@ class Client {
         }
     }
 
-    onBgMessage({name, value}, sender, callback) {
-        switch (name) {
-            case 'state':
-                this.setEnabled(value === 'enabled');
-                break;
-            case 'options':
-                this.setOptions(value);
-                break;
+    onBgMessage({action, params}, sender, callback) {
+        const method = this['api_' + action];
+        if (typeof(method) === 'function') {
+            method.call(this, params);
         }
 
         callback();
@@ -159,16 +150,16 @@ class Client {
         this.definitions = null;
     }
 
-    setEnabled(enabled) {
+    api_setOptions(opts) {
+        this.options = opts;
+    }
+
+    api_setEnabled(enabled) {
         if (!(this.enabled = enabled)) {
             this.hidePopup();
         }
     }
 
-    setOptions(opts) {
-        this.options = opts;
-    }
-
     api_addNote({index, mode}) {
         const state = {};
         state[mode] = false;