@namespace Shared.Pages
@inject CardPreviewService PreviewService
@page "/agents"

<PageTitle>Chrono CCG - Agents</PageTitle>

<HeadContent>
    <meta name="description"
          content="View and compare all Chrono CCG agents. Analyze stats, factions, and efficiency to build the perfect deck."/>
</HeadContent>

<div class="agents-page">
    <TelerikGrid Data="@agents"
                 Sortable="true"
                 FilterMode="GridFilterMode.FilterRow"
                 Pageable="true"
                 PageSize="250"
                 Resizable="true"
                 Height="850px"
                 Groupable="true"
                 class="agents-grid">
        <GridColumns>
            <GridColumn Field="@nameof(CardData.IsImmortalized)" Title="Im." Width="120px">
                <Template>
                    @if (((CardData)context).IsImmortalized)
                    {
                        <i class="bi bi-star-fill" style="color: #ffd700;" title="Immortalized"></i>
                    }
                </Template>
            </GridColumn>
            <GridColumn Field="@nameof(CardData.Name)" Title="Card" Width="220px">
                <Template>
                    @{
                        var card = (CardData)context;
                    }
                    <div class="agent-name-cell"
                         @onmouseenter="@(e => PreviewService.Show(card, e.ClientX, e.ClientY))"
                         @onmouseleave="@(() => PreviewService.Hide())">
                        <img src="@(card.ImagePath)" alt="@(card.Name)"
                             class="agent-thumb"/>
                        <span>@(card.Name)</span>
                    </div>
                </Template>
            </GridColumn>
            <GridColumn Field="@nameof(CardData.Cost)" Title="Cost" Width="120px"/>
            <GridColumn Field="@nameof(CardData.StatEfficiency)" Title="SE" Width="120px">
                <Template>
                    @(((CardData)context).StatEfficiency)
                </Template>
            </GridColumn>
            <GridColumn Field="@nameof(CardData.Syndicate)" Title="Faction" Width="140px"/>
            <GridColumn Field="@nameof(CardData.Attack)" Title="ATK" Width="120px"/>
            <GridColumn Field="@nameof(CardData.Health)" Title="HP" Width="120px"/>
            <GridColumn Field="@nameof(CardData.Description)" Title="Description" Width="400px"/>

        </GridColumns>
    </TelerikGrid>
</div>

@code {
    private List<CardData> agents = [];

    protected override void OnInitialized()
    {
        agents = CardDatabase.Cards
            .Where(c => c.Category is "Agent" or "Immortalized")
            .OrderBy(c => c.Cost)
            .ThenBy(c => c.Name)
            .ToList();
    }

}