From b5d32c73e657c882ba6f70b79d4a5e214684f563 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sun, 16 Feb 2020 12:23:20 -0500 Subject: [PATCH] Simplify process to wait for iframe prepare completion --- ext/fg/js/float.js | 6 +++--- ext/fg/js/frontend.js | 3 +-- ext/fg/js/popup-proxy-host.js | 8 +------- ext/fg/js/popup-proxy.js | 5 ----- ext/fg/js/popup.js | 30 +++++++++++++++++++++++------- 5 files changed, 28 insertions(+), 24 deletions(-) diff --git a/ext/fg/js/float.js b/ext/fg/js/float.js index 46d1314e..35a78d48 100644 --- a/ext/fg/js/float.js +++ b/ext/fg/js/float.js @@ -34,7 +34,7 @@ class DisplayFloat extends Display { window.addEventListener('message', (e) => this.onMessage(e), false); } - async prepare(options, popupInfo, url, childrenSupported, scale) { + async prepare(options, popupInfo, url, childrenSupported, scale, uniqueId) { await super.prepare(options); const {id, depth, parentFrameId} = popupInfo; @@ -47,7 +47,7 @@ class DisplayFloat extends Display { this.setContentScale(scale); - apiForward('popupSetDisplayInitialized'); + apiForward('popupPrepareCompleted', {uniqueId}); } onError(error) { @@ -125,7 +125,7 @@ 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, scale}) => self.prepare(options, popupInfo, url, childrenSupported, scale)], + ['prepare', (self, {options, popupInfo, url, childrenSupported, scale, uniqueId}) => self.prepare(options, popupInfo, url, childrenSupported, scale, uniqueId)], ['setContentScale', (self, {scale}) => self.setContentScale(scale)] ]); diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js index c3050514..67045241 100644 --- a/ext/fg/js/frontend.js +++ b/ext/fg/js/frontend.js @@ -244,6 +244,5 @@ Frontend._windowMessageHandlers = new Map([ ]); Frontend._runtimeMessageHandlers = new Map([ - ['popupSetVisibleOverride', (self, {visible}) => { self.popup.setVisibleOverride(visible); }], - ['popupSetDisplayInitialized', (self) => { self.popup.setDisplayInitialized(); }] + ['popupSetVisibleOverride', (self, {visible}) => { self.popup.setVisibleOverride(visible); }] ]); diff --git a/ext/fg/js/popup-proxy-host.js b/ext/fg/js/popup-proxy-host.js index f6a3d451..98729796 100644 --- a/ext/fg/js/popup-proxy-host.js +++ b/ext/fg/js/popup-proxy-host.js @@ -43,8 +43,7 @@ class PopupProxyHost { ['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)], - ['setContentScale', ({id, scale}) => this._onApiSetContentScale(id, scale)], - ['setDisplayInitialized', ({id}) => this._onApiSetDisplayInitialized(id)] + ['setContentScale', ({id, scale}) => this._onApiSetContentScale(id, scale)] ])); } @@ -105,11 +104,6 @@ class PopupProxyHost { return popup.setContentScale(scale); } - async _onApiSetDisplayInitialized(id) { - const popup = this._getPopup(id); - return popup.setDisplayInitialized(); - } - // Private functions _createPopupInternal(parentId, depth) { diff --git a/ext/fg/js/popup-proxy.js b/ext/fg/js/popup-proxy.js index 6f3c0f1c..db6dffb1 100644 --- a/ext/fg/js/popup-proxy.js +++ b/ext/fg/js/popup-proxy.js @@ -103,11 +103,6 @@ class PopupProxy { this._invokeHostApi('setContentScale', {id, scale}); } - async setDisplayInitialized() { - const id = await this._getPopupId(); - this._invokeHostApi('setDisplayInitialized', {id}); - } - // Private _getPopupId() { diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js index 55f3e0aa..5f6a777b 100644 --- a/ext/fg/js/popup.js +++ b/ext/fg/js/popup.js @@ -123,10 +123,6 @@ class Popup { this._invokeApi('setContentScale', {scale}); } - setDisplayInitialized() { - throw new Error('Override me'); - } - // Popup-only public functions setParent(parent) { @@ -223,7 +219,10 @@ class Popup { return new Promise((resolve) => { const parentFrameId = (typeof this._frameId === 'number' ? this._frameId : null); this._container.addEventListener('load', () => { - this._invokeApi('initialize', { + const uniqueId = yomichan.generateId(32); + Popup._listenForDisplayPrepareCompleted(uniqueId, resolve); + + this._invokeApi('prepare', { options: this._options, popupInfo: { id: this._id, @@ -232,9 +231,9 @@ class Popup { }, url: this.url, childrenSupported: this._childrenSupported, - scale: this._contentScale + scale: this._contentScale, + uniqueId }); - this.setDisplayInitialized = resolve; }); this._observeFullscreen(); this._onFullscreenChanged(); @@ -357,6 +356,23 @@ class Popup { } } + static _listenForDisplayPrepareCompleted(uniqueId, resolve) { + const runtimeMessageCallback = ({action, params}, sender, callback) => { + if ( + action === 'popupPrepareCompleted' && + typeof params === 'object' && + params !== null && + params.uniqueId === uniqueId + ) { + chrome.runtime.onMessage.removeListener(runtimeMessageCallback); + callback(); + resolve(); + return false; + } + }; + chrome.runtime.onMessage.addListener(runtimeMessageCallback); + } + static _getPositionForHorizontalText(elementRect, width, height, viewport, offsetScale, optionsGeneral) { const preferBelow = (optionsGeneral.popupHorizontalTextPosition === 'below'); const horizontalOffset = optionsGeneral.popupHorizontalOffset * offsetScale;