Mark private members
This commit is contained in:
parent
7c68490d2e
commit
801df8000f
@ -19,33 +19,45 @@
|
|||||||
|
|
||||||
class Popup {
|
class Popup {
|
||||||
constructor(id, depth, frameIdPromise) {
|
constructor(id, depth, frameIdPromise) {
|
||||||
this.id = id;
|
this._id = id;
|
||||||
this.depth = depth;
|
this._depth = depth;
|
||||||
this.frameIdPromise = frameIdPromise;
|
this._frameIdPromise = frameIdPromise;
|
||||||
this.frameId = null;
|
this._frameId = null;
|
||||||
this.parent = null;
|
this._parent = null;
|
||||||
this.child = null;
|
this._child = null;
|
||||||
this.childrenSupported = true;
|
this._childrenSupported = true;
|
||||||
this.injectPromise = null;
|
this._injectPromise = null;
|
||||||
this.isInjected = false;
|
this._isInjected = false;
|
||||||
this.visible = false;
|
this._visible = false;
|
||||||
this.visibleOverride = null;
|
this._visibleOverride = null;
|
||||||
this.options = null;
|
this._options = null;
|
||||||
this.stylesheetInjectedViaApi = false;
|
this._stylesheetInjectedViaApi = false;
|
||||||
|
|
||||||
this.container = document.createElement('iframe');
|
this._container = document.createElement('iframe');
|
||||||
this.container.className = 'yomichan-float';
|
this._container.className = 'yomichan-float';
|
||||||
this.container.addEventListener('mousedown', (e) => e.stopPropagation());
|
this._container.addEventListener('mousedown', (e) => e.stopPropagation());
|
||||||
this.container.addEventListener('scroll', (e) => e.stopPropagation());
|
this._container.addEventListener('scroll', (e) => e.stopPropagation());
|
||||||
this.container.setAttribute('src', chrome.runtime.getURL('/fg/float.html'));
|
this._container.setAttribute('src', chrome.runtime.getURL('/fg/float.html'));
|
||||||
this.container.style.width = '0px';
|
this._container.style.width = '0px';
|
||||||
this.container.style.height = '0px';
|
this._container.style.height = '0px';
|
||||||
|
|
||||||
this._updateVisibility();
|
this._updateVisibility();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Public properties
|
// Public properties
|
||||||
|
|
||||||
|
get parent() {
|
||||||
|
return this._parent;
|
||||||
|
}
|
||||||
|
|
||||||
|
get child() {
|
||||||
|
return this._child;
|
||||||
|
}
|
||||||
|
|
||||||
|
get depth() {
|
||||||
|
return this._depth;
|
||||||
|
}
|
||||||
|
|
||||||
get url() {
|
get url() {
|
||||||
return window.location.href;
|
return window.location.href;
|
||||||
}
|
}
|
||||||
@ -57,7 +69,7 @@ class Popup {
|
|||||||
}
|
}
|
||||||
|
|
||||||
async setOptions(options) {
|
async setOptions(options) {
|
||||||
this.options = options;
|
this._options = options;
|
||||||
this.updateTheme();
|
this.updateTheme();
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -67,8 +79,8 @@ class Popup {
|
|||||||
}
|
}
|
||||||
|
|
||||||
this._setVisible(false);
|
this._setVisible(false);
|
||||||
if (this.child !== null) {
|
if (this._child !== null) {
|
||||||
this.child.hide(false);
|
this._child.hide(false);
|
||||||
}
|
}
|
||||||
if (changeFocus) {
|
if (changeFocus) {
|
||||||
this._focusParent();
|
this._focusParent();
|
||||||
@ -80,13 +92,13 @@ class Popup {
|
|||||||
}
|
}
|
||||||
|
|
||||||
setVisibleOverride(visible) {
|
setVisibleOverride(visible) {
|
||||||
this.visibleOverride = visible;
|
this._visibleOverride = visible;
|
||||||
this._updateVisibility();
|
this._updateVisibility();
|
||||||
}
|
}
|
||||||
|
|
||||||
async containsPoint(x, y) {
|
async containsPoint(x, y) {
|
||||||
for (let popup = this; popup !== null && popup.isVisible(); popup = popup.child) {
|
for (let popup = this; popup !== null && popup.isVisible(); popup = popup._child) {
|
||||||
const rect = popup.container.getBoundingClientRect();
|
const rect = popup._container.getBoundingClientRect();
|
||||||
if (x >= rect.left && y >= rect.top && x < rect.right && y < rect.bottom) {
|
if (x >= rect.left && y >= rect.top && x < rect.right && y < rect.bottom) {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
@ -106,7 +118,7 @@ class Popup {
|
|||||||
}
|
}
|
||||||
|
|
||||||
clearAutoPlayTimer() {
|
clearAutoPlayTimer() {
|
||||||
if (this.isInjected) {
|
if (this._isInjected) {
|
||||||
this._invokeApi('clearAutoPlayTimer');
|
this._invokeApi('clearAutoPlayTimer');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -117,28 +129,28 @@ class Popup {
|
|||||||
if (parent === null) {
|
if (parent === null) {
|
||||||
throw new Error('Cannot set popup parent to null');
|
throw new Error('Cannot set popup parent to null');
|
||||||
}
|
}
|
||||||
if (this.parent !== null) {
|
if (this._parent !== null) {
|
||||||
throw new Error('Popup already has a parent');
|
throw new Error('Popup already has a parent');
|
||||||
}
|
}
|
||||||
if (parent.child !== null) {
|
if (parent._child !== null) {
|
||||||
throw new Error('Cannot parent popup to another popup which already has a child');
|
throw new Error('Cannot parent popup to another popup which already has a child');
|
||||||
}
|
}
|
||||||
this.parent = parent;
|
this._parent = parent;
|
||||||
parent.child = this;
|
parent._child = this;
|
||||||
}
|
}
|
||||||
|
|
||||||
isVisible() {
|
isVisible() {
|
||||||
return this.isInjected && (this.visibleOverride !== null ? this.visibleOverride : this.visible);
|
return this._isInjected && (this._visibleOverride !== null ? this._visibleOverride : this._visible);
|
||||||
}
|
}
|
||||||
|
|
||||||
updateTheme() {
|
updateTheme() {
|
||||||
this.container.dataset.yomichanTheme = this.options.general.popupOuterTheme;
|
this._container.dataset.yomichanTheme = this._options.general.popupOuterTheme;
|
||||||
this.container.dataset.yomichanSiteColor = this._getSiteColor();
|
this._container.dataset.yomichanSiteColor = this._getSiteColor();
|
||||||
}
|
}
|
||||||
|
|
||||||
async setCustomOuterCss(css, injectDirectly) {
|
async setCustomOuterCss(css, injectDirectly) {
|
||||||
// Cannot repeatedly inject stylesheets using web extension APIs since there is no way to remove them.
|
// Cannot repeatedly inject stylesheets using web extension APIs since there is no way to remove them.
|
||||||
if (this.stylesheetInjectedViaApi) { return; }
|
if (this._stylesheetInjectedViaApi) { return; }
|
||||||
|
|
||||||
if (injectDirectly || Popup._isOnExtensionPage()) {
|
if (injectDirectly || Popup._isOnExtensionPage()) {
|
||||||
Popup.injectOuterStylesheet(css);
|
Popup.injectOuterStylesheet(css);
|
||||||
@ -146,7 +158,7 @@ class Popup {
|
|||||||
if (!css) { return; }
|
if (!css) { return; }
|
||||||
try {
|
try {
|
||||||
await apiInjectStylesheet(css);
|
await apiInjectStylesheet(css);
|
||||||
this.stylesheetInjectedViaApi = true;
|
this._stylesheetInjectedViaApi = true;
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
// NOP
|
// NOP
|
||||||
}
|
}
|
||||||
@ -154,15 +166,15 @@ class Popup {
|
|||||||
}
|
}
|
||||||
|
|
||||||
setChildrenSupported(value) {
|
setChildrenSupported(value) {
|
||||||
this.childrenSupported = value;
|
this._childrenSupported = value;
|
||||||
}
|
}
|
||||||
|
|
||||||
getContainer() {
|
getContainer() {
|
||||||
return this.container;
|
return this._container;
|
||||||
}
|
}
|
||||||
|
|
||||||
getContainerRect() {
|
getContainerRect() {
|
||||||
return this.container.getBoundingClientRect();
|
return this._container.getBoundingClientRect();
|
||||||
}
|
}
|
||||||
|
|
||||||
static injectOuterStylesheet(css) {
|
static injectOuterStylesheet(css) {
|
||||||
@ -188,53 +200,53 @@ class Popup {
|
|||||||
// Private functions
|
// Private functions
|
||||||
|
|
||||||
_inject() {
|
_inject() {
|
||||||
if (this.injectPromise === null) {
|
if (this._injectPromise === null) {
|
||||||
this.injectPromise = this._createInjectPromise();
|
this._injectPromise = this._createInjectPromise();
|
||||||
}
|
}
|
||||||
return this.injectPromise;
|
return this._injectPromise;
|
||||||
}
|
}
|
||||||
|
|
||||||
async _createInjectPromise() {
|
async _createInjectPromise() {
|
||||||
try {
|
try {
|
||||||
const {frameId} = await this.frameIdPromise;
|
const {frameId} = await this._frameIdPromise;
|
||||||
if (typeof frameId === 'number') {
|
if (typeof frameId === 'number') {
|
||||||
this.frameId = frameId;
|
this._frameId = frameId;
|
||||||
}
|
}
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
// NOP
|
// NOP
|
||||||
}
|
}
|
||||||
|
|
||||||
return new Promise((resolve) => {
|
return new Promise((resolve) => {
|
||||||
const parentFrameId = (typeof this.frameId === 'number' ? this.frameId : null);
|
const parentFrameId = (typeof this._frameId === 'number' ? this._frameId : null);
|
||||||
this.container.addEventListener('load', () => {
|
this._container.addEventListener('load', () => {
|
||||||
this._invokeApi('initialize', {
|
this._invokeApi('initialize', {
|
||||||
options: this.options,
|
options: this._options,
|
||||||
popupInfo: {
|
popupInfo: {
|
||||||
id: this.id,
|
id: this._id,
|
||||||
depth: this.depth,
|
depth: this._depth,
|
||||||
parentFrameId
|
parentFrameId
|
||||||
},
|
},
|
||||||
url: this.url,
|
url: this.url,
|
||||||
childrenSupported: this.childrenSupported
|
childrenSupported: this._childrenSupported
|
||||||
});
|
});
|
||||||
resolve();
|
resolve();
|
||||||
});
|
});
|
||||||
this._observeFullscreen();
|
this._observeFullscreen();
|
||||||
this._onFullscreenChanged();
|
this._onFullscreenChanged();
|
||||||
this.setCustomOuterCss(this.options.general.customPopupOuterCss, false);
|
this.setCustomOuterCss(this._options.general.customPopupOuterCss, false);
|
||||||
this.isInjected = true;
|
this._isInjected = true;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
_isInitialized() {
|
_isInitialized() {
|
||||||
return this.options !== null;
|
return this._options !== null;
|
||||||
}
|
}
|
||||||
|
|
||||||
async _show(elementRect, writingMode) {
|
async _show(elementRect, writingMode) {
|
||||||
await this._inject();
|
await this._inject();
|
||||||
|
|
||||||
const optionsGeneral = this.options.general;
|
const optionsGeneral = this._options.general;
|
||||||
const container = this.container;
|
const container = this._container;
|
||||||
const containerRect = container.getBoundingClientRect();
|
const containerRect = container.getBoundingClientRect();
|
||||||
const getPosition = (
|
const getPosition = (
|
||||||
writingMode === 'horizontal-tb' || optionsGeneral.popupVerticalTextPosition === 'default' ?
|
writingMode === 'horizontal-tb' || optionsGeneral.popupVerticalTextPosition === 'default' ?
|
||||||
@ -260,31 +272,31 @@ class Popup {
|
|||||||
container.style.height = `${height}px`;
|
container.style.height = `${height}px`;
|
||||||
|
|
||||||
this._setVisible(true);
|
this._setVisible(true);
|
||||||
if (this.child !== null) {
|
if (this._child !== null) {
|
||||||
this.child.hide(true);
|
this._child.hide(true);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
_setVisible(visible) {
|
_setVisible(visible) {
|
||||||
this.visible = visible;
|
this._visible = visible;
|
||||||
this._updateVisibility();
|
this._updateVisibility();
|
||||||
}
|
}
|
||||||
|
|
||||||
_updateVisibility() {
|
_updateVisibility() {
|
||||||
this.container.style.setProperty('visibility', this.isVisible() ? 'visible' : 'hidden', 'important');
|
this._container.style.setProperty('visibility', this.isVisible() ? 'visible' : 'hidden', 'important');
|
||||||
}
|
}
|
||||||
|
|
||||||
_focusParent() {
|
_focusParent() {
|
||||||
if (this.parent !== null) {
|
if (this._parent !== null) {
|
||||||
// Chrome doesn't like focusing iframe without contentWindow.
|
// Chrome doesn't like focusing iframe without contentWindow.
|
||||||
const contentWindow = this.parent.container.contentWindow;
|
const contentWindow = this._parent.container.contentWindow;
|
||||||
if (contentWindow !== null) {
|
if (contentWindow !== null) {
|
||||||
contentWindow.focus();
|
contentWindow.focus();
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
// Firefox doesn't like focusing window without first blurring the iframe.
|
// Firefox doesn't like focusing window without first blurring the iframe.
|
||||||
// this.container.contentWindow.blur() doesn't work on Firefox for some reason.
|
// this.container.contentWindow.blur() doesn't work on Firefox for some reason.
|
||||||
this.container.blur();
|
this._container.blur();
|
||||||
// This is needed for Chrome.
|
// This is needed for Chrome.
|
||||||
window.focus();
|
window.focus();
|
||||||
}
|
}
|
||||||
@ -299,7 +311,7 @@ class Popup {
|
|||||||
}
|
}
|
||||||
|
|
||||||
_invokeApi(action, params={}) {
|
_invokeApi(action, params={}) {
|
||||||
this.container.contentWindow.postMessage({action, params}, '*');
|
this._container.contentWindow.postMessage({action, params}, '*');
|
||||||
}
|
}
|
||||||
|
|
||||||
_observeFullscreen() {
|
_observeFullscreen() {
|
||||||
@ -325,8 +337,8 @@ class Popup {
|
|||||||
|
|
||||||
_onFullscreenChanged() {
|
_onFullscreenChanged() {
|
||||||
const parent = (this._getFullscreenElement() || document.body || null);
|
const parent = (this._getFullscreenElement() || document.body || null);
|
||||||
if (parent !== null && this.container.parentNode !== parent) {
|
if (parent !== null && this._container.parentNode !== parent) {
|
||||||
parent.appendChild(this.container);
|
parent.appendChild(this._container);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user