Skip to content
Snippets Groups Projects
Commit 31b94b95 authored by narindra.rajohnso's avatar narindra.rajohnso
Browse files

correct score display

parent 5cace1cd
No related branches found
No related tags found
No related merge requests found
...@@ -3,6 +3,7 @@ import {ActivatedRoute, Router} from "@angular/router"; ...@@ -3,6 +3,7 @@ import {ActivatedRoute, Router} from "@angular/router";
import {QuizzService} from "./quizz.service"; import {QuizzService} from "./quizz.service";
import {SessionService} from "../login/session.service"; import {SessionService} from "../login/session.service";
import {Session} from "../login/session-model"; import {Session} from "../login/session-model";
import {Subscription} from "rxjs";
@Component({ @Component({
selector: 'app-homepage', selector: 'app-homepage',
...@@ -20,7 +21,6 @@ export class HomepageComponent implements OnInit, OnDestroy { ...@@ -20,7 +21,6 @@ export class HomepageComponent implements OnInit, OnDestroy {
async ngOnInit() { async ngOnInit() {
this.loading = true; this.loading = true;
this.quizzService.connetToSocketIo();
this.actRoute.paramMap.subscribe((paramM) => { this.actRoute.paramMap.subscribe((paramM) => {
if (!paramM.has('username')) { if (!paramM.has('username')) {
this.router.navigate(['/', 'login']); this.router.navigate(['/', 'login']);
...@@ -34,7 +34,6 @@ export class HomepageComponent implements OnInit, OnDestroy { ...@@ -34,7 +34,6 @@ export class HomepageComponent implements OnInit, OnDestroy {
this.quizzService.getUserInfo().then((userInfo)=>{ this.quizzService.getUserInfo().then((userInfo)=>{
console.log(userInfo); console.log(userInfo);
this.quizzService.onPlayerNotReady();
this.loading=false; this.loading=false;
}) })
...@@ -43,16 +42,17 @@ export class HomepageComponent implements OnInit, OnDestroy { ...@@ -43,16 +42,17 @@ export class HomepageComponent implements OnInit, OnDestroy {
} }
logOut(){ logOut(){
this.quizzService.socket?.emit("player-not-ready");
this.quizzService.removeSocket();
this.sessionService.deleteToken(); this.sessionService.deleteToken();
this.router.navigate(['/', 'login']); this.router.navigate(['/', 'login']);
//this.sessionService.deleteToken(); //this.sessionService.deleteToken();
this.quizzService.socket.emit("player-not-ready");
this.quizzService.socket.disconnect();
} }
ngOnDestroy() { ngOnDestroy() {
this.quizzService.socket.emit("player-not-ready"); this.quizzService.socket?.emit("player-not-ready");
this.quizzService.removeSocket();
} }
......
<div class="max-w-md mx-auto bg-white rounded shadow p-6" *ngIf="!quizzService.gameFinished"> <div class="max-w-md mx-auto bg-white rounded shadow p-6" *ngIf="!quizzService.gameFinished">
<h2 class="text-2xl font-bold mb-4">Question du quizz</h2>
<div *ngIf="!loadingQuestion"> <div *ngIf="!loadingQuestion">
<h2 class="text-2xl font-bold mb-4">Catégorie: {{ question.category }}</h2>
<p class="text-lg mb-4">{{ question.question }}</p> <p class="text-lg mb-4">{{ question.question }}</p>
<div class="space-y-4"> <div class="space-y-4">
......
...@@ -25,11 +25,11 @@ export class QuizzPlayComponent implements OnInit, OnDestroy { ...@@ -25,11 +25,11 @@ export class QuizzPlayComponent implements OnInit, OnDestroy {
async ngOnInit() { async ngOnInit() {
this.loadingQuestion = true; this.loadingQuestion = true;
this.loadingPlayers = true; this.loadingPlayers = true;
this.quizzService.onPlayerReady();
this.quizzService.onPlayerNotReady(); this.quizzService.onPlayerNotReady();
this.quizzService.onPlayerReady();
this.quizzService.onGameFinished(); this.quizzService.onGameFinished();
this.quizzService.socket.emit("player-ready"); this.quizzService.socket?.emit("player-ready");
this.quizzService.socket.emit("on-game"); this.quizzService.socket?.emit("on-game");
this.questionSubject = this.quizzService.question.subscribe((question) => { this.questionSubject = this.quizzService.question.subscribe((question) => {
this.selectedResponseIndex = undefined; this.selectedResponseIndex = undefined;
this.question = question; this.question = question;
...@@ -43,13 +43,14 @@ export class QuizzPlayComponent implements OnInit, OnDestroy { ...@@ -43,13 +43,14 @@ export class QuizzPlayComponent implements OnInit, OnDestroy {
validateResponse() { validateResponse() {
console.log("validate response:", this.question.possibleResponse[this.selectedResponseIndex!!]); console.log("validate response:", this.question.possibleResponse[this.selectedResponseIndex!!]);
this.quizzService.socket.emit("validate-question", this.selectedResponseIndex); this.quizzService.socket?.emit("validate-question", this.selectedResponseIndex);
} }
restartGame() { restartGame() {
this.quizzService.score = [];
this.quizzService.gameFinished = false; this.quizzService.gameFinished = false;
this.quizzService.socket.emit("player-not-ready"); this.quizzService.socket?.emit("player-not-ready");
this.quizzService.socket.emit("restart-game"); this.quizzService.socket?.emit("restart-game");
this.router.navigate([`/${this.quizzService.username}/play/waiting-players`]); this.router.navigate([`/${this.quizzService.username}/play/waiting-players`]);
} }
......
import { Injectable } from '@angular/core'; import { Injectable } from '@angular/core';
import {BehaviorSubject, map, Subject, tap} from "rxjs"; import {BehaviorSubject, map, Subject, Subscriber, Subscription, tap} from "rxjs";
import {HttpClient} from "@angular/common/http"; import {HttpClient} from "@angular/common/http";
import {Session} from "../login/session-model"; import {Session} from "../login/session-model";
import {SessionService} from "../login/session.service"; import {SessionService} from "../login/session.service";
...@@ -14,7 +14,7 @@ export class QuizzService { ...@@ -14,7 +14,7 @@ export class QuizzService {
private _username!: string; private _username!: string;
private _userInfo!: Session; private _userInfo!: Session;
public userInfoSubject = new Subject<Session>(); public userInfoSubject = new Subject<Session>();
private _socket!: Socket; private _socket!: Socket | undefined;
public question= new Subject<Question>; public question= new Subject<Question>;
public score: { username: string; score: any; }[]=[]; public score: { username: string; score: any; }[]=[];
public gameFinished!: any; public gameFinished!: any;
...@@ -38,16 +38,29 @@ export class QuizzService { ...@@ -38,16 +38,29 @@ export class QuizzService {
get socket(): Socket{ get socket(): Socket | undefined{
return this._socket; return this._socket;
} }
constructor(private httpClient: HttpClient, private sessionService: SessionService) { } constructor(private httpClient: HttpClient, private sessionService: SessionService) { }
removeSocket() {
if (this._socket) {
this._socket?.off("question");
this._socket?.off('players');
this._socket?.off("ready-player");
this._socket?.off("not-ready-player");
this._socket?.off("game-finished");
this._socket.disconnect();
this._socket=undefined;
}
}
async getUserInfo(): Promise<Session> { async getUserInfo(): Promise<Session> {
return new Promise<any>((resolve, reject) => { return new Promise<any>((resolve, reject) => {
this.sessionService.username=this.username;
this.httpClient.get<any>('http://localhost:30992/api/v1/users/' + this.username).subscribe( this.httpClient.get<any>('http://localhost:30992/api/v1/users/' + this.username).subscribe(
response => { response => {
this._userInfo = new Session( this._userInfo = new Session(
...@@ -68,13 +81,14 @@ export class QuizzService { ...@@ -68,13 +81,14 @@ export class QuizzService {
} }
public getQuestion(){ public getQuestion(){
this._socket.on("question", (question) => { this._socket?.on("question", (question) => {
this.question.next(question); this.question.next(question);
}); });
} }
public connetToSocketIo() { public connetToSocketIo() {
const token = this.sessionService.token; const token = this.sessionService.token;
console.log("connect socket token=", token)
this._socket = io('http://localhost:30992', { this._socket = io('http://localhost:30992', {
auth: { auth: {
token: token token: token
...@@ -84,14 +98,14 @@ export class QuizzService { ...@@ -84,14 +98,14 @@ export class QuizzService {
getNbPlayers(){ getNbPlayers(){
this.socket.on('players', (players) => { this.socket?.on('players', (players) => {
console.log("players: ", players); console.log("players: ", players);
this._players.next(players); this._players.next(players);
}); });
} }
onPlayerReady(){ onPlayerReady(){
this.socket.on("ready-player", (username)=>{ this.socket?.on("ready-player", (username)=>{
console.log("ready-player: ", username); console.log("ready-player: ", username);
this.players.pipe( this.players.pipe(
// Utilisez l'opérateur map pour itérer sur chaque élément du tableau // Utilisez l'opérateur map pour itérer sur chaque élément du tableau
...@@ -107,10 +121,10 @@ export class QuizzService { ...@@ -107,10 +121,10 @@ export class QuizzService {
this._players.next(playersUpdated); this._players.next(playersUpdated);
}) })
).subscribe(); ).subscribe();
}) });
} }
onPlayerNotReady(){ onPlayerNotReady(){
this.socket.on("not-ready-player", (username)=>{ this.socket?.on("not-ready-player", (username)=>{
console.log("not-ready-player: ", username); console.log("not-ready-player: ", username);
this.players.pipe( this.players.pipe(
// Utilisez l'opérateur map pour itérer sur chaque élément du tableau // Utilisez l'opérateur map pour itérer sur chaque élément du tableau
...@@ -126,11 +140,12 @@ export class QuizzService { ...@@ -126,11 +140,12 @@ export class QuizzService {
this._players.next(playersUpdated); this._players.next(playersUpdated);
}) })
).subscribe(); ).subscribe();
}) });
} }
onGameFinished(){ onGameFinished(){
this.socket.on("game-finished", (playersScore)=>{ this.socket?.on("game-finished", (playersScore)=>{
this.score=[];
Object.entries(playersScore).forEach(([key, value]) => { Object.entries(playersScore).forEach(([key, value]) => {
this.score.push({username: key, score: value}) this.score.push({username: key, score: value})
}); });
......
...@@ -65,7 +65,7 @@ export class WaitingPlayersComponent implements OnInit, OnDestroy{ ...@@ -65,7 +65,7 @@ export class WaitingPlayersComponent implements OnInit, OnDestroy{
playGame(){ playGame(){
this.waitConfirmPlayer=true; this.waitConfirmPlayer=true;
this.quizzService.socket.emit("player-ready"); this.quizzService.socket?.emit("player-ready");
} }
......
...@@ -12,6 +12,9 @@ export class SessionService { ...@@ -12,6 +12,9 @@ export class SessionService {
public sessionSubject: Subject<Session> = new Subject<Session>() public sessionSubject: Subject<Session> = new Subject<Session>()
private _username!: string;
get session(): Session { get session(): Session {
return this._session return this._session
} }
...@@ -21,9 +24,13 @@ export class SessionService { ...@@ -21,9 +24,13 @@ export class SessionService {
this.sessionSubject.next(this._session) this.sessionSubject.next(this._session)
} }
set username(id: string){
this._username=id;
}
get token(): string { get token(): string {
const username = this.session?.username ?? ""; const storedToken = localStorage.getItem(`${SessionService.LS_SESSION_TOKEN_PREFIX}${this._username}`);
const storedToken = localStorage.getItem(`${SessionService.LS_SESSION_TOKEN_PREFIX}${username}`);
return storedToken ?? ""; return storedToken ?? "";
} }
...@@ -33,8 +40,7 @@ export class SessionService { ...@@ -33,8 +40,7 @@ export class SessionService {
} }
deleteToken() { deleteToken() {
const username = this.session?.username ?? ""; localStorage.removeItem(`${SessionService.LS_SESSION_TOKEN_PREFIX}${this._username}`);
localStorage.removeItem(`${SessionService.LS_SESSION_TOKEN_PREFIX}${username}`);
} }
......
...@@ -5,6 +5,7 @@ import {User} from "./users/user-model"; ...@@ -5,6 +5,7 @@ import {User} from "./users/user-model";
import {FormGroup} from "@angular/forms"; import {FormGroup} from "@angular/forms";
import {LoginService} from "../login/login.service"; import {LoginService} from "../login/login.service";
import {Question} from "./questions/question-model"; import {Question} from "./questions/question-model";
import {SessionService} from "../login/session.service";
interface UserData { interface UserData {
username: string; username: string;
...@@ -32,7 +33,7 @@ export class ManageService { ...@@ -32,7 +33,7 @@ export class ManageService {
private _users = new BehaviorSubject<User[]>([]); private _users = new BehaviorSubject<User[]>([]);
private _questions = new BehaviorSubject<Question[]>([]); private _questions = new BehaviorSubject<Question[]>([]);
constructor(private httpClient: HttpClient, private loginService: LoginService) { constructor(private httpClient: HttpClient, private loginService: LoginService, private sessionService: SessionService) {
} }
get username(): string { get username(): string {
...@@ -53,6 +54,7 @@ export class ManageService { ...@@ -53,6 +54,7 @@ export class ManageService {
async getUserInfo(): Promise<any> { async getUserInfo(): Promise<any> {
return new Promise<any>((resolve, reject) => { return new Promise<any>((resolve, reject) => {
this.sessionService.username=this.username;
this.httpClient.get<any>('http://localhost:30992/api/v1/admins/' + this.username).subscribe( this.httpClient.get<any>('http://localhost:30992/api/v1/admins/' + this.username).subscribe(
response => { response => {
resolve(response.info_user); resolve(response.info_user);
...@@ -240,7 +242,7 @@ export class ManageService { ...@@ -240,7 +242,7 @@ export class ManageService {
let userEdited=this.changeAccountTypeKey(editUsers[usernameSearch]); let userEdited=this.changeAccountTypeKey(editUsers[usernameSearch]);
console.log(userEdited); console.log(userEdited);
return this.httpClient.put( return this.httpClient.put(
`http://localhost:30992/api/v1/admins/${this.username}/users/'${username}`, `http://localhost:30992/api/v1/admins/${this.username}/users/${username}`,
{ ...userEdited } { ...userEdited }
); );
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment