//
//  CompactHandView.swift
//  Baccarat
//
//  A compact view showing cards in a horizontal row with overlap.
//

import SwiftUI
import CasinoKit

/// A compact hand view showing cards in a row with overlap.
struct CompactHandView: View {
    let cards: [Card]
    let cardsFaceUp: [Bool]
    let isWinner: Bool
    /// Screen width passed from parent for responsive sizing
    var screenWidth: CGFloat = 400
    
    // MARK: - Environment
    
    @Environment(\.horizontalSizeClass) private var horizontalSizeClass
    
    // MARK: - Computed Properties
    
    /// Whether we're on a large screen (iPad)
    private var isLargeScreen: Bool {
        horizontalSizeClass == .regular
    }
    
    /// Whether we're on a small screen (iPhone SE, etc)
    private var isSmallScreen: Bool {
        !isLargeScreen && screenWidth < Design.Size.smallScreenThreshold
    }
    
    /// WIN badge font size - only scales on iPad
    private var winBadgeFontSize: CGFloat {
        let baseSize: CGFloat = 10
        return isLargeScreen ? baseSize * Design.Size.handScale * Design.Size.largeScreenMultiplier : baseSize
    }
    
    /// Card width - responsive based on screen size
    private var cardWidth: CGFloat {
        if isLargeScreen {
            return Design.Size.cardWidthTableLarge
        } else if isSmallScreen {
            return Design.Size.cardWidthTableSmall
        } else {
            return Design.Size.cardWidthTable
        }
    }
    
    /// Card height based on aspect ratio
    private var cardHeight: CGFloat {
        cardWidth * Design.Size.cardAspectRatio
    }
    
    /// Card overlap - scaled with card size
    private var cardOverlap: CGFloat {
        if isLargeScreen {
            return Design.Size.cardOverlapLarge
        } else if isSmallScreen {
            return Design.Size.cardOverlapSmall
        } else {
            return Design.Size.cardOverlap
        }
    }
    
    private let placeholderSpacing: CGFloat = Design.Spacing.small
    
    /// Fixed container width to prevent resizing during deal
    private var fixedContainerWidth: CGFloat {
        // Max 3 cards: first card full width + 2 more with overlap
        let cardsWidth = cardWidth + (cardWidth + cardOverlap) * 2
        return cardsWidth + Design.Spacing.xSmall * 2
    }
    
    /// Fixed container height
    private var fixedContainerHeight: CGFloat {
        cardHeight + Design.Spacing.xSmall * 2
    }
    
    // MARK: - Body
    
    var body: some View {
        ZStack {
            // Fixed-size container
            Color.clear
                .frame(width: fixedContainerWidth, height: fixedContainerHeight)
            
            // Cards content centered in fixed container
            cardsContent
        }
        .background(winnerBorder)
        .overlay(alignment: .bottom) {
            winBadge
        }
    }
    
    // MARK: - Private Views
    
    private var cardsContent: some View {
        HStack(spacing: cards.isEmpty ? placeholderSpacing : cardOverlap) {
            if cards.isEmpty {
                // Placeholders - no overlap, just side by side
                ForEach(0..<2, id: \.self) { _ in
                    CardPlaceholderView(width: cardWidth)
                }
            } else {
                ForEach(cards.indices, id: \.self) { index in
                    let isFaceUp = index < cardsFaceUp.count ? cardsFaceUp[index] : false
                    CardView(
                        card: cards[index],
                        isFaceUp: isFaceUp,
                        cardWidth: cardWidth
                    )
                    .zIndex(Double(index))
                }
            }
        }
    }
    
    private var winnerBorder: some View {
        RoundedRectangle(cornerRadius: Design.CornerRadius.small)
            .strokeBorder(
                isWinner ? Color.yellow : Color.clear,
                lineWidth: Design.LineWidth.standard
            )
    }
    
    @ViewBuilder
    private var winBadge: some View {
        if isWinner {
            Text("WIN")
                .font(.system(size: winBadgeFontSize, weight: .black))
                .foregroundStyle(.black)
                .padding(.horizontal, Design.Spacing.small)
                .padding(.vertical, Design.Spacing.xxSmall)
                .background(
                    Capsule()
                        .fill(Color.yellow)
                )
                .offset(y: Design.Spacing.small)
        }
    }
}

// MARK: - Previews

#Preview("Empty Hand") {
    ZStack {
        TableBackgroundView()
        CompactHandView(
            cards: [],
            cardsFaceUp: [],
            isWinner: false
        )
    }
}

#Preview("Two Cards") {
    ZStack {
        TableBackgroundView()
        CompactHandView(
            cards: [
                Card(suit: .spades, rank: .king),
                Card(suit: .hearts, rank: .eight)
            ],
            cardsFaceUp: [true, true],
            isWinner: false
        )
    }
}

#Preview("Three Cards - Winner") {
    ZStack {
        TableBackgroundView()
        CompactHandView(
            cards: [
                Card(suit: .spades, rank: .four),
                Card(suit: .hearts, rank: .three),
                Card(suit: .clubs, rank: .two)
            ],
            cardsFaceUp: [true, true, true],
            isWinner: true
        )
    }
}

#Preview("Cards Face Down") {
    ZStack {
        TableBackgroundView()
        CompactHandView(
            cards: [
                Card(suit: .diamonds, rank: .ace),
                Card(suit: .spades, rank: .seven)
            ],
            cardsFaceUp: [false, false],
            isWinner: false
        )
    }
}

