diff --git a/frontend/src/app/feature/game/blackjack/blackjack.component.ts b/frontend/src/app/feature/game/blackjack/blackjack.component.ts
index e5dc78f..d6bfec4 100644
--- a/frontend/src/app/feature/game/blackjack/blackjack.component.ts
+++ b/frontend/src/app/feature/game/blackjack/blackjack.component.ts
@@ -82,8 +82,7 @@ export default class BlackjackComponent {
if (isGameOver) {
console.log('Game is over, state:', game.state);
- this.refreshUserBalance();
-
+ this.userService.refreshCurrentUser();
this.showGameResult.set(true);
console.log('Game result dialog should be shown now');
}
@@ -96,7 +95,7 @@ export default class BlackjackComponent {
this.blackjackService.startGame(bet).subscribe({
next: (game) => {
this.updateGameState(game);
- this.refreshUserBalance();
+ this.userService.refreshCurrentUser();
this.isActionInProgress.set(false);
},
error: (error) => {
@@ -115,6 +114,9 @@ export default class BlackjackComponent {
this.blackjackService.hit(this.currentGameId()!).subscribe({
next: (game) => {
this.updateGameState(game);
+ if (game.state !== 'IN_PROGRESS') {
+ this.userService.refreshCurrentUser();
+ }
this.isActionInProgress.set(false);
},
error: (error) => {
@@ -139,6 +141,7 @@ export default class BlackjackComponent {
this.blackjackService.stand(this.currentGameId()!).subscribe({
next: (game) => {
this.updateGameState(game);
+ this.userService.refreshCurrentUser();
this.isActionInProgress.set(false);
},
error: (error) => {
@@ -163,6 +166,7 @@ export default class BlackjackComponent {
this.blackjackService.doubleDown(this.currentGameId()!).subscribe({
next: (game) => {
this.updateGameState(game);
+ this.userService.refreshCurrentUser();
this.isActionInProgress.set(false);
},
error: (error) => {
diff --git a/frontend/src/app/feature/game/blackjack/components/game-info/game-info.component.ts b/frontend/src/app/feature/game/blackjack/components/game-info/game-info.component.ts
index 6219b98..fea5453 100644
--- a/frontend/src/app/feature/game/blackjack/components/game-info/game-info.component.ts
+++ b/frontend/src/app/feature/game/blackjack/components/game-info/game-info.component.ts
@@ -18,10 +18,6 @@ import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angula
Spiel Informationen
-
- Guthaben:
- {{ balance | currency: 'EUR' }}
-
Aktuelle Wette:
0 ? 'text-accent-red' : 'text-text-secondary'">
diff --git a/frontend/src/app/feature/game/blackjack/components/game-result/game-result.component.ts b/frontend/src/app/feature/game/blackjack/components/game-result/game-result.component.ts
index 0044e0d..a03ff4e 100644
--- a/frontend/src/app/feature/game/blackjack/components/game-result/game-result.component.ts
+++ b/frontend/src/app/feature/game/blackjack/components/game-result/game-result.component.ts
@@ -86,7 +86,7 @@ export class GameResultComponent {
visible = false;
get isWin(): boolean {
- return this.gameState === GameState.PLAYER_WON;
+ return this.gameState === GameState.PLAYER_WON || this.gameState === GameState.PLAYER_BLACKJACK;
}
get isLoss(): boolean {
@@ -98,6 +98,7 @@ export class GameResultComponent {
}
getResultTitle(): string {
+ if (this.gameState === GameState.PLAYER_BLACKJACK) return 'Blackjack!';
if (this.isWin) return 'Gewonnen!';
if (this.isLoss) return 'Verloren!';
if (this.isDraw) return 'Unentschieden!';
@@ -105,6 +106,7 @@ export class GameResultComponent {
}
getResultMessage(): string {
+ if (this.gameState === GameState.PLAYER_BLACKJACK) return 'Glückwunsch! Du hast mit einem Blackjack gewonnen!';
if (this.isWin) return 'Glückwunsch! Du hast diese Runde gewonnen.';
if (this.isLoss) return 'Schade! Du hast diese Runde verloren.';
if (this.isDraw) return 'Diese Runde endet unentschieden. Dein Einsatz wurde zurückgegeben.';
@@ -112,6 +114,7 @@ export class GameResultComponent {
}
getResultClass(): string {
+ if (this.gameState === GameState.PLAYER_BLACKJACK) return 'text-emerald font-bold';
if (this.isWin) return 'text-emerald';
if (this.isLoss) return 'text-accent-red';
if (this.isDraw) return 'text-yellow-400';
diff --git a/frontend/src/app/feature/game/blackjack/enum/gameState.ts b/frontend/src/app/feature/game/blackjack/enum/gameState.ts
index 69e3ddf..977e16d 100644
--- a/frontend/src/app/feature/game/blackjack/enum/gameState.ts
+++ b/frontend/src/app/feature/game/blackjack/enum/gameState.ts
@@ -3,4 +3,5 @@ export enum GameState {
IN_PROGRESS = 'IN_PROGRESS',
PLAYER_LOST = 'PLAYER_LOST',
DRAW = 'DRAW',
+ PLAYER_BLACKJACK = 'PLAYER_BLACKJACK',
}
diff --git a/frontend/src/app/service/user.service.ts b/frontend/src/app/service/user.service.ts
index 20573ff..c42ebce 100644
--- a/frontend/src/app/service/user.service.ts
+++ b/frontend/src/app/service/user.service.ts
@@ -1,7 +1,7 @@
import { inject, Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { KeycloakProfile } from 'keycloak-js';
-import { catchError, EMPTY, Observable } from 'rxjs';
+import { BehaviorSubject, catchError, EMPTY, Observable, tap } from 'rxjs';
import { User } from '../model/User';
@Injectable({
@@ -9,20 +9,39 @@ import { User } from '../model/User';
})
export class UserService {
private http: HttpClient = inject(HttpClient);
+ private currentUserSubject = new BehaviorSubject(null);
+ public currentUser$ = this.currentUserSubject.asObservable();
+
+ constructor() {
+ // Initialize with current user data
+ this.getCurrentUser().subscribe();
+ }
public getUser(id: string): Observable {
- return this.http.get(`/backend/user/${id}`).pipe(catchError(() => EMPTY));
+ return this.http.get(`/backend/user/${id}`).pipe(
+ catchError(() => EMPTY),
+ tap(user => this.currentUserSubject.next(user))
+ );
}
public getCurrentUser(): Observable {
- return this.http.get('/backend/user').pipe(catchError(() => EMPTY));
+ return this.http.get('/backend/user').pipe(
+ catchError(() => EMPTY),
+ tap(user => this.currentUserSubject.next(user))
+ );
+ }
+
+ public refreshCurrentUser(): void {
+ this.getCurrentUser().subscribe();
}
public createUser(id: string, username: string): Observable {
return this.http.post('/backend/user', {
keycloakId: id,
username: username,
- });
+ }).pipe(
+ tap(user => this.currentUserSubject.next(user))
+ );
}
public async getOrCreateUser(userProfile: KeycloakProfile) {
diff --git a/frontend/src/app/shared/components/navbar/navbar.component.html b/frontend/src/app/shared/components/navbar/navbar.component.html
index ee95fa2..040e7cf 100644
--- a/frontend/src/app/shared/components/navbar/navbar.component.html
+++ b/frontend/src/app/shared/components/navbar/navbar.component.html
@@ -18,7 +18,7 @@
- Guthaben: {{ balance() | currency: 'EUR' : 'symbol' : '1.2-2' }}
+ {{ balance() | currency: 'EUR' : 'symbol' : '1.2-2' }}
}
diff --git a/frontend/src/app/shared/components/navbar/navbar.component.ts b/frontend/src/app/shared/components/navbar/navbar.component.ts
index adf7b78..3211a4e 100644
--- a/frontend/src/app/shared/components/navbar/navbar.component.ts
+++ b/frontend/src/app/shared/components/navbar/navbar.component.ts
@@ -1,9 +1,10 @@
-import { ChangeDetectionStrategy, Component, inject, OnInit, signal } from '@angular/core';
+import { ChangeDetectionStrategy, Component, inject, OnInit, OnDestroy, signal } from '@angular/core';
import { RouterModule } from '@angular/router';
import { KeycloakService } from 'keycloak-angular';
-
import { CurrencyPipe } from '@angular/common';
import { UserService } from '@service/user.service';
+import { Subscription } from 'rxjs';
+
@Component({
selector: 'app-navbar',
templateUrl: './navbar.component.html',
@@ -11,22 +12,27 @@ import { UserService } from '@service/user.service';
imports: [RouterModule, CurrencyPipe],
changeDetection: ChangeDetectionStrategy.OnPush,
})
-export class NavbarComponent implements OnInit {
+export class NavbarComponent implements OnInit, OnDestroy {
isMenuOpen = false;
private keycloakService: KeycloakService = inject(KeycloakService);
isLoggedIn = this.keycloakService.isLoggedIn();
private userService = inject(UserService);
- private user = this.userService.getCurrentUser();
-
+ private userSubscription: Subscription | undefined;
public balance = signal(0);
ngOnInit() {
- this.user.subscribe((user) => {
+ this.userSubscription = this.userService.currentUser$.subscribe((user) => {
this.balance.set(user?.balance ?? 0);
});
}
+ ngOnDestroy() {
+ if (this.userSubscription) {
+ this.userSubscription.unsubscribe();
+ }
+ }
+
login() {
try {
const baseUrl = window.location.origin;