Adds quiz theme option

parent b571fbaa
Pipeline #27264 passed with stages
in 13 minutes and 7 seconds
......@@ -3,6 +3,7 @@ import { Router } from '@angular/router';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { TranslateService } from '@ngx-translate/core';
import { Subscription } from 'rxjs';
import { environment } from '../../../../environments/environment';
import { AutoUnsubscribe } from '../../../../lib/AutoUnsubscribe';
import { availableQuestionTypes, IAvailableQuestionType } from '../../../../lib/available-question-types';
import { DefaultAnswerEntity } from '../../../../lib/entities/answer/DefaultAnswerEntity';
......@@ -54,13 +55,17 @@ export class QuizManagerComponent implements OnDestroy {
this.footerBarService.TYPE_REFERENCE = QuizManagerComponent.TYPE;
footerBarService.replaceFooterElements([
const footerElements = [
this.footerBarService.footerElemHome,
this.footerBarService.footerElemStartQuiz,
this.footerBarService.footerElemNicknames,
this.footerBarService.footerElemMemberGroup,
this.footerBarService.footerElemSound,
]);
];
if (environment.forceQuizTheme) {
footerElements.push(this.footerBarService.footerElemTheme);
}
footerBarService.replaceFooterElements(footerElements);
this._subscriptions.push(this.quizService.quizUpdateEmitter.subscribe(() => {
this.footerBarService.footerElemStartQuiz.isActive = this.quizService.isValid() && this.connectionService.serverAvailable;
......
......@@ -62,6 +62,12 @@ export class NicknameInputComponent implements OnInit, OnDestroy {
this.router.navigate(['/quiz', 'flow', 'lobby']);
}, data => {
this.isLoggingIn = false;
if (!data) {
this.router.navigate(['/']);
return;
}
switch (data.step) {
case MessageProtocol.DuplicateLogin:
this._failedLoginReason = 'plugins.splashscreen.error.error_messages.duplicate_user';
......@@ -79,6 +85,8 @@ export class NicknameInputComponent implements OnInit, OnDestroy {
if (this.attendeeService.ownNick) {
this.router.navigate(['/']);
}
this.quizService.loadDataToPlay(sessionStorage.getItem(StorageKey.CurrentQuizName));
}
public ngOnDestroy(): void {
......
......@@ -89,6 +89,7 @@ export class NicknameSelectComponent implements OnInit, OnDestroy {
this.router.navigate(['/quiz', 'flow', 'lobby']);
}, (err) => {
console.log('NicknameSelectComponent: PutMember failed', err);
this.router.navigate(['/']);
this.isLoggingIn = null;
});
}
......@@ -106,9 +107,12 @@ export class NicknameSelectComponent implements OnInit, OnDestroy {
this.router.navigate(['/']);
}
this._isLoading = true;
this.memberApiService.getAvailableNames(this.quizService.quiz.name).subscribe(data => {
this._isLoading = false;
this._nicks = this._nicks.concat(data);
this.quizService.loadDataToPlay(sessionStorage.getItem(StorageKey.CurrentQuizName)).then(() => {
this.memberApiService.getAvailableNames(this.quizService.quiz.name).subscribe(data => {
this._isLoading = false;
this._nicks = this._nicks.concat(data);
});
});
}
......
import { isPlatformBrowser } from '@angular/common';
import { Component, Inject, PLATFORM_ID } from '@angular/core';
import { Component, EventEmitter, Inject, OnDestroy, PLATFORM_ID } from '@angular/core';
import { Router } from '@angular/router';
import { Subscription } from 'rxjs';
import { environment } from '../../../environments/environment';
import { AutoUnsubscribe } from '../../../lib/AutoUnsubscribe';
import { DbTable, StorageKey } from '../../../lib/enums/enums';
import { FooterBarService } from '../../service/footer-bar/footer-bar.service';
import { HeaderLabelService } from '../../service/header-label/header-label.service';
import { QuizService } from '../../service/quiz/quiz.service';
import { StorageService } from '../../service/storage/storage.service';
import { ThemesService } from '../../service/themes/themes.service';
......@@ -10,11 +15,14 @@ import { ThemesService } from '../../service/themes/themes.service';
selector: 'app-theme-switcher',
templateUrl: './theme-switcher.component.html',
styleUrls: ['./theme-switcher.component.scss'],
})
export class ThemeSwitcherComponent {
}) //
@AutoUnsubscribe('_subscriptions') //
export class ThemeSwitcherComponent implements OnDestroy {
public static TYPE = 'ThemeSwitcherComponent';
private previewThemeBackup: string;
private _subscriptions: Array<Subscription> = [];
private _themeChangedEmitter = new EventEmitter<string>();
constructor(
@Inject(PLATFORM_ID) private platformId: Object,
......@@ -22,16 +30,44 @@ export class ThemeSwitcherComponent {
private headerLabelService: HeaderLabelService,
private themesService: ThemesService,
private storageService: StorageService,
private quizService: QuizService,
private router: Router,
) {
this.footerBarService.TYPE_REFERENCE = ThemeSwitcherComponent.TYPE;
footerBarService.replaceFooterElements([
this.footerBarService.footerElemHome, this.footerBarService.footerElemAbout, this.footerBarService.footerElemTranslation,
]);
headerLabelService.headerLabel = 'component.theme_switcher.set_theme';
if (isPlatformBrowser(this.platformId)) {
this.previewThemeBackup = document.getElementsByTagName('html').item(0).dataset['theme'];
}
this._subscriptions.push(this.quizService.quizUpdateEmitter.subscribe(() => {
this._subscriptions.push(this._themeChangedEmitter.subscribe((themeId) => {
this.quizService.quiz.sessionConfig.theme = themeId;
this.quizService.persist();
}));
}));
let footerElements;
if (environment.forceQuizTheme && sessionStorage.getItem(StorageKey.CurrentQuizName)) {
this.quizService.loadDataToEdit(sessionStorage.getItem(StorageKey.CurrentQuizName));
footerElements = [this.footerBarService.footerElemBack];
this.footerBarService.footerElemBack.onClickCallback = () => {
this.router.navigate(['/quiz', 'manager']);
};
} else {
footerElements = [
this.footerBarService.footerElemHome, this.footerBarService.footerElemAbout, this.footerBarService.footerElemTranslation,
];
}
footerBarService.replaceFooterElements(footerElements);
}
public ngOnDestroy(): void {
this._subscriptions.forEach(sub => sub.unsubscribe());
this.footerBarService.footerElemBack.restoreClickCallback();
}
public updateTheme(id: string): void {
......@@ -39,6 +75,7 @@ export class ThemeSwitcherComponent {
document.getElementsByTagName('html').item(0).dataset['theme'] = id;
this.previewThemeBackup = document.getElementsByTagName('html').item(0).dataset['theme'];
this.storageService.create(DbTable.Config, StorageKey.DefaultTheme, this.previewThemeBackup).subscribe();
this._themeChangedEmitter.emit(id);
}
}
......
import { isPlatformBrowser, isPlatformServer } from '@angular/common';
import { EventEmitter, Inject, Injectable, PLATFORM_ID } from '@angular/core';
import { environment } from '../../../environments/environment';
import { themes } from '../../../lib/available-themes';
import { DefaultSettings } from '../../../lib/default.settings';
import { DbState, DbTable, StorageKey } from '../../../lib/enums/enums';
......@@ -47,17 +48,20 @@ export class ThemesService {
return;
}
const themeConfig = await Promise.all<any>(<any>[
this.storageService.read(DbTable.Config, StorageKey.DefaultTheme).toPromise(),
this.storageService.read(DbTable.Config, StorageKey.QuizTheme).toPromise(),
new Promise(resolve => {
if (this.quizService.quiz && this.quizService.quiz.sessionConfig.theme) {
resolve(this.quizService.quiz.sessionConfig.theme);
return;
}
resolve('theme-Material');
}),
]);
const themePromises: Array<Promise<any>> = [];
if (!environment.forceQuizTheme || !this.quizService.quiz) {
themePromises.push(this.storageService.read(DbTable.Config, StorageKey.DefaultTheme).toPromise(),
this.storageService.read(DbTable.Config, StorageKey.QuizTheme).toPromise());
}
themePromises.push(new Promise(resolve => {
if (this.quizService.quiz && this.quizService.quiz.sessionConfig.theme) {
resolve(this.quizService.quiz.sessionConfig.theme);
return;
}
resolve(DefaultSettings.defaultQuizSettings.sessionConfig.theme);
}));
const themeConfig = await Promise.all(themePromises);
const usedTheme = themeConfig[0] || themeConfig[1] || themeConfig[2];
const themeDataset = document.getElementsByTagName('html').item(0).dataset['theme'];
......
......@@ -12,14 +12,16 @@ import { TrackingService } from '../service/tracking/tracking.service';
})
export class ThemesComponent implements OnDestroy {
public static TYPE = 'ThemesComponent';
@Output() public updateTheme = new EventEmitter<string>();
@Output() public previewTheme = new EventEmitter<string>();
@Output() public restoreTheme = new EventEmitter<string>();
private _currentTheme: string;
constructor(
private translateService: TranslateService,
public themesService: ThemesService,
private translateService: TranslateService,
private trackingService: TrackingService,
private themesApiService: ThemesApiService,
) {
......
......@@ -7,6 +7,7 @@ export const environment = {
infoProjectTabEnabled: true,
infoBackendApiEnabled: true,
requireLoginToCreateQuiz: false,
forceQuizTheme: false,
};
export enum DEVICE_TYPES {
......
......@@ -12,6 +12,7 @@ export const environment = {
infoProjectTabEnabled: false,
infoBackendApiEnabled: false,
requireLoginToCreateQuiz: true,
forceQuizTheme: false,
};
export enum DEVICE_TYPES {
......
......@@ -7,6 +7,7 @@ export const environment = {
infoProjectTabEnabled: false,
infoBackendApiEnabled: false,
requireLoginToCreateQuiz: true,
forceQuizTheme: true,
};
export enum DEVICE_TYPES {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment