From 1dc35dd6f13828a8d2a134de754ce54d33db4a86 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sat, 22 Aug 2020 14:33:41 -0400 Subject: [PATCH] Popup factory proxy creation (#745) * Change getOrCreatePopup to async * Rename parentFrameId to frameId, expose frameId property * Update how proxy popups are created --- ext/fg/js/frontend.js | 28 ++++++++++-------- ext/fg/js/popup-factory.js | 60 +++++++++++++++++++++++--------------- ext/fg/js/popup-proxy.js | 16 +++++----- ext/fg/js/popup.js | 4 +++ 4 files changed, 64 insertions(+), 44 deletions(-) diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js index e7fb7f47..9e3b902f 100644 --- a/ext/fg/js/frontend.js +++ b/ext/fg/js/frontend.js @@ -17,8 +17,6 @@ /* global * DocumentUtil - * FrameOffsetForwarder - * PopupProxy * TextScanner * TextSourceElement * api @@ -58,7 +56,6 @@ class Frontend { this._isSearchPage = isSearchPage; this._depth = depth; this._frameId = frameId; - this._frameOffsetForwarder = new FrameOffsetForwarder(frameId); this._popupFactory = popupFactory; this._allowRootFramePopupProxy = allowRootFramePopupProxy; this._popupCache = new Map(); @@ -83,8 +80,6 @@ class Frontend { } async prepare() { - this._frameOffsetForwarder.prepare(); - await this.updateOptions(); try { const {zoomFactor} = await api.getZoom(); @@ -333,13 +328,20 @@ class Frontend { return null; } - return this._popupFactory.getOrCreatePopup({depth: this._depth, ownerFrameId: this._frameId}); + return await this._popupFactory.getOrCreatePopup({ + frameId: this._frameId, + ownerFrameId: this._frameId, + depth: this._depth + }); } async _getProxyPopup() { - const popup = new PopupProxy(null, this._depth, this._parentPopupId, this._parentFrameId, this._frameId); - await popup.prepare(); - return popup; + return await this._popupFactory.getOrCreatePopup({ + frameId: this._parentFrameId, + ownerFrameId: this._frameId, + depth: this._depth, + parentPopupId: this._parentPopupId + }); } async _getIframeProxyPopup() { @@ -351,13 +353,15 @@ class Frontend { return null; } - const popup = new PopupProxy(popupId, 0, null, targetFrameId, this._frameId, this._frameOffsetForwarder); + const popup = await this._popupFactory.getOrCreatePopup({ + frameId: targetFrameId, + ownerFrameId: this._frameId, + id: popupId + }); popup.on('offsetNotFound', () => { this._allowRootFramePopupProxy = false; this._updatePopup(); }); - await popup.prepare(); - return popup; } diff --git a/ext/fg/js/popup-factory.js b/ext/fg/js/popup-factory.js index 7d6f9846..ab450b26 100644 --- a/ext/fg/js/popup-factory.js +++ b/ext/fg/js/popup-factory.js @@ -16,21 +16,25 @@ */ /* global + * FrameOffsetForwarder * Popup + * PopupProxy * api */ class PopupFactory { constructor(frameId) { - this._popups = new Map(); this._frameId = frameId; + this._frameOffsetForwarder = new FrameOffsetForwarder(frameId); + this._popups = new Map(); } // Public functions prepare() { + this._frameOffsetForwarder.prepare(); api.crossFrame.registerHandlers([ - ['getOrCreatePopup', {async: false, handler: this._onApiGetOrCreatePopup.bind(this)}], + ['getOrCreatePopup', {async: true, handler: this._onApiGetOrCreatePopup.bind(this)}], ['setOptionsContext', {async: true, handler: this._onApiSetOptionsContext.bind(this)}], ['hide', {async: false, handler: this._onApiHide.bind(this)}], ['isVisible', {async: true, handler: this._onApiIsVisibleAsync.bind(this)}], @@ -46,7 +50,7 @@ class PopupFactory { ]); } - getOrCreatePopup({id=null, parentId=null, ownerFrameId=null, depth=null}) { + async getOrCreatePopup({frameId=null, ownerFrameId=null, id=null, parentPopupId=null, depth=null}) { // Find by existing id if (id !== null) { const popup = this._popups.get(id); @@ -57,8 +61,8 @@ class PopupFactory { // Find by existing parent id let parent = null; - if (parentId !== null) { - parent = this._popups.get(parentId); + if (parentPopupId !== null) { + parent = this._popups.get(parentPopupId); if (typeof parent !== 'undefined') { const popup = parent.child; if (popup !== null) { @@ -69,12 +73,7 @@ class PopupFactory { } } - // New unique id - if (id === null) { - id = yomichan.generateId(16); - } - - // Create new popup + // Depth if (parent !== null) { if (depth !== null) { throw new Error('Depth cannot be set when parent exists'); @@ -83,25 +82,40 @@ class PopupFactory { } else if (depth === null) { depth = 0; } - const popup = new Popup(id, depth, this._frameId, ownerFrameId); - if (parent !== null) { - if (parent.child !== null) { - throw new Error('Parent popup already has a child'); + + if (frameId === this._frameId) { + // New unique id + if (id === null) { + id = yomichan.generateId(16); } - popup.parent = parent; - parent.child = popup; + const popup = new Popup(id, depth, frameId, ownerFrameId); + if (parent !== null) { + if (parent.child !== null) { + throw new Error('Parent popup already has a child'); + } + popup.parent = parent; + parent.child = popup; + } + this._popups.set(id, popup); + popup.prepare(); + return popup; + } else { + const useFrameOffsetForwarder = (parentPopupId === null); + ({id, depth, frameId} = await api.crossFrame.invoke(frameId, 'getOrCreatePopup', {id, parentPopupId, frameId, ownerFrameId})); + const popup = new PopupProxy(id, depth, frameId, ownerFrameId, useFrameOffsetForwarder ? this._frameOffsetForwarder : null); + this._popups.set(id, popup); + return popup; } - this._popups.set(id, popup); - popup.prepare(); - return popup; } // API message handlers - _onApiGetOrCreatePopup({id, parentId, ownerFrameId}) { - const popup = this.getOrCreatePopup({id, parentId, ownerFrameId}); + async _onApiGetOrCreatePopup({id, parentPopupId, frameId, ownerFrameId}) { + const popup = await this.getOrCreatePopup({id, parentPopupId, frameId, ownerFrameId}); return { - id: popup.id + id: popup.id, + depth: popup.depth, + frameId: popup.frameId }; } diff --git a/ext/fg/js/popup-proxy.js b/ext/fg/js/popup-proxy.js index 28f6b276..f1b3ab21 100644 --- a/ext/fg/js/popup-proxy.js +++ b/ext/fg/js/popup-proxy.js @@ -20,12 +20,11 @@ */ class PopupProxy extends EventDispatcher { - constructor(id, depth, parentPopupId, parentFrameId, ownerFrameId, frameOffsetForwarder=null) { + constructor(id, depth, frameId, ownerFrameId, frameOffsetForwarder=null) { super(); this._id = id; this._depth = depth; - this._parentPopupId = parentPopupId; - this._parentFrameId = parentFrameId; + this._frameId = frameId; this._ownerFrameId = ownerFrameId; this._frameOffsetForwarder = frameOffsetForwarder; @@ -69,13 +68,12 @@ class PopupProxy extends EventDispatcher { return null; } - // Public functions - - async prepare() { - const {id} = await this._invoke('getOrCreatePopup', {id: this._id, parentId: this._parentPopupId, ownerFrameId: this._ownerFrameId}); - this._id = id; + get frameId() { + return this._frameId; } + // Public functions + setOptionsContext(optionsContext, source) { return this._invokeSafe('setOptionsContext', {id: this._id, optionsContext, source}); } @@ -148,7 +146,7 @@ class PopupProxy extends EventDispatcher { // Private _invoke(action, params={}) { - return api.crossFrame.invoke(this._parentFrameId, action, params); + return api.crossFrame.invoke(this._frameId, action, params); } async _invokeSafe(action, params={}, defaultReturnValue) { diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js index bdffd424..5a0166bf 100644 --- a/ext/fg/js/popup.js +++ b/ext/fg/js/popup.js @@ -88,6 +88,10 @@ class Popup { return this._container; } + get frameId() { + return this._frameId; + } + // Public functions prepare() {