@page "/counter"

@using System.Text.Json;
@using VeloeKemonoPartyApp.Data;
@using VeloeKemonoPartyApp.Services;
@inject KemonoHttpClient HttpClient

<!--
<h1>Hello, world!</h1>

Welcome to your new app.

<SurveyPrompt Title="How is Blazor working for you?" />
-->
<div class="text-center bg-blue-100">
    <input class="border-2 rounded border-blue-300" @bind-value="SearchText" @bind-value:event="oninput" placeholder="Search by title" />
</div>

@if (!CreatorList.Any())
{
    if (Message != "")
    {
        <div class="p-2 grid grid-cols-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-3">
            <div class="alert alert-danger mt-4">
                <p>@Message</p>
            </div>
        </div>
    }
    else
    {
        <div class="p-2 grid grid-cols-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-3">
            <div class="alert alert-secondary mt-4">
                <p>Loading favorites list...</p>
            </div>
        </div>
    }

}
else
{
    <div class="p-2 grid grid-cols-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-3">
        @foreach (var creator in FilteredCreators)
        {

            <div class="alert alert-secondary mt-4">
                <table style="width:100%;">
                    <tr>
                        <td>
                            <img src="@creator.Icon" style="width:20vw;height:20vw;">
                        </td>
                        <td>
                            <div style="">
                                <a href="/fetchdata/@creator.service/@creator.id">@creator.name</a>
                                <p>@creator.service</p>
                            </div>
                        </td>
                        <td align="right">                         
                                <button class="btn btn-outline-danger" @onclick="@(()=>RemoveFromFavorite(creator))" type="button" value="Add Dir">
                                    <i class="bi bi-dash"></i>
                                </button>
                            
                            <p>@creator.favorited</p>
                        </td>
                    </tr>
                </table>
            </div>

        }
    </div>
}
@code {
    private string SearchText { get; set; }
    private string Message { get; set; } = "";
    private List<Creator> CreatorList { get; set; }


    protected override async Task OnInitializedAsync()
    {
        CreatorList = new List<Creator>();
        SearchText = "";

        int i = 0;
        do
        {
            try
            {
                var json = Preferences.Get("favorites", "[]");
                CreatorList = JsonSerializer.Deserialize<List<Creator>>(json);
                if (CreatorList.Count == 0)
                {
                    Message = "Empty";
                }
                return;
            }
            catch (Exception ex)
            {
                await Task.Delay(1000);
            }
            i++;
        }
        while (i < 5);
        Message = "Getting data failed!";
    }
    private List<Creator> FilteredCreators => CreatorList.Where(
            creator => creator.name.ToLower().Contains(SearchText.ToLower())).Take(100).ToList();

    private async Task OpenLink(string link)
    {
        await Launcher.OpenAsync(link);
    }

    private void AddToFavorite(Creator creator)
    {
        CreatorList.Add(creator);

        Preferences.Set("favorites", JsonSerializer.Serialize(CreatorList));
    }

    private void RemoveFromFavorite(Creator creator)
    {
        CreatorList.Remove(creator);

        Preferences.Set("favorites", JsonSerializer.Serialize(CreatorList));
    }
}