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';
    }
  }
}