126 lines
3.3 KiB
TypeScript
126 lines
3.3 KiB
TypeScript
import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
|
|
import { CommonModule } from '@angular/common';
|
|
import { Card } from '../../models/blackjack.model';
|
|
|
|
@Component({
|
|
selector: 'app-game-controls',
|
|
standalone: true,
|
|
imports: [CommonModule],
|
|
template: `
|
|
<div class="flex flex-col gap-4">
|
|
<div class="flex justify-center text-lg mb-5">
|
|
<div class="card p-4">
|
|
<div class="text-emerald font-bold mb-1">Deine Punkte: {{ calculateHandValue(playerCards) }}</div>
|
|
<div class="text-text-secondary">
|
|
Status: <span [class]="getStatusClass(gameState)">{{ getStatusText(gameState) }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex justify-center gap-4">
|
|
<button
|
|
(click)="hit.emit()"
|
|
class="button-primary px-8 py-4 text-lg font-medium min-w-[120px]"
|
|
[disabled]="gameState !== 'IN_PROGRESS'"
|
|
>
|
|
Ziehen
|
|
</button>
|
|
<button
|
|
(click)="stand.emit()"
|
|
class="button-primary px-8 py-4 text-lg font-medium min-w-[120px]"
|
|
[disabled]="gameState !== 'IN_PROGRESS'"
|
|
>
|
|
Halten
|
|
</button>
|
|
<button
|
|
(click)="doubleDown.emit()"
|
|
class="button-primary px-8 py-4 text-lg font-medium min-w-[120px]"
|
|
[disabled]="gameState !== 'IN_PROGRESS' || playerCards.length !== 2"
|
|
>
|
|
Verdoppeln
|
|
</button>
|
|
<button
|
|
(click)="leave.emit()"
|
|
class="bg-accent-red hover:bg-accent-red/80 px-8 py-4 rounded text-lg font-medium min-w-[120px] transition-all duration-300"
|
|
>
|
|
Abbrechen
|
|
</button>
|
|
</div>
|
|
</div>
|
|
`,
|
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
})
|
|
export class GameControlsComponent {
|
|
@Input() playerCards: Card[] = [];
|
|
@Input() gameState: string = 'IN_PROGRESS';
|
|
|
|
@Output() hit = new EventEmitter<void>();
|
|
@Output() stand = new EventEmitter<void>();
|
|
@Output() doubleDown = new EventEmitter<void>();
|
|
@Output() leave = new EventEmitter<void>();
|
|
|
|
calculateHandValue(cards: Card[]): number {
|
|
let sum = 0;
|
|
let aceCount = 0;
|
|
|
|
const rankValues: Record<string, number> = {
|
|
TWO: 2,
|
|
THREE: 3,
|
|
FOUR: 4,
|
|
FIVE: 5,
|
|
SIX: 6,
|
|
SEVEN: 7,
|
|
EIGHT: 8,
|
|
NINE: 9,
|
|
TEN: 10,
|
|
JACK: 10,
|
|
QUEEN: 10,
|
|
KING: 10,
|
|
ACE: 11
|
|
};
|
|
|
|
for (const card of cards) {
|
|
if (!card.hidden) {
|
|
const value = rankValues[card.rank] || 0;
|
|
sum += value;
|
|
if (card.rank === 'ACE') {
|
|
aceCount++;
|
|
}
|
|
}
|
|
}
|
|
|
|
while (sum > 21 && aceCount > 0) {
|
|
sum -= 10;
|
|
aceCount--;
|
|
}
|
|
|
|
return sum;
|
|
}
|
|
|
|
getStatusText(state: string): string {
|
|
switch (state) {
|
|
case 'IN_PROGRESS':
|
|
return 'Spiel läuft';
|
|
case 'PLAYER_WON':
|
|
return 'Gewonnen!';
|
|
case 'PLAYER_LOST':
|
|
return 'Verloren!';
|
|
case 'DRAW':
|
|
return 'Unentschieden!';
|
|
default:
|
|
return state;
|
|
}
|
|
}
|
|
|
|
getStatusClass(state: string): string {
|
|
switch (state) {
|
|
case 'PLAYER_WON':
|
|
return 'text-emerald';
|
|
case 'PLAYER_LOST':
|
|
return 'text-accent-red';
|
|
case 'DRAW':
|
|
return 'text-yellow-400';
|
|
default:
|
|
return 'text-white';
|
|
}
|
|
}
|
|
}
|