From 8a8d1d756e0c68db21ece5bd37f7d540255082ec Mon Sep 17 00:00:00 2001 From: the-djmaze <> Date: Mon, 20 Feb 2023 15:47:46 +0100 Subject: [PATCH] centralize elementById('rl-app') --- dev/Common/Fullscreen.js | 15 +++++++-------- dev/Common/Globals.js | 2 ++ dev/Common/Html.js | 32 ++++++++++++++++---------------- dev/Stores/Theme.js | 14 ++++++-------- 4 files changed, 31 insertions(+), 32 deletions(-) diff --git a/dev/Common/Fullscreen.js b/dev/Common/Fullscreen.js index dc7e42fb5..77cf0b599 100644 --- a/dev/Common/Fullscreen.js +++ b/dev/Common/Fullscreen.js @@ -1,20 +1,19 @@ -import { doc, elementById, $htmlCL } from 'Common/Globals'; +import { doc, appEl, $htmlCL } from 'Common/Globals'; // Fullscreen must be on app, else other popups fail export const - app = elementById('rl-app'), - appFullscreen = () => (doc.fullscreenElement || doc.webkitFullscreenElement) === app, + appFullscreen = () => (doc.fullscreenElement || doc.webkitFullscreenElement) === appEl, exitFullscreen = () => appFullscreen() && (doc.exitFullscreen || doc.webkitExitFullscreen).call(doc), isFullscreen = ko.observable(false), - toggleFullscreen = () => isFullscreen() ? exitFullscreen() : app.requestFullscreen(); + toggleFullscreen = () => isFullscreen() ? exitFullscreen() : appEl.requestFullscreen(); -if (app) { +if (appEl) { let event = 'fullscreenchange'; - if (!app.requestFullscreen && app.webkitRequestFullscreen) { - app.requestFullscreen = app.webkitRequestFullscreen; + if (!appEl.requestFullscreen && appEl.webkitRequestFullscreen) { + appEl.requestFullscreen = appEl.webkitRequestFullscreen; event = 'webkit'+event; } - if (app.requestFullscreen) { + if (appEl.requestFullscreen) { doc.addEventListener(event, () => { isFullscreen(appFullscreen()); $htmlCL.toggle('rl-fullscreen', appFullscreen()); diff --git a/dev/Common/Globals.js b/dev/Common/Globals.js index cd53ff55a..d1a8878f5 100644 --- a/dev/Common/Globals.js +++ b/dev/Common/Globals.js @@ -11,6 +11,8 @@ export const elementById = id => doc.getElementById(id), + appEl = elementById('rl-app'), + Settings = rl.settings, SettingsGet = Settings.get, SettingsCapa = name => name && !!(SettingsGet('Capa') || {})[name], diff --git a/dev/Common/Html.js b/dev/Common/Html.js index 68edf31a5..80d86889e 100644 --- a/dev/Common/Html.js +++ b/dev/Common/Html.js @@ -3,7 +3,7 @@ import { forEachObjectEntry, pInt } from 'Common/Utils'; import { SettingsUserStore } from 'Stores/User/Settings'; const - tpl = createElement('template'), + tmpl = createElement('template'), htmlre = /[&<>"']/g, httpre = /^(https?:)?\/\//i, htmlmap = { @@ -24,8 +24,8 @@ const blockquoteSwitcher = () => { SettingsUserStore.collapseBlockquotes() && -// tpl.content.querySelectorAll('blockquote').forEach(node => { - [...tpl.content.querySelectorAll('blockquote')].reverse().forEach(node => { +// tmpl.content.querySelectorAll('blockquote').forEach(node => { + [...tmpl.content.querySelectorAll('blockquote')].reverse().forEach(node => { const el = createElement('details', {class:'sm-bq-switcher'}); el.innerHTML = '•••'; node.replaceWith(el); @@ -264,7 +264,7 @@ export const msgId = 0; } - tpl.innerHTML = html + tmpl.innerHTML = html // Strip Microsoft comments .replace(//gi, '') // .replace(/]*>[\s\S]*?<\/pre>/gi, pre => pre.replace(/\n/g, '\n
')) @@ -282,17 +282,17 @@ export const // \MailSo\Base\HtmlUtils::ClearComments() // https://github.com/the-djmaze/snappymail/issues/187 - const nodeIterator = document.createNodeIterator(tpl.content, NodeFilter.SHOW_COMMENT); + const nodeIterator = document.createNodeIterator(tmpl.content, NodeFilter.SHOW_COMMENT); while (nodeIterator.nextNode()) { nodeIterator.referenceNode.remove(); } - tpl.content.querySelectorAll( + tmpl.content.querySelectorAll( disallowedTags + (0 < bqLevel ? ',' + (new Array(1 + bqLevel).fill('blockquote').join(' ')) : '') ).forEach(oElement => oElement.remove()); - [...tpl.content.querySelectorAll('*')].forEach(oElement => { + [...tmpl.content.querySelectorAll('*')].forEach(oElement => { const name = oElement.tagName, oStyle = oElement.style; @@ -555,8 +555,8 @@ export const blockquoteSwitcher(); -// return tpl.content.firstChild; - result.html = tpl.innerHTML.trim(); +// return tmpl.content.firstChild; + result.html = tmpl.innerHTML.trim(); return result; }, @@ -567,7 +567,7 @@ export const htmlToPlain = html => { const hr = '⎯'.repeat(64), - forEach = (selector, fn) => tpl.content.querySelectorAll(selector).forEach(fn), + forEach = (selector, fn) => tmpl.content.querySelectorAll(selector).forEach(fn), blockquotes = node => { let bq; while ((bq = node.querySelector('blockquote'))) { @@ -595,7 +595,7 @@ export const html = html.replace(/\n*<\/(div|tr)(\s[\s\S]*?)?>\n*/gi, '\n'); } - tpl.innerHTML = html + tmpl.innerHTML = html .replace(//gi, '\t') .replace(/<\/tr(\s[\s\S]*?)?>/gi, '\n'); @@ -645,16 +645,16 @@ export const forEach('i,em', i => i.replaceWith(`*${i.textContent}*`)); // Convert line-breaks - tpl.innerHTML = tpl.innerHTML + tmpl.innerHTML = tmpl.innerHTML .replace(/\n{3,}/gm, '\n\n') .replace(/\n]*>/g, '\n') .replace(/]*>\n/g, '\n'); forEach('br', br => br.replaceWith('\n')); // Blockquotes must be last - blockquotes(tpl.content); + blockquotes(tmpl.content); - return (tpl.content.textContent || '').trim(); + return (tmpl.content.textContent || '').trim(); }, /** @@ -708,7 +708,7 @@ export const aText = aNextText; } while (bDo); - tpl.innerHTML = aText.join('\n') + tmpl.innerHTML = aText.join('\n') // .replace(/~~~\/blockquote~~~\n~~~blockquote~~~/g, '\n') .replace(/&/g, '&') .replace(/>/g, '>') @@ -723,7 +723,7 @@ export const .replace(/\s*~~~\/blockquote~~~/g, '') .replace(/\n/g, '
'); blockquoteSwitcher(); - return tpl.innerHTML.trim(); + return tmpl.innerHTML.trim(); }, WYSIWYGS = ko.observableArray(); diff --git a/dev/Stores/Theme.js b/dev/Stores/Theme.js index 36883c251..d641bc1d3 100644 --- a/dev/Stores/Theme.js +++ b/dev/Stores/Theme.js @@ -1,5 +1,5 @@ import ko from 'ko'; -import { $htmlCL, elementById, leftPanelDisabled, Settings, SettingsGet } from 'Common/Globals'; +import { $htmlCL, appEl, elementById, leftPanelDisabled, Settings, SettingsGet } from 'Common/Globals'; import { isArray, arrayLength } from 'Common/Utils'; import { cssLink, serverRequestRaw } from 'Common/Links'; import { SaveSettingStatus } from 'Common/Enums'; @@ -7,8 +7,6 @@ import { SaveSettingStatus } from 'Common/Enums'; let __themeTimer = 0; export const - appEl = () => elementById('rl-app'), - ThemeStore = { theme: ko.observable(''), themes: ko.observableArray(), @@ -66,7 +64,7 @@ ThemeStore.isMobile.subscribe(value => $htmlCL.toggle('rl-mobile', value)); ThemeStore.fontSansSerif.subscribe(value => { if (null != value) { - let cl = appEl().classList; + let cl = appEl.classList; cl.forEach(name => { if (name.startsWith('font') && !/font(Serif|Mono)/.test(name)) { cl.remove(name); @@ -77,20 +75,20 @@ ThemeStore.fontSansSerif.subscribe(value => { }); ThemeStore.fontSerif.subscribe(value => { if (null != value) { - let cl = appEl().classList; + let cl = appEl.classList; cl.forEach(name => name.startsWith('fontSerif') && cl.remove(name)); value && cl.add('fontSerif'+value); } }); ThemeStore.fontMono.subscribe(value => { if (null != value) { - let cl = appEl().classList; + let cl = appEl.classList; cl.forEach(name => name.startsWith('fontMono') && cl.remove(name)); value && cl.add('fontMono'+value); } }); ThemeStore.userBackgroundHash.subscribe(value => { - appEl().classList.toggle('UserBackground', !!value); - appEl().style.backgroundImage = value ? "url("+serverRequestRaw('UserBackground', value)+")" : null; + appEl.classList.toggle('UserBackground', !!value); + appEl.style.backgroundImage = value ? "url("+serverRequestRaw('UserBackground', value)+")" : null; });