Updates quiz renaming component to allow custom names

parent 7cdea906
Pipeline #24023 failed with stages
in 1 minute and 31 seconds
<div *ngFor="let duplicateQuiz of fileUploadService.duplicateQuizzes; let i = index">
<div class="d-flex flex-column"
*ngFor="let duplicateQuiz of fileUploadService.duplicateQuizzes">
<h4>{{'component.quiz_rename.rename' | translate:{NAME: duplicateQuiz.quizName} }}</h4>
<button *ngFor="let renameRecommendation of duplicateQuiz.renameRecommendation"
(click)="sendRecommendation(duplicateQuiz, renameRecommendation)"
class="btn btn-secondary rounded p-2 my-2 rename-recommendation">{{renameRecommendation}}
</button>
<div class="mt-2">
<p>{{'component.quiz_rename.custom.title' | translate}}</p>
<label class="d-block">
<input type="text"
class="p-2 border-0 w-100 rounded ng-touched"
[(ngModel)]="quizName"
(keyup)="checkIsQuizNameAvailable()"
[placeholder]="'component.quiz_rename.custom.input' | translate"/>
<ng-container *ngIf="quizName.length > 3">
<ng-container *ngIf="isQuiznameAvailable">
<p>{{'component.quiz_rename.custom.available' | translate}}</p>
<button class="btn btn-secondary"
(click)="sendQuizName(duplicateQuiz)">
<span>{{'component.quiz_rename.custom.select-quiz' | translate}}</span>
</button>
</ng-container>
<ng-container *ngIf="!isQuiznameAvailable">
<p *ngIf="isQueringQuizname">{{'component.quiz_rename.custom.please-wait' | translate}}</p>
<ng-container *ngIf="!isQueringQuizname">
<p *ngIf="isQuiznameMalformed">{{'component.quiz_rename.custom.malformed' | translate}}</p>
<p *ngIf="!isQuiznameMalformed">{{'component.quiz_rename.custom.already-taken' | translate}}</p>
</ng-container>
</ng-container>
</ng-container>
</label>
</div>
</div>
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { checkABCDOrdering } from '../../../lib/checkABCDOrdering';
import { QuizEntity } from '../../../lib/entities/QuizEntity';
import { MessageProtocol } from '../../../lib/enums/Message';
import { IDuplicateQuiz } from '../../../lib/interfaces/quizzes/IDuplicateQuiz';
import { QuizApiService } from '../../service/api/quiz/quiz-api.service';
import { FileUploadService } from '../../service/file-upload/file-upload.service';
import { FooterBarService } from '../../service/footer-bar/footer-bar.service';
......@@ -12,10 +15,16 @@ import { FooterBarService } from '../../service/footer-bar/footer-bar.service';
})
export class QuizRenameComponent implements OnInit {
public static TYPE = 'QuizRenameComponent';
public isQuiznameAvailable: boolean;
public isQueringQuizname: boolean;
public quizName = '';
public isQuiznameMalformed: boolean;
constructor(public readonly fileUploadService: FileUploadService,
private readonly footerBarService: FooterBarService,
private readonly router: Router,
constructor(
public readonly fileUploadService: FileUploadService,
private readonly footerBarService: FooterBarService,
private readonly router: Router,
private readonly quizApiService: QuizApiService,
) {
this.footerBarService.TYPE_REFERENCE = QuizRenameComponent.TYPE;
this.footerBarService.replaceFooterElements([this.footerBarService.footerElemBack]);
......@@ -36,6 +45,27 @@ export class QuizRenameComponent implements OnInit {
reader.readAsText(file);
}
public checkIsQuizNameAvailable(): void {
this.isQuiznameAvailable = false;
this.isQuiznameMalformed = false;
const name = this.quizName.trim().toLowerCase();
if (name.length < 3 || name.startsWith('demo quiz') || checkABCDOrdering(name)) {
this.isQuiznameMalformed = true;
return;
}
this.isQueringQuizname = true;
this.quizApiService.getQuizStatus(this.quizName).subscribe(status => {
this.isQueringQuizname = false;
this.isQuiznameAvailable = status.step === MessageProtocol.Unavailable;
});
}
public sendQuizName(duplicateQuiz: IDuplicateQuiz): void {
this.sendRecommendation(duplicateQuiz, this.quizName);
}
public ngOnInit(): void {
if (!this.fileUploadService.renameFilesQueue) {
this.router.navigate(['/']);
......
......@@ -5,6 +5,7 @@ import { ActivatedRoute, Router } from '@angular/router';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { Subscription } from 'rxjs';
import { AutoUnsubscribe } from '../../../lib/AutoUnsubscribe';
import { checkABCDOrdering } from '../../../lib/checkABCDOrdering';
import { DefaultSettings } from '../../../lib/default.settings';
import { AbstractAnswerEntity } from '../../../lib/entities/answer/AbstractAnswerEntity';
import { DefaultAnswerEntity } from '../../../lib/entities/answer/DefaultAnswerEntity';
......@@ -407,7 +408,7 @@ export class HomeComponent implements OnInit, OnDestroy {
this.selectQuizAsExisting(quizName);
} else if (quizName.toLowerCase() === 'demo quiz') {
this.selectQuizAsDemoQuiz();
} else if (this.checkABCDOrdering(quizName.toLowerCase())) {
} else if (checkABCDOrdering(quizName)) {
this.selectQuizAsAbcdQuiz();
} else {
if (quizName.length > 3) {
......@@ -483,20 +484,6 @@ export class HomeComponent implements OnInit, OnDestroy {
}
}
private checkABCDOrdering(name: string): boolean {
let ordered = true;
if (!name || name.length < 2 || name.charAt(0) !== 'a') {
return false;
}
for (let i = 1; i < name.length; i++) {
if (name.charCodeAt(i) !== name.charCodeAt(i - 1) + 1) {
ordered = false;
break;
}
}
return ordered;
}
private async addDemoQuiz(): Promise<QuizEntity> {
const value = await this.quizApiService.generateDemoQuiz(this.i18nService.currentLanguage.toString()).toPromise();
value.sessionConfig = Object.assign({}, DefaultSettings.defaultQuizSettings.sessionConfig, value.sessionConfig);
......
export function checkABCDOrdering(name: string): boolean {
let ordered = true;
name = name.trim().toLowerCase();
if (!name || name.length < 2 || name.charAt(0) !== 'a') {
return false;
}
for (let i = 1; i < name.length; i++) {
if (name.charCodeAt(i) !== name.charCodeAt(i - 1) + 1) {
ordered = false;
break;
}
}
return ordered;
}
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