Move search mode (#1381)

* Move mode handling to SearchDisplayController

* Remove mode state info and handlers from Display

ext/bg/js/search-display-controller.js

@@ -43,21 +43,27 @@ class SearchDisplayController {
                 getText: async () => (await api.clipboardGet())
             }
         });
+        this._messageHandlers = new Map();
+        this._mode = null;
     }
 
     async prepare() {
+        this._updateMode();
+
         await this._display.updateOptions();
 
+        chrome.runtime.onMessage.addListener(this._onMessage.bind(this));
         yomichan.on('optionsUpdated', this._onOptionsUpdated.bind(this));
 
         this._display.on('optionsUpdated', this._onDisplayOptionsUpdated.bind(this));
         this._display.on('contentUpdating', this._onContentUpdating.bind(this));
-        this._display.on('modeChange', this._onModeChange.bind(this));
 
         this._display.hotkeyHandler.registerActions([
             ['focusSearchBox', this._onActionFocusSearchBox.bind(this)]
         ]);
-        this._display.registerMessageHandlers([
+        this._registerMessageHandlers([
+            ['getMode', {async: false, handler: this._onMessageGetMode.bind(this)}],
+            ['setMode', {async: false, handler: this._onMessageSetMode.bind(this)}],
             ['updateSearchQuery', {async: false, handler: this._onExternalSearchUpdate.bind(this)}]
         ]);
 
@@ -73,7 +79,6 @@ class SearchDisplayController {
         this._clipboardMonitorEnableCheckbox.addEventListener('change', this._onClipboardMonitorEnableChange.bind(this));
         this._display.hotkeyHandler.on('keydownNonHotkey', this._onKeyDown.bind(this));
 
-        this._onModeChange();
         this._onDisplayOptionsUpdated({options: this._display.getOptions()});
     }
 
@@ -85,8 +90,24 @@ class SearchDisplayController {
         this._queryInput.select();
     }
 
+    // Messages
+
+    _onMessageSetMode({mode}) {
+        this._setMode(mode, true);
+    }
+
+    _onMessageGetMode() {
+        return this._mode;
+    }
+
     // Private
 
+    _onMessage({action, params}, sender, callback) {
+        const messageHandler = this._messageHandlers.get(action);
+        if (typeof messageHandler === 'undefined') { return false; }
+        return yomichan.invokeMessageHandler(messageHandler, params, callback, sender);
+    }
+
     _onKeyDown(e) {
         if (
             document.activeElement !== this._queryInput &&
@@ -194,13 +215,6 @@ class SearchDisplayController {
         this._setClipboardMonitorEnabled(enabled);
     }
 
-    _onModeChange() {
-        let mode = this._display.mode;
-        if (mode === null) { mode = ''; }
-        document.documentElement.dataset.searchMode = mode;
-        this._updateClipboardMonitorEnabled();
-    }
-
     _setWanakanaEnabled(enabled) {
         if (this._queryInputEventsSetup && this._wanakanaEnabled === enabled) { return; }
 
@@ -297,10 +311,9 @@ class SearchDisplayController {
     }
 
     _updateClipboardMonitorEnabled() {
-        const mode = this._display.mode;
         const enabled = this._clipboardMonitorEnabled;
         this._clipboardMonitorEnableCheckbox.checked = enabled;
-        if (enabled && mode !== 'popup') {
+        if (enabled && this._mode !== 'popup') {
             this._clipboardMonitor.start();
         } else {
             this._clipboardMonitor.stop();
@@ -372,4 +385,38 @@ class SearchDisplayController {
         }
         return query;
     }
+
+    _registerMessageHandlers(handlers) {
+        for (const [name, handlerInfo] of handlers) {
+            this._messageHandlers.set(name, handlerInfo);
+        }
+    }
+
+    _updateMode() {
+        let mode = null;
+        try {
+            mode = sessionStorage.getItem('mode');
+        } catch (e) {
+            // Browsers can throw a SecurityError when cookie blocking is enabled.
+        }
+        this._setMode(mode, false);
+    }
+
+    _setMode(mode, save) {
+        if (mode === this._mode) { return; }
+        if (save) {
+            try {
+                if (mode === null) {
+                    sessionStorage.removeItem('mode');
+                } else {
+                    sessionStorage.setItem('mode', mode);
+                }
+            } catch (e) {
+                // Browsers can throw a SecurityError when cookie blocking is enabled.
+            }
+        }
+        this._mode = mode;
+        document.documentElement.dataset.searchMode = (mode !== null ? mode : '');
+        this._updateClipboardMonitorEnabled();
+    }
 }

ext/mixed/js/display.js

@@ -84,7 +84,6 @@ class Display extends EventDispatcher {
             getSearchContext: this._getSearchContext.bind(this),
             documentUtil: this._documentUtil
         });
-        this._mode = null;
         this._ankiFieldTemplates = null;
         this._ankiFieldTemplatesDefault = null;
         this._ankiNoteBuilder = new AnkiNoteBuilder(true);
@@ -138,10 +137,6 @@ class Display extends EventDispatcher {
             ['nextEntryDifferentDictionary',     () => { this._focusEntryWithDifferentDictionary(1, true); }],
             ['previousEntryDifferentDictionary', () => { this._focusEntryWithDifferentDictionary(-1, true); }]
         ]);
-        this.registerMessageHandlers([
-            ['setMode', {async: false, handler: this._onMessageSetMode.bind(this)}],
-            ['getMode', {async: false, handler: this._onMessageGetMode.bind(this)}]
-        ]);
         this.registerDirectMessageHandlers([
             ['setOptionsContext',  {async: false, handler: this._onMessageSetOptionsContext.bind(this)}],
             ['setContent',         {async: false, handler: this._onMessageSetContent.bind(this)}],
@@ -176,10 +171,6 @@ class Display extends EventDispatcher {
         this._updateQueryParser();
     }
 
-    get mode() {
-        return this._mode;
-    }
-
     get japaneseUtil() {
         return this._japaneseUtil;
     }
@@ -215,7 +206,6 @@ class Display extends EventDispatcher {
     async prepare() {
         // State setup
         const {documentElement} = document;
-        this._updateMode();
         const {browser} = await api.getEnvironmentInfo();
         this._browser = browser;
 
@@ -231,7 +221,6 @@ class Display extends EventDispatcher {
         this._queryParser.on('searched', this._onQueryParserSearch.bind(this));
         this._progressIndicatorVisible.on('change', this._onProgressIndicatorVisibleChanged.bind(this));
         yomichan.on('extensionUnloaded', this._onExtensionUnloaded.bind(this));
-        chrome.runtime.onMessage.addListener(this._onMessage.bind(this));
         api.crossFrame.registerHandlers([
             ['popupMessage', {async: 'dynamic', handler: this._onDirectMessage.bind(this)}]
         ]);
@@ -379,12 +368,6 @@ class Display extends EventDispatcher {
         }
     }
 
-    registerMessageHandlers(handlers) {
-        for (const [name, handlerInfo] of handlers) {
-            this._messageHandlers.set(name, handlerInfo);
-        }
-    }
-
     registerDirectMessageHandlers(handlers) {
         for (const [name, handlerInfo] of handlers) {
             this._directMessageHandlers.set(name, handlerInfo);
@@ -456,12 +439,6 @@ class Display extends EventDispatcher {
 
     // Message handlers
 
-    _onMessage({action, params}, sender, callback) {
-        const messageHandler = this._messageHandlers.get(action);
-        if (typeof messageHandler === 'undefined') { return false; }
-        return yomichan.invokeMessageHandler(messageHandler, params, callback, sender);
-    }
-
     _onDirectMessage(data) {
         data = this.authenticateMessageData(data);
         const {action, params} = data;
@@ -490,14 +467,6 @@ class Display extends EventDispatcher {
         yomichan.invokeMessageHandler(messageHandler, params, callback);
     }
 
-    _onMessageSetMode({mode}) {
-        this._setMode(mode, true);
-    }
-
-    _onMessageGetMode() {
-        return this._mode;
-    }
-
     _onMessageSetOptionsContext({optionsContext}) {
         this.setOptionsContext(optionsContext);
         this.searchLast();
@@ -1424,33 +1393,6 @@ class Display extends EventDispatcher {
         yomichan.trigger('closePopups');
     }
 
-    _updateMode() {
-        let mode = null;
-        try {
-            mode = sessionStorage.getItem('mode');
-        } catch (e) {
-            // Browsers can throw a SecurityError when cookie blocking is enabled.
-        }
-        this._setMode(mode, false);
-    }
-
-    _setMode(mode, save) {
-        if (mode === this._mode) { return; }
-        if (save) {
-            try {
-                if (mode === null) {
-                    sessionStorage.removeItem('mode');
-                } else {
-                    sessionStorage.setItem('mode', mode);
-                }
-            } catch (e) {
-                // Browsers can throw a SecurityError when cookie blocking is enabled.
-            }
-        }
-        this._mode = mode;
-        this.trigger('modeChange', {mode});
-    }
-
     async _getAnkiFieldTemplates(options) {
         let templates = options.anki.fieldTemplates;
         if (typeof templates === 'string') { return templates; }