From c225210a441eae8006df857881aa91c86f9e12dd Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Mon, 31 May 2021 13:36:26 +1000 Subject: [PATCH 1/5] Respond to native OS theme changes --- src/app/app.component.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/app/app.component.ts b/src/app/app.component.ts index f959f911..fe82df24 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -124,6 +124,11 @@ export class AppComponent implements OnInit { window.onkeypress = () => this.recordActivity(); }); + this.platformUtilsService.onDefaultSystemThemeChange(theme => { + window.document.documentElement.classList.remove('theme_light', 'theme_dark'); + window.document.documentElement.classList.add('theme_' + theme); + }); + this.broadcasterService.subscribe(BroadcasterSubscriptionId, async (message: any) => { this.ngZone.run(async () => { switch (message.command) { From 7f5a5a5fbbddcd9bfe7da57c86c3035fa8874147 Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Mon, 31 May 2021 14:19:31 +1000 Subject: [PATCH 2/5] Only update to system theme if theme is Default --- src/app/app.component.ts | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/src/app/app.component.ts b/src/app/app.component.ts index fe82df24..4511f52e 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -124,9 +124,12 @@ export class AppComponent implements OnInit { window.onkeypress = () => this.recordActivity(); }); - this.platformUtilsService.onDefaultSystemThemeChange(theme => { - window.document.documentElement.classList.remove('theme_light', 'theme_dark'); - window.document.documentElement.classList.add('theme_' + theme); + this.platformUtilsService.onDefaultSystemThemeChange(async systemTheme => { + const theme = await this.storageService.get(ConstantsService.themeKey); + if (theme == null) { + window.document.documentElement.classList.remove('theme_light', 'theme_dark'); + window.document.documentElement.classList.add('theme_' + systemTheme); + } }); this.broadcasterService.subscribe(BroadcasterSubscriptionId, async (message: any) => { From b00df0112ef3db8f91fefbb8488847a3b6f4a50b Mon Sep 17 00:00:00 2001 From: Tom Rittson Date: Mon, 31 May 2021 14:04:36 +1000 Subject: [PATCH 3/5] Let all OS' use system theme on startup --- src/app/services.module.ts | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/src/app/services.module.ts b/src/app/services.module.ts index 04836c7f..bfdf235c 100644 --- a/src/app/services.module.ts +++ b/src/app/services.module.ts @@ -156,11 +156,7 @@ export function initFactory(): Function { htmlEl.classList.add('locale_' + i18nService.translationLocale); let theme = await storageService.get(ConstantsService.themeKey); if (theme == null) { - if (platformUtilsService.getDevice() === DeviceType.MacOsDesktop) { - theme = await platformUtilsService.getDefaultSystemTheme(); - } else { - theme = 'light'; - } + theme = await platformUtilsService.getDefaultSystemTheme(); } htmlEl.classList.add('theme_' + theme); stateService.save(ConstantsService.disableFaviconKey, From 98f614aedaa70353bd7f846655676583cefb3bf1 Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Wed, 2 Jun 2021 07:11:54 +1000 Subject: [PATCH 4/5] bump jslib --- jslib | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/jslib b/jslib index 25a91313..b1d9b84e 160000 --- a/jslib +++ b/jslib @@ -1 +1 @@ -Subproject commit 25a91313ad0441d1c02e043113f931f203fd57e6 +Subproject commit b1d9b84eae451ec2edaf18b7256dd8361b0310ca From 6edd60000635377991a46833c8b7f95b9380952f Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Wed, 2 Jun 2021 07:28:21 +1000 Subject: [PATCH 5/5] Move theme update logic to services.module.ts --- src/app/app.component.ts | 8 -------- src/app/services.module.ts | 4 ++++ 2 files changed, 4 insertions(+), 8 deletions(-) diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 4511f52e..f959f911 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -124,14 +124,6 @@ export class AppComponent implements OnInit { window.onkeypress = () => this.recordActivity(); }); - this.platformUtilsService.onDefaultSystemThemeChange(async systemTheme => { - const theme = await this.storageService.get(ConstantsService.themeKey); - if (theme == null) { - window.document.documentElement.classList.remove('theme_light', 'theme_dark'); - window.document.documentElement.classList.add('theme_' + systemTheme); - } - }); - this.broadcasterService.subscribe(BroadcasterSubscriptionId, async (message: any) => { this.ngZone.run(async () => { switch (message.command) { diff --git a/src/app/services.module.ts b/src/app/services.module.ts index bfdf235c..b6a24f9f 100644 --- a/src/app/services.module.ts +++ b/src/app/services.module.ts @@ -157,6 +157,10 @@ export function initFactory(): Function { let theme = await storageService.get(ConstantsService.themeKey); if (theme == null) { theme = await platformUtilsService.getDefaultSystemTheme(); + platformUtilsService.onDefaultSystemThemeChange(sysTheme => { + window.document.documentElement.classList.remove('theme_light', 'theme_dark'); + window.document.documentElement.classList.add('theme_' + sysTheme); + }); } htmlEl.classList.add('theme_' + theme); stateService.save(ConstantsService.disableFaviconKey,