feat: add double down feature to blackjack game

This commit is contained in:
Jan-Marlon Leibl 2025-03-27 15:40:26 +01:00
parent d90fcdcf1e
commit d2b22b561d
Signed by: jleibl
GPG key ID: 300B2F906DC6F1D5
7 changed files with 190 additions and 61 deletions

View file

@ -1,4 +1,4 @@
import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
import { ChangeDetectionStrategy, Component, Input, Output, EventEmitter } from '@angular/core';
import { CommonModule, CurrencyPipe } from '@angular/common';
import { animate, style, transition, trigger } from '@angular/animations';
@ -11,6 +11,7 @@ import { animate, style, transition, trigger } from '@angular/animations';
*ngIf="visible"
[@fadeInOut]
class="modal-bg"
style="z-index: 1000; position: fixed;"
>
<div
class="modal-card"
@ -52,7 +53,7 @@ import { animate, style, transition, trigger } from '@angular/animations';
<button
type="button"
(click)="visible = false"
(click)="closeDialog()"
class="button-primary w-full py-2"
>
Verstanden
@ -66,16 +67,16 @@ import { animate, style, transition, trigger } from '@angular/animations';
trigger('fadeInOut', [
transition(':enter', [
style({ opacity: 0 }),
animate('300ms ease-out', style({ opacity: 1 }))
animate('150ms ease-out', style({ opacity: 1 }))
]),
transition(':leave', [
animate('200ms ease-in', style({ opacity: 0 }))
animate('150ms ease-in', style({ opacity: 0 }))
])
]),
trigger('cardAnimation', [
transition(':enter', [
style({ opacity: 0, transform: 'scale(0.8)' }),
animate('350ms ease-out', style({ opacity: 1, transform: 'scale(1)' }))
style({ opacity: 0, transform: 'scale(0.95)' }),
animate('200ms ease-out', style({ opacity: 1, transform: 'scale(1)' }))
])
])
]
@ -84,9 +85,12 @@ export class GameResultComponent {
@Input() gameState: string = '';
@Input() amount: number = 0;
@Input() set show(value: boolean) {
console.log('GameResultComponent show input changed:', value, 'gameState:', this.gameState);
this.visible = value;
}
@Output() close = new EventEmitter<void>();
visible = false;
get isWin(): boolean {
@ -121,4 +125,10 @@ export class GameResultComponent {
if (this.isDraw) return 'text-yellow-400';
return '';
}
closeDialog(): void {
this.visible = false;
this.close.emit();
console.log('Dialog closed by user');
}
}