From 0d82c52a7624d80ec48dc774fb23db5244bc14f9 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sat, 28 May 2022 21:57:25 -0400 Subject: [PATCH] HTML page script refactoring (#2162) * Move some common functionality * Move setupEnvironmentInfo into ExtensionContentController * Move background/environment.js to extension/environment.js --- .eslintrc.json | 2 +- ext/background.html | 2 +- .../{background => extension}/environment.js | 0 .../common/extension-content-controller.js | 131 ++++++++++++++++++ ext/js/pages/generic-page-main.js | 11 +- ext/js/pages/permissions-main.js | 15 +- .../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, 159 insertions(+), 96 deletions(-) rename ext/js/{background => extension}/environment.js (100%) create mode 100644 ext/js/pages/common/extension-content-controller.js diff --git a/.eslintrc.json b/.eslintrc.json index f1489420..793c4bf4 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -220,7 +220,6 @@ "ext/js/yomichan.js", "ext/js/accessibility/accessibility-controller.js", "ext/js/background/backend.js", - "ext/js/background/environment.js", "ext/js/background/profile-conditions-util.js", "ext/js/background/request-builder.js", "ext/js/background/script-manager.js", @@ -235,6 +234,7 @@ "ext/js/data/permissions-util.js", "ext/js/data/sandbox/string-util.js", "ext/js/dom/simple-dom-parser.js", + "ext/js/extension/environment.js", "ext/js/general/cache-map.js", "ext/js/general/object-property-accessor.js", "ext/js/general/regex-util.js", 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/extension/environment.js similarity index 100% rename from ext/js/background/environment.js rename to ext/js/extension/environment.js 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,19 +67,11 @@ function setupPermissionsToggles() { const documentFocusController = new DocumentFocusController(); documentFocusController.prepare(); + const extensionContentController = new ExtensionContentController(); + extensionContentController.prepare(); + setupPermissionsToggles(); - for (const node of document.querySelectorAll('.extension-id-example')) { - node.textContent = chrome.runtime.getURL('/'); - } - - 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); - } - await yomichan.prepare(); setupEnvironmentInfo(); 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 @@ + +