From 4fc7731f1a511706a3630f7e631e6c7e1a46ba86 Mon Sep 17 00:00:00 2001 From: GabrielMeyer Date: Mon, 17 Jun 2019 14:43:38 +0200 Subject: [PATCH] Ensures theming of components - If there is no theme applied, the default theme is loaded and applied. --- .../src/app/core/ui-services/theme.service.ts | 38 +++++++++++++++---- .../reset-password.component.ts | 5 ++- 2 files changed, 34 insertions(+), 9 deletions(-) diff --git a/client/src/app/core/ui-services/theme.service.ts b/client/src/app/core/ui-services/theme.service.ts index cf75f4588..a92de283e 100644 --- a/client/src/app/core/ui-services/theme.service.ts +++ b/client/src/app/core/ui-services/theme.service.ts @@ -41,17 +41,26 @@ export class ThemeService { if (!newTheme) { return; } - this.currentTheme = newTheme; - - const classList = document.getElementsByTagName('body')[0].classList; // Get the classlist of the body. - const toRemove = Array.from(classList).filter((item: string) => item.includes('theme')); - if (toRemove.length) { - classList.remove(...toRemove); // Remove all old themes. - } - classList.add(newTheme, ThemeService.DEFAULT_THEME); // Add the new theme. + this.changeTheme(newTheme); }); } + /** + * Function to change the theme and ensures, that old themes are removed. + * + * @param theme The theme which is applied. + */ + private changeTheme(theme: string): void { + this.currentTheme = theme; + + const classList = document.getElementsByTagName('body')[0].classList; // Get the classlist of the body. + const toRemove = Array.from(classList).filter((item: string) => item.includes('theme')); + if (toRemove.length) { + classList.remove(...toRemove); // Remove all old themes. + } + classList.add(theme, ThemeService.DEFAULT_THEME); // Add the new theme. + } + /** * Returns the logo relative to the used theme. * @@ -68,4 +77,17 @@ export class ThemeService { return null; } } + + /** + * Function to ensure, that there is at least one theme set to define + * the colors of the components. + * + * If a theme is already set, nothing happens, otherwise the + * `DEFAULT_THEME` will be set. + */ + public checkTheme(): void { + if (!this.currentTheme || this.currentTheme === '') { + this.changeTheme(ThemeService.DEFAULT_THEME); + } + } } diff --git a/client/src/app/site/login/components/reset-password/reset-password.component.ts b/client/src/app/site/login/components/reset-password/reset-password.component.ts index d04ef0c44..cb6c5f3a8 100644 --- a/client/src/app/site/login/components/reset-password/reset-password.component.ts +++ b/client/src/app/site/login/components/reset-password/reset-password.component.ts @@ -9,6 +9,7 @@ import { TranslateService } from '@ngx-translate/core'; import { environment } from 'environments/environment'; import { BaseComponent } from '../../../../base.component'; import { HttpService } from 'app/core/core-services/http.service'; +import { ThemeService } from 'app/core/ui-services/theme.service'; /** * Reset password component. @@ -34,7 +35,8 @@ export class ResetPasswordComponent extends BaseComponent implements OnInit { private http: HttpService, formBuilder: FormBuilder, private matSnackBar: MatSnackBar, - private router: Router + private router: Router, + private themeService: ThemeService ) { super(titleService, translate); this.resetPasswordForm = formBuilder.group({ @@ -47,6 +49,7 @@ export class ResetPasswordComponent extends BaseComponent implements OnInit { */ public ngOnInit(): void { super.setTitle('Reset password'); + this.themeService.checkTheme(); } /**