feat(blackjack): add action indicators and loading states

This commit is contained in:
Jan-Marlon Leibl 2025-03-27 15:44:38 +01:00
parent d2b22b561d
commit acdbea5a99
Signed by: jleibl
GPG key ID: 300B2F906DC6F1D5
7 changed files with 208 additions and 27 deletions

View file

@ -5,10 +5,22 @@
<div class="lg:col-span-3 space-y-6 flex flex-col gap-4">
<app-dealer-hand [cards]="dealerCards()"></app-dealer-hand>
<app-player-hand [cards]="playerCards()"></app-player-hand>
<!-- Action message indicator -->
@if (isActionInProgress()) {
<div class="flex justify-center">
<div class="card p-4 flex items-center gap-3 animate-pulse bg-deep-blue-light border border-deep-blue-light/50">
<div class="w-5 h-5 rounded-full border-2 border-white border-t-transparent animate-spin"></div>
<span>{{ currentAction() }}</span>
</div>
</div>
}
@if (gameInProgress()) {
<app-game-controls
[playerCards]="playerCards()"
[gameState]="gameState()"
[isActionInProgress]="isActionInProgress()"
(hit)="onHit()"
(stand)="onStand()"
(doubleDown)="onDoubleDown()"
@ -22,6 +34,7 @@
[balance]="balance()"
[currentBet]="currentBet()"
[gameInProgress]="gameInProgress()"
[isActionInProgress]="isActionInProgress()"
(newGame)="onNewGame($event)"
></app-game-info>
</div>