From 8292be92d8958fc09dceb7c6bf252ac1c170ed1a Mon Sep 17 00:00:00 2001
From: siikamiika <siikamiika@users.noreply.github.com>
Date: Thu, 16 Jan 2020 23:22:38 +0200
Subject: use TextScanner in QueryParser

---
 ext/fg/js/frontend.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js
index 034d9075..9621ed2b 100644
--- a/ext/fg/js/frontend.js
+++ b/ext/fg/js/frontend.js
@@ -90,9 +90,8 @@ class Frontend extends TextScanner {
     }
 
     async updateOptions() {
-        this.options = await apiOptionsGet(this.getOptionsContext());
+        this.setOptions(await apiOptionsGet(this.getOptionsContext()));
         await this.popup.setOptions(this.options);
-        this.setEnabled(this.options.general.enable);
     }
 
     async onSearchSource(textSource, cause) {
-- 
cgit v1.2.3


From dbbcfa5739d10a6e45eb6e8b964e6a576431ff20 Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Fri, 27 Dec 2019 17:42:36 -0500
Subject: Only use Display.setContent

---
 ext/bg/js/search.js     | 4 ++--
 ext/fg/js/float.js      | 2 +-
 ext/mixed/js/display.js | 4 ++--
 3 files changed, 5 insertions(+), 5 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/bg/js/search.js b/ext/bg/js/search.js
index ba66d5a9..673f066b 100644
--- a/ext/bg/js/search.js
+++ b/ext/bg/js/search.js
@@ -220,12 +220,12 @@ class DisplaySearch extends Display {
             this.updateSearchButton();
             if (valid) {
                 const {definitions} = await apiTermsFind(query, details, this.optionsContext);
-                this.setContentTerms(definitions, {
+                this.setContent('terms', {definitions, context: {
                     focus: false,
                     disableHistory: true,
                     sentence: {text: query, offset: 0},
                     url: window.location.href
-                });
+                }});
             } else {
                 this.container.textContent = '';
             }
diff --git a/ext/fg/js/float.js b/ext/fg/js/float.js
index 513d246b..c550579d 100644
--- a/ext/fg/js/float.js
+++ b/ext/fg/js/float.js
@@ -35,7 +35,7 @@ class DisplayFloat extends Display {
 
     onError(error) {
         if (this._orphaned) {
-            this.setContentOrphaned();
+            this.setContent('orphaned');
         } else {
             logError(error, true);
         }
diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js
index f5b2225d..cc5bc95f 100644
--- a/ext/mixed/js/display.js
+++ b/ext/mixed/js/display.js
@@ -77,7 +77,7 @@ class Display {
             };
 
             const definitions = await apiKanjiFind(link.textContent, this.getOptionsContext());
-            this.setContentKanji(definitions, context);
+            this.setContent('kanji', {definitions, context});
         } catch (error) {
             this.onError(error);
         }
@@ -131,7 +131,7 @@ class Display {
                 });
             }
 
-            this.setContentTerms(definitions, context);
+            this.setContent('terms', {definitions, context});
 
             if (selectText) {
                 textSource.select();
-- 
cgit v1.2.3


From 62da7ec5cc3efa7011260bebe7366fabcb610ab4 Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Thu, 16 Jan 2020 18:56:20 -0500
Subject: Update expression-scan-toggle to term-expression-text

---
 ext/bg/js/search-frontend.js | 2 +-
 ext/fg/js/popup-nested.js    | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/bg/js/search-frontend.js b/ext/bg/js/search-frontend.js
index 2fe50a13..bd2ddb50 100644
--- a/ext/bg/js/search-frontend.js
+++ b/ext/bg/js/search-frontend.js
@@ -27,7 +27,7 @@ async function searchFrontendSetup() {
 
     const ignoreNodes = ['.scan-disable', '.scan-disable *'];
     if (!options.scanning.enableOnPopupExpressions) {
-        ignoreNodes.push('.expression-scan-toggle', '.expression-scan-toggle *');
+        ignoreNodes.push('.term-expression-text', '.term-expression-text *');
     }
 
     window.frontendInitializationData = {depth: 1, ignoreNodes, proxy: false};
diff --git a/ext/fg/js/popup-nested.js b/ext/fg/js/popup-nested.js
index bacf3b93..e0e52cb7 100644
--- a/ext/fg/js/popup-nested.js
+++ b/ext/fg/js/popup-nested.js
@@ -35,7 +35,7 @@ async function popupNestedInitialize(id, depth, parentFrameId, url) {
 
     const ignoreNodes = ['.scan-disable', '.scan-disable *'];
     if (!options.scanning.enableOnPopupExpressions) {
-        ignoreNodes.push('.expression-scan-toggle', '.expression-scan-toggle *');
+        ignoreNodes.push('.term-expression-text', '.term-expression-text *');
     }
 
     window.frontendInitializationData = {id, depth, parentFrameId, ignoreNodes, url, proxy: true};
-- 
cgit v1.2.3


From f969b5b8a9fa3b77bfc3bbb13830913c620c48da Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Thu, 16 Jan 2020 19:35:19 -0500
Subject: Update popup scan ignore selectors

---
 ext/bg/js/search-frontend.js     | 2 +-
 ext/fg/js/popup-nested.js        | 2 +-
 ext/mixed/display-templates.html | 4 ++--
 3 files changed, 4 insertions(+), 4 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/bg/js/search-frontend.js b/ext/bg/js/search-frontend.js
index bd2ddb50..e453ccef 100644
--- a/ext/bg/js/search-frontend.js
+++ b/ext/bg/js/search-frontend.js
@@ -27,7 +27,7 @@ async function searchFrontendSetup() {
 
     const ignoreNodes = ['.scan-disable', '.scan-disable *'];
     if (!options.scanning.enableOnPopupExpressions) {
-        ignoreNodes.push('.term-expression-text', '.term-expression-text *');
+        ignoreNodes.push('.source-text', '.source-text *');
     }
 
     window.frontendInitializationData = {depth: 1, ignoreNodes, proxy: false};
diff --git a/ext/fg/js/popup-nested.js b/ext/fg/js/popup-nested.js
index e0e52cb7..3f3c945e 100644
--- a/ext/fg/js/popup-nested.js
+++ b/ext/fg/js/popup-nested.js
@@ -35,7 +35,7 @@ async function popupNestedInitialize(id, depth, parentFrameId, url) {
 
     const ignoreNodes = ['.scan-disable', '.scan-disable *'];
     if (!options.scanning.enableOnPopupExpressions) {
-        ignoreNodes.push('.term-expression-text', '.term-expression-text *');
+        ignoreNodes.push('.source-text', '.source-text *');
     }
 
     window.frontendInitializationData = {id, depth, parentFrameId, ignoreNodes, url, proxy: true};
diff --git a/ext/mixed/display-templates.html b/ext/mixed/display-templates.html
index 01cfeffc..62f3c69c 100644
--- a/ext/mixed/display-templates.html
+++ b/ext/mixed/display-templates.html
@@ -20,7 +20,7 @@
     <div class="term-definition-container"><ol class="term-definition-list"></ol></div>
     <pre class="debug-info"></pre>
 </div></template>
-<template id="term-expression-template"><div class="term-expression"><span class="term-expression-text"></span><div class="term-expression-details">
+<template id="term-expression-template"><div class="term-expression"><span class="term-expression-text source-text"></span><div class="term-expression-details">
     <button class="action-button action-play-audio"><img src="/mixed/img/play-audio.svg" class="icon-image" title="Play audio" alt></button>
     <div class="tags tag-list"></div>
     <div class="frequencies tag-list"></div>
@@ -43,7 +43,7 @@
                     <button class="action-button action-add-note pending disabled" data-mode="kanji"><img src="/mixed/img/add-term-kanji.svg" class="icon-image" title="Add Kanji (Alt + K)" alt></button>
                     <span class="action-button action-current-indicator"><img src="/mixed/img/entry-current.svg" class="icon-image current" title="Current entry (Alt + Up/Down/Home/End/PgUp/PgDn)" alt></span>
                 </div>
-                <div class="kanji-glyph"></div>
+                <div class="kanji-glyph source-text"></div>
             </div>
         </div>
         <div class="frequencies"></div>
-- 
cgit v1.2.3


From d8b0d5267b93e46e69c89e3b8abcc660d2712b46 Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Fri, 17 Jan 2020 20:47:51 -0500
Subject: Catch exception on range.setStart

Fixes #328
---
 ext/fg/js/document.js | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/fg/js/document.js b/ext/fg/js/document.js
index e068e3ba..db9f0cdc 100644
--- a/ext/fg/js/document.js
+++ b/ext/fg/js/document.js
@@ -269,8 +269,14 @@ const caretRangeFromPoint = (() => {
 
             const range = document.createRange();
             const offset = (node.nodeType === Node.TEXT_NODE ? position.offset : 0);
-            range.setStart(node, offset);
-            range.setEnd(node, offset);
+            try {
+                range.setStart(node, offset);
+                range.setEnd(node, offset);
+            } catch (e) {
+                // Firefox throws new DOMException("The operation is insecure.")
+                // when trying to select a node from within a ShadowRoot.
+                return null;
+            }
             return range;
         };
     }
-- 
cgit v1.2.3


From 14e48cf85478da1d3817be244fcdf1a28835f99b Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Mon, 23 Dec 2019 13:58:33 -0500
Subject: Create single function for how the frontend shows popup content

---
 ext/fg/js/frontend.js | 26 ++++++++++++++------------
 1 file changed, 14 insertions(+), 12 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js
index 9621ed2b..2543b52c 100644
--- a/ext/fg/js/frontend.js
+++ b/ext/fg/js/frontend.js
@@ -53,10 +53,7 @@ class Frontend extends TextScanner {
     async onResize() {
         const textSource = this.textSourceCurrent;
         if (textSource !== null && await this.popup.isVisible()) {
-            this._lastShowPromise = this.popup.showContent(
-                textSource.getRect(),
-                textSource.getWritingMode()
-            );
+            this._showPopupContent(textSource);
         }
     }
 
@@ -111,11 +108,7 @@ class Frontend extends TextScanner {
         } catch (e) {
             if (this._orphaned) {
                 if (textSource !== null && this.options.scanning.modifier !== 'none') {
-                    this._lastShowPromise = this.popup.showContent(
-                        textSource.getRect(),
-                        textSource.getWritingMode(),
-                        'orphaned'
-                    );
+                    this._showPopupContent(textSource, 'orphaned');
                 }
             } else {
                 this.onError(e);
@@ -132,9 +125,8 @@ class Frontend extends TextScanner {
     showContent(textSource, focus, definitions, type) {
         const sentence = docSentenceExtract(textSource, this.options.anki.sentenceExt);
         const url = window.location.href;
-        this._lastShowPromise = this.popup.showContent(
-            textSource.getRect(),
-            textSource.getWritingMode(),
+        this._showPopupContent(
+            textSource,
             type,
             {definitions, context: {sentence, url, focus, disableHistory: true}}
         );
@@ -180,6 +172,16 @@ class Frontend extends TextScanner {
         this.optionsContext.url = this.popup.url;
         return this.optionsContext;
     }
+
+    _showPopupContent(textSource, type=null, details=null) {
+        this._lastShowPromise = this.popup.showContent(
+            textSource.getRect(),
+            textSource.getWritingMode(),
+            type,
+            details
+        );
+        return this._lastShowPromise;
+    }
 }
 
 Frontend._windowMessageHandlers = new Map([
-- 
cgit v1.2.3


From f725549330e851ededad3c97c4517f8a23168e4a Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Mon, 23 Dec 2019 14:09:41 -0500
Subject: Remove redundant window resize handler

---
 ext/bg/js/settings/popup-preview-frame.js | 12 +-----------
 ext/fg/js/frontend.js                     |  7 ++++---
 2 files changed, 5 insertions(+), 14 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/bg/js/settings/popup-preview-frame.js b/ext/bg/js/settings/popup-preview-frame.js
index 2b727cbd..54f246e3 100644
--- a/ext/bg/js/settings/popup-preview-frame.js
+++ b/ext/bg/js/settings/popup-preview-frame.js
@@ -35,7 +35,6 @@ class SettingsPopupPreview {
 
     async prepare() {
         // Setup events
-        window.addEventListener('resize', (e) => this.onWindowResize(e), false);
         window.addEventListener('message', (e) => this.onMessage(e), false);
 
         const themeDarkCheckbox = document.querySelector('#theme-dark-checkbox');
@@ -96,16 +95,6 @@ class SettingsPopupPreview {
         return result;
     }
 
-    onWindowResize() {
-        if (this.frontend === null) { return; }
-        const textSource = this.textSource;
-        if (textSource === null) { return; }
-
-        const elementRect = textSource.getRect();
-        const writingMode = textSource.getWritingMode();
-        this.frontend.popup.showContent(elementRect, writingMode);
-    }
-
     onMessage(e) {
         const {action, params} = e.data;
         const handler = SettingsPopupPreview._messageHandlers.get(action);
@@ -163,6 +152,7 @@ class SettingsPopupPreview {
 
         try {
             await this.frontend.onSearchSource(source, 'script');
+            this.frontend.setCurrentTextSource(source);
         } finally {
             source.cleanup();
         }
diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js
index 2543b52c..85f1f373 100644
--- a/ext/fg/js/frontend.js
+++ b/ext/fg/js/frontend.js
@@ -42,6 +42,8 @@ class Frontend extends TextScanner {
         try {
             await this.updateOptions();
 
+            window.addEventListener('resize', this.onResize.bind(this), false);
+
             yomichan.on('orphaned', () => this.onOrphaned());
             yomichan.on('optionsUpdate', () => this.updateOptions());
             chrome.runtime.onMessage.addListener(this.onRuntimeMessage.bind(this));
@@ -51,7 +53,7 @@ class Frontend extends TextScanner {
     }
 
     async onResize() {
-        const textSource = this.textSourceCurrent;
+        const textSource = this.getCurrentTextSource();
         if (textSource !== null && await this.popup.isVisible()) {
             this._showPopupContent(textSource);
         }
@@ -81,8 +83,7 @@ class Frontend extends TextScanner {
     getMouseEventListeners() {
         return [
             ...super.getMouseEventListeners(),
-            [window, 'message', this.onWindowMessage.bind(this)],
-            [window, 'resize', this.onResize.bind(this)]
+            [window, 'message', this.onWindowMessage.bind(this)]
         ];
     }
 
-- 
cgit v1.2.3


From e51fd8ea71b361ef439728ba6985cbc30c057cd0 Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Mon, 23 Dec 2019 16:13:41 -0500
Subject: Add _isInjectedAndLoaded property

---
 ext/fg/js/popup.js | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

(limited to 'ext/fg/js')

diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js
index 7a0c6133..9b3e3944 100644
--- a/ext/fg/js/popup.js
+++ b/ext/fg/js/popup.js
@@ -28,6 +28,7 @@ class Popup {
         this._childrenSupported = true;
         this._injectPromise = null;
         this._isInjected = false;
+        this._isInjectedAndLoaded = false;
         this._visible = false;
         this._visibleOverride = null;
         this._options = null;
@@ -114,7 +115,7 @@ class Popup {
     }
 
     clearAutoPlayTimer() {
-        if (this._isInjected) {
+        if (this._isInjectedAndLoaded) {
             this._invokeApi('clearAutoPlayTimer');
         }
     }
@@ -215,6 +216,7 @@ class Popup {
         return new Promise((resolve) => {
             const parentFrameId = (typeof this._frameId === 'number' ? this._frameId : null);
             this._container.addEventListener('load', () => {
+                this._isInjectedAndLoaded = true;
                 this._invokeApi('initialize', {
                     options: this._options,
                     popupInfo: {
@@ -307,6 +309,9 @@ class Popup {
     }
 
     _invokeApi(action, params={}) {
+        if (!this._isInjectedAndLoaded) {
+            throw new Error('Frame not loaded');
+        }
         this._container.contentWindow.postMessage({action, params}, '*');
     }
 
-- 
cgit v1.2.3


From 22afab2f47bcc1e5e9ac0db35d2f1b168becf76e Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Mon, 23 Dec 2019 16:52:05 -0500
Subject: Remove _isInitialized

---
 ext/fg/js/popup.js | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js
index 9b3e3944..12a5c1c2 100644
--- a/ext/fg/js/popup.js
+++ b/ext/fg/js/popup.js
@@ -104,7 +104,7 @@ class Popup {
     }
 
     async showContent(elementRect, writingMode, type=null, details=null) {
-        if (!this._isInitialized()) { return; }
+        if (this._options === null) { throw new Error('Options not assigned'); }
         await this._show(elementRect, writingMode);
         if (type === null) { return; }
         this._invokeApi('setContent', {type, details});
@@ -236,10 +236,6 @@ class Popup {
         });
     }
 
-    _isInitialized() {
-        return this._options !== null;
-    }
-
     async _show(elementRect, writingMode) {
         await this._inject();
 
-- 
cgit v1.2.3


From e740965d4f39a34eecf8a211f22eddf56d185fed Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Mon, 23 Dec 2019 17:12:09 -0500
Subject: Scale popup based on current page zoom factor

---
 ext/fg/js/float.js            | 11 +++++++++--
 ext/fg/js/frontend.js         | 20 ++++++++++++++++++++
 ext/fg/js/popup-proxy-host.js |  8 +++++++-
 ext/fg/js/popup-proxy.js      |  5 +++++
 ext/fg/js/popup.js            | 29 ++++++++++++++++++++---------
 5 files changed, 61 insertions(+), 12 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/fg/js/float.js b/ext/fg/js/float.js
index c550579d..8d61d8f6 100644
--- a/ext/fg/js/float.js
+++ b/ext/fg/js/float.js
@@ -89,7 +89,11 @@ class DisplayFloat extends Display {
         }
     }
 
-    async initialize(options, popupInfo, url, childrenSupported) {
+    setContentScale(scale) {
+        document.body.style.fontSize = `${scale}em`;
+    }
+
+    async initialize(options, popupInfo, url, childrenSupported, scale) {
         await super.initialize(options);
 
         const {id, depth, parentFrameId} = popupInfo;
@@ -99,6 +103,8 @@ class DisplayFloat extends Display {
         if (childrenSupported) {
             popupNestedInitialize(id, depth, parentFrameId, url);
         }
+
+        this.setContentScale(scale);
     }
 }
 
@@ -116,7 +122,8 @@ DisplayFloat._messageHandlers = new Map([
     ['setContent', (self, {type, details}) => self.setContent(type, details)],
     ['clearAutoPlayTimer', (self) => self.clearAutoPlayTimer()],
     ['setCustomCss', (self, {css}) => self.setCustomCss(css)],
-    ['initialize', (self, {options, popupInfo, url, childrenSupported}) => self.initialize(options, popupInfo, url, childrenSupported)]
+    ['initialize', (self, {options, popupInfo, url, childrenSupported, scale}) => self.initialize(options, popupInfo, url, childrenSupported, scale)],
+    ['setContentScale', (self, {scale}) => self.setContentScale(scale)]
 ]);
 
 DisplayFloat.instance = new DisplayFloat();
diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js
index 85f1f373..52e3a5bc 100644
--- a/ext/fg/js/frontend.js
+++ b/ext/fg/js/frontend.js
@@ -34,6 +34,8 @@ class Frontend extends TextScanner {
             url: popup.url
         };
 
+        this._pageZoomFactor = 1.0;
+        this._contentScale = 1.0;
         this._orphaned = true;
         this._lastShowPromise = Promise.resolve();
     }
@@ -41,11 +43,14 @@ class Frontend extends TextScanner {
     async prepare() {
         try {
             await this.updateOptions();
+            const {zoomFactor} = await apiGetZoom();
+            this.onZoomChanged({newZoomFactor: zoomFactor});
 
             window.addEventListener('resize', this.onResize.bind(this), false);
 
             yomichan.on('orphaned', () => this.onOrphaned());
             yomichan.on('optionsUpdate', () => this.updateOptions());
+            yomichan.on('zoomChanged', (e) => this.onZoomChanged(e));
             chrome.runtime.onMessage.addListener(this.onRuntimeMessage.bind(this));
         } catch (e) {
             this.onError(e);
@@ -80,6 +85,11 @@ class Frontend extends TextScanner {
         this._orphaned = true;
     }
 
+    onZoomChanged({newZoomFactor}) {
+        this._pageZoomFactor = newZoomFactor;
+        this._updateContentScale();
+    }
+
     getMouseEventListeners() {
         return [
             ...super.getMouseEventListeners(),
@@ -90,6 +100,7 @@ class Frontend extends TextScanner {
     async updateOptions() {
         this.setOptions(await apiOptionsGet(this.getOptionsContext()));
         await this.popup.setOptions(this.options);
+        this._updateContentScale();
     }
 
     async onSearchSource(textSource, cause) {
@@ -183,6 +194,15 @@ class Frontend extends TextScanner {
         );
         return this._lastShowPromise;
     }
+
+    _updateContentScale() {
+        const contentScale = 1.0 / this._pageZoomFactor; // TODO : Use options
+        if (contentScale === this._contentScale) { return; }
+
+        this._contentScale = contentScale;
+        this.popup.setContentScale(this._contentScale);
+        this.onResize();
+    }
 }
 
 Frontend._windowMessageHandlers = new Map([
diff --git a/ext/fg/js/popup-proxy-host.js b/ext/fg/js/popup-proxy-host.js
index c4f0c6ff..427172c6 100644
--- a/ext/fg/js/popup-proxy-host.js
+++ b/ext/fg/js/popup-proxy-host.js
@@ -41,7 +41,8 @@ class PopupProxyHost {
             ['containsPoint', ({id, x, y}) => this._onApiContainsPoint(id, x, y)],
             ['showContent', ({id, elementRect, writingMode, type, details}) => this._onApiShowContent(id, elementRect, writingMode, type, details)],
             ['setCustomCss', ({id, css}) => this._onApiSetCustomCss(id, css)],
-            ['clearAutoPlayTimer', ({id}) => this._onApiClearAutoPlayTimer(id)]
+            ['clearAutoPlayTimer', ({id}) => this._onApiClearAutoPlayTimer(id)],
+            ['setContentScale', ({id, scale}) => this._onApiSetContentScale(id, scale)]
         ]));
     }
 
@@ -97,6 +98,11 @@ class PopupProxyHost {
         return popup.clearAutoPlayTimer();
     }
 
+    async _onApiSetContentScale(id, scale) {
+        const popup = this._getPopup(id);
+        return popup.setContentScale(scale);
+    }
+
     // Private functions
 
     _createPopupInternal(parentId, depth) {
diff --git a/ext/fg/js/popup-proxy.js b/ext/fg/js/popup-proxy.js
index ae0cffad..4cacee53 100644
--- a/ext/fg/js/popup-proxy.js
+++ b/ext/fg/js/popup-proxy.js
@@ -97,6 +97,11 @@ class PopupProxy {
         this._invokeHostApi('clearAutoPlayTimer', {id: this._id});
     }
 
+    async setContentScale(scale) {
+        const id = await this._getPopupId();
+        this._invokeHostApi('setContentScale', {id, scale});
+    }
+
     // Private
 
     _getPopupId() {
diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js
index 12a5c1c2..3c774f54 100644
--- a/ext/fg/js/popup.js
+++ b/ext/fg/js/popup.js
@@ -33,6 +33,7 @@ class Popup {
         this._visibleOverride = null;
         this._options = null;
         this._stylesheetInjectedViaApi = false;
+        this._contentScale = 1.0;
 
         this._container = document.createElement('iframe');
         this._container.className = 'yomichan-float';
@@ -120,6 +121,13 @@ class Popup {
         }
     }
 
+    setContentScale(scale) {
+        this._contentScale = scale;
+        if (this._isInjectedAndLoaded) {
+            this._invokeApi('setContentScale', {scale});
+        }
+    }
+
     // Popup-only public functions
 
     setParent(parent) {
@@ -225,7 +233,8 @@ class Popup {
                         parentFrameId
                     },
                     url: this.url,
-                    childrenSupported: this._childrenSupported
+                    childrenSupported: this._childrenSupported,
+                    scale: this._contentScale
                 });
                 resolve();
             });
@@ -248,12 +257,14 @@ class Popup {
             Popup._getPositionForVerticalText
         );
 
+        const scale = this._contentScale;
         const [x, y, width, height, below] = getPosition(
             elementRect,
-            Math.max(containerRect.width, optionsGeneral.popupWidth),
-            Math.max(containerRect.height, optionsGeneral.popupHeight),
+            Math.max(containerRect.width, optionsGeneral.popupWidth * scale),
+            Math.max(containerRect.height, optionsGeneral.popupHeight * scale),
             document.body.clientWidth,
             window.innerHeight,
+            scale,
             optionsGeneral,
             writingMode
         );
@@ -339,8 +350,8 @@ class Popup {
         }
     }
 
-    static _getPositionForHorizontalText(elementRect, width, height, maxWidth, maxHeight, optionsGeneral) {
-        let x = elementRect.left + optionsGeneral.popupHorizontalOffset;
+    static _getPositionForHorizontalText(elementRect, width, height, maxWidth, maxHeight, offsetScale, optionsGeneral) {
+        let x = elementRect.left + optionsGeneral.popupHorizontalOffset * offsetScale;
         const overflowX = Math.max(x + width - maxWidth, 0);
         if (overflowX > 0) {
             if (x >= overflowX) {
@@ -353,7 +364,7 @@ class Popup {
 
         const preferBelow = (optionsGeneral.popupHorizontalTextPosition === 'below');
 
-        const verticalOffset = optionsGeneral.popupVerticalOffset;
+        const verticalOffset = optionsGeneral.popupVerticalOffset * offsetScale;
         const [y, h, below] = Popup._limitGeometry(
             elementRect.top - verticalOffset,
             elementRect.bottom + verticalOffset,
@@ -365,10 +376,10 @@ class Popup {
         return [x, y, width, h, below];
     }
 
-    static _getPositionForVerticalText(elementRect, width, height, maxWidth, maxHeight, optionsGeneral, writingMode) {
+    static _getPositionForVerticalText(elementRect, width, height, maxWidth, maxHeight, offsetScale, optionsGeneral, writingMode) {
         const preferRight = Popup._isVerticalTextPopupOnRight(optionsGeneral.popupVerticalTextPosition, writingMode);
-        const horizontalOffset = optionsGeneral.popupHorizontalOffset2;
-        const verticalOffset = optionsGeneral.popupVerticalOffset2;
+        const horizontalOffset = optionsGeneral.popupHorizontalOffset2 * offsetScale;
+        const verticalOffset = optionsGeneral.popupVerticalOffset2 * offsetScale;
 
         const [x, w] = Popup._limitGeometry(
             elementRect.left - horizontalOffset,
-- 
cgit v1.2.3


From 351598a1829930a25a27a007fb3bc69bde251787 Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Mon, 23 Dec 2019 17:39:00 -0500
Subject: Add settings to control popup content scale

---
 ext/bg/js/options.js       |  2 ++
 ext/bg/js/settings/main.js |  4 ++++
 ext/bg/settings.html       | 16 ++++++++++++++++
 ext/fg/js/frontend.js      |  4 +++-
 4 files changed, 25 insertions(+), 1 deletion(-)

(limited to 'ext/fg/js')

diff --git a/ext/bg/js/options.js b/ext/bg/js/options.js
index 8021672b..cf9af240 100644
--- a/ext/bg/js/options.js
+++ b/ext/bg/js/options.js
@@ -279,6 +279,8 @@ function profileOptionsCreateDefaults() {
             popupVerticalOffset2: 0,
             popupHorizontalTextPosition: 'below',
             popupVerticalTextPosition: 'before',
+            popupScalingFactor: 1,
+            popupScaleRelativeToPageZoom: false,
             showGuide: true,
             compactTags: false,
             compactGlossaries: false,
diff --git a/ext/bg/js/settings/main.js b/ext/bg/js/settings/main.js
index 56828a15..a5407b75 100644
--- a/ext/bg/js/settings/main.js
+++ b/ext/bg/js/settings/main.js
@@ -44,6 +44,8 @@ async function formRead(options) {
     options.general.popupVerticalOffset = parseInt($('#popup-vertical-offset').val(), 10);
     options.general.popupHorizontalOffset2 = parseInt($('#popup-horizontal-offset2').val(), 0);
     options.general.popupVerticalOffset2 = parseInt($('#popup-vertical-offset2').val(), 10);
+    options.general.popupScalingFactor = parseInt($('#popup-scaling-factor').val(), 10);
+    options.general.popupScaleRelativeToPageZoom = $('#popup-scale-relative-to-page-zoom').val() === 'true';
     options.general.popupTheme = $('#popup-theme').val();
     options.general.popupOuterTheme = $('#popup-outer-theme').val();
     options.general.customPopupCss = $('#custom-popup-css').val();
@@ -109,6 +111,8 @@ async function formWrite(options) {
     $('#popup-vertical-offset').val(options.general.popupVerticalOffset);
     $('#popup-horizontal-offset2').val(options.general.popupHorizontalOffset2);
     $('#popup-vertical-offset2').val(options.general.popupVerticalOffset2);
+    $('#popup-scaling-factor').val(options.general.popupScalingFactor);
+    $('#popup-scale-relative-to-page-zoom').val(options.general.popupScaleRelativeToPageZoom ? 'true' : 'false');
     $('#popup-theme').val(options.general.popupTheme);
     $('#popup-outer-theme').val(options.general.popupOuterTheme);
     $('#custom-popup-css').val(options.general.customPopupCss);
diff --git a/ext/bg/settings.html b/ext/bg/settings.html
index 4c973674..37ee20aa 100644
--- a/ext/bg/settings.html
+++ b/ext/bg/settings.html
@@ -237,6 +237,22 @@
                     </div>
                 </div>
 
+                <div class="form-group options-advanced">
+                    <div class="row">
+                        <div class="col-xs-6">
+                            <label for="popup-scaling-factor">Popup size multiplier</label>
+                            <input type="number" min="0" id="popup-scaling-factor" class="form-control">
+                        </div>
+                        <div class="col-xs-6">
+                            <label for="popup-scale-relative-to-page-zoom">Popup size mode</label>
+                            <select class="form-control" id="popup-scale-relative-to-page-zoom">
+                                <option value="false">Absolute</option>
+                                <option value="true">Relative to zoom level</option>
+                            </select>
+                        </div>
+                    </div>
+                </div>
+
                 <div class="form-group">
                     <div class="row">
                         <div class="col-xs-6">
diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js
index 52e3a5bc..d2fe9e76 100644
--- a/ext/fg/js/frontend.js
+++ b/ext/fg/js/frontend.js
@@ -196,7 +196,9 @@ class Frontend extends TextScanner {
     }
 
     _updateContentScale() {
-        const contentScale = 1.0 / this._pageZoomFactor; // TODO : Use options
+        const {popupScalingFactor, popupScaleRelativeToPageZoom} = this.options.general;
+        let contentScale = popupScalingFactor;
+        if (popupScaleRelativeToPageZoom) { contentScale /= this._pageZoomFactor; }
         if (contentScale === this._contentScale) { return; }
 
         this._contentScale = contentScale;
-- 
cgit v1.2.3


From 4d85a36091c68237c53136a6f78692eaf3a60a37 Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Sat, 28 Dec 2019 23:22:29 -0500
Subject: Fix popup size changing when zooming

---
 ext/fg/js/popup.js | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js
index 3c774f54..6c98491b 100644
--- a/ext/fg/js/popup.js
+++ b/ext/fg/js/popup.js
@@ -34,6 +34,7 @@ class Popup {
         this._options = null;
         this._stylesheetInjectedViaApi = false;
         this._contentScale = 1.0;
+        this._containerSizeContentScale = null;
 
         this._container = document.createElement('iframe');
         this._container.className = 'yomichan-float';
@@ -258,10 +259,12 @@ class Popup {
         );
 
         const scale = this._contentScale;
+        const scaleRatio = this._containerSizeContentScale === null ? 1.0 : scale / this._containerSizeContentScale;
+        this._containerSizeContentScale = scale;
         const [x, y, width, height, below] = getPosition(
             elementRect,
-            Math.max(containerRect.width, optionsGeneral.popupWidth * scale),
-            Math.max(containerRect.height, optionsGeneral.popupHeight * scale),
+            Math.max(containerRect.width * scaleRatio, optionsGeneral.popupWidth * scale),
+            Math.max(containerRect.height * scaleRatio, optionsGeneral.popupHeight * scale),
             document.body.clientWidth,
             window.innerHeight,
             scale,
-- 
cgit v1.2.3


From e73e4c032c2fbbeee1e1b4ce89a8627bb60d5dbb Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Mon, 30 Dec 2019 12:42:25 -0500
Subject: Implement scale relative to visual viewport

---
 ext/fg/js/frontend.js | 32 +++++++++++++++++++++++++++++---
 1 file changed, 29 insertions(+), 3 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js
index d2fe9e76..43cbae73 100644
--- a/ext/fg/js/frontend.js
+++ b/ext/fg/js/frontend.js
@@ -44,14 +44,22 @@ class Frontend extends TextScanner {
         try {
             await this.updateOptions();
             const {zoomFactor} = await apiGetZoom();
-            this.onZoomChanged({newZoomFactor: zoomFactor});
+            this._pageZoomFactor = zoomFactor;
 
             window.addEventListener('resize', this.onResize.bind(this), false);
 
+            const visualViewport = window.visualViewport;
+            if (visualViewport !== null && typeof visualViewport === 'object') {
+                window.visualViewport.addEventListener('scroll', this.onVisualViewportScroll.bind(this));
+                window.visualViewport.addEventListener('resize', this.onVisualViewportResize.bind(this));
+            }
+
             yomichan.on('orphaned', () => this.onOrphaned());
             yomichan.on('optionsUpdate', () => this.updateOptions());
             yomichan.on('zoomChanged', (e) => this.onZoomChanged(e));
             chrome.runtime.onMessage.addListener(this.onRuntimeMessage.bind(this));
+
+            this._updateContentScale();
         } catch (e) {
             this.onError(e);
         }
@@ -90,6 +98,14 @@ class Frontend extends TextScanner {
         this._updateContentScale();
     }
 
+    onVisualViewportScroll() {
+        // TODO
+    }
+
+    onVisualViewportResize() {
+        this._updateContentScale();
+    }
+
     getMouseEventListeners() {
         return [
             ...super.getMouseEventListeners(),
@@ -196,15 +212,25 @@ class Frontend extends TextScanner {
     }
 
     _updateContentScale() {
-        const {popupScalingFactor, popupScaleRelativeToPageZoom} = this.options.general;
+        const {popupScalingFactor, popupScaleRelativeToPageZoom, popupScaleRelativeToVisualViewport} = this.options.general;
         let contentScale = popupScalingFactor;
-        if (popupScaleRelativeToPageZoom) { contentScale /= this._pageZoomFactor; }
+        if (popupScaleRelativeToPageZoom) {
+            contentScale /= this._pageZoomFactor;
+        }
+        if (popupScaleRelativeToVisualViewport) {
+            contentScale /= Frontend._getVisualViewportScale();
+        }
         if (contentScale === this._contentScale) { return; }
 
         this._contentScale = contentScale;
         this.popup.setContentScale(this._contentScale);
         this.onResize();
     }
+
+    static _getVisualViewportScale() {
+        const visualViewport = window.visualViewport;
+        return visualViewport !== null && typeof visualViewport === 'object' ? visualViewport.scale : 1.0;
+    }
 }
 
 Frontend._windowMessageHandlers = new Map([
-- 
cgit v1.2.3


From 21dbb19565d2a0b024d3240d93a961c989504bcb Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Sat, 11 Jan 2020 14:16:58 -0500
Subject: Update popup position on scroll

---
 ext/fg/js/frontend.js | 23 ++++++++++++++++-------
 1 file changed, 16 insertions(+), 7 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js
index 43cbae73..e1021ce8 100644
--- a/ext/fg/js/frontend.js
+++ b/ext/fg/js/frontend.js
@@ -46,6 +46,7 @@ class Frontend extends TextScanner {
             const {zoomFactor} = await apiGetZoom();
             this._pageZoomFactor = zoomFactor;
 
+            window.addEventListener('scroll', this.onScroll.bind(this), false);
             window.addEventListener('resize', this.onResize.bind(this), false);
 
             const visualViewport = window.visualViewport;
@@ -65,11 +66,12 @@ class Frontend extends TextScanner {
         }
     }
 
-    async onResize() {
-        const textSource = this.getCurrentTextSource();
-        if (textSource !== null && await this.popup.isVisible()) {
-            this._showPopupContent(textSource);
-        }
+    onResize() {
+        this._updatePopupPosition();
+    }
+
+    onScroll() {
+        this._updatePopupPosition();
     }
 
     onWindowMessage(e) {
@@ -99,7 +101,7 @@ class Frontend extends TextScanner {
     }
 
     onVisualViewportScroll() {
-        // TODO
+        this._updatePopupPosition();
     }
 
     onVisualViewportResize() {
@@ -224,7 +226,14 @@ class Frontend extends TextScanner {
 
         this._contentScale = contentScale;
         this.popup.setContentScale(this._contentScale);
-        this.onResize();
+        this._updatePopupPosition();
+    }
+
+    async _updatePopupPosition() {
+        const textSource = this.getCurrentTextSource();
+        if (textSource !== null && await this.popup.isVisible()) {
+            this._showPopupContent(textSource);
+        }
     }
 
     static _getVisualViewportScale() {
-- 
cgit v1.2.3


From d59f2022b9582a9a310c8a93eb3b4e0bbab097a5 Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Sat, 11 Jan 2020 14:21:10 -0500
Subject: Allow viewport to be used for constraining popup position

---
 ext/fg/js/popup.js | 114 +++++++++++++++++++++++++++++++++++------------------
 1 file changed, 75 insertions(+), 39 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js
index 6c98491b..710d95cd 100644
--- a/ext/fg/js/popup.js
+++ b/ext/fg/js/popup.js
@@ -258,6 +258,7 @@ class Popup {
             Popup._getPositionForVerticalText
         );
 
+        const viewport = Popup._getViewport(optionsGeneral.popupScaleRelativeToVisualViewport);
         const scale = this._contentScale;
         const scaleRatio = this._containerSizeContentScale === null ? 1.0 : scale / this._containerSizeContentScale;
         this._containerSizeContentScale = scale;
@@ -265,8 +266,7 @@ class Popup {
             elementRect,
             Math.max(containerRect.width * scaleRatio, optionsGeneral.popupWidth * scale),
             Math.max(containerRect.height * scaleRatio, optionsGeneral.popupHeight * scale),
-            document.body.clientWidth,
-            window.innerHeight,
+            viewport,
             scale,
             optionsGeneral,
             writingMode
@@ -353,49 +353,49 @@ class Popup {
         }
     }
 
-    static _getPositionForHorizontalText(elementRect, width, height, maxWidth, maxHeight, offsetScale, optionsGeneral) {
-        let x = elementRect.left + optionsGeneral.popupHorizontalOffset * offsetScale;
-        const overflowX = Math.max(x + width - maxWidth, 0);
-        if (overflowX > 0) {
-            if (x >= overflowX) {
-                x -= overflowX;
-            } else {
-                width = maxWidth;
-                x = 0;
-            }
-        }
-
+    static _getPositionForHorizontalText(elementRect, width, height, viewport, offsetScale, optionsGeneral) {
         const preferBelow = (optionsGeneral.popupHorizontalTextPosition === 'below');
-
+        const horizontalOffset = optionsGeneral.popupHorizontalOffset * offsetScale;
         const verticalOffset = optionsGeneral.popupVerticalOffset * offsetScale;
-        const [y, h, below] = Popup._limitGeometry(
+
+        const [x, w] = Popup._getConstrainedPosition(
+            elementRect.right - horizontalOffset,
+            elementRect.left + horizontalOffset,
+            width,
+            viewport.left,
+            viewport.right,
+            true
+        );
+        const [y, h, below] = Popup._getConstrainedPositionBinary(
             elementRect.top - verticalOffset,
             elementRect.bottom + verticalOffset,
             height,
-            maxHeight,
+            viewport.top,
+            viewport.bottom,
             preferBelow
         );
-
-        return [x, y, width, h, below];
+        return [x, y, w, h, below];
     }
 
-    static _getPositionForVerticalText(elementRect, width, height, maxWidth, maxHeight, offsetScale, optionsGeneral, writingMode) {
+    static _getPositionForVerticalText(elementRect, width, height, viewport, offsetScale, optionsGeneral, writingMode) {
         const preferRight = Popup._isVerticalTextPopupOnRight(optionsGeneral.popupVerticalTextPosition, writingMode);
         const horizontalOffset = optionsGeneral.popupHorizontalOffset2 * offsetScale;
         const verticalOffset = optionsGeneral.popupVerticalOffset2 * offsetScale;
 
-        const [x, w] = Popup._limitGeometry(
+        const [x, w] = Popup._getConstrainedPositionBinary(
             elementRect.left - horizontalOffset,
             elementRect.right + horizontalOffset,
             width,
-            maxWidth,
+            viewport.left,
+            viewport.right,
             preferRight
         );
-        const [y, h, below] = Popup._limitGeometry(
+        const [y, h, below] = Popup._getConstrainedPosition(
             elementRect.bottom - verticalOffset,
             elementRect.top + verticalOffset,
             height,
-            maxHeight,
+            viewport.top,
+            viewport.bottom,
             true
         );
         return [x, y, w, h, below];
@@ -424,23 +424,36 @@ class Popup {
         }
     }
 
-    static _limitGeometry(positionBefore, positionAfter, size, limit, preferAfter) {
-        let after = preferAfter;
-        let position = 0;
-        const overflowBefore = Math.max(0, size - positionBefore);
-        const overflowAfter = Math.max(0, positionAfter + size - limit);
+    static _getConstrainedPosition(positionBefore, positionAfter, size, minLimit, maxLimit, after) {
+        size = Math.min(size, maxLimit - minLimit);
+
+        let position;
+        if (after) {
+            position = Math.max(minLimit, positionAfter);
+            position = position - Math.max(0, (position + size) - maxLimit);
+        } else {
+            position = Math.min(maxLimit, positionBefore) - size;
+            position = position + Math.max(0, minLimit - position);
+        }
+
+        return [position, size, after];
+    }
+
+    static _getConstrainedPositionBinary(positionBefore, positionAfter, size, minLimit, maxLimit, after) {
+        const overflowBefore = minLimit - (positionBefore - size);
+        const overflowAfter = (positionAfter + size) - maxLimit;
+
         if (overflowAfter > 0 || overflowBefore > 0) {
-            if (overflowAfter < overflowBefore) {
-                size = Math.max(0, size - overflowAfter);
-                position = positionAfter;
-                after = true;
-            } else {
-                size = Math.max(0, size - overflowBefore);
-                position = Math.max(0, positionBefore - size);
-                after = false;
-            }
+            after = (overflowAfter < overflowBefore);
+        }
+
+        let position;
+        if (after) {
+            size -= Math.max(0, overflowAfter);
+            position = Math.max(minLimit, positionAfter);
         } else {
-            position = preferAfter ? positionAfter : positionBefore - size;
+            size -= Math.max(0, overflowBefore);
+            position = Math.min(maxLimit, positionBefore) - size;
         }
 
         return [position, size, after];
@@ -479,6 +492,29 @@ class Popup {
             // NOP
         }
     }
+
+    static _getViewport(useVisualViewport) {
+        if (useVisualViewport) {
+            const visualViewport = window.visualViewport;
+            if (visualViewport !== null && typeof visualViewport === 'object') {
+                const left = visualViewport.offsetLeft;
+                const top = visualViewport.offsetTop;
+                return {
+                    left,
+                    top,
+                    right: left + visualViewport.width,
+                    bottom: top + visualViewport.height
+                };
+            }
+        }
+
+        return {
+            left: 0,
+            top: 0,
+            right: document.body.clientWidth,
+            bottom: window.innerHeight
+        };
+    }
 }
 
 Popup.outerStylesheet = null;
-- 
cgit v1.2.3


From 74d9b0e857bc8fc086a6ffaf4178c2372779ecd3 Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Sat, 11 Jan 2020 14:45:40 -0500
Subject: Update full-width popup to stay on screen

---
 ext/fg/css/client.css |  7 -------
 ext/fg/js/popup.js    | 12 ++++++++++--
 2 files changed, 10 insertions(+), 9 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/fg/css/client.css b/ext/fg/css/client.css
index b9c59da7..5720d8ac 100644
--- a/ext/fg/css/client.css
+++ b/ext/fg/css/client.css
@@ -39,21 +39,14 @@ iframe.yomichan-float[data-yomichan-theme=auto][data-yomichan-site-color=dark] {
 iframe.yomichan-float.yomichan-float-full-width {
     border-left: none;
     border-right: none;
-    left: 0 !important;
-    right: 0 !important;
-    width: 100% !important;
     box-sizing: border-box;
     resize: none;
 }
 
 iframe.yomichan-float.yomichan-float-full-width:not(.yomichan-float-above) {
     border-bottom: none;
-    top: auto !important;
-    bottom: 0 !important;
 }
 
 iframe.yomichan-float.yomichan-float-full-width.yomichan-float-above {
     border-top: none;
-    top: 0 !important;
-    bottom: auto !important;
 }
diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js
index 710d95cd..ef1334bd 100644
--- a/ext/fg/js/popup.js
+++ b/ext/fg/js/popup.js
@@ -262,7 +262,7 @@ class Popup {
         const scale = this._contentScale;
         const scaleRatio = this._containerSizeContentScale === null ? 1.0 : scale / this._containerSizeContentScale;
         this._containerSizeContentScale = scale;
-        const [x, y, width, height, below] = getPosition(
+        let [x, y, width, height, below] = getPosition(
             elementRect,
             Math.max(containerRect.width * scaleRatio, optionsGeneral.popupWidth * scale),
             Math.max(containerRect.height * scaleRatio, optionsGeneral.popupHeight * scale),
@@ -272,8 +272,16 @@ class Popup {
             writingMode
         );
 
-        container.classList.toggle('yomichan-float-full-width', optionsGeneral.popupDisplayMode === 'full-width');
+        const fullWidth = (optionsGeneral.popupDisplayMode === 'full-width');
+        container.classList.toggle('yomichan-float-full-width', fullWidth);
         container.classList.toggle('yomichan-float-above', !below);
+
+        if (optionsGeneral.popupDisplayMode === 'full-width') {
+            x = viewport.left;
+            y = below ? viewport.bottom - height : viewport.top;
+            width = viewport.right - viewport.left;
+        }
+
         container.style.left = `${x}px`;
         container.style.top = `${y}px`;
         container.style.width = `${width}px`;
-- 
cgit v1.2.3


From 8e15c2031142c4d52088c6b159c90fcec03c46ef Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Sat, 11 Jan 2020 15:50:55 -0500
Subject: Remove window.onscroll handler since it causes a warning

---
 ext/fg/js/frontend.js | 5 -----
 1 file changed, 5 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js
index e1021ce8..2286bf19 100644
--- a/ext/fg/js/frontend.js
+++ b/ext/fg/js/frontend.js
@@ -46,7 +46,6 @@ class Frontend extends TextScanner {
             const {zoomFactor} = await apiGetZoom();
             this._pageZoomFactor = zoomFactor;
 
-            window.addEventListener('scroll', this.onScroll.bind(this), false);
             window.addEventListener('resize', this.onResize.bind(this), false);
 
             const visualViewport = window.visualViewport;
@@ -70,10 +69,6 @@ class Frontend extends TextScanner {
         this._updatePopupPosition();
     }
 
-    onScroll() {
-        this._updatePopupPosition();
-    }
-
     onWindowMessage(e) {
         const action = e.data;
         const handler = Frontend._windowMessageHandlers.get(action);
-- 
cgit v1.2.3


From 04727a8cd7dc29a02595690389979ec1070bbded Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Sat, 18 Jan 2020 13:13:12 -0500
Subject: Fix viewport issues when popupScaleRelativeToVisualViewport is
 disabled

---
 ext/fg/js/popup.js | 24 +++++++++++++++++-------
 1 file changed, 17 insertions(+), 7 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js
index ef1334bd..e7dae93e 100644
--- a/ext/fg/js/popup.js
+++ b/ext/fg/js/popup.js
@@ -502,16 +502,26 @@ class Popup {
     }
 
     static _getViewport(useVisualViewport) {
-        if (useVisualViewport) {
-            const visualViewport = window.visualViewport;
-            if (visualViewport !== null && typeof visualViewport === 'object') {
-                const left = visualViewport.offsetLeft;
-                const top = visualViewport.offsetTop;
+        const visualViewport = window.visualViewport;
+        if (visualViewport !== null && typeof visualViewport === 'object') {
+            const left = visualViewport.offsetLeft;
+            const top = visualViewport.offsetTop;
+            const width = visualViewport.width;
+            const height = visualViewport.height;
+            if (useVisualViewport) {
                 return {
                     left,
                     top,
-                    right: left + visualViewport.width,
-                    bottom: top + visualViewport.height
+                    right: left + width,
+                    bottom: top + height
+                };
+            } else {
+                const scale = visualViewport.scale;
+                return {
+                    left: 0,
+                    top: 0,
+                    right: Math.max(left + width, width * scale),
+                    bottom: Math.max(top + height, height * scale)
                 };
             }
         }
-- 
cgit v1.2.3


From 1f3ff6fad012f28e8c21f9b5573ead6daf405afe Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Sat, 25 Jan 2020 11:18:18 -0500
Subject: Fix equals function on TextSourceRange when imposter elements are
 used

---
 ext/bg/js/settings/popup-preview-frame.js |  2 +-
 ext/fg/js/document.js                     |  5 ++++-
 ext/fg/js/source.js                       | 19 ++++++++++++++++---
 3 files changed, 21 insertions(+), 5 deletions(-)

(limited to 'ext/fg/js')

diff --git a/ext/bg/js/settings/popup-preview-frame.js b/ext/bg/js/settings/popup-preview-frame.js
index 54f246e3..37a4b416 100644
--- a/ext/bg/js/settings/popup-preview-frame.js
+++ b/ext/bg/js/settings/popup-preview-frame.js
@@ -148,7 +148,7 @@ class SettingsPopupPreview {
 
         const range = document.createRange();
         range.selectNode(textNode);
-        const source = new TextSourceRange(range, range.toString(), null);
+        const source = new TextSourceRange(range, range.toString(), null, null);
 
         try {
             await this.frontend.onSearchSource(source, 'script');
diff --git a/ext/fg/js/document.js b/ext/fg/js/document.js
index db9f0cdc..71654b29 100644
--- a/ext/fg/js/document.js
+++ b/ext/fg/js/document.js
@@ -110,6 +110,7 @@ function docRangeFromPoint(x, y, deepDomScan) {
     const elements = docElementsFromPoint(x, y, deepDomScan);
     let imposter = null;
     let imposterContainer = null;
+    let imposterSourceElement = null;
     if (elements.length > 0) {
         const element = elements[0];
         switch (element.nodeName.toUpperCase()) {
@@ -117,9 +118,11 @@ function docRangeFromPoint(x, y, deepDomScan) {
             case 'BUTTON':
                 return new TextSourceElement(element);
             case 'INPUT':
+                imposterSourceElement = element;
                 [imposter, imposterContainer] = docImposterCreate(element, false);
                 break;
             case 'TEXTAREA':
+                imposterSourceElement = element;
                 [imposter, imposterContainer] = docImposterCreate(element, true);
                 break;
         }
@@ -131,7 +134,7 @@ function docRangeFromPoint(x, y, deepDomScan) {
             docSetImposterStyle(imposterContainer.style, 'z-index', '-2147483646');
             docSetImposterStyle(imposter.style, 'pointer-events', 'none');
         }
-        return new TextSourceRange(range, '', imposterContainer);
+        return new TextSourceRange(range, '', imposterContainer, imposterSourceElement);
     } else {
         if (imposterContainer !== null) {
             imposterContainer.parentNode.removeChild(imposterContainer);
diff --git a/ext/fg/js/source.js b/ext/fg/js/source.js
index 5cdf47b5..11d3ff0e 100644
--- a/ext/fg/js/source.js
+++ b/ext/fg/js/source.js
@@ -25,14 +25,16 @@ const IGNORE_TEXT_PATTERN = /\u200c/;
  */
 
 class TextSourceRange {
-    constructor(range, content, imposterContainer) {
+    constructor(range, content, imposterContainer, imposterSourceElement) {
         this.range = range;
+        this.rangeStartOffset = range.startOffset;
         this.content = content;
         this.imposterContainer = imposterContainer;
+        this.imposterSourceElement = imposterSourceElement;
     }
 
     clone() {
-        return new TextSourceRange(this.range.cloneRange(), this.content, this.imposterContainer);
+        return new TextSourceRange(this.range.cloneRange(), this.content, this.imposterContainer, this.imposterSourceElement);
     }
 
     cleanup() {
@@ -55,6 +57,7 @@ class TextSourceRange {
     setStartOffset(length) {
         const state = TextSourceRange.seekBackward(this.range.startContainer, this.range.startOffset, length);
         this.range.setStart(state.node, state.offset);
+        this.rangeStartOffset = this.range.startOffset;
         this.content = state.content;
         return length - state.remainder;
     }
@@ -79,7 +82,17 @@ class TextSourceRange {
     }
 
     equals(other) {
-        return other && other.range && other.range.compareBoundaryPoints(Range.START_TO_START, this.range) === 0;
+        if (other === null) {
+            return false;
+        }
+        if (this.imposterSourceElement !== null) {
+            return (
+                this.imposterSourceElement === other.imposterSourceElement &&
+                this.rangeStartOffset === other.rangeStartOffset
+            );
+        } else {
+            return this.range.compareBoundaryPoints(Range.START_TO_START, other.range) === 0;
+        }
     }
 
     static shouldEnter(node) {
-- 
cgit v1.2.3