TaikoLocalServer/TaikoWebUI/Pages/PlayResults.razor

@using TaikoWebUI.Services
@using SharedProject.Models.Responses
@using SharedProject.Models
@using SharedProject.Models.Requests
@using SharedProject.Enums
@inject IGameDataService GameDataService
@inject HttpClient Client

@page "/Cards/{baid:int}/PlayResults"

<MudBreadcrumbs Items="breadcrumbs" Class="px-0"></MudBreadcrumbs>

<h1>Play Data</h1>
<MudText Typo="Typo.caption">Card: @Baid</MudText>

<MudGrid Class="my-8">
@if (response is null)
{
    <MudItem xs="12">
        <MudText Align="Align.Center">
            No data.
        </MudText>
    </MudItem>
}
else
{
    <MudItem xs="12">
        <MudDataGrid Items="@response.SongBestData">
            <Columns>
                <Column T="SongBestData" Field="@nameof(SongBestData.SongId)" Title="Song">
                    <CellTemplate>
                        <MudText Typo="Typo.body2" Style="font-weight:bold">@GameDataService.GetMusicNameBySongId(context.Item.SongId)</MudText>
                        <MudText Typo="Typo.caption">@GameDataService.GetMusicArtistBySongId(context.Item.SongId)</MudText>
                    </CellTemplate>
                </Column>
                <Column T="SongBestData" Field="@nameof(SongBestData.Difficulty)" Title="Difficulty">
                    <CellTemplate>
                            <MudTooltip Text="@(context.Item.Difficulty.ToString())" Arrow="true" Placement="Placement.Top">
                            <img src="@($"/images/{context.Item.Difficulty}.png")" alt="@(context.Item.Difficulty)" style="@ICON_STYLE" />
                        </MudTooltip>
                    </CellTemplate>
                </Column>
                <Column T="SongBestData" Field="@nameof(SongBestData.BestScore)" Title="Best Score"/>
                <Column T="SongBestData" Field="@nameof(SongBestData.BestCrown)" Title="Best Crown">
                    <CellTemplate>
                            <MudTooltip Text="@(GetCrownText(context.Item.BestCrown))" Arrow="true" Placement="Placement.Top">
                                <img src="@($"/images/crown_{context.Item.BestCrown}.png")" alt="@(context.Item.BestCrown)" style="@ICON_STYLE" />
                        </MudTooltip>
                    </CellTemplate>
                </Column>
                <Column T="SongBestData" Field="@nameof(SongBestData.BestScoreRank)" Title="Best Rank" />
                <Column T="SongBestData" Field="@nameof(SongBestData.BestRate)" Title="Best Rate"/>
                <Column T="SongBestData" Field="@nameof(SongBestData.GoodCount)" Title="Good"/>
                <Column T="SongBestData" Field="@nameof(SongBestData.OkCount)" Title="Ok"/>
                <Column T="SongBestData" Field="@nameof(SongBestData.MissCount)" Title="Miss"/>
                <Column T="SongBestData" Field="@nameof(SongBestData.ComboCount)" Title="Max Combo"/>
                <Column T="SongBestData" Field="@nameof(SongBestData.DrumrollCount)" Title="Drum Rolls"/>
                <Column T="SongBestData" Field="@nameof(SongBestData.HitCount)" Title="Hit"/>
                <Column T="SongBestData" Field="@nameof(SongBestData.IsFavorite)" Title="Favorite">
                    <CellTemplate>
                        <MudToggleIconButton Toggled="@context.Item.IsFavorite"
                                             ToggledChanged="@(async () => await OnFavoriteToggled(context.Item))"
                                             Icon="@Icons.Material.Filled.FavoriteBorder" Color="@Color.Secondary"
                                             Title="Add to favorites"
                                             ToggledIcon="@Icons.Material.Filled.Favorite" ToggledColor="@Color.Secondary"
                                             ToggledTitle="Remove from favorites"/>
                    </CellTemplate>
                </Column>
            </Columns>
            <PagerContent>
                <MudDataGridPager T="SongBestData"/>
            </PagerContent>
        </MudDataGrid>
    </MudItem>
}
</MudGrid>


@code {

    [Parameter]
    public int Baid { get; set; }

    private SongBestResponse? response;

    private const string ICON_STYLE = "width:25px; height:25px;";

    private readonly List<BreadcrumbItem> breadcrumbs = new()
    {
        new BreadcrumbItem("Cards", href: "/Cards"),
    };

    protected override async Task OnInitializedAsync()
    {
        await base.OnInitializedAsync();
        response = await Client.GetFromJsonAsync<SongBestResponse>($"api/PlayData/{Baid}");
        
        breadcrumbs.Add(new BreadcrumbItem($"Card: {Baid}", href: null, disabled: true));
        breadcrumbs.Add(new BreadcrumbItem("Play Data", href: $"/Cards/{Baid}/PlayResults", disabled: false));
    }

    private async Task OnFavoriteToggled(SongBestData data)
    {
        var request = new SetFavoriteRequest
        {
            Baid = (uint)Baid,
            IsFavorite = !data.IsFavorite,
            SongId = data.SongId
        };
        var result = await Client.PostAsJsonAsync("api/FavoriteSongs", request);
        if (result.IsSuccessStatusCode)
        {
            data.IsFavorite = !data.IsFavorite;
        }
    }

    private static string GetCrownText(CrownType crown)
    {
        return crown switch
        {
            CrownType.None => "Fail",
            CrownType.Clear => "Cleared",
            CrownType.Gold => "Full Combo",
            CrownType.Dondaful => "Donderful Combo",
            _ => ""
        };
    }

}