Update Popup and DisplayFloat optionsContext from Frontend (#464)

* set optionsContext from Frontend

* update Popup+Display options on Frontend change

* remove popup setOptions

* only update DisplayFloat options from Frontend

* fix optionsContext usage

* fix preview frame arguments

* keep Frontend URL up to date

* cache url

* fix preview frame

* trigger modifyingProfileChange in correct places

* remove async from function not using await

* refactor optionsContext in Frontend

1 files changed, 13 insertions, 10 deletions

diff --git a/ext/fg/js/float.js b/ext/fg/js/float.js
index 18d15a72..2a5eba83 100644
--- a/ext/fg/js/float.js
+++ b/ext/fg/js/float.js
@@ -29,11 +29,6 @@ class DisplayFloat extends Display {
 
         this._popupId = null;
 
-        this.optionsContext = {
-            depth: 0,
-            url: window.location.href
-        };
-
         this._orphaned = false;
         this._prepareInvoked = false;
         this._messageToken = null;
@@ -51,10 +46,11 @@ class DisplayFloat extends Display {
         ]);
 
         this._windowMessageHandlers = new Map([
+            ['setOptionsContext', ({optionsContext}) => this.setOptionsContext(optionsContext)],
             ['setContent', ({type, details}) => this.setContent(type, details)],
             ['clearAutoPlayTimer', () => this.clearAutoPlayTimer()],
             ['setCustomCss', ({css}) => this.setCustomCss(css)],
-            ['prepare', ({popupInfo, url, childrenSupported, scale}) => this.prepare(popupInfo, url, childrenSupported, scale)],
+            ['prepare', ({popupInfo, optionsContext, childrenSupported, scale}) => this.prepare(popupInfo, optionsContext, childrenSupported, scale)],
             ['setContentScale', ({scale}) => this.setContentScale(scale)]
         ]);
 
@@ -62,18 +58,20 @@ class DisplayFloat extends Display {
         window.addEventListener('message', this.onMessage.bind(this), false);
     }
 
-    async prepare(popupInfo, url, childrenSupported, scale) {
+    async prepare(popupInfo, optionsContext, childrenSupported, scale) {
         if (this._prepareInvoked) { return; }
         this._prepareInvoked = true;
 
-        const {id, depth, parentFrameId} = popupInfo;
+        const {id, parentFrameId} = popupInfo;
         this._popupId = id;
-        this.optionsContext.depth = depth;
-        this.optionsContext.url = url;
+
+        this.optionsContext = optionsContext;
 
         await super.prepare();
+        await this.updateOptions();
 
         if (childrenSupported) {
+            const {depth, url} = optionsContext;
             popupNestedInitialize(id, depth, parentFrameId, url);
         }
 
@@ -158,6 +156,11 @@ class DisplayFloat extends Display {
         }
     }
 
+    async setOptionsContext(optionsContext) {
+        this.optionsContext = optionsContext;
+        await this.updateOptions();
+    }
+
     setContentScale(scale) {
         document.body.style.fontSize = `${scale}em`;
     }