SZUT/casino
5
1
Fork 0
Code Issues Pull requests 1 Releases 65 Wiki Activity Actions

style(blackjack): format code for better readability

Browse source
This commit is contained in:
Jan-Marlon Leibl 2025-03-27 15:47:16 +01:00
parent acdbea5a99
commit deac128935
Signed by: jleibl
GPG key ID: 300B2F906DC6F1D5
9 changed files with 139 additions and 121 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -7,55 +7,49 @@ import { animate, style, transition, trigger } from '@angular/animations';
standalone: true,
imports: [CommonModule, CurrencyPipe],
template: `
<div
*ngIf="visible"
[@fadeInOut]
class="modal-bg"
style="z-index: 1000; position: fixed;"
>
<div
class="modal-card"
[@cardAnimation]
>
<div *ngIf="visible" [@fadeInOut] class="modal-bg" style="z-index: 1000; position: fixed;">
<div class="modal-card" [@cardAnimation]>
<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="text-text-secondary">{{ isDraw ? 'Zurückgegeben:' : (isWin ? 'Gewonnen:' : 'Verloren:') }}</div>
<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
'text-yellow-400': isDraw,
}"
>
{{ isLoss ? '-' : '+' }}{{ amount }} €
</div>
<div class="text-text-secondary border-t border-text-secondary/20 pt-3 font-medium">Gesamt:</div>
<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
'text-white': isDraw,
}"
>
{{ isWin ? '+' : (isLoss ? '-' : '') }}{{ amount }} €
{{ isWin ? '+' : isLoss ? '-' : '' }}{{ amount }} €
</div>
</div>
</div>
<button
type="button"
(click)="closeDialog()"
class="button-primary w-full py-2"
>
<button type="button" (click)="closeDialog()" class="button-primary w-full py-2">
Verstanden
</button>
</div>
@ -67,68 +61,66 @@ import { animate, style, transition, trigger } from '@angular/animations';
trigger('fadeInOut', [
transition(':enter', [
style({ opacity: 0 }),
animate('150ms ease-out', style({ opacity: 1 }))
animate('150ms ease-out', style({ opacity: 1 })),
]),
transition(':leave', [
animate('150ms ease-in', style({ opacity: 0 }))
])
transition(':leave', [animate('150ms ease-in', style({ opacity: 0 }))]),
]),
trigger('cardAnimation', [
transition(':enter', [
style({ opacity: 0, transform: 'scale(0.95)' }),
animate('200ms ease-out', style({ opacity: 1, transform: 'scale(1)' }))
])
])
]
animate('200ms ease-out', style({ opacity: 1, transform: 'scale(1)' })),
]),
]),
],
})
export class GameResultComponent {
@Input() gameState: string = '';
@Input() amount: number = 0;
@Input() gameState = '';
@Input() amount = 0;
@Input() set show(value: boolean) {
console.log('GameResultComponent show input changed:', value, 'gameState:', this.gameState);
this.visible = value;
}
@Output() close = new EventEmitter<void>();
@Output() gameResultClosed = new EventEmitter<void>();
visible = false;
get isWin(): boolean {
return this.gameState === 'PLAYER_WON';
}
get isLoss(): boolean {
return this.gameState === 'PLAYER_LOST';
}
get isDraw(): boolean {
return this.gameState === 'DRAW';
}
getResultTitle(): string {
if (this.isWin) return 'Gewonnen!';
if (this.isLoss) return 'Verloren!';
if (this.isDraw) return 'Unentschieden!';
return '';
}
getResultMessage(): string {
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.';
return '';
}
getResultClass(): string {
if (this.isWin) return 'text-emerald';
if (this.isLoss) return 'text-accent-red';
if (this.isDraw) return 'text-yellow-400';
return '';
}
closeDialog(): void {
this.visible = false;
this.close.emit();
this.gameResultClosed.emit();
console.log('Dialog closed by user');
}
}