1 files changed, 65 insertions, 11 deletions

diff --git a/ext/fg/js/float.js b/ext/fg/js/float.js
index 845bf7f6..d7beb675 100644
--- a/ext/fg/js/float.js
+++ b/ext/fg/js/float.js
@@ -17,9 +17,10 @@
 
 /* global
  * Display
- * apiBroadcastTab
- * apiSendMessageToFrame
- * popupNestedInitialize
+ * Frontend
+ * PopupFactory
+ * api
+ * dynamicLoader
  */
 
 class DisplayFloat extends Display {
@@ -31,7 +32,7 @@ class DisplayFloat extends Display {
         this._token = null;
 
         this._orphaned = false;
-        this._initializedNestedPopups = false;
+        this._nestedPopupsPrepared = false;
 
         this._onKeyDownHandlers = new Map([
             ['C', (e) => {
@@ -61,7 +62,7 @@ class DisplayFloat extends Display {
         yomichan.on('orphaned', this.onOrphaned.bind(this));
         window.addEventListener('message', this.onMessage.bind(this), false);
 
-        apiBroadcastTab('popupPrepared', {secret: this._secret});
+        api.broadcastTab('popupPrepared', {secret: this._secret});
     }
 
     onError(error) {
@@ -153,7 +154,7 @@ class DisplayFloat extends Display {
                 },
                 2000
             );
-            apiBroadcastTab('requestDocumentInformationBroadcast', {uniqueId});
+            api.broadcastTab('requestDocumentInformationBroadcast', {uniqueId});
 
             const {title} = await promise;
             return title;
@@ -176,7 +177,7 @@ class DisplayFloat extends Display {
         const {token, frameId} = params;
         this._token = token;
 
-        apiSendMessageToFrame(frameId, 'popupInitialized', {secret, token});
+        api.sendMessageToFrame(frameId, 'popupInitialized', {secret, token});
     }
 
     async _configure({messageId, frameId, popupId, optionsContext, childrenSupported, scale}) {
@@ -184,15 +185,15 @@ class DisplayFloat extends Display {
 
         await this.updateOptions();
 
-        if (childrenSupported && !this._initializedNestedPopups) {
+        if (childrenSupported && !this._nestedPopupsPrepared) {
             const {depth, url} = optionsContext;
-            popupNestedInitialize(popupId, depth, frameId, url);
-            this._initializedNestedPopups = true;
+            this._prepareNestedPopups(popupId, depth, frameId, url);
+            this._nestedPopupsPrepared = true;
         }
 
         this.setContentScale(scale);
 
-        apiSendMessageToFrame(frameId, 'popupConfigured', {messageId});
+        api.sendMessageToFrame(frameId, 'popupConfigured', {messageId});
     }
 
     _isMessageAuthenticated(message) {
@@ -202,4 +203,57 @@ class DisplayFloat extends Display {
             this._secret === message.secret
         );
     }
+
+    async _prepareNestedPopups(id, depth, parentFrameId, url) {
+        let complete = false;
+
+        const onOptionsUpdated = async () => {
+            const optionsContext = this.optionsContext;
+            const options = await api.optionsGet(optionsContext);
+            const maxPopupDepthExceeded = !(typeof depth === 'number' && depth < options.scanning.popupNestingMaxDepth);
+            if (maxPopupDepthExceeded || complete) { return; }
+
+            complete = true;
+            yomichan.off('optionsUpdated', onOptionsUpdated);
+
+            try {
+                await this._setupNestedPopups(id, depth, parentFrameId, url);
+            } catch (e) {
+                yomichan.logError(e);
+            }
+        };
+
+        yomichan.on('optionsUpdated', onOptionsUpdated);
+
+        await onOptionsUpdated();
+    }
+
+    async _setupNestedPopups(id, depth, parentFrameId, url) {
+        await dynamicLoader.loadScripts([
+            '/mixed/js/text-scanner.js',
+            '/fg/js/popup.js',
+            '/fg/js/popup-proxy.js',
+            '/fg/js/popup-factory.js',
+            '/fg/js/frame-offset-forwarder.js',
+            '/fg/js/frontend.js'
+        ]);
+
+        const {frameId} = await api.frameInformationGet();
+
+        const popupFactory = new PopupFactory(frameId);
+        popupFactory.prepare();
+
+        const frontend = new Frontend(
+            frameId,
+            popupFactory,
+            {
+                id,
+                depth,
+                parentFrameId,
+                url,
+                proxy: true
+            }
+        );
+        await frontend.prepare();
+    }
 }