|
7 | 7 |
|
8 | 8 | // Import JS resources
|
9 | 9 | for (const resource of [
|
10 |
| - 'lib/chatbar.js', 'lib/chatgpt.js', 'lib/dom.js', 'lib/settings.js', |
| 10 | + 'lib/chatbar.js', 'lib/chatgpt.js', 'lib/dom.js', 'lib/settings.js', 'lib/ui.js', |
11 | 11 | 'components/buttons.js', 'components/modals.js', 'components/tooltip.js'
|
12 | 12 | ]) await import(chrome.runtime.getURL(resource))
|
13 | 13 |
|
14 | 14 | // Init ENV context
|
15 | 15 | const env = {
|
16 | 16 | browser: { isMobile: chatgpt.browser.isMobile() }, site: /([^.]+)\.[^.]+$/.exec(location.hostname)[1], ui: {}}
|
17 | 17 | env.browser.isPortrait = env.browser.isMobile && (window.innerWidth < window.innerHeight)
|
18 |
| - env.ui.scheme = getScheme() |
| 18 | + env.ui.scheme = ui.getScheme() |
19 | 19 |
|
20 | 20 | // Import DATA
|
21 | 21 | const { app } = await chrome.storage.sync.get('app'),
|
|
27 | 27 | modals.imports.import({ app, env }) // for app data + env.<browser|ui> flags
|
28 | 28 | settings.imports.import({ site: env.site }) // to load/save active tab's settings
|
29 | 29 | tooltip.imports.import({ site: env.site, sites }) // for tooltip.update() position logic
|
| 30 | + ui.imports.import({ site: env.site, sites }) // for ui.ui.isFullWin() logic |
30 | 31 |
|
31 | 32 | // Init SETTINGS
|
32 | 33 | const firstRunKey = `${env.site}_isFirstRun`
|
|
85 | 86 | case 'ON' : activateMode(mode) ; break
|
86 | 87 | case 'OFF' : deactivateMode(mode) ; break
|
87 | 88 | default : ( mode == 'wideScreen' ? document.head.contains(wideScreenStyle)
|
88 |
| - : mode == 'fullWindow' ? isFullWin() : chatgpt.isFullScreen() ) ? deactivateMode(mode) |
| 89 | + : mode == 'fullWindow' ? ui.isFullWin() : chatgpt.isFullScreen() ) ? deactivateMode(mode) |
89 | 90 | : activateMode(mode)
|
90 | 91 | }
|
91 | 92 |
|
|
189 | 190 | if (config.wideScreen ^ document.head.contains(wideScreenStyle)) { // sync Widescreen
|
190 | 191 | supressNotifs() ; toggleMode('wideScreen') }
|
191 | 192 | if (sites[env.site].hasSidebar) {
|
192 |
| - if (config.fullWindow ^ isFullWin()) { // sync Full-Window |
| 193 | + if (config.fullWindow ^ ui.isFullWin()) { // sync Full-Window |
193 | 194 | supressNotifs() ; toggleMode('fullWindow') }
|
194 | 195 | sync.fullerWin() // sync Fuller Windows
|
195 | 196 | }
|
|
222 | 223 |
|
223 | 224 | async mode(mode) { // setting + icon + tooltip + chatbar
|
224 | 225 | const state = ( mode == 'wideScreen' ? !!document.getElementById('wideScreen-mode')
|
225 |
| - : mode == 'fullWindow' ? isFullWin() |
| 226 | + : mode == 'fullWindow' ? ui.isFullWin() |
226 | 227 | : chatgpt.isFullScreen() )
|
227 | 228 | settings.save(mode, state) ; buttons.update.svg(mode) ; tooltip.update(mode)
|
228 | 229 | if (!config.extensionDisabled) { // tweak UI
|
|
238 | 239 | }
|
239 | 240 | }
|
240 | 241 |
|
241 |
| - function getScheme() { |
242 |
| - const rootElem = document.documentElement |
243 |
| - return env.site == 'perplexity' ? rootElem.dataset.colorScheme : rootElem.className |
244 |
| - || (window.matchMedia?.('(prefers-color-scheme: dark)')?.matches ? 'dark' : 'light') |
245 |
| - } |
246 |
| - |
247 |
| - function isFullWin() { |
248 |
| - return env.site == 'poe' ? !!document.getElementById('fullWindow-mode') |
249 |
| - : !sites[env.site].hasSidebar // false if sidebar non-existent |
250 |
| - || /\d+/.exec(getComputedStyle(document.querySelector( |
251 |
| - sites[env.site].selectors.sidebar))?.width || '')[0] < 100 |
252 |
| - } |
253 |
| - |
254 | 242 | chatgpt.canvasIsOpen = function() {
|
255 | 243 | return document.querySelector('section.popover')?.getBoundingClientRect().top == 0 }
|
256 | 244 |
|
|
268 | 256 | // Init FULL-MODE states
|
269 | 257 | config.fullScreen = chatgpt.isFullScreen()
|
270 | 258 | if (sites[env.site].selectors.btns.sidebarToggle) // site has native FW state
|
271 |
| - config.fullWindow = isFullWin() // ...so match it |
| 259 | + config.fullWindow = ui.isFullWin() // ...so match it |
272 | 260 | else await settings.load('fullWindow') // otherwise load CWM's saved state
|
273 | 261 |
|
274 | 262 | // Apply general style TWEAKS
|
|
348 | 336 | window.matchMedia('(prefers-color-scheme: dark)').addEventListener( // for browser/system scheme pref changes
|
349 | 337 | 'change', () => requestAnimationFrame(handleSchemePrefChange))
|
350 | 338 | function handleSchemePrefChange() {
|
351 |
| - const displayedScheme = getScheme() |
| 339 | + const displayedScheme = ui.getScheme() |
352 | 340 | if (env.ui.scheme != displayedScheme) {
|
353 | 341 | env.ui.scheme = displayedScheme ; modals.stylize() ; buttons.update.color() }
|
354 | 342 | }
|
|
357 | 345 | if (sites[env.site].selectors.btns.sidebarToggle && sites[env.site].hasSidebar) {
|
358 | 346 | const sidebarObserver = new MutationObserver(async () => {
|
359 | 347 | await new Promise(resolve => setTimeout(resolve, env.site == 'perplexity' ? 500 : 0))
|
360 |
| - if ((config.fullWindow ^ isFullWin()) && !config.modeSynced) sync.mode('fullWindow') |
| 348 | + if ((config.fullWindow ^ ui.isFullWin()) && !config.modeSynced) sync.mode('fullWindow') |
361 | 349 | })
|
362 | 350 | setTimeout(() => { // delay half-sec before observing to avoid repeated toggles from node observer
|
363 | 351 | let obsTarget = document.querySelector(sites[env.site].selectors.sidebar)
|
|
0 commit comments