@page "/pokemonsleep/add-new-pokemon"

@inject IPokemonService PokemonService
@inject NavigationManager Navigation

@attribute [StreamRendering]
@rendermode InteractiveServer


<PageTitle>Add New Pokémon</PageTitle>


<div class="top-row bg-secondary bg-gradient ml-0 py-3">
    <div class="row">
        <div class="col-12 text-center">
            <h1 class="text-primary">Pokémon Sleep</h1>
        </div>
    </div>
</div>
@if (isSubmitting)
{
    <p><em>Submitting...</em></p>
}
else
{
    <div class="w-50 mt-5 m-auto " style="box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);">

        <div class="card-header bg-secondary bg-gradient ml-0 py-3">
            <div class="row">
                <div class="col-12 text-center">
                    <h2 class="text-info">Add New Pokémon</h2>
                </div>
            </div>
        </div>


        <div class="container  shadow m-lg-1" >
            <EditForm class=" col mb-3" Model="NewPokemon" OnValidSubmit="HandleSubmit">
                <DataAnnotationsValidator />

                <!-- Section 1 -->
                <div class="row m-auto">
                    <div class="col-sm-3 input-group input-group-sm mb-3 ">
                        <!-- Pokemon #-->
                        <span for="PokemonId" class="input-group-text">#</span>
                        <InputNumber min="0" placeholder="Pokedex #" id="PokemonId" @bind-Value="NewPokemon.PokemonId" class="form-control" required />
                        <!-- Pokemon Name-->
                        <InputText placeholder="Pokemon Name" id="PokemonName" @bind-Value="NewPokemon.PokemonName" class="form-control" required />
                    </div>
                </div>

                <!-- Section 2 -->
                <div class="row m-auto">
                    <div class="col-sm-3 input-group input-group-sm mb-3">
                        <!-- Variation Check -->
                        <InputCheckbox id="IsVariation" @bind-Value="NewPokemon.IsVariation" @onclick="@Toggle" class=" form-check-input" style="border: 1px solid black;" />
                        <span for="IsVariation" class="input-group-text">Variation?</span>
                        <!-- Variation Region Input -->
                        <InputText placeholder="What Variant? (Alolan, Paldean)" hidden="@HideLabel" id="VariationName" @bind-Value="NewPokemon.VariationName" class="form-control" />
                    </div>
                </div>


                <!-- Section 3 -->
                <div class="row mb-3 m-auto" >
                    <label for="SleepType" class="form-label">Sleep Type</label>
                    <InputSelect id="SleepType" @bind-Value="NewPokemon.SleepType" class="form-select">
                        <option hidden value="">Dozing / Snoozing / Slumbering</option>
                        <option value="Dozing">Dozing</option>
                        <option value="Snoozing">Snoozing</option>
                        <option value="Slumbering">Slumbering</option>
                    </InputSelect>
                </div>

                <!-- Section 4 -->
                <div class="row mb-3 m-auto">
                    <label for="Speciality" class="form-label">Specialty</label>
                    <InputSelect id="SleepType" @bind-Value="NewPokemon.Speciality" class="form-select">
                        <option hidden value="">Berries / Ingredients / Skills</option>
                        <option value="Berries">Berries</option>
                        <option value="Ingredients">Ingredients</option>
                        <option value="Skills">Skills</option>
                    </InputSelect>
                </div>
                <button type="submit" class="btn btn-primary mb-3">Add Pokémon</button>
                <button type="button" class="btn btn-secondary mb-3" @onclick="@Cancel">Cancel</button>
            </EditForm>
        </div>
    </div>
}





@code {

    private bool HideLabel { get; set; } = true;
    private void Toggle()
    {
        HideLabel = !HideLabel;
    }

    private Pokemon NewPokemon = new Pokemon
        {
            PokemonId = 0, // Or any default ID logic
            PokemonName = string.Empty, // Required fields cannot be null
            SleepType = string.Empty,
            Speciality = string.Empty,
            IsVariation = false
        };
    private bool isSubmitting = false;

    private bool ToggleVariationName { get; set; }

    private void onDisable()
    {
        this.ToggleVariationName = true;
    }
    private async Task HandleSubmit()
    {
        isSubmitting = true;
        await PokemonService.AddPokemonAsync(NewPokemon);
        isSubmitting = false;
        Navigation.NavigateTo("/pokemonsleep");
    }

    protected void Cancel(MouseEventArgs e)
    {
        Console.WriteLine("Testing in Cancel");
        Navigation.NavigateTo("/pokemonsleep");
    }

}