From 0d82c52a7624d80ec48dc774fb23db5244bc14f9 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sat, 28 May 2022 21:57:25 -0400 Subject: HTML page script refactoring (#2162) * Move some common functionality * Move setupEnvironmentInfo into ExtensionContentController * Move background/environment.js to extension/environment.js --- ext/background.html | 2 +- ext/js/background/environment.js | 105 ----------------- ext/js/extension/environment.js | 105 +++++++++++++++++ .../pages/common/extension-content-controller.js | 131 +++++++++++++++++++++ ext/js/pages/generic-page-main.js | 11 +- ext/js/pages/permissions-main.js | 15 +-- .../pages/settings/settings-display-controller.js | 59 ---------- ext/js/pages/settings/settings-main.js | 20 +--- ext/js/pages/welcome-main.js | 4 + ext/legal.html | 2 + ext/permissions.html | 2 + ext/settings.html | 3 +- ext/sw.js | 2 +- ext/welcome.html | 2 + 14 files changed, 263 insertions(+), 200 deletions(-) delete mode 100644 ext/js/background/environment.js create mode 100644 ext/js/extension/environment.js create mode 100644 ext/js/pages/common/extension-content-controller.js (limited to 'ext') diff --git a/ext/background.html b/ext/background.html index 84e64c9c..937b5346 100644 --- a/ext/background.html +++ b/ext/background.html @@ -25,7 +25,6 @@ - @@ -40,6 +39,7 @@ + diff --git a/ext/js/background/environment.js b/ext/js/background/environment.js deleted file mode 100644 index d9ca502c..00000000 --- a/ext/js/background/environment.js +++ /dev/null @@ -1,105 +0,0 @@ -/* - * Copyright (C) 2020-2022 Yomichan Authors - * - * This program is free software: you can redistribute it and/or modify - * it under the terms of the GNU General Public License as published by - * the Free Software Foundation, either version 3 of the License, or - * (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU General Public License for more details. - * - * You should have received a copy of the GNU General Public License - * along with this program. If not, see . - */ - -class Environment { - constructor() { - this._cachedEnvironmentInfo = null; - } - - async prepare() { - this._cachedEnvironmentInfo = await this._loadEnvironmentInfo(); - } - - getInfo() { - if (this._cachedEnvironmentInfo === null) { throw new Error('Not prepared'); } - return this._cachedEnvironmentInfo; - } - - async _loadEnvironmentInfo() { - const browser = await this._getBrowser(); - const os = await this._getOperatingSystem(); - return { - browser, - platform: {os} - }; - } - - async _getOperatingSystem() { - try { - const {os} = await this._getPlatformInfo(); - if (typeof os === 'string') { - return os; - } - } catch (e) { - // NOP - } - return 'unknown'; - } - - _getPlatformInfo() { - return new Promise((resolve, reject) => { - chrome.runtime.getPlatformInfo((result) => { - const error = chrome.runtime.lastError; - if (error) { - reject(error); - } else { - resolve(result); - } - }); - }); - } - - async _getBrowser() { - try { - if (chrome.runtime.getURL('/').startsWith('ms-browser-extension://')) { - return 'edge-legacy'; - } - if (/\bEdge?\//.test(navigator.userAgent)) { - return 'edge'; - } - } catch (e) { - // NOP - } - if (typeof browser !== 'undefined') { - try { - const info = await browser.runtime.getBrowserInfo(); - if (info.name === 'Fennec') { - return 'firefox-mobile'; - } - } catch (e) { - // NOP - } - if (this._isSafari()) { - return 'safari'; - } - return 'firefox'; - } else { - return 'chrome'; - } - } - - _isSafari() { - const {vendor, userAgent} = navigator; - return ( - typeof vendor === 'string' && - typeof userAgent === 'string' && - vendor.includes('Apple') && - !userAgent.includes('CriOS') && - !userAgent.includes('FxiOS') - ); - } -} diff --git a/ext/js/extension/environment.js b/ext/js/extension/environment.js new file mode 100644 index 00000000..d9ca502c --- /dev/null +++ b/ext/js/extension/environment.js @@ -0,0 +1,105 @@ +/* + * Copyright (C) 2020-2022 Yomichan Authors + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see . + */ + +class Environment { + constructor() { + this._cachedEnvironmentInfo = null; + } + + async prepare() { + this._cachedEnvironmentInfo = await this._loadEnvironmentInfo(); + } + + getInfo() { + if (this._cachedEnvironmentInfo === null) { throw new Error('Not prepared'); } + return this._cachedEnvironmentInfo; + } + + async _loadEnvironmentInfo() { + const browser = await this._getBrowser(); + const os = await this._getOperatingSystem(); + return { + browser, + platform: {os} + }; + } + + async _getOperatingSystem() { + try { + const {os} = await this._getPlatformInfo(); + if (typeof os === 'string') { + return os; + } + } catch (e) { + // NOP + } + return 'unknown'; + } + + _getPlatformInfo() { + return new Promise((resolve, reject) => { + chrome.runtime.getPlatformInfo((result) => { + const error = chrome.runtime.lastError; + if (error) { + reject(error); + } else { + resolve(result); + } + }); + }); + } + + async _getBrowser() { + try { + if (chrome.runtime.getURL('/').startsWith('ms-browser-extension://')) { + return 'edge-legacy'; + } + if (/\bEdge?\//.test(navigator.userAgent)) { + return 'edge'; + } + } catch (e) { + // NOP + } + if (typeof browser !== 'undefined') { + try { + const info = await browser.runtime.getBrowserInfo(); + if (info.name === 'Fennec') { + return 'firefox-mobile'; + } + } catch (e) { + // NOP + } + if (this._isSafari()) { + return 'safari'; + } + return 'firefox'; + } else { + return 'chrome'; + } + } + + _isSafari() { + const {vendor, userAgent} = navigator; + return ( + typeof vendor === 'string' && + typeof userAgent === 'string' && + vendor.includes('Apple') && + !userAgent.includes('CriOS') && + !userAgent.includes('FxiOS') + ); + } +} diff --git a/ext/js/pages/common/extension-content-controller.js b/ext/js/pages/common/extension-content-controller.js new file mode 100644 index 00000000..12adf41b --- /dev/null +++ b/ext/js/pages/common/extension-content-controller.js @@ -0,0 +1,131 @@ +/* + * Copyright (C) 2022 Yomichan Authors + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see . + */ + +/* global + * Environment + */ + +class ExtensionContentController { + prepare() { + this._prepareSpecialUrls(); + this._prepareExtensionIdExamples(); + this._prepareEnvironmentInfo(); + } + + // Private + + async _prepareEnvironmentInfo() { + const {dataset} = document.documentElement; + const {manifest_version: manifestVersion} = chrome.runtime.getManifest(); + dataset.manifestVersion = `${manifestVersion}`; + + const environment = new Environment(); + await environment.prepare(); + + const {browser, platform} = environment.getInfo(); + dataset.browser = browser; + dataset.os = platform.os; + } + + _prepareExtensionIdExamples() { + const nodes = document.querySelectorAll('.extension-id-example'); + let url = ''; + try { + url = chrome.runtime.getURL('/'); + } catch (e) { + // NOP + } + for (const node of nodes) { + node.textContent = url; + } + } + + _prepareSpecialUrls() { + const nodes = document.querySelectorAll('[data-special-url]'); + if (nodes.length === 0) { return; } + + let extensionId = ''; + try { + extensionId = chrome.runtime.id; + } catch (e) { + // NOP + } + + const idPattern = /\{id\}/g; + const onSpecialUrlLinkClick = this._onSpecialUrlLinkClick.bind(this); + const onSpecialUrlLinkMouseDown = this._onSpecialUrlLinkMouseDown.bind(this); + for (const node of nodes) { + let {specialUrl} = node.dataset; + if (typeof specialUrl !== 'string') { specialUrl = ''; } + node.dataset.specialUrl = specialUrl.replace(idPattern, extensionId); + node.addEventListener('click', onSpecialUrlLinkClick, false); + node.addEventListener('auxclick', onSpecialUrlLinkClick, false); + node.addEventListener('mousedown', onSpecialUrlLinkMouseDown, false); + } + } + + _onSpecialUrlLinkClick(e) { + switch (e.button) { + case 0: + case 1: + e.preventDefault(); + this._createTab(e.currentTarget.dataset.specialUrl, true); + break; + } + } + + _onSpecialUrlLinkMouseDown(e) { + switch (e.button) { + case 0: + case 1: + e.preventDefault(); + break; + } + } + + async _createTab(url, useOpener) { + let openerTabId; + if (useOpener) { + try { + const tab = await new Promise((resolve, reject) => { + chrome.tabs.getCurrent((result) => { + const e = chrome.runtime.lastError; + if (e) { + reject(new Error(e.message)); + } else { + resolve(result); + } + }); + }); + openerTabId = tab.id; + } catch (e) { + // NOP + } + } + + return await new Promise((resolve, reject) => { + chrome.tabs.create({url, openerTabId}, (tab2) => { + const e = chrome.runtime.lastError; + if (e) { + reject(new Error(e.message)); + } else { + resolve(tab2); + } + }); + }); + } +} diff --git a/ext/js/pages/generic-page-main.js b/ext/js/pages/generic-page-main.js index cfb89609..bde7394b 100644 --- a/ext/js/pages/generic-page-main.js +++ b/ext/js/pages/generic-page-main.js @@ -17,16 +17,15 @@ /* global * DocumentFocusController + * ExtensionContentController */ -function setupEnvironmentInfo() { - const {manifest_version: manifestVersion} = chrome.runtime.getManifest(); - document.documentElement.dataset.manifestVersion = `${manifestVersion}`; -} - (() => { const documentFocusController = new DocumentFocusController(); documentFocusController.prepare(); + + const extensionContentController = new ExtensionContentController(); + extensionContentController.prepare(); + document.documentElement.dataset.loaded = 'true'; - setupEnvironmentInfo(); })(); diff --git a/ext/js/pages/permissions-main.js b/ext/js/pages/permissions-main.js index 718b77ae..df4b07ee 100644 --- a/ext/js/pages/permissions-main.js +++ b/ext/js/pages/permissions-main.js @@ -17,6 +17,7 @@ /* global * DocumentFocusController + * ExtensionContentController * ModalController * PermissionsOriginController * PermissionsToggleController @@ -66,18 +67,10 @@ function setupPermissionsToggles() { const documentFocusController = new DocumentFocusController(); documentFocusController.prepare(); - setupPermissionsToggles(); - - for (const node of document.querySelectorAll('.extension-id-example')) { - node.textContent = chrome.runtime.getURL('/'); - } + const extensionContentController = new ExtensionContentController(); + extensionContentController.prepare(); - const extensionId = chrome.runtime.id; - const idPattern = /\{id\}/g; - for (const node of document.querySelectorAll('.extension-settings-link[data-special-url]')) { - const {specialUrl} = node.dataset; - node.dataset.specialUrl = `${specialUrl}`.replace(idPattern, extensionId); - } + setupPermissionsToggles(); await yomichan.prepare(); diff --git a/ext/js/pages/settings/settings-display-controller.js b/ext/js/pages/settings/settings-display-controller.js index 783d5bec..1b70843f 100644 --- a/ext/js/pages/settings/settings-display-controller.js +++ b/ext/js/pages/settings/settings-display-controller.js @@ -55,14 +55,6 @@ class SettingsDisplayController { node.addEventListener('keydown', onInputTabActionKeyDown, false); } - const onSpecialUrlLinkClick = this._onSpecialUrlLinkClick.bind(this); - const onSpecialUrlLinkMouseDown = this._onSpecialUrlLinkMouseDown.bind(this); - for (const node of document.querySelectorAll('[data-special-url]')) { - node.addEventListener('click', onSpecialUrlLinkClick, false); - node.addEventListener('auxclick', onSpecialUrlLinkClick, false); - node.addEventListener('mousedown', onSpecialUrlLinkMouseDown, false); - } - for (const node of document.querySelectorAll('.defer-load-iframe')) { this._setupDeferLoadIframe(node); } @@ -229,57 +221,6 @@ class SettingsDisplayController { } } - _onSpecialUrlLinkClick(e) { - switch (e.button) { - case 0: - case 1: - e.preventDefault(); - this._createTab(e.currentTarget.dataset.specialUrl, true); - break; - } - } - - _onSpecialUrlLinkMouseDown(e) { - switch (e.button) { - case 0: - case 1: - e.preventDefault(); - break; - } - } - - async _createTab(url, useOpener) { - let openerTabId; - if (useOpener) { - try { - const tab = await new Promise((resolve, reject) => { - chrome.tabs.getCurrent((result) => { - const e = chrome.runtime.lastError; - if (e) { - reject(new Error(e.message)); - } else { - resolve(result); - } - }); - }); - openerTabId = tab.id; - } catch (e) { - // NOP - } - } - - return await new Promise((resolve, reject) => { - chrome.tabs.create({url, openerTabId}, (tab2) => { - const e = chrome.runtime.lastError; - if (e) { - reject(new Error(e.message)); - } else { - resolve(tab2); - } - }); - }); - } - _updateScrollTarget() { const hash = window.location.hash; if (!hash.startsWith('#!')) { return; } diff --git a/ext/js/pages/settings/settings-main.js b/ext/js/pages/settings/settings-main.js index 5aab25f7..a3dcf357 100644 --- a/ext/js/pages/settings/settings-main.js +++ b/ext/js/pages/settings/settings-main.js @@ -24,7 +24,7 @@ * DictionaryController * DictionaryImportController * DocumentFocusController - * Environment + * ExtensionContentController * ExtensionKeyboardShortcutController * GenericSettingController * KeyboardShortcutController @@ -48,19 +48,6 @@ * TranslationTextReplacementsController */ -async function setupEnvironmentInfo() { - const {dataset} = document.documentElement; - const {manifest_version: manifestVersion} = chrome.runtime.getManifest(); - dataset.manifestVersion = `${manifestVersion}`; - - const environment = new Environment(); - await environment.prepare(); - const {browser, platform} = environment.getInfo(); - - dataset.browser = browser; - dataset.os = platform.os; -} - async function setupGenericSettingsController(genericSettingController) { await genericSettingController.prepare(); await genericSettingController.refresh(); @@ -71,11 +58,12 @@ async function setupGenericSettingsController(genericSettingController) { const documentFocusController = new DocumentFocusController(); documentFocusController.prepare(); + const extensionContentController = new ExtensionContentController(); + extensionContentController.prepare(); + const statusFooter = new StatusFooter(document.querySelector('.status-footer-container')); statusFooter.prepare(); - setupEnvironmentInfo(); - let prepareTimer = setTimeout(() => { prepareTimer = null; document.documentElement.dataset.loadingStalled = 'true'; diff --git a/ext/js/pages/welcome-main.js b/ext/js/pages/welcome-main.js index c6c7911d..16ef7b52 100644 --- a/ext/js/pages/welcome-main.js +++ b/ext/js/pages/welcome-main.js @@ -19,6 +19,7 @@ * DictionaryController * DictionaryImportController * DocumentFocusController + * ExtensionContentController * GenericSettingController * ModalController * ScanInputsSimpleController @@ -45,6 +46,9 @@ async function setupGenericSettingsController(genericSettingController) { const documentFocusController = new DocumentFocusController(); documentFocusController.prepare(); + const extensionContentController = new ExtensionContentController(); + extensionContentController.prepare(); + const statusFooter = new StatusFooter(document.querySelector('.status-footer-container')); statusFooter.prepare(); diff --git a/ext/legal.html b/ext/legal.html index 8d082af4..82a7d4a5 100644 --- a/ext/legal.html +++ b/ext/legal.html @@ -153,6 +153,8 @@ THE SOFTWARE. + + diff --git a/ext/permissions.html b/ext/permissions.html index afb16300..5ec7ba6a 100644 --- a/ext/permissions.html +++ b/ext/permissions.html @@ -280,6 +280,8 @@ + + diff --git a/ext/settings.html b/ext/settings.html index 48ce3472..ac296b8d 100644 --- a/ext/settings.html +++ b/ext/settings.html @@ -3623,7 +3623,6 @@ - @@ -3641,6 +3640,7 @@ + @@ -3651,6 +3651,7 @@ + diff --git a/ext/sw.js b/ext/sw.js index 3b567f55..0016c28f 100644 --- a/ext/sw.js +++ b/ext/sw.js @@ -22,7 +22,6 @@ self.importScripts( '/js/yomichan.js', '/js/accessibility/accessibility-controller.js', '/js/background/backend.js', - '/js/background/environment.js', '/js/background/profile-conditions-util.js', '/js/background/request-builder.js', '/js/background/script-manager.js', @@ -37,6 +36,7 @@ self.importScripts( '/js/data/permissions-util.js', '/js/data/sandbox/string-util.js', '/js/dom/simple-dom-parser.js', + '/js/extension/environment.js', '/js/general/cache-map.js', '/js/general/object-property-accessor.js', '/js/general/regex-util.js', diff --git a/ext/welcome.html b/ext/welcome.html index f67e186c..0527d02d 100644 --- a/ext/welcome.html +++ b/ext/welcome.html @@ -401,12 +401,14 @@ + + -- cgit v1.2.3