From 32d86f91bececdbb09bcb9590a740e69bf2d40dd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Th=C3=A9ophile=20HUSS?= <theophile.huss@etu.unistra.fr>
Date: Wed, 4 Dec 2024 12:20:12 +0100
Subject: [PATCH 1/2] feat: Add new routes for answers to the real API
---
src/app/services/question.service.ts | 10 +++++++++-
1 file changed, 9 insertions(+), 1 deletion(-)
diff --git a/src/app/services/question.service.ts b/src/app/services/question.service.ts
index a785be0..d4d70a1 100644
--- a/src/app/services/question.service.ts
+++ b/src/app/services/question.service.ts
@@ -6,7 +6,7 @@ import { Observable } from 'rxjs';
providedIn: 'root',
})
export class QuestionService {
- private apiUrl = 'http://klebert-host.com:33036';
+ private apiUrl = 'https://klebert-host.com:33037';
constructor(private http: HttpClient) {}
createQuiz(nbQuestions: number, category?: number, difficulty?: string): Observable<any> {
@@ -21,4 +21,12 @@ export class QuestionService {
}
return this.http.post(`${this.apiUrl}/quiz/create`, body);
}
+
+ getAnswer(codeQuiz: string, questionId: number, answerId: number) {
+ return this.http.post(`${this.apiUrl}/quiz/answer`, {
+ id: codeQuiz,
+ questionID: questionId,
+ answerID: answerId,
+ });
+ }
}
--
GitLab
From a46e0474c68941402e4d0251bf0c5e1a87cc50d2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Th=C3=A9ophile=20HUSS?= <theophile.huss@etu.unistra.fr>
Date: Wed, 4 Dec 2024 12:22:24 +0100
Subject: [PATCH 2/2] feat: User new routes for API to show good answer
---
src/app/modules/home/home.module.ts | 3 +-
.../multiple-choice.component.ts | 5 ++-
.../home/play-quiz/play-quiz.component.html | 5 +--
.../home/play-quiz/play-quiz.component.ts | 33 +++++++++++++++++--
4 files changed, 40 insertions(+), 6 deletions(-)
diff --git a/src/app/modules/home/home.module.ts b/src/app/modules/home/home.module.ts
index cf58e79..375e09f 100644
--- a/src/app/modules/home/home.module.ts
+++ b/src/app/modules/home/home.module.ts
@@ -9,6 +9,7 @@ import { MultipleChoiceComponent } from './play-quiz/multiple-choice/multiple-ch
import { HomePageComponent } from './home-page/home-page.component';
import { BrowserModule } from '@angular/platform-browser';
import { FormPlayQuizComponent } from './form-play-quiz/form-play-quiz.component';
+import { MatIconModule } from '@angular/material/icon';
@NgModule({
declarations: [
@@ -21,6 +22,6 @@ import { FormPlayQuizComponent } from './form-play-quiz/form-play-quiz.component
FormPlayQuizComponent,
],
exports: [MultipleChoiceComponent],
- imports: [CommonModule, ReactiveFormsModule, BrowserModule],
+ imports: [CommonModule, ReactiveFormsModule, BrowserModule, MatIconModule],
})
export class HomeModule {}
diff --git a/src/app/modules/home/play-quiz/multiple-choice/multiple-choice.component.ts b/src/app/modules/home/play-quiz/multiple-choice/multiple-choice.component.ts
index 1db3c6e..b422e51 100644
--- a/src/app/modules/home/play-quiz/multiple-choice/multiple-choice.component.ts
+++ b/src/app/modules/home/play-quiz/multiple-choice/multiple-choice.component.ts
@@ -20,11 +20,14 @@ export class MultipleChoiceComponent implements OnInit {
}
ngOnInit(): void {}
+
async handleClick(id_answer: number, position: number) {
- this.answer_click = position;
const right_answer = await this.getAnswer(id_answer);
+ console.log('right_answer : ', right_answer);
+ console.log('id_answer : ', id_answer);
for (let index = 0; index < this.answers.length; index++) {
this.good_answers[index] = this.answers[index].id == right_answer;
}
+ this.answer_click = position;
}
}
diff --git a/src/app/modules/home/play-quiz/play-quiz.component.html b/src/app/modules/home/play-quiz/play-quiz.component.html
index 5476daa..edf7be2 100644
--- a/src/app/modules/home/play-quiz/play-quiz.component.html
+++ b/src/app/modules/home/play-quiz/play-quiz.component.html
@@ -1,5 +1,6 @@
<div *ngIf="!isLoading" class="main">
<div class="header">
+ <mat-icon (click)="goHome()">home</mat-icon>
<p>Category : {{ actualQuestion.category }}</p>
<div class="title">
<h4>Question {{ actualQuestionIndex + 1 }}/{{ quiz.questions.length }}</h4>
@@ -10,8 +11,8 @@
<app-multiple-choice [answers]="actualQuestion.answers" [getAnswer]="getAnswerBound"></app-multiple-choice>
<div class="next-question">
<button *ngIf="showNextQuestion" (click)="nextQuestion()">
- @if (actualQuestionIndex === this.quiz.questionIndex + this.quiz.questions.length - 1) { Finish quiz } @else
- { Next question }
+ @if (actualQuestionIndex === this.quiz.questionIndex - 1 + this.quiz.questions.length - 1) { Finish quiz }
+ @else { Next question }
</button>
</div>
</div>
diff --git a/src/app/modules/home/play-quiz/play-quiz.component.ts b/src/app/modules/home/play-quiz/play-quiz.component.ts
index d16d672..acea61f 100644
--- a/src/app/modules/home/play-quiz/play-quiz.component.ts
+++ b/src/app/modules/home/play-quiz/play-quiz.component.ts
@@ -2,6 +2,7 @@ import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import Swal from 'sweetalert2';
import { QuestionService } from '../../../services/question.service';
+import { lastValueFrom } from 'rxjs/internal/lastValueFrom';
@Component({
selector: 'app-play-quiz',
@@ -39,7 +40,7 @@ export class PlayQuizComponent implements OnInit {
}
nextQuestion() {
- if (this.actualQuestionIndex === this.quiz.questionIndex + this.quiz.questions.length - 1) {
+ if (this.actualQuestionIndex === this.quiz.questionIndex - 1 + this.quiz.questions.length - 1) {
Swal.fire({
title: 'Quiz finished !',
text: 'Want a rematch ?',
@@ -69,7 +70,35 @@ export class PlayQuizComponent implements OnInit {
async getAnswer(id_tested_answer: number): Promise<number> {
this.showNextQuestion = true;
this.cdr.detectChanges();
- return 0;
+ let good_answer = 0;
+
+ try {
+ const data: any = await lastValueFrom(
+ this.questionSerivce.getAnswer(this.quiz.id, this.actualQuestion.id, id_tested_answer)
+ );
+ console.log('data: ', data);
+ this.score = data.score;
+ good_answer = data.answers.find((answer: any) => answer.isCorrect).id;
+ } catch (error) {
+ console.error('Error fetching answer: ', error);
+ }
+
+ return good_answer;
+ }
+
+ goHome() {
+ Swal.fire({
+ title: 'Would you like to return to the menu ?',
+ icon: 'warning',
+ showCancelButton: true,
+ confirmButtonColor: '#3085d6',
+ cancelButtonColor: '#d33',
+ confirmButtonText: 'BACK TO MENU',
+ }).then((result) => {
+ if (result.isConfirmed) {
+ this.router.navigate(['/']);
+ }
+ });
}
// randomArray(array: any[]): void {
--
GitLab