SZUT/casino
SZUT/casino
Archived
3
1
Fork 0
Code Issues Pull requests 2 Releases 162 Packages 2 Wiki Activity Actions

feat(debt-dialog): add debt warning dialog for negative balance

Browse source
This commit is contained in:
Jan-Marlon Leibl 2025-04-02 12:50:51 +02:00
commit 68a226b677
Signed by: jleibl
GPG key ID: 300B2F906DC6F1D5
7 changed files with 182 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

7
frontend/src/app/feature/game/blackjack/blackjack.component.html
View file

@ -51,3 +51,10 @@
[show]="showGameResult()"
(gameResultClosed)="onCloseGameResult()"
></app-game-result>
<!-- Debt Dialog -->
<app-debt-dialog
[amount]="debtAmount()"
[show]="showDebtDialog()"
(dialogClosed)="onCloseDebtDialog()"
></app-debt-dialog>

16
frontend/src/app/feature/game/blackjack/blackjack.component.ts
View file

@ -14,6 +14,7 @@ import { GameState } from '@blackjack/enum/gameState';
import { NavbarComponent } from '@shared/components/navbar/navbar.component';
import { UserService } from '@service/user.service';
import { timer } from 'rxjs';
import { DebtDialogComponent } from '@shared/components/debt-dialog/debt-dialog.component';
@Component({
selector: 'app-blackjack',
@ -27,6 +28,7 @@ import { timer } from 'rxjs';
GameControlsComponent,
GameInfoComponent,
GameResultComponent,
DebtDialogComponent,
],
templateUrl: './blackjack.component.html',
changeDetection: ChangeDetectionStrategy.OnPush,
@ -48,6 +50,9 @@ export default class BlackjackComponent implements OnInit {
isActionInProgress = signal(false);
currentAction = signal<string>('');
showDebtDialog = signal(false);
debtAmount = signal(0);
ngOnInit(): void {
this.userService.currentUser$.subscribe((user) => {
if (user) {
@ -167,7 +172,12 @@ export default class BlackjackComponent implements OnInit {
this.blackjackService.doubleDown(this.currentGameId()!).subscribe({
next: (game) => {
this.updateGameState(game);
this.userService.refreshCurrentUser();
this.userService.getCurrentUser().subscribe((user) => {
if (user && user.balance < 0) {
this.debtAmount.set(Math.abs(user.balance));
this.showDebtDialog.set(true);
}
});
this.isActionInProgress.set(false);
},
error: (error) => {
@ -184,6 +194,10 @@ export default class BlackjackComponent implements OnInit {
this.userService.refreshCurrentUser();
}
onCloseDebtDialog(): void {
this.showDebtDialog.set(false);
}
private handleGameError(error: HttpErrorResponse): void {
if (error instanceof HttpErrorResponse) {
if (error.status === 400 && error.error?.error === 'Invalid state') {

2
frontend/src/app/feature/game/blackjack/components/dealer-hand/dealer-hand.component.ts
View file

@ -9,7 +9,7 @@ import { PlayingCardComponent } from '../playing-card/playing-card.component';
imports: [CommonModule, PlayingCardComponent],
template: `
<div class="space-y-4">
<h3 class="section-heading text-2xl mb-4">Croupier's Karten</h3>
<h3 class="section-heading text-2xl mb-4">Dealer's Karten</h3>
<div class="card p-6 !bg-accent-red">
<div class="flex justify-center gap-4 min-h-[160px] p-4 border-2 border-red-400 rounded-lg">
@if (cards.length > 0) {

41
frontend/src/app/feature/game/blackjack/components/game-result/game-result.component.ts
View file

@ -13,39 +13,29 @@ import { GameState } from '../../enum/gameState';
<h2 class="modal-heading" [class]="getResultClass()">{{ getResultTitle() }}</h2>
<p class="py-2 text-text-secondary mb-4">{{ getResultMessage() }}</p>
<div
class="bg-deep-blue-light/50 rounded-lg p-5 mb-6 shadow-inner border border-deep-blue-light/30"
>
<div class="bg-deep-blue-light/50 rounded-lg p-5 mb-6 shadow-inner border border-deep-blue-light/30">
<div class="grid grid-cols-2 gap-4">
<div class="text-text-secondary">Einsatz:</div>
<div class="font-medium text-right">{{ amount }} €</div>
<div class="font-medium text-right">{{ amount | currency:'EUR' }}</div>
<div class="text-text-secondary">
{{ isDraw ? 'Zurückgegeben:' : isWin ? 'Gewonnen:' : 'Verloren:' }}
</div>
<div
class="font-medium text-right"
[ngClass]="{
'text-emerald': isWin,
'text-accent-red': isLoss,
'text-yellow-400': isDraw,
}"
>
{{ isLoss ? '-' : '+' }}{{ amount }} €
<div class="font-medium text-right" [ngClass]="{
'text-emerald': isWin,
'text-accent-red': isLoss,
'text-yellow-400': isDraw
}">
{{ isLoss ? '-' : '+' }}{{ isWin ? (amount * 2) : amount | currency:'EUR' }}
</div>
<div class="text-text-secondary border-t border-text-secondary/20 pt-3 font-medium">
Gesamt:
</div>
<div
class="font-medium text-right border-t border-text-secondary/20 pt-3"
[ngClass]="{
'text-emerald': isWin,
'text-accent-red': isLoss,
'text-white': isDraw,
}"
>
{{ isWin ? '+' : isLoss ? '-' : '' }}{{ amount }} €
<div class="text-text-secondary border-t border-text-secondary/20 pt-3 font-medium">Gesamt:</div>
<div class="font-medium text-right border-t border-text-secondary/20 pt-3" [ngClass]="{
'text-emerald': isWin,
'text-accent-red': isLoss,
'text-white': isDraw
}">
{{ isWin ? (amount * 2) : (isDraw ? amount : 0) | currency:'EUR' }}
</div>
</div>
</div>
@ -76,6 +66,7 @@ import { GameState } from '../../enum/gameState';
export class GameResultComponent {
@Input() gameState: GameState = GameState.IN_PROGRESS;
@Input() amount = 0;
@Input() balance = 0;
@Input() set show(value: boolean) {
console.log('GameResultComponent show input changed:', value, 'gameState:', this.gameState);
this.visible = value;