Popup action search (#1678)

* Set up search page in the action popup

* Fix a style causing incorrect overflow

* Fix error when trying to take a screenshot

* Fix popup size on Firefox

4 files changed, 59 insertions, 2 deletions

diff --git a/ext/js/display/display.js b/ext/js/display/display.js
index 6895ea74..7bfe3add 100644
--- a/ext/js/display/display.js
+++ b/ext/js/display/display.js
@@ -1571,7 +1571,11 @@ class Display extends EventDispatcher {
             audioDetails = {sources: sources2, preferredAudioIndex, customSourceUrl, customSourceType};
         }
 
-        const screenshotDetails = (AnkiUtil.fieldsObjectContainsMarker(fields, 'screenshot') ? {tabId: this._contentOriginTabId, frameId: this._contentOriginFrameId, format, quality} : null);
+        const screenshotDetails = (
+            AnkiUtil.fieldsObjectContainsMarker(fields, 'screenshot') && typeof this._contentOriginTabId === 'number' ?
+            {tabId: this._contentOriginTabId, frameId: this._contentOriginFrameId, format, quality} :
+            null
+        );
 
         const clipboardDetails = {
             image: AnkiUtil.fieldsObjectContainsMarker(fields, 'clipboard-image'),
diff --git a/ext/js/display/search-action-popup-controller.js b/ext/js/display/search-action-popup-controller.js
new file mode 100644
index 00000000..ab5a4976
--- /dev/null
+++ b/ext/js/display/search-action-popup-controller.js
@@ -0,0 +1,35 @@
+/*
+ * Copyright (C) 2021  Yomichan Authors
+ *
+ * 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 <https://www.gnu.org/licenses/>.
+ */
+
+class SearchActionPopupController {
+    constructor(searchPersistentStateController) {
+        this._searchPersistentStateController = searchPersistentStateController;
+    }
+
+    prepare() {
+        const searchParams = new URLSearchParams(location.search);
+        if (searchParams.get('action-popup') !== 'true') { return; }
+
+        searchParams.delete('action-popup');
+        let search = searchParams.toString();
+        if (search.length > 0) { search = `?${search}`; }
+        const url = `${location.protocol}//${location.host}${location.pathname}${search}${location.hash}`;
+        history.replaceState(history.state, '', url);
+
+        this._searchPersistentStateController.mode = 'action-popup';
+    }
+}
diff --git a/ext/js/display/search-display-controller.js b/ext/js/display/search-display-controller.js
index 95f8b6c1..8743166b 100644
--- a/ext/js/display/search-display-controller.js
+++ b/ext/js/display/search-display-controller.js
@@ -84,6 +84,10 @@ class SearchDisplayController {
         this._onDisplayOptionsUpdated({options: this._display.getOptions()});
     }
 
+    setMode(mode) {
+        this._setMode(mode, true);
+    }
+
     // Actions
 
     _onActionFocusSearchBox() {
@@ -329,13 +333,23 @@ class SearchDisplayController {
     _updateClipboardMonitorEnabled() {
         const enabled = this._clipboardMonitorEnabled;
         this._clipboardMonitorEnableCheckbox.checked = enabled;
-        if (enabled && this._searchPersistentStateController.mode !== 'popup') {
+        if (enabled && this._canEnableClipboardMonitor()) {
             this._clipboardMonitor.start();
         } else {
             this._clipboardMonitor.stop();
         }
     }
 
+    _canEnableClipboardMonitor() {
+        switch (this._searchPersistentStateController.mode) {
+            case 'popup':
+            case 'action-popup':
+                return false;
+            default:
+                return true;
+        }
+    }
+
     _requestPermissions(permissions) {
         return new Promise((resolve) => {
             chrome.permissions.request(
diff --git a/ext/js/display/search-main.js b/ext/js/display/search-main.js
index 04886bc8..7d39b3b7 100644
--- a/ext/js/display/search-main.js
+++ b/ext/js/display/search-main.js
@@ -20,6 +20,7 @@
  * DocumentFocusController
  * HotkeyHandler
  * JapaneseUtil
+ * SearchActionPopupController
  * SearchDisplayController
  * SearchPersistentStateController
  * wanakana
@@ -33,6 +34,9 @@
         const searchPersistentStateController = new SearchPersistentStateController();
         searchPersistentStateController.prepare();
 
+        const searchActionPopupController = new SearchActionPopupController(searchPersistentStateController);
+        searchActionPopupController.prepare();
+
         await yomichan.prepare();
 
         const {tabId, frameId} = await yomichan.api.frameInformationGet();