From 194615ef21557236cd2b9ea390b4164a4d5338c5 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sat, 12 Oct 2019 14:34:45 -0400 Subject: Make popups store options --- ext/fg/js/popup-proxy-host.js | 6 ++++++ 1 file changed, 6 insertions(+) (limited to 'ext/fg/js/popup-proxy-host.js') diff --git a/ext/fg/js/popup-proxy-host.js b/ext/fg/js/popup-proxy-host.js index f933639c..5edee8dd 100644 --- a/ext/fg/js/popup-proxy-host.js +++ b/ext/fg/js/popup-proxy-host.js @@ -38,6 +38,7 @@ class PopupProxyHost { this.apiReceiver = new FrontendApiReceiver(`popup-proxy-host#${frameId}`, { createNestedPopup: ({parentId}) => this.createNestedPopup(parentId), + setOptions: ({id, options}) => this.setOptions(id, options), show: ({id, elementRect, options}) => this.show(id, elementRect, options), showOrphaned: ({id, elementRect, options}) => this.show(id, elementRect, options), hide: ({id, changeFocus}) => this.hide(id, changeFocus), @@ -86,6 +87,11 @@ class PopupProxyHost { return new DOMRect(x, y, jsonRect.width, jsonRect.height); } + async setOptions(id, options) { + const popup = this.getPopup(id); + return await popup.setOptions(options); + } + async show(id, elementRect, options) { const popup = this.getPopup(id); elementRect = this.jsonRectToDOMRect(popup, elementRect); -- cgit v1.2.3 From 8a1637f6b31719969473f1b393d46721a2398f11 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sat, 12 Oct 2019 14:38:16 -0400 Subject: Remove .show popup proxy API since it's not used --- ext/fg/js/popup-proxy-host.js | 9 +-------- ext/fg/js/popup-proxy.js | 6 ------ 2 files changed, 1 insertion(+), 14 deletions(-) (limited to 'ext/fg/js/popup-proxy-host.js') diff --git a/ext/fg/js/popup-proxy-host.js b/ext/fg/js/popup-proxy-host.js index 5edee8dd..c3acec7f 100644 --- a/ext/fg/js/popup-proxy-host.js +++ b/ext/fg/js/popup-proxy-host.js @@ -39,8 +39,7 @@ class PopupProxyHost { this.apiReceiver = new FrontendApiReceiver(`popup-proxy-host#${frameId}`, { createNestedPopup: ({parentId}) => this.createNestedPopup(parentId), setOptions: ({id, options}) => this.setOptions(id, options), - show: ({id, elementRect, options}) => this.show(id, elementRect, options), - showOrphaned: ({id, elementRect, options}) => this.show(id, elementRect, options), + showOrphaned: ({id, elementRect, options}) => this.showOrphaned(id, elementRect, options), hide: ({id, changeFocus}) => this.hide(id, changeFocus), setVisibleOverride: ({id, visible}) => this.setVisibleOverride(id, visible), containsPoint: ({id, x, y}) => this.containsPoint(id, x, y), @@ -92,12 +91,6 @@ class PopupProxyHost { return await popup.setOptions(options); } - async show(id, elementRect, options) { - const popup = this.getPopup(id); - elementRect = this.jsonRectToDOMRect(popup, elementRect); - return await popup.show(elementRect, options); - } - async showOrphaned(id, elementRect, options) { const popup = this.getPopup(id); elementRect = this.jsonRectToDOMRect(popup, elementRect); diff --git a/ext/fg/js/popup-proxy.js b/ext/fg/js/popup-proxy.js index 22b95785..96fc8890 100644 --- a/ext/fg/js/popup-proxy.js +++ b/ext/fg/js/popup-proxy.js @@ -51,12 +51,6 @@ class PopupProxy { return await this.invokeHostApi('setOptions', {id, options}); } - async show(elementRect, options) { - const id = await this.getPopupId(); - elementRect = PopupProxy.DOMRectToJson(elementRect); - return await this.invokeHostApi('show', {id, elementRect, options}); - } - async showOrphaned(elementRect, options) { const id = await this.getPopupId(); elementRect = PopupProxy.DOMRectToJson(elementRect); -- cgit v1.2.3 From 6da76835524fbf6b95902f06822d77c54ccf735b Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sat, 12 Oct 2019 14:55:18 -0400 Subject: Don't pass options around for calls to termsShow, kanjiShow, etc. --- ext/bg/js/search.js | 6 +++++- ext/fg/js/float.js | 4 ++-- ext/fg/js/frontend.js | 5 +---- ext/fg/js/popup-proxy-host.js | 18 +++++++++--------- ext/fg/js/popup-proxy.js | 12 ++++++------ ext/fg/js/popup.js | 30 +++++++++++++++--------------- ext/mixed/js/display.js | 18 ++++++++++-------- 7 files changed, 48 insertions(+), 45 deletions(-) (limited to 'ext/fg/js/popup-proxy-host.js') diff --git a/ext/bg/js/search.js b/ext/bg/js/search.js index 7a8fdf5e..80519f4a 100644 --- a/ext/bg/js/search.js +++ b/ext/bg/js/search.js @@ -103,7 +103,11 @@ class DisplaySearch extends Display { this.updateSearchButton(); if (valid) { const {definitions} = await apiTermsFind(query, this.optionsContext); - this.termsShow(definitions, this.options); + this.termsShow(definitions, { + focus: false, + sentence: null, + url: window.location.href + }); } else { this.container.textContent = ''; } diff --git a/ext/fg/js/float.js b/ext/fg/js/float.js index d9b483d7..4a571466 100644 --- a/ext/fg/js/float.js +++ b/ext/fg/js/float.js @@ -143,8 +143,8 @@ DisplayFloat.onKeyDownHandlers = { }; DisplayFloat.messageHandlers = { - termsShow: (self, {definitions, options, context}) => self.termsShow(definitions, options, context), - kanjiShow: (self, {definitions, options, context}) => self.kanjiShow(definitions, options, context), + termsShow: (self, {definitions, context}) => self.termsShow(definitions, context), + kanjiShow: (self, {definitions, context}) => self.kanjiShow(definitions, context), clearAutoPlayTimer: (self) => self.clearAutoPlayTimer(), orphaned: (self) => self.onOrphaned(), initialize: (self, {options, popupInfo, url, childrenSupported}) => self.initialize(options, popupInfo, url, childrenSupported) diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js index f67441af..52a23889 100644 --- a/ext/fg/js/frontend.js +++ b/ext/fg/js/frontend.js @@ -333,8 +333,7 @@ class Frontend { if (textSource && this.options.scanning.modifier !== 'none') { this.popup.showOrphaned( textSource.getRect(), - textSource.getWritingMode(), - this.options + textSource.getWritingMode() ); } } else { @@ -374,7 +373,6 @@ class Frontend { textSource.getRect(), textSource.getWritingMode(), definitions, - this.options, {sentence, url, focus} ); @@ -405,7 +403,6 @@ class Frontend { textSource.getRect(), textSource.getWritingMode(), definitions, - this.options, {sentence, url, focus} ); diff --git a/ext/fg/js/popup-proxy-host.js b/ext/fg/js/popup-proxy-host.js index c3acec7f..74a5153a 100644 --- a/ext/fg/js/popup-proxy-host.js +++ b/ext/fg/js/popup-proxy-host.js @@ -39,12 +39,12 @@ class PopupProxyHost { this.apiReceiver = new FrontendApiReceiver(`popup-proxy-host#${frameId}`, { createNestedPopup: ({parentId}) => this.createNestedPopup(parentId), setOptions: ({id, options}) => this.setOptions(id, options), - showOrphaned: ({id, elementRect, options}) => this.showOrphaned(id, elementRect, options), + showOrphaned: ({id, elementRect}) => this.showOrphaned(id, elementRect), hide: ({id, changeFocus}) => this.hide(id, changeFocus), setVisibleOverride: ({id, visible}) => this.setVisibleOverride(id, visible), containsPoint: ({id, x, y}) => this.containsPoint(id, x, y), - termsShow: ({id, elementRect, writingMode, definitions, options, context}) => this.termsShow(id, elementRect, writingMode, definitions, options, context), - kanjiShow: ({id, elementRect, writingMode, definitions, options, context}) => this.kanjiShow(id, elementRect, writingMode, definitions, options, context), + termsShow: ({id, elementRect, writingMode, definitions, context}) => this.termsShow(id, elementRect, writingMode, definitions, context), + kanjiShow: ({id, elementRect, writingMode, definitions, context}) => this.kanjiShow(id, elementRect, writingMode, definitions, context), clearAutoPlayTimer: ({id}) => this.clearAutoPlayTimer(id) }); } @@ -91,10 +91,10 @@ class PopupProxyHost { return await popup.setOptions(options); } - async showOrphaned(id, elementRect, options) { + async showOrphaned(id, elementRect) { const popup = this.getPopup(id); elementRect = this.jsonRectToDOMRect(popup, elementRect); - return await popup.showOrphaned(elementRect, options); + return await popup.showOrphaned(elementRect); } async hide(id, changeFocus) { @@ -112,18 +112,18 @@ class PopupProxyHost { return await popup.containsPoint(x, y); } - async termsShow(id, elementRect, writingMode, definitions, options, context) { + async termsShow(id, elementRect, writingMode, definitions, context) { const popup = this.getPopup(id); elementRect = this.jsonRectToDOMRect(popup, elementRect); if (!PopupProxyHost.popupCanShow(popup)) { return false; } - return await popup.termsShow(elementRect, writingMode, definitions, options, context); + return await popup.termsShow(elementRect, writingMode, definitions, context); } - async kanjiShow(id, elementRect, writingMode, definitions, options, context) { + async kanjiShow(id, elementRect, writingMode, definitions, context) { const popup = this.getPopup(id); elementRect = this.jsonRectToDOMRect(popup, elementRect); if (!PopupProxyHost.popupCanShow(popup)) { return false; } - return await popup.kanjiShow(elementRect, writingMode, definitions, options, context); + return await popup.kanjiShow(elementRect, writingMode, definitions, context); } async clearAutoPlayTimer(id) { diff --git a/ext/fg/js/popup-proxy.js b/ext/fg/js/popup-proxy.js index 96fc8890..e8d6bc98 100644 --- a/ext/fg/js/popup-proxy.js +++ b/ext/fg/js/popup-proxy.js @@ -51,10 +51,10 @@ class PopupProxy { return await this.invokeHostApi('setOptions', {id, options}); } - async showOrphaned(elementRect, options) { + async showOrphaned(elementRect) { const id = await this.getPopupId(); elementRect = PopupProxy.DOMRectToJson(elementRect); - return await this.invokeHostApi('showOrphaned', {id, elementRect, options}); + return await this.invokeHostApi('showOrphaned', {id, elementRect}); } async hide(changeFocus) { @@ -76,16 +76,16 @@ class PopupProxy { return await this.invokeHostApi('containsPoint', {id: this.id, x, y}); } - async termsShow(elementRect, writingMode, definitions, options, context) { + async termsShow(elementRect, writingMode, definitions, context) { const id = await this.getPopupId(); elementRect = PopupProxy.DOMRectToJson(elementRect); - return await this.invokeHostApi('termsShow', {id, elementRect, writingMode, definitions, options, context}); + return await this.invokeHostApi('termsShow', {id, elementRect, writingMode, definitions, context}); } - async kanjiShow(elementRect, writingMode, definitions, options, context) { + async kanjiShow(elementRect, writingMode, definitions, context) { const id = await this.getPopupId(); elementRect = PopupProxy.DOMRectToJson(elementRect); - return await this.invokeHostApi('kanjiShow', {id, elementRect, writingMode, definitions, options, context}); + return await this.invokeHostApi('kanjiShow', {id, elementRect, writingMode, definitions, context}); } async clearAutoPlayTimer() { diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js index a9fde7b6..f36bb436 100644 --- a/ext/fg/js/popup.js +++ b/ext/fg/js/popup.js @@ -41,14 +41,14 @@ class Popup { this.updateVisibility(); } - inject(options) { + inject() { if (this.injectPromise === null) { - this.injectPromise = this.createInjectPromise(options); + this.injectPromise = this.createInjectPromise(); } return this.injectPromise; } - async createInjectPromise(options) { + async createInjectPromise() { try { const {frameId} = await this.frameIdPromise; if (typeof frameId === 'number') { @@ -62,7 +62,7 @@ class Popup { const parentFrameId = (typeof this.frameId === 'number' ? this.frameId : null); this.container.addEventListener('load', () => { this.invokeApi('initialize', { - options: options, + options: this.options, popupInfo: { id: this.id, depth: this.depth, @@ -87,10 +87,10 @@ class Popup { this.options = options; } - async show(elementRect, writingMode, options) { - await this.inject(options); + async show(elementRect, writingMode) { + await this.inject(); - const optionsGeneral = options.general; + const optionsGeneral = this.options.general; const container = this.container; const containerRect = container.getBoundingClientRect(); const getPosition = ( @@ -215,9 +215,9 @@ class Popup { return [position, size, after]; } - async showOrphaned(elementRect, writingMode, options) { + async showOrphaned(elementRect, writingMode) { if (!this.isInitialized()) { return; } - await this.show(elementRect, writingMode, options); + await this.show(elementRect, writingMode); this.invokeApi('orphaned'); } @@ -279,16 +279,16 @@ class Popup { return false; } - async termsShow(elementRect, writingMode, definitions, options, context) { + async termsShow(elementRect, writingMode, definitions, context) { if (!this.isInitialized()) { return; } - await this.show(elementRect, writingMode, options); - this.invokeApi('termsShow', {definitions, options, context}); + await this.show(elementRect, writingMode); + this.invokeApi('termsShow', {definitions, context}); } - async kanjiShow(elementRect, writingMode, definitions, options, context) { + async kanjiShow(elementRect, writingMode, definitions, context) { if (!this.isInitialized()) { return; } - await this.show(elementRect, writingMode, options); - this.invokeApi('kanjiShow', {definitions, options, context}); + await this.show(elementRect, writingMode); + this.invokeApi('kanjiShow', {definitions, context}); } clearAutoPlayTimer() { diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js index d5d055e0..b3ddae72 100644 --- a/ext/mixed/js/display.js +++ b/ext/mixed/js/display.js @@ -76,7 +76,7 @@ class Display { } const kanjiDefs = await apiKanjiFind(link.textContent, this.getOptionsContext()); - this.kanjiShow(kanjiDefs, this.options, context); + this.kanjiShow(kanjiDefs, context); } catch (e) { this.onError(e); } @@ -125,7 +125,7 @@ class Display { context.source.source = this.context.source; } - this.termsShow(definitions, this.options, context); + this.termsShow(definitions, context); } catch (e) { this.onError(e); } @@ -239,10 +239,12 @@ class Display { }); } - async termsShow(definitions, options, context) { + async termsShow(definitions, context) { if (!this.isInitialized()) { return; } try { + const options = this.options; + this.setEventListenersActive(false); if (!context || context.focus !== false) { @@ -250,7 +252,6 @@ class Display { } this.definitions = definitions; - this.options = options; this.context = context; const sequence = ++this.sequence; @@ -280,7 +281,7 @@ class Display { const {index, scroll} = context || {}; this.entryScrollIntoView(index || 0, scroll); - if (this.options.audio.enabled && this.options.audio.autoPlay) { + if (options.audio.enabled && options.audio.autoPlay) { this.autoPlayAudio(); } @@ -292,10 +293,12 @@ class Display { } } - async kanjiShow(definitions, options, context) { + async kanjiShow(definitions, context) { if (!this.isInitialized()) { return; } try { + const options = this.options; + this.setEventListenersActive(false); if (!context || context.focus !== false) { @@ -303,7 +306,6 @@ class Display { } this.definitions = definitions; - this.options = options; this.context = context; const sequence = ++this.sequence; @@ -415,7 +417,7 @@ class Display { source: this.context.source.source }; - this.termsShow(this.context.source.definitions, this.options, context); + this.termsShow(this.context.source.definitions, context); } } -- cgit v1.2.3 From 883226b0451350a0c01841e6c9a192bbb76dd8b6 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sat, 12 Oct 2019 17:12:34 -0400 Subject: Update how custom CSS is applied --- ext/bg/js/search.js | 4 ++++ ext/fg/js/float.js | 21 +-------------------- ext/fg/js/popup-proxy-host.js | 6 ++++++ ext/fg/js/popup-proxy.js | 5 +++++ ext/fg/js/popup.js | 4 ++++ ext/mixed/js/display.js | 16 ++++++++++++++++ 6 files changed, 36 insertions(+), 20 deletions(-) (limited to 'ext/fg/js/popup-proxy-host.js') diff --git a/ext/bg/js/search.js b/ext/bg/js/search.js index 1d780d70..68afe47e 100644 --- a/ext/bg/js/search.js +++ b/ext/bg/js/search.js @@ -118,6 +118,10 @@ class DisplaySearch extends Display { return this.optionsContext; } + setCustomCss() { + // No custom CSS + } + setIntroVisible(visible, animate) { if (this.introVisible === visible) { return; diff --git a/ext/fg/js/float.js b/ext/fg/js/float.js index 5164cd8f..4b3cd848 100644 --- a/ext/fg/js/float.js +++ b/ext/fg/js/float.js @@ -21,7 +21,6 @@ class DisplayFloat extends Display { constructor() { super(document.querySelector('#spinner'), document.querySelector('#definitions')); this.autoPlayAudioTimer = null; - this.styleNode = null; this.optionsContext = { depth: 0, @@ -101,11 +100,6 @@ class DisplayFloat extends Display { async initialize(options, popupInfo, url, childrenSupported) { await super.initialize(options); - const css = options.general.customPopupCss; - if (css) { - this.setStyle(css); - } - const {id, depth, parentFrameId} = popupInfo; this.optionsContext.depth = depth; this.optionsContext.url = url; @@ -114,20 +108,6 @@ class DisplayFloat extends Display { popupNestedInitialize(id, depth, parentFrameId, url); } } - - setStyle(css) { - const parent = document.head; - - if (this.styleNode === null) { - this.styleNode = document.createElement('style'); - } - - this.styleNode.textContent = css; - - if (this.styleNode.parentNode !== parent) { - parent.appendChild(this.styleNode); - } - } } DisplayFloat.onKeyDownHandlers = { @@ -145,6 +125,7 @@ DisplayFloat.messageHandlers = { kanjiShow: (self, {definitions, context}) => self.kanjiShow(definitions, context), clearAutoPlayTimer: (self) => self.clearAutoPlayTimer(), orphaned: (self) => self.onOrphaned(), + setCustomCss: (self, {css}) => self.setCustomCss(css), initialize: (self, {options, popupInfo, url, childrenSupported}) => self.initialize(options, popupInfo, url, childrenSupported) }; diff --git a/ext/fg/js/popup-proxy-host.js b/ext/fg/js/popup-proxy-host.js index 74a5153a..bb323f64 100644 --- a/ext/fg/js/popup-proxy-host.js +++ b/ext/fg/js/popup-proxy-host.js @@ -45,6 +45,7 @@ class PopupProxyHost { containsPoint: ({id, x, y}) => this.containsPoint(id, x, y), termsShow: ({id, elementRect, writingMode, definitions, context}) => this.termsShow(id, elementRect, writingMode, definitions, context), kanjiShow: ({id, elementRect, writingMode, definitions, context}) => this.kanjiShow(id, elementRect, writingMode, definitions, context), + setCustomCss: ({id, css}) => this.setCustomCss(id, css), clearAutoPlayTimer: ({id}) => this.clearAutoPlayTimer(id) }); } @@ -126,6 +127,11 @@ class PopupProxyHost { return await popup.kanjiShow(elementRect, writingMode, definitions, context); } + async setCustomCss(id, css) { + const popup = this.getPopup(id); + return popup.setCustomCss(css); + } + async clearAutoPlayTimer(id) { const popup = this.getPopup(id); return popup.clearAutoPlayTimer(); diff --git a/ext/fg/js/popup-proxy.js b/ext/fg/js/popup-proxy.js index e8d6bc98..6ea94b6a 100644 --- a/ext/fg/js/popup-proxy.js +++ b/ext/fg/js/popup-proxy.js @@ -88,6 +88,11 @@ class PopupProxy { return await this.invokeHostApi('kanjiShow', {id, elementRect, writingMode, definitions, context}); } + async setCustomCss(css) { + const id = await this.getPopupId(); + return await this.invokeHostApi('setCustomCss', {id, css}); + } + async clearAutoPlayTimer() { if (this.id === null) { return; diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js index 3556a52e..5ca8643f 100644 --- a/ext/fg/js/popup.js +++ b/ext/fg/js/popup.js @@ -292,6 +292,10 @@ class Popup { this.invokeApi('kanjiShow', {definitions, context}); } + async setCustomCss(css) { + this.invokeApi('setCustomCss', {css}); + } + clearAutoPlayTimer() { if (this.isInjected) { this.invokeApi('clearAutoPlayTimer'); diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js index 2bf917aa..51a3dc22 100644 --- a/ext/mixed/js/display.js +++ b/ext/mixed/js/display.js @@ -29,6 +29,7 @@ class Display { this.audioPlaying = null; this.audioFallback = null; this.audioCache = {}; + this.styleNode = null; this.eventListeners = []; this.persistentEventListeners = []; @@ -195,6 +196,7 @@ class Display { async updateOptions(options) { this.options = options ? options : await apiOptionsGet(this.getOptionsContext()); this.updateTheme(this.options.general.popupTheme); + this.setCustomCss(this.options.general.customPopupCss); } updateTheme(themeName) { @@ -207,6 +209,20 @@ class Display { } } + setCustomCss(css) { + if (this.styleNode === null) { + if (css.length === 0) { return; } + this.styleNode = document.createElement('style'); + } + + this.styleNode.textContent = css; + + const parent = document.head; + if (this.styleNode.parentNode !== parent) { + parent.appendChild(this.styleNode); + } + } + setInteractive(interactive) { interactive = !!interactive; if (this.interactive === interactive) { return; } -- cgit v1.2.3 From 16521fec935845828b7e08baf1668657bb5a7cef Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Tue, 15 Oct 2019 20:23:25 -0400 Subject: Assign first popup on the search page as a depth of 1 --- ext/bg/js/search-frontend.js | 2 ++ ext/fg/js/frontend.js | 7 +++---- ext/fg/js/popup-nested.js | 2 +- ext/fg/js/popup-proxy-host.js | 8 +++++--- 4 files changed, 11 insertions(+), 8 deletions(-) (limited to 'ext/fg/js/popup-proxy-host.js') diff --git a/ext/bg/js/search-frontend.js b/ext/bg/js/search-frontend.js index f55f06e6..b21dac17 100644 --- a/ext/bg/js/search-frontend.js +++ b/ext/bg/js/search-frontend.js @@ -25,6 +25,8 @@ async function searchFrontendSetup() { const options = await apiOptionsGet(optionsContext); if (!options.scanning.enableOnSearchPage) { return; } + window.frontendInitializationData = {depth: 1, proxy: false}; + const scriptSrcs = [ '/fg/js/frontend-api-receiver.js', '/fg/js/popup.js', diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js index 3ddeae78..7ea737d7 100644 --- a/ext/fg/js/frontend.js +++ b/ext/fg/js/frontend.js @@ -49,11 +49,10 @@ class Frontend { } static create() { - const initializationData = window.frontendInitializationData; - const isNested = (initializationData !== null && typeof initializationData === 'object'); - const {id, depth, parentFrameId, ignoreNodes, url} = isNested ? initializationData : {}; + const data = window.frontendInitializationData || {}; + const {id, depth=0, parentFrameId, ignoreNodes, url, proxy=false} = data; - const popup = isNested ? new PopupProxy(depth + 1, id, parentFrameId, url) : PopupProxyHost.instance.createPopup(null); + const popup = proxy ? new PopupProxy(depth + 1, id, parentFrameId, url) : PopupProxyHost.instance.createPopup(null, depth); const frontend = new Frontend(popup, ignoreNodes); frontend.prepare(); return frontend; diff --git a/ext/fg/js/popup-nested.js b/ext/fg/js/popup-nested.js index f7309466..cec95aea 100644 --- a/ext/fg/js/popup-nested.js +++ b/ext/fg/js/popup-nested.js @@ -35,7 +35,7 @@ async function popupNestedInitialize(id, depth, parentFrameId, url) { const ignoreNodes = options.scanning.enableOnPopupExpressions ? [] : [ '.expression', '.expression *' ]; - window.frontendInitializationData = {id, depth, parentFrameId, ignoreNodes, url}; + window.frontendInitializationData = {id, depth, parentFrameId, ignoreNodes, url, proxy: true}; const scriptSrcs = [ '/fg/js/frontend-api-sender.js', diff --git a/ext/fg/js/popup-proxy-host.js b/ext/fg/js/popup-proxy-host.js index bb323f64..f97d44ac 100644 --- a/ext/fg/js/popup-proxy-host.js +++ b/ext/fg/js/popup-proxy-host.js @@ -50,10 +50,12 @@ class PopupProxyHost { }); } - createPopup(parentId) { + createPopup(parentId, depth) { const parent = (typeof parentId === 'string' && this.popups.hasOwnProperty(parentId) ? this.popups[parentId] : null); - const depth = (parent !== null ? parent.depth + 1 : 0); const id = `${this.nextId}`; + if (parent !== null) { + depth = parent.depth + 1; + } ++this.nextId; const popup = new Popup(id, depth, this.frameIdPromise); if (parent !== null) { @@ -65,7 +67,7 @@ class PopupProxyHost { } async createNestedPopup(parentId) { - return this.createPopup(parentId).id; + return this.createPopup(parentId, 0).id; } getPopup(id) { -- cgit v1.2.3 From 598cd32946c8e10e5aa3fcec26e3fc40af44bddf Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Wed, 16 Oct 2019 21:36:10 -0400 Subject: Update *show* APIs to unified showContent and setContent --- ext/bg/js/search.js | 2 +- ext/bg/js/settings-popup-preview.js | 3 +-- ext/fg/js/float.js | 19 ++----------------- ext/fg/js/frontend.js | 17 +++++++++-------- ext/fg/js/popup-proxy-host.js | 23 ++++------------------ ext/fg/js/popup-proxy.js | 16 ++-------------- ext/fg/js/popup.js | 25 +++++++----------------- ext/mixed/js/display.js | 38 +++++++++++++++++++++++++++++++------ 8 files changed, 58 insertions(+), 85 deletions(-) (limited to 'ext/fg/js/popup-proxy-host.js') diff --git a/ext/bg/js/search.js b/ext/bg/js/search.js index 68afe47e..a5a815cf 100644 --- a/ext/bg/js/search.js +++ b/ext/bg/js/search.js @@ -101,7 +101,7 @@ class DisplaySearch extends Display { this.updateSearchButton(); if (valid) { const {definitions} = await apiTermsFind(query, this.optionsContext); - this.termsShow(definitions, { + this.setContentTerms(definitions, { focus: false, sentence: null, url: window.location.href diff --git a/ext/bg/js/settings-popup-preview.js b/ext/bg/js/settings-popup-preview.js index 7ccdc7f3..b12fb726 100644 --- a/ext/bg/js/settings-popup-preview.js +++ b/ext/bg/js/settings-popup-preview.js @@ -100,8 +100,7 @@ class SettingsPopupPreview { const elementRect = textSource.getRect(); const writingMode = textSource.getWritingMode(); - const options = this.frontend.options; - this.frontend.popup.show(elementRect, writingMode, options); + this.frontend.popup.showContent(elementRect, writingMode); } onMessage(e) { diff --git a/ext/fg/js/float.js b/ext/fg/js/float.js index 4b3cd848..089c9422 100644 --- a/ext/fg/js/float.js +++ b/ext/fg/js/float.js @@ -32,25 +32,12 @@ class DisplayFloat extends Display { onError(error) { if (window.yomichan_orphaned) { - this.onOrphaned(); + this.setContentOrphaned(); } else { logError(error, true); } } - onOrphaned() { - const definitions = document.querySelector('#definitions'); - const errorOrphaned = document.querySelector('#error-orphaned'); - - if (definitions !== null) { - definitions.style.setProperty('display', 'none', 'important'); - } - - if (errorOrphaned !== null) { - errorOrphaned.style.setProperty('display', 'block', 'important'); - } - } - onSearchClear() { window.parent.postMessage('popupClose', '*'); } @@ -121,10 +108,8 @@ DisplayFloat.onKeyDownHandlers = { }; DisplayFloat.messageHandlers = { - termsShow: (self, {definitions, context}) => self.termsShow(definitions, context), - kanjiShow: (self, {definitions, context}) => self.kanjiShow(definitions, context), + setContent: (self, {type, details}) => self.setContent(type, details), clearAutoPlayTimer: (self) => self.clearAutoPlayTimer(), - orphaned: (self) => self.onOrphaned(), setCustomCss: (self, {css}) => self.setCustomCss(css), initialize: (self, {options, popupInfo, url, childrenSupported}) => self.initialize(options, popupInfo, url, childrenSupported) }; diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js index 7ea737d7..eddbf9cc 100644 --- a/ext/fg/js/frontend.js +++ b/ext/fg/js/frontend.js @@ -332,9 +332,10 @@ class Frontend { } catch (e) { if (window.yomichan_orphaned) { if (textSource && this.options.scanning.modifier !== 'none') { - this.lastShowPromise = this.popup.showOrphaned( + this.lastShowPromise = this.popup.showContent( textSource.getRect(), - textSource.getWritingMode() + textSource.getWritingMode(), + 'orphaned' ); } } else { @@ -370,11 +371,11 @@ class Frontend { const sentence = docSentenceExtract(textSource, this.options.anki.sentenceExt); const url = window.location.href; - this.lastShowPromise = this.popup.termsShow( + this.lastShowPromise = this.popup.showContent( textSource.getRect(), textSource.getWritingMode(), - definitions, - {sentence, url, focus} + 'terms', + {definitions, context: {sentence, url, focus}} ); this.textSourceLast = textSource; @@ -400,11 +401,11 @@ class Frontend { const sentence = docSentenceExtract(textSource, this.options.anki.sentenceExt); const url = window.location.href; - this.lastShowPromise = this.popup.kanjiShow( + this.lastShowPromise = this.popup.showContent( textSource.getRect(), textSource.getWritingMode(), - definitions, - {sentence, url, focus} + 'kanji', + {definitions, context: {sentence, url, focus}} ); this.textSourceLast = textSource; diff --git a/ext/fg/js/popup-proxy-host.js b/ext/fg/js/popup-proxy-host.js index f97d44ac..dcdce604 100644 --- a/ext/fg/js/popup-proxy-host.js +++ b/ext/fg/js/popup-proxy-host.js @@ -39,12 +39,10 @@ class PopupProxyHost { this.apiReceiver = new FrontendApiReceiver(`popup-proxy-host#${frameId}`, { createNestedPopup: ({parentId}) => this.createNestedPopup(parentId), setOptions: ({id, options}) => this.setOptions(id, options), - showOrphaned: ({id, elementRect}) => this.showOrphaned(id, elementRect), hide: ({id, changeFocus}) => this.hide(id, changeFocus), setVisibleOverride: ({id, visible}) => this.setVisibleOverride(id, visible), containsPoint: ({id, x, y}) => this.containsPoint(id, x, y), - termsShow: ({id, elementRect, writingMode, definitions, context}) => this.termsShow(id, elementRect, writingMode, definitions, context), - kanjiShow: ({id, elementRect, writingMode, definitions, context}) => this.kanjiShow(id, elementRect, writingMode, definitions, context), + showContent: ({id, elementRect, writingMode, type, details}) => this.showContent(id, elementRect, writingMode, type, details), setCustomCss: ({id, css}) => this.setCustomCss(id, css), clearAutoPlayTimer: ({id}) => this.clearAutoPlayTimer(id) }); @@ -94,12 +92,6 @@ class PopupProxyHost { return await popup.setOptions(options); } - async showOrphaned(id, elementRect) { - const popup = this.getPopup(id); - elementRect = this.jsonRectToDOMRect(popup, elementRect); - return await popup.showOrphaned(elementRect); - } - async hide(id, changeFocus) { const popup = this.getPopup(id); return popup.hide(changeFocus); @@ -115,18 +107,11 @@ class PopupProxyHost { return await popup.containsPoint(x, y); } - async termsShow(id, elementRect, writingMode, definitions, context) { - const popup = this.getPopup(id); - elementRect = this.jsonRectToDOMRect(popup, elementRect); - if (!PopupProxyHost.popupCanShow(popup)) { return false; } - return await popup.termsShow(elementRect, writingMode, definitions, context); - } - - async kanjiShow(id, elementRect, writingMode, definitions, context) { + async showContent(id, elementRect, writingMode, type, details) { const popup = this.getPopup(id); elementRect = this.jsonRectToDOMRect(popup, elementRect); - if (!PopupProxyHost.popupCanShow(popup)) { return false; } - return await popup.kanjiShow(elementRect, writingMode, definitions, context); + if (!PopupProxyHost.popupCanShow(popup)) { return Promise.resolve(false); } + return await popup.showContent(elementRect, writingMode, type, details); } async setCustomCss(id, css) { diff --git a/ext/fg/js/popup-proxy.js b/ext/fg/js/popup-proxy.js index 6ea94b6a..53b68872 100644 --- a/ext/fg/js/popup-proxy.js +++ b/ext/fg/js/popup-proxy.js @@ -51,12 +51,6 @@ class PopupProxy { return await this.invokeHostApi('setOptions', {id, options}); } - async showOrphaned(elementRect) { - const id = await this.getPopupId(); - elementRect = PopupProxy.DOMRectToJson(elementRect); - return await this.invokeHostApi('showOrphaned', {id, elementRect}); - } - async hide(changeFocus) { if (this.id === null) { return; @@ -76,16 +70,10 @@ class PopupProxy { return await this.invokeHostApi('containsPoint', {id: this.id, x, y}); } - async termsShow(elementRect, writingMode, definitions, context) { - const id = await this.getPopupId(); - elementRect = PopupProxy.DOMRectToJson(elementRect); - return await this.invokeHostApi('termsShow', {id, elementRect, writingMode, definitions, context}); - } - - async kanjiShow(elementRect, writingMode, definitions, context) { + async showContent(elementRect, writingMode, type=null, details=null) { const id = await this.getPopupId(); elementRect = PopupProxy.DOMRectToJson(elementRect); - return await this.invokeHostApi('kanjiShow', {id, elementRect, writingMode, definitions, context}); + return await this.invokeHostApi('showContent', {id, elementRect, writingMode, type, details}); } async setCustomCss(css) { diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js index 2a9670fc..6c24c0ce 100644 --- a/ext/fg/js/popup.js +++ b/ext/fg/js/popup.js @@ -90,6 +90,13 @@ class Popup { this.updateTheme(); } + async showContent(elementRect, writingMode, type=null, details=null) { + if (!this.isInitialized()) { return; } + await this.show(elementRect, writingMode); + if (type === null) { return; } + this.invokeApi('setContent', {type, details}); + } + async show(elementRect, writingMode) { await this.inject(); @@ -218,12 +225,6 @@ class Popup { return [position, size, after]; } - async showOrphaned(elementRect, writingMode) { - if (!this.isInitialized()) { return; } - await this.show(elementRect, writingMode); - this.invokeApi('orphaned'); - } - hide(changeFocus) { if (!this.isVisible()) { return; @@ -320,18 +321,6 @@ class Popup { return false; } - async termsShow(elementRect, writingMode, definitions, context) { - if (!this.isInitialized()) { return; } - await this.show(elementRect, writingMode); - this.invokeApi('termsShow', {definitions, context}); - } - - async kanjiShow(elementRect, writingMode, definitions, context) { - if (!this.isInitialized()) { return; } - await this.show(elementRect, writingMode); - this.invokeApi('kanjiShow', {definitions, context}); - } - async setCustomCss(css) { this.invokeApi('setCustomCss', {css}); } diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js index e0994f8a..bab82015 100644 --- a/ext/mixed/js/display.js +++ b/ext/mixed/js/display.js @@ -74,8 +74,8 @@ class Display { context.source.source = this.context.source; } - const kanjiDefs = await apiKanjiFind(link.textContent, this.getOptionsContext()); - this.kanjiShow(kanjiDefs, context); + const definitions = await apiKanjiFind(link.textContent, this.getOptionsContext()); + this.setContentKanji(definitions, context); } catch (e) { this.onError(e); } @@ -122,7 +122,7 @@ class Display { context.source.source = this.context.source; } - this.termsShow(definitions, context); + this.setContentTerms(definitions, context); } catch (e) { this.onError(e); } @@ -263,7 +263,20 @@ class Display { }); } - async termsShow(definitions, context) { + setContent(type, details) { + switch (type) { + case 'terms': + return this.setContentTerms(details.definitions, details.context); + case 'kanji': + return this.setContentKanji(details.definitions, details.context); + case 'orphaned': + return this.setContentOrphaned(); + default: + return Promise.resolve(); + } + } + + async setContentTerms(definitions, context) { if (!this.isInitialized()) { return; } try { @@ -317,7 +330,7 @@ class Display { } } - async kanjiShow(definitions, context) { + async setContentKanji(definitions, context) { if (!this.isInitialized()) { return; } try { @@ -363,6 +376,19 @@ class Display { } } + async setContentOrphaned() { + const definitions = document.querySelector('#definitions'); + const errorOrphaned = document.querySelector('#error-orphaned'); + + if (definitions !== null) { + definitions.style.setProperty('display', 'none', 'important'); + } + + if (errorOrphaned !== null) { + errorOrphaned.style.setProperty('display', 'block', 'important'); + } + } + autoPlayAudio() { this.audioPlay(this.definitions[0], this.firstExpressionIndex, 0); } @@ -441,7 +467,7 @@ class Display { source: this.context.source.source }; - this.termsShow(this.context.source.definitions, context); + this.setContentTerms(this.context.source.definitions, context); } } -- cgit v1.2.3 From 8f918c63dcf82bfcdba47100194b34e4be2dd531 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Thu, 17 Oct 2019 18:39:12 -0400 Subject: Reposition popup on window resize rather than clear the search Fixes #107 --- ext/fg/js/frontend.js | 10 ++++++++-- ext/fg/js/popup-proxy-host.js | 8 +++++++- ext/fg/js/popup-proxy.js | 5 +++++ ext/fg/js/popup.js | 4 ++++ 4 files changed, 24 insertions(+), 3 deletions(-) (limited to 'ext/fg/js/popup-proxy-host.js') diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js index eddbf9cc..45d24329 100644 --- a/ext/fg/js/frontend.js +++ b/ext/fg/js/frontend.js @@ -139,8 +139,14 @@ class Frontend { } } - onResize() { - this.searchClear(false); + async onResize() { + if (this.textSourceLast !== null && await this.popup.isVisibleAsync()) { + const textSource = this.textSourceLast; + this.lastShowPromise = this.popup.showContent( + textSource.getRect(), + textSource.getWritingMode() + ); + } } onClick(e) { diff --git a/ext/fg/js/popup-proxy-host.js b/ext/fg/js/popup-proxy-host.js index dcdce604..d8dec4df 100644 --- a/ext/fg/js/popup-proxy-host.js +++ b/ext/fg/js/popup-proxy-host.js @@ -40,6 +40,7 @@ class PopupProxyHost { createNestedPopup: ({parentId}) => this.createNestedPopup(parentId), setOptions: ({id, options}) => this.setOptions(id, options), hide: ({id, changeFocus}) => this.hide(id, changeFocus), + isVisibleAsync: ({id}) => this.isVisibleAsync(id), setVisibleOverride: ({id, visible}) => this.setVisibleOverride(id, visible), containsPoint: ({id, x, y}) => this.containsPoint(id, x, y), showContent: ({id, elementRect, writingMode, type, details}) => this.showContent(id, elementRect, writingMode, type, details), @@ -97,9 +98,14 @@ class PopupProxyHost { return popup.hide(changeFocus); } + async isVisibleAsync(id) { + const popup = this.getPopup(id); + return await popup.isVisibleAsync(); + } + async setVisibleOverride(id, visible) { const popup = this.getPopup(id); - return popup.setVisibleOverride(visible); + return await popup.setVisibleOverride(visible); } async containsPoint(id, x, y) { diff --git a/ext/fg/js/popup-proxy.js b/ext/fg/js/popup-proxy.js index 53b68872..e62a4868 100644 --- a/ext/fg/js/popup-proxy.js +++ b/ext/fg/js/popup-proxy.js @@ -58,6 +58,11 @@ class PopupProxy { return await this.invokeHostApi('hide', {id: this.id, changeFocus}); } + async isVisibleAsync() { + const id = await this.getPopupId(); + return await this.invokeHostApi('isVisibleAsync', {id}); + } + async setVisibleOverride(visible) { const id = await this.getPopupId(); return await this.invokeHostApi('setVisibleOverride', {id, visible}); diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js index 6c24c0ce..b5eb9fe2 100644 --- a/ext/fg/js/popup.js +++ b/ext/fg/js/popup.js @@ -239,6 +239,10 @@ class Popup { } } + async isVisibleAsync() { + return this.isVisible(); + } + isVisible() { return this.isInjected && (this.visibleOverride !== null ? this.visibleOverride : this.visible); } -- cgit v1.2.3