Commit 91fd717e authored by Christopher Mark Fullarton's avatar Christopher Mark Fullarton
Browse files

Does some refactoring stuff. Optimizes styles and load the mathjax example inline.

parent 3ea3d7a6
......@@ -31,6 +31,7 @@
"src/assets/i18n",
"src/assets/icons",
"src/assets/styles",
"src/assets/mathjax",
"src/assets/serverEndpoint.json"
],
"styles": [
......@@ -96,6 +97,8 @@
"src/assets/fonts",
"src/assets/i18n",
"src/assets/icons",
"src/assets/styles",
"src/assets/mathjax",
"src/assets/serverEndpoint.json"
]
}
......
......@@ -70,7 +70,7 @@
[class.text-danger]="!connectionService.serverAvailable"
data-fa-transform="shrink-5"
data-fa-mask="fas fa-square"></i>
<p class="mb-0 d-inline">
<p class="ml-2 mb-0 d-inline">
<span>Server: </span>
<span>{{'region.header.connection_status.server_status.' + (connectionService.serverAvailable ? 'available' : 'not_available') | translate}}</span>
</p>
......@@ -83,7 +83,7 @@
[class.text-danger]="!connectionService.websocketAvailable"
data-fa-transform="shrink-5"
data-fa-mask="fas fa-square"></i>
<p class="mb-0 d-inline">
<p class="ml-2 mb-0 d-inline">
<span>Websocket: </span>
<span>{{'region.header.connection_status.websocket_status.' + (connectionService.websocketAvailable ? 'connected' : 'not_connected') | translate}}</span>
</p>
......@@ -96,7 +96,7 @@
[class.text-danger]="!localStorageAvailable"
data-fa-transform="shrink-5"
data-fa-mask="fas fa-square"></i>
<p class="mb-0 d-inline">
<p class="ml-2 mb-0 d-inline">
<span>LocalStorage: </span>
<span>{{'region.header.connection_status.localStorage_status.' + (localStorageAvailable ? 'writable' : 'non_writable') | translate}}</span>
</p>
......@@ -109,7 +109,7 @@
[class.text-danger]="!sessionStorageAvailable"
data-fa-transform="shrink-5"
data-fa-mask="fas fa-square"></i>
<p class="mb-0 d-inline">
<p class="ml-2 mb-0 d-inline">
<span>SessionStorage: </span>
<span>{{'region.header.connection_status.sessionStorage_status.' + (sessionStorageAvailable ? 'writable' : 'non_writable') | translate}}</span>
</p>
......@@ -122,7 +122,7 @@
[class.text-danger]="connectionService.rtt > 300 || !connectionService.serverAvailable"
data-fa-transform="shrink-5"
data-fa-mask="fas fa-square"></i>
<p class="mb-0 d-inline">
<p class="ml-2 mb-0 d-inline">
<span>Round-Trip-Time: </span>
<span>{{connectionService.serverAvailable ? (connectionService.rtt + 'ms') : ('region.header.connection_status.server_status.not_available' | translate)}}</span>
</p>
......
......@@ -11,12 +11,15 @@
</button>
</div>
<div class="modal-body">
<ul>
<li *ngFor="let elem of sessions"
(click)="elem.isValid() ? startQuiz(elem) : editQuiz(elem)"
[class]="elem.isValid() ? 'success' : 'failed'"
[innerHTML]="elem.hashtag"></li>
</ul>
<div class="d-flex">
<div *ngFor="let elem of sessions"
class="text-light d-inline mr-2 px-4 py-2 rounded pointer available-quiz"
[class.bg-success]="elem.isValid()"
[class.bg-danger]="!elem.isValid()"
(click)="elem.isValid() ? startQuiz(elem) : editQuiz(elem)">
{{elem.hashtag}}
</div>
</div>
</div>
<div class="modal-footer">
<button type="button"
......
......@@ -7,25 +7,25 @@
<h2 class="text-light mt-4 mt-lg-0"
[innerHTML]="'component.quiz_manager.available_questions_title' | translate"></h2>
<div class="overflow-auto available-questions-view-frame">
<div class="btn-group flex-lg-column d-lg-flex"
id="available_questions_wrapper"
[attr.data-intro]="'component.quiz_manager.description.available_questions' | translate">
<button *ngFor="let elem of selectableQuestionTypes"
(click)="addQuestion(elem.id)"
[id]="elem.id + '_draggable'"
[class]="'btn btn-info mr-2 mr-lg-0 px-lg-2 py-lg-2 mb-lg-2 rounded pointer questionElementWrapper d-flex justify-content-center justify-content-lg-start align-items-center questionType_' + elem.id"
[attr.data-intro]="elem.descriptionType | translate"
[innerHTML]="elem.translationName | translate">
[attr.data-intro]="elem.descriptionType | translate">
{{elem.translationName | translate}}
</button>
</div>
</div>
</div>
<div class="col-12 col-lg-6">
<h2 class="text-light mt-4 mt-lg-0"
[innerHTML]="'component.quiz_manager.added_questions_title' | translate"></h2>
<h2 class="text-light mt-4 mt-lg-0">{{'component.quiz_manager.added_questions_title' | translate}}</h2>
<h4 class="text-light"
*ngIf="!questionGroupItem.questionList.length"
[innerHTML]="'component.quiz_manager.no_added_questions' | translate"></h4>
*ngIf="!questionGroupItem.questionList.length">{{'component.quiz_manager.no_added_questions' | translate}}</h4>
<div class="row">
<div class="col-12">
<ul id="added_questions_wrapper"
......@@ -35,7 +35,8 @@
[class]="'questionElementWrapper d-flex justify-content-center align-items-center px-2 py-2 mb-2 rounded questionType_' + i">
<span [innerHTML]="elem.translationReferrer() | translate"></span>
<span *ngIf="!elem.isValid()"
class="text-warning ml-2">
class="text-warning ml-2"
[title]="'component.quiz_summary.question_failed' | translate">
<i class="fas fa-exclamation-triangle"></i>
</span>
<span class="questionButtonOptions text-right">
......
......@@ -22,14 +22,14 @@ import { TrackingService } from '../../../service/tracking/tracking.service';
export class QuizManagerComponent implements OnDestroy {
public static TYPE = 'QuizManagerComponent';
public readonly questionGroupItem: IQuestionGroup;
private _selectableQuestionTypes = availableQuestionTypes;
get selectableQuestionTypes(): Array<IAvailableQuestionType> {
return this._selectableQuestionTypes;
}
private readonly questionGroupItem: IQuestionGroup;
constructor(
private footerBarService: FooterBarService,
private headerLabelService: HeaderLabelService,
......
......@@ -15,10 +15,12 @@
<div class="row">
<div class="col-12 px-1 mb-2">
<input type="text"
class="text-center rounded w-100 border-0 input-field"
id="hashtag-input-field"
autocomplete="off"
spellcheck="false"
class="text-center w-100 border-0 input-field"
[class.rounded]="!isShowingQuiznameDatalist"
[class.rounded-top]="isShowingQuiznameDatalist"
[(value)]="enteredSessionName"
(input)="parseQuiznameInput($event)"
(focus)="showQuiznameDatalist()"
......@@ -33,11 +35,11 @@
<div class="list-group text-default d-none list-group-flush"
id="hashtag-input-data-list">
<span class="list-group-item list-group-item-action list-group-item-success text-capitalize pointer"
(click)="autoJoinToSession(option)"
*ngFor="let option of sharedService.activeQuizzes">Join {{option}}</span>
*ngFor="let quizname of sharedService.activeQuizzes"
(click)="autoJoinToSession(quizname)">Join {{quizname}}</span>
<span class="list-group-item list-group-item-action text-capitalize pointer"
(click)="selectQuizByList(option)"
*ngFor="let option of ownQuizzes">Use {{option}}</span>
*ngFor="let quizname of ownQuizzes"
(click)="selectQuizByList(quizname)">Use {{quizname}}</span>
<span class="list-group-item list-group-item-action pointer"
(click)="selectQuizByList('Demo Quiz')">Create new Demo Quiz</span>
<span class="list-group-item list-group-item-action pointer"
......@@ -125,7 +127,95 @@
<p>{{'component.hashtag_home.demo_quiz.title.3' | translate}}</p>
</div>
<div class="col-12 px-1 mb-5 mt-2 justify-content-center d-flex mathjax-container">
<div class="mathjax-content-container"
[innerHTML]="sanitizeHTML(mathjax)"></div>
<ng-container *ngTemplateOutlet="mathjaxExample3"></ng-container>
</div>
</div>
<ng-template #mathjaxExample3>
<svg xmlns:xlink="http://www.w3.org/1999/xlink"
height="6.176ex"
viewBox="0 -1580.7 10538.3 2659.1"
width="24.476ex"
xmlns="http://www.w3.org/2000/svg">
<defs>
<path id="a"
d="m-123 694q0 8 5 14t15 6q10 0 15-8t8-19 13-27 27-27q11-7 11-18 0-9-7-15t-17-10-30-19-38-40q-14-15-22-15t-14 6-6 14 11 23 23 25 13 11h-171l-171 1q-1 1-3 3t-5 3-3 5-2 8q0 7 13 20h359q-24 38-24 59z"/>
<path id="b"
d="m34 159q0 109 86 196t186 87q56 0 88-24t33-63q0-29-19-49t-48-21q-19 0-30 10t-11 30 11 34 22 21 14 6h1q0 2-6 6t-21 8-34 4q-30 0-57-14-21-9-43-31-44-44-64-124t-21-116q0-46 26-69 22-24 58-24h4q112 0 185 85 9 10 12 10 4 0 13-9t10-14-9-15-29-28-45-30-64-25-80-11q-75 0-121 48t-47 122z"/>
<path id="c"
d="m202 508q-23 0-33 12t-11 27q0 10 6 30t21 47 45 51 71 35l32 5h12q33 0 39-1 63-11 105-53t60-93 17-111q0-95-47-217t-117-187q-81-75-179-75-100 0-150 78-31 46-31 92v11q0 117 87 211t193 95q61 0 92-31t41-67l3 11q20 83 20 137 0 88-41 124t-93 37q-78 0-121-64 41-6 41-40 0-25-18-44t-44-20zm228-202q0 66-29 94t-68 28q-63 0-111-46-25-28-39-59t-33-102q-18-72-18-105 0-95 100-95 12 0 18 1 77 13 124 90 15 25 35 84t21 110z"/>
</defs>
<g stroke-width="0"
transform="scale(1 -1)">
<g transform="translate(156 -204)">
<path d="m46 676q0 3 5 7h730q5-4 5-7 0-2-169-350t-173-352q-5-7-28-7t-28 7q-3 4-172 352t-170 350zm651-80q0 1-252 1t-252-1q2-5 126-260t126-256z"
stroke-width="1"
transform=""/>
<path d="m630 29q0-20-21-20-5 0-22 16t-94 93l-104 104-105-105q-106-104-109-106-4-2-7-2-8 0-14 6t-7 14q0 7 14 22t94 95l104 104-104 104q-81 81-94 95t-14 22q0 9 6 14t15 5q5 0 7-1 3-2 109-106l105-105 104 104q77 77 94 93t22 16q21 0 21-20 0-7-10-18t-98-98l-104-105 104-105q84-84 96-97t12-19z"
stroke-width="1"
transform="translate(1055)"/>
<g transform="translate(2056)">
<path d="m720 510q0-34-16-62t-39-44-46-27-39-15l-16-3 19-3q19-3 49-14t58-30q22-20 35-36 27-41 27-87v-6q0-23-11-58-43-107-194-123-4-1-259-2h-249v62h108v562h-108v62h225 145q93 0 133-5t82-26q96-48 96-145zm-157 3q0 40-15 65t-30 33-32 11q-7 2-101 2h-92v-242h82q83 1 92 3 96 20 96 128zm27-321q0 115-85 137-1 1-2 1l-105 1h-105v-269h98 9 44q52 0 84 13t52 56q10 24 10 61z"
stroke-width="1"
transform=""/>
<use x="644"
xlink:href="#a"
y="279"/>
</g>
<path d="m84 237t0 13 14 20h581q15-8 15-20t-15-20h-581q-14 7-14 20z"
stroke-width="1"
transform="translate(3097)"/>
<g transform="translate(4384)">
<path d="m0 220h620v60h-620z"/>
<path d="m213 578-13-5q-14-5-40-10t-58-7h-19v46h19q47 2 87 15t56 24 28 22q2 3 12 3 9 0 17-6v-299l1-300q7-7 12-9t24-4 62-2h26v-46h-11q-21 3-159 3-136 0-157-3h-12v46h26q22 0 38 0t25 1 16 3 8 2 6 5 6 4z"
stroke-width="1"
transform="translate(60 676)"/>
<use x="93"
xlink:href="#b"
y="-686"/>
</g>
<path d="m5411 220h1444v60h-1444z"/>
<g transform="translate(5471 676)">
<use xlink:href="#c"/>
<g transform="translate(567)">
<path d="m723 286q-2-2-23-141t-23-142v-3h-638v62h108v556h-108v62h621v-4q2-6 15-124t16-124v-4h-62v4q0 1-2 20t-9 46-17 47q-27 52-74 64t-145 13h-8-70v-234h32q2 0 11 0t14 0 15 2 16 4 15 7 14 10 11 16q10 21 11 59v19h62v-296h-62v19q-1 34-8 54t-24 29-31 11-44 4h-32v-260h71 19q35 0 55 0t48 4 44 10 36 19 32 31 23 44 19 62q10 55 10 57h62z"
stroke-width="1"
transform=""/>
<use x="613"
xlink:href="#a"
y="273"/>
</g>
</g>
<g transform="translate(5668 -736)">
<use xlink:href="#c"/>
<path d="m26 385q-7 7-7 10 0 4 3 16t5 14q2 5 9 5t51 1h53l19 80q3 11 7 29t7 26 6 20 8 17 10 12 14 9 18 2q18-1 25-11t7-19q0-7-9-47t-20-79l-10-37q0-2 50-2h51q7-7 7-11 0-22-13-35h-107l-36-145q-39-160-39-172 0-42 27-42 35 0 68 34t53 84q2 6 5 7t15 2h4q15 0 15-8 0-3-3-12-5-16-18-38t-34-47-51-42-61-17q-30 0-57 15t-39 52q-2 8-2 27v18l35 140q35 141 36 142 0 2-51 2z"
stroke-width="1"
transform="translate(567)"/>
</g>
</g>
<path d="m56 347q0 13 14 20h637q15-8 15-20 0-11-14-19l-318-1h-318q-16 5-16 20zm0-194q0 15 16 20h636q14-10 14-20 0-13-15-20h-637q-14 7-14 20z"
stroke-width="1"
transform="translate(7409 -204)"/>
<g transform="translate(8585 -204)">
<path d="m0 220h1194v60h-1194z"/>
<path d="m462 0q-18 3-129 3-116 0-134-3h-9v46h31q20 0 27 0t17 2 14 5 7 8q1 2 1 54v50h-259v46l151 231q153 232 155 233 2 2 21 2h18l6-6v-460h92v-46h-92v-51q0-41 0-48t6-12q8-7 57-8h29v-46zm-169 211v334l-219-333 109-1z"
stroke-width="1"
transform="translate(60 676)"/>
<path d="m132-11q-34 0-34 33v11l13 28q75 158 109 273l8 24h-32q-38 0-54-3t-39-19q-11-7-22-18t-19-21-9-12q-2-1-15-1-19 0-19 10 0 6 19 35t55 62 71 38q7 2 225 2 160 0 164-1 20-7 20-28 0-31-32-42-6-2-69-2h-64l-3-17q-12-72-12-119 0-52 9-93t19-64 10-28q0-17-14-32t-36-15q-11 0-18 3t-16 24-16 60q-1 9-1 44 0 49 9 105t18 92 10 40h-98l-1-4q0-3-19-79t-43-161-31-97q-11-28-43-28z"
stroke-width="1"
transform="translate(560 676)"/>
<use x="380"
xlink:href="#b"
y="-686"/>
</g>
<g transform="translate(9900 -204)">
<path d="m104 610q0 39 26 62t61 23q34-2 58-25t24-60q0-38-24-61t-60-24q-37 0-61 23t-24 62zm-26-168 95 4 95 4h6v-254q0-201 0-233t-5-46q-13-49-68-83t-130-34q-61 0-101 27t-41 71q0 32 20 51t50 20q28 0 49-18t21-51q0-21-16-47h3q10-2 21-2h3q10 0 20 3t27 21 22 52q2 18 2 222v213q-1 2-3 4t-3 4-3 3-4 2-5 2-9 1-11 1-16 1h-22v62z"
stroke-width="1"
transform="translate(59)"/>
<use x="470"
xlink:href="#a"
y="288"/>
</g>
</g>
</svg>
</ng-template>
......@@ -2,9 +2,7 @@
#landingPageContent {
#arsnova-click-description,
.mathjax-content-container {
fill: #fff;
#arsnova-click-description {
color: #fff;
}
......@@ -35,6 +33,7 @@
.mathjax-container {
font-size: 0.9rem;
fill: #fff;
}
.header-label {
......
import { HttpClient, HttpClientModule } from '@angular/common/http';
import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
import { async, inject, TestBed } from '@angular/core/testing';
import { async, ComponentFixture, inject, TestBed } from '@angular/core/testing';
import { DomSanitizer } from '@angular/platform-browser';
import { RouterTestingModule } from '@angular/router/testing';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { TranslateCompiler, TranslateLoader, TranslateModule } from '@ngx-translate/core';
import { TranslateMessageFormatCompiler } from 'ngx-translate-messageformat-compiler';
import { DefaultSettings } from '../../../lib/default.settings';
import { createTranslateLoader } from '../../../lib/translation.factory';
import { ModalsModule } from '../../modals/modals.module';
import { ActiveQuestionGroupMockService } from '../../service/active-question-group/active-question-group.mock.service';
......@@ -19,8 +21,10 @@ import { CurrentQuizService } from '../../service/current-quiz/current-quiz.serv
import { FooterBarService } from '../../service/footer-bar/footer-bar.service';
import { HeaderLabelService } from '../../service/header-label/header-label.service';
import { I18nService } from '../../service/i18n/i18n.service';
import { SettingsMockService } from '../../service/settings/settings.mock.service';
import { SettingsService } from '../../service/settings/settings.service';
import { SharedService } from '../../service/shared/shared.service';
import { ThemesMockService } from '../../service/themes/themes.mock.service';
import { ThemesService } from '../../service/themes/themes.service';
import { TrackingMockService } from '../../service/tracking/tracking.mock.service';
import { TrackingService } from '../../service/tracking/tracking.service';
......@@ -30,8 +34,12 @@ import { WebsocketService } from '../../service/websocket/websocket.service';
import { HomeComponent } from './home.component';
describe('HomeComponent', () => {
beforeEach(async(() => {
fdescribe('HomeComponent', () => {
let component: HomeComponent;
let fixture: ComponentFixture<HomeComponent>;
let backend: HttpTestingController;
beforeEach(() => {
TestBed.configureTestingModule({
imports: [
RouterTestingModule,
......@@ -53,13 +61,13 @@ describe('HomeComponent', () => {
],
providers: [
FooterBarService,
SettingsService,
{ provide: SettingsService, useClass: SettingsMockService },
{ provide: ConnectionService, useClass: ConnectionMockService },
{ provide: WebsocketService, useClass: WebsocketMockService },
SharedService,
HeaderLabelService,
{ provide: ActiveQuestionGroupService, useClass: ActiveQuestionGroupMockService },
ThemesService,
{ provide: ThemesService, useClass: ThemesMockService },
I18nService,
{ provide: AttendeeService, useClass: AttendeeMockService },
CasService,
......@@ -69,22 +77,65 @@ describe('HomeComponent', () => {
],
declarations: [HomeComponent],
}).compileComponents();
});
beforeEach((() => {
fixture = TestBed.createComponent(HomeComponent);
component = fixture.componentInstance;
fixture.detectChanges();
backend = TestBed.get(HttpTestingController);
}));
it('should create the app', async(inject([HttpClient, HttpTestingController],
(http: HttpClient, backend: HttpTestingController) => {
const fixture = TestBed.createComponent(HomeComponent);
const app = fixture.debugElement.componentInstance;
afterEach(() => {
backend.verify();
});
expect(app).toBeTruthy();
})),
);
it('should be created', () => {
expect(component).toBeTruthy();
it('should render \'arsnova.click\' in the main view', async(() => {
const fixture = TestBed.createComponent(HomeComponent);
fixture.detectChanges();
backend.expectOne(`./assets/i18n/de.json`).flush({});
});
it('should contain a TYPE reference', (() => {
expect(HomeComponent.TYPE).toEqual('HomeComponent');
backend.expectOne(`./assets/i18n/de.json`).flush({});
}));
it('should render \'arsnova.click\' in the main view', () => {
const compiled = fixture.debugElement.nativeElement;
const mainText = compiled.querySelector('#arsnova-click-description').textContent.trim().replace(/\s*\n*/g, '');
backend.expectOne(`./assets/i18n/de.json`).flush({});
expect(mainText).toContain('arsnova.click');
}));
});
describe('#sanitizeHTML', () => {
it('should sanitize a given markup string', inject([DomSanitizer], (sanitizer: DomSanitizer) => {
const markup = '<div><span>TestMarkup</span></div>';
spyOn(sanitizer, 'bypassSecurityTrustHtml').and.callFake(() => {});
component.sanitizeHTML(markup);
backend.expectOne(`./assets/i18n/de.json`).flush({});
expect(sanitizer.bypassSecurityTrustHtml).toHaveBeenCalled();
}));
});
fdescribe('#autoJoinToSession', () => {
it('should join the session by click', async(() => {
spyOn(document.getElementById('joinSession'), 'click').and.callFake(() => {});
component.autoJoinToSession('testquiz').subscribe((value) => {
console.log(value);
}, () => {}, () => {
backend.expectOne(`./assets/i18n/de.json`).flush({});
backend.expectOne(`./assets/mathjax/example_3.svg`).flush({});
backend.expectOne(`${DefaultSettings.httpApiEndpoint}/status/testquiz`).flush({});
expect(document.getElementById('joinSession').click).toHaveBeenCalled();
});
}));
});
});
......@@ -10,7 +10,7 @@ import { IQuestionGroup } from 'arsnova-click-v2-types/src/questions/interfaces'
import { ABCDSingleChoiceQuestion } from 'arsnova-click-v2-types/src/questions/question_choice_single_abcd';
import { questionGroupReflection } from 'arsnova-click-v2-types/src/questions/questionGroup_reflection';
import { SessionConfiguration } from 'arsnova-click-v2-types/src/session_configuration/session_config';
import { Observable, Subscription } from 'rxjs';
import { Observable, of, Subscription } from 'rxjs';
import { DefaultSettings } from '../../../lib/default.settings';
import { AvailableQuizzesComponent } from '../../modals/available-quizzes/available-quizzes.component';
import { ActiveQuestionGroupService } from '../../service/active-question-group/active-question-group.service';
......@@ -41,7 +41,6 @@ export class HomeComponent implements OnInit, OnDestroy {
public isAddingDemoQuiz = false;
public isAddingABCDQuiz = false;
public enteredSessionName = '';
public mathjax = '';
get ownQuizzes(): Array<string> {
return this._ownQuizzes;
......@@ -76,7 +75,6 @@ export class HomeComponent implements OnInit, OnDestroy {
}
private readonly _routerSubscription: Subscription;
private _currentlyAvailableQuizzes: Array<string> = [];
private readonly _ownQuizzes: Array<string> = [];
constructor(
......@@ -96,7 +94,6 @@ export class HomeComponent implements OnInit, OnDestroy {
private sanitizer: DomSanitizer,
private casService: CasService,
private settingsService: SettingsService,
private currentQuiz: CurrentQuizService,
private trackingService: TrackingService,
public sharedService: SharedService,
) {
......@@ -139,10 +136,6 @@ export class HomeComponent implements OnInit, OnDestroy {
}
this.connectionService.initConnection().then(() => {
this.http.get(`${DefaultSettings.httpLibEndpoint}/mathjax/example/third`).subscribe(
(result: string) => {
this.mathjax = result;
});
this.connectionService.socket.subscribe(
(data: IMessage) => {
......@@ -176,10 +169,14 @@ export class HomeComponent implements OnInit, OnDestroy {
}
}
public autoJoinToSession(option): void {
this.selectQuizByList(option);
public autoJoinToSession(quizname): Observable<any> {
return new Observable<void>(subscriber => {
of(this.selectQuizByList(quizname)).subscribe(() => subscriber.complete());
if (isPlatformServer(this.platformId)) {
return;
}
if (isPlatformBrowser(this.platformId)) {
const interval = setInterval(() => {
if (document.getElementById('joinSession').hasAttribute('disabled')) {
return;
......@@ -188,7 +185,7 @@ export class HomeComponent implements OnInit, OnDestroy {
}
document.getElementById('joinSession').click();
}, 10);
}
});
}
public showQuiznameDatalist(): void {
......@@ -207,9 +204,15 @@ export class HomeComponent implements OnInit, OnDestroy {
this.isShowingQuiznameDatalist = false;
}
public selectQuizByList(option: string): void {
this.hideQuiznameDatalist();
this.selectQuizByName(option);
public selectQuizByList(quizname: string): Subscription {
return new Observable<void>(subscriber => {
this.hideQuiznameDatalist();
console.log('selectquizbyname call');
this.selectQuizByName(quizname).subscribe(() => {
console.log('selectquizbyname returns');
subscriber.complete();
});
}).subscribe();
}
public parseQuiznameInput(event: any): void {
......@@ -292,9 +295,9 @@ export class HomeComponent implements OnInit, OnDestroy {
const questionGroup = await new Promise<IQuestionGroup>((resolve) => {
if (this.isAddingDemoQuiz) {
this.addDemoQuiz().then((value) => resolve(value));
this.addDemoQuiz().subscribe((value) => resolve(value));
} else if (this.isAddingABCDQuiz) {
this.addAbcdQuiz().then((value) => resolve(value));
this.addAbcdQuiz().subscribe((value) => resolve(value));
} else if (questionGroupSerialized) {
resolve(questionGroupReflection[questionGroupSerialized.TYPE](questionGroupSerialized));
} else {
......@@ -312,18 +315,6 @@ export class HomeComponent implements OnInit, OnDestroy {
this.reserveQuiz(questionGroup, routingTarget);
}
private test2(): void {
console.log(this.test());
}
private test(): void {
return undefined;
}
private test3(): boolean {
return;
}
private reserveQuiz(questionGroup, routingTarget): Observable<IMessage> {
return new Observable<IMessage>(subscriber => {
this.http.post<IMessage>(`${DefaultSettings.httpApiEndpoint}/quiz/reserve`, {
......@@ -367,7 +358,7 @@ export class HomeComponent implements OnInit, OnDestroy {
});
}
private selectQuizByName(quizname: string): void {
private selectQuizByName(quizname: string): Observable<void> {
this.enteredSessionName = quizname;
this.canJoinQuiz = false;
this.canAddQuiz = false;
......@@ -384,15 +375,16 @@ export class HomeComponent implements OnInit, OnDestroy {
const currentQuizzes = JSON.parse(window.localStorage.getItem('config.owned_quizzes').toLowerCase()) || [];
if (currentQuizzes.find(quiz => quiz === quizname.toLowerCase())) {
this.selectQuizAsExisting(quizname);
return of(this.selectQuizAsExisting(quizname));
} else if (quizname.toLowerCase() === 'demo quiz') {
this.selectQuizAsDemoQuiz();
return of(this.selectQuizAsDemoQuiz());
} else if (this.checkABCDOrdering(quizname.toLowerCase())) {
this.selectQuizAsAbcdQuiz();
return of(this.selectQuizAsAbcdQuiz());
} else {
if (quizname.length > 3) {
this.selectQuizAsDefaultQuiz(quizname);
return this.selectQuizAsDefaultQuiz(quizname);
}
return of(null);
}
}
......@@ -419,36 +411,42 @@ export class HomeComponent implements OnInit, OnDestroy {
this.passwordRequired = this.settingsService.serverSettings.createQuizPasswordRequired;
}
private selectQuizAsDefaultQuiz(quizname): void {
this.http.get(`${DefaultSettings.httpApiEndpoint}/quiz/status/${quizname}`).subscribe((value: IMessage) => {
if (value.status === 'STATUS:SUCCESSFUL') {
switch (value.step) {
case 'QUIZ:EXISTS':
this.canAddQuiz = false;
this.canJoinQuiz = false;
this.passwordRequired = false;
break;
case 'QUIZ:AVAILABLE':
this.canAddQuiz = false;
this.canJoinQuiz = true;
this.passwordRequired = false;
this._provideNickSelection = value.payload.provideNickSelection;
this.casService.casLoginRequired = value.payload.authorizeViaCas;
if (this.casService.casLoginRequired) {
this.casService.quizName = quizname;
private selectQuizAsDefaultQuiz(quizname): Observable<any> {
return new Observable<any>(subscriber => {
console.log('http start');
subscriber.next(of(
this.http.get<IMessage>(`${DefaultSettings.httpApiEndpoint}/quiz/status/${quizname}`).subscribe(value => {
console.log('http returned', value);
if (value.status === 'STATUS:SUCCESSFUL') {
switch (value.step) {
case 'QUIZ:EXISTS':
this.canAddQuiz = false;