1 files changed, 13 insertions, 11 deletions

diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js
index bbf39c4e..f644ee98 100644
--- a/ext/fg/js/popup.js
+++ b/ext/fg/js/popup.js
@@ -34,8 +34,7 @@ class Popup extends EventDispatcher {
         this._childrenSupported = true;
         this._injectPromise = null;
         this._injectPromiseComplete = false;
-        this._visible = false;
-        this._visibleOverride = null;
+        this._visible = new DynamicProperty(false);
         this._options = null;
         this._optionsContext = null;
         this._contentScale = 1.0;
@@ -96,11 +95,12 @@ class Popup extends EventDispatcher {
     // Public functions
 
     prepare() {
-        this._updateVisibility();
         this._frame.addEventListener('mousedown', (e) => e.stopPropagation());
         this._frame.addEventListener('scroll', (e) => e.stopPropagation());
         this._frame.addEventListener('load', this._onFrameLoad.bind(this));
+        this._visible.on('change', this._onVisibleChange.bind(this));
         yomichan.on('extensionUnloaded', this._onExtensionUnloaded.bind(this));
+        this._onVisibleChange({value: this.isVisibleSync()});
     }
 
     async setOptionsContext(optionsContext, source) {
@@ -131,9 +131,12 @@ class Popup extends EventDispatcher {
         return this.isVisibleSync();
     }
 
-    setVisibleOverride(visible) {
-        this._visibleOverride = visible;
-        this._updateVisibility();
+    async setVisibleOverride(value, priority) {
+        return this._visible.setOverride(value, priority);
+    }
+
+    async clearVisibleOverride(token) {
+        return this._visible.clearOverride(token);
     }
 
     async containsPoint(x, y) {
@@ -177,7 +180,7 @@ class Popup extends EventDispatcher {
     }
 
     isVisibleSync() {
-        return (this._visibleOverride !== null ? this._visibleOverride : this._visible);
+        return this._visible.value;
     }
 
     updateTheme() {
@@ -392,12 +395,11 @@ class Popup extends EventDispatcher {
     }
 
     _setVisible(visible) {
-        this._visible = visible;
-        this._updateVisibility();
+        this._visible.defaultValue = visible;
     }
 
-    _updateVisibility() {
-        this._frame.style.setProperty('visibility', this.isVisibleSync() ? 'visible' : 'hidden', 'important');
+    _onVisibleChange({value}) {
+        this._frame.style.setProperty('visibility', value ? 'visible' : 'hidden', 'important');
     }
 
     _focusParent() {