use crate::battle_ticket::{generate_battle_pin, generate_qr_svg};
use maud::{Markup, PreEscaped, html};

pub fn battler_view() -> Markup {
    let pin = generate_battle_pin();
    let qr_svg = generate_qr_svg(&format!("/battle?pin={pin}")).unwrap_or_default();

    html! {
        div class="battler-hero" {
            div class="coming-soon-badge" {
                "⚔️ AutoBattler Arena — Coming soon"
            }
            h2 class="battler-title" {
                "Automated Pokémon Tournament"
            }
            p class="battler-desc" {
                "The Pokémon League arena is currently under active preparation. Scan the generated QR code or enter your battle PIN to preview player check-in."
            }

            // QR Code and Generated PIN Section
            div id="battle-ticket-container" class="my-6 max-w-sm mx-auto p-6 bg-[#fbf8f2] border-2 border-[#c6b297] rounded-2xl shadow-md text-center" {
                (battle_ticket_card(&pin, &qr_svg))
            }

            // Coming Soon Notice
            div class="p-4 bg-[#fcf4e2] border-l-4 border-[#c99335] text-left text-sm text-[#5a4432] rounded-md my-6" {
                p class="font-bold mb-1" { "🌿 Battles Coming Soon" }
                p {
                    "AutoBattler matches are not yet live. When enabled, your scanned QR code will register your selected Pokémon, after which 20-second turns with automatic move fallbacks will commence."
                }
            }

            div class="feature-cards-grid" {
                div class="feature-box" {
                    h4 { "📱 QR Code Check-In" }
                    p { "Admin hosts a tournament and presents QR codes for mobile check-in." }
                }
                div class="feature-box" {
                    h4 { "⏱️ 20-Second Turns" }
                    p { "Quick-turn automated combat ensures battles conclude promptly." }
                }
                div class="feature-box" {
                    h4 { "🏆 Elimination Brackets" }
                    p { "Single elimination tournament brackets with automated round progression." }
                }
                div class="feature-box" {
                    h4 { "📺 Live WebSocket Feed" }
                    p { "Real-time match broadcast with live HP bar updates and combat text." }
                }
            }

            div class="mt-8 pt-6 border-t border-dashed border-stone-300 flex justify-center gap-4" {
                a
                    href="/"
                    class="cottage-btn cottage-btn-primary"
                    hx-get="/pokedex"
                    hx-target="#main-content"
                    hx-push-url="/" {
                    "🌿 Return to Pokédex"
                }
                a
                    href="/debug"
                    class="cottage-btn cottage-btn-secondary"
                    hx-get="/debug"
                    hx-target="#main-content"
                    hx-push-url="/debug" {
                    "🛠️ Tournament Admin Debug"
                }
            }
        }
    }
}

pub fn battle_ticket_card(pin: &str, qr_svg: &str) -> Markup {
    html! {
        div {
            p class="text-xs uppercase font-bold tracking-widest text-[#5b7c60] mb-2" {
                "Player Battle Pass"
            }

            div class="inline-block p-3 bg-white border border-[#e3d5c1] rounded-xl shadow-inner my-2" {
                div class="w-48 h-48 flex items-center justify-center mx-auto" {
                    (PreEscaped(qr_svg))
                }
            }

            div class="my-3" {
                p class="text-xs text-stone-500 uppercase font-semibold" {
                    "Player Battle PIN"
                }
                p class="font-mono text-3xl font-bold tracking-widest text-[#5a4432] my-1" {
                    (pin)
                }
                p class="text-xs text-stone-500 italic" {
                    "Scan QR code or use PIN above to enter arena"
                }
            }

            button
                type="button"
                class="cottage-btn cottage-btn-secondary text-xs mt-2"
                hx-get="/battler/ticket"
                hx-target="#battle-ticket-container" {
                "🔄 Generate New PIN & QR"
            }
        }
    }
}

pub fn battle_coming_soon_view(pin: Option<&str>) -> Markup {
    html! {
        div class="battler-hero" {
            div class="coming-soon-badge" {
                "⚔️ Player Match — Coming soon"
            }
            h2 class="battler-title" {
                "Match Lobby"
            }
            @if let Some(p) = pin {
                div class="my-4 p-4 bg-[#fbf8f2] border border-[#c6b297] rounded-xl inline-block" {
                    p class="text-xs text-stone-500 uppercase font-bold" { "Entered Battle PIN" }
                    p class="font-mono text-2xl font-bold text-[#5a4432]" { (p) }
                }
            }
            p class="battler-desc" {
                "Battling with other trainers is coming soon! Please check back shortly when the Pokémon League tournament begins."
            }
            div class="mt-6 flex justify-center gap-4" {
                a
                    href="/"
                    class="cottage-btn cottage-btn-primary"
                    hx-get="/pokedex"
                    hx-target="#main-content"
                    hx-push-url="/" {
                    "🌿 Return to Pokédex"
                }
            }
        }
    }
}