Pokemon are being retrieved from Database (somehow? maybe revisit later). Form to submit new pokemon created and can be navigated to from /pokemonsleep page, but need to complete functionality.

This commit is contained in:
Kira Jiroux 2025-02-17 22:28:38 -05:00
parent f083ff3f23
commit 9dd4765780
9 changed files with 195 additions and 98 deletions

View File

@ -10,5 +10,6 @@ namespace Portfolio.Application.Services.PokemonService
public interface IPokemonService public interface IPokemonService
{ {
Task<List<Pokemon>> GetAllPokemonAsync(); Task<List<Pokemon>> GetAllPokemonAsync();
Task AddPokemonAsync(Pokemon pokemon);
} }
} }

View File

@ -3,6 +3,7 @@ using Portfolio.Domain.Features.Pokemon;
using System; using System;
using System.Collections.Generic; using System.Collections.Generic;
using System.Linq; using System.Linq;
using System.Net.Http;
using System.Text; using System.Text;
using System.Threading.Tasks; using System.Threading.Tasks;
@ -16,72 +17,16 @@ namespace Portfolio.Application.Services.PokemonService
{ {
_pokemonRepository = pokemonRepository; _pokemonRepository = pokemonRepository;
} }
public async Task AddPokemonAsync(Pokemon pokemon)
{
await _pokemonRepository.AddPokemonAsync(pokemon);
}
public async Task<List<Pokemon>> GetAllPokemonAsync() public async Task<List<Pokemon>> GetAllPokemonAsync()
{ {
return await _pokemonRepository.GetAllPokemonsAsync(); return await _pokemonRepository.GetAllPokemonsAsync();
//return new List<Pokemon>() {
// new Pokemon
// {
// PokemonId = 1,
// PokemonName = "Bulbasaur",
// SleepType = "Dozing",
// Speciality = "Ingredients"
// },
// new Pokemon
// {
// PokemonId = 2,
// PokemonName = "Ivysaur",
// SleepType = "Dozing",
// Speciality = "Ingredients"
// },
// new Pokemon
// {
// PokemonId = 3,
// PokemonName = "Venasaur",
// SleepType = "Dozing",
// Speciality = "Ingredients"
// },
// new Pokemon
// {
// PokemonId = 37,
// PokemonName = "Vulpix",
// SleepType = "Snoozing",
// Speciality = "Berries"
// },
// new Pokemon
// {
// PokemonId = 38,
// PokemonName = "Ninetails",
// SleepType = "Snoozing",
// Speciality = "Berries"
// },
// new Pokemon
// {
// PokemonId = 37,
// PokemonName = "Vulpix",
// IsVariation = true,
// VariationName = "Alolan",
// SleepType = "Slumbering",
// Speciality = "Berries"
// },
// new Pokemon
// {
// PokemonId = 38,
// PokemonName = "Ninetails",
// IsVariation = true,
// VariationName = "Alolan",
// SleepType = "Slumbering",
// Speciality = "Berries"
// },
//};
} }
} }
} }

View File

@ -9,5 +9,6 @@ namespace Portfolio.Domain.Features.Pokemon
public interface IPokemonRepository public interface IPokemonRepository
{ {
Task<List<Pokemon>> GetAllPokemonsAsync(); Task<List<Pokemon>> GetAllPokemonsAsync();
Task AddPokemonAsync(Pokemon pokemon);
} }
} }

View File

@ -17,4 +17,5 @@ namespace Portfolio.Domain.Features.Pokemon
public required string Speciality { get; set; } public required string Speciality { get; set; }
} }
} }

View File

@ -21,5 +21,10 @@ namespace Portfolio.Infrastructure.Repositories
{ {
return await _context.Pokemons.ToListAsync(); return await _context.Pokemons.ToListAsync();
} }
public async Task AddPokemonAsync(Pokemon pokemon)
{
_context.Pokemons.Add(pokemon);
await _context.SaveChangesAsync();
}
} }
} }

View File

@ -0,0 +1,89 @@
@page "/pokemonsleep/add-new-pokemon"
@inject IPokemonService PokemonService
@inject NavigationManager Navigation
<h2>Add New Pokémon</h2>
@if (isSubmitting)
{
<p><em>Submitting...</em></p>
}
else
{
<div class="card shadow border-0 mt-4" style="margin: auto; width: 900px; max-width: 60%; ">
<EditForm Model="NewPokemon" OnValidSubmit="HandleSubmit">
<DataAnnotationsValidator />
<div class="mb-3">
<label for="PokemonName" class="form-label">Pokémon Name</label>
<InputText id="PokemonName" @bind-Value="NewPokemon.PokemonName" class="form-control" required />
</div>
<div class="mb-3">
<label for="PokemonId" class="form-label">Pokédex ID</label>
<InputNumber id="PokemonId" @bind-Value="NewPokemon.PokemonId" class="form-control" required />
</div>
<div class="mb-3">
<label for="IsVariation" class="form-label">Variation?</label>
<InputCheckbox id="IsVariation" @bind-Value="NewPokemon.IsVariation" @onclick="onDisable" class="form-control" required />
</div>
<div class="mb-3">
<label for="VariationName" class="form-label">What Variant? (Alolan, Paldean)</label>
<InputText disabled="@ToggleVariationName" id="VariationName" @bind-Value="NewPokemon.VariationName" class="form-control" required />
</div>
<div class="mb-3">
<label for="SleepType" class="form-label">Sleep Type</label>
<InputSelect id="SleepType" @bind-Value="NewPokemon.SleepType" class="form-select">
<option value="Dozing">Dozing</option>
<option value="Snoozing">Snoozing</option>
<option value="Slumbering">Slumbering</option>
</InputSelect>
</div>
<div class="mb-3">
<label for="Speciality" class="form-label">Specialty</label>
<InputSelect id="SleepType" @bind-Value="NewPokemon.Speciality" class="form-select">
<option value="Berries">Berries</option>
<option value="Ingredients">Ingredients</option>
<option value="Skills">Skills</option>
</InputSelect>
</div>
<button type="submit" class="btn btn-primary">Add Pokémon</button>
<button type="button" class="btn btn-secondary" @onclick="Cancel">Cancel</button>
</EditForm>
</div>
}
@code {
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");
}
}

View File

@ -1,4 +1,5 @@
@page "/pokemonsleep" @page "/pokemonsleep"
@inject IPokemonService PokemonService @inject IPokemonService PokemonService
@attribute [StreamRendering] @attribute [StreamRendering]
@ -6,16 +7,14 @@
<PageTitle>Pokemon Sleep</PageTitle> <PageTitle>Pokemon Sleep</PageTitle>
<h1>Pokemon Sleep</h1> <h1>Pokemon Sleep</h1>
@if (pokemons == null) @if (pokemons == null)
{ {
<p><em>Loading...</em></p> <p><em>Loading...</em></p>
} }
else else
{ {
<div class="card shadow border-0 mt-4" style ="margin: auto; width: 900px; max-width: 60%; "> <div class="card shadow border-0 mt-4" style="margin: auto; width: 900px; max-width: 60%; ">
<div class="card-header bg-secondary bg-gradient ml-0 py-3">
<div class="card-header bg-secondary bg-gradient ml-0 py-3">
<div class="row"> <div class="row">
<div class="col-12 text-center"> <div class="col-12 text-center">
<h1 class="text-info">Available Pokemon</h1> <h1 class="text-info">Available Pokemon</h1>
@ -27,11 +26,21 @@ else
<div class="col-6"> <div class="col-6">
</div> </div>
<div class="col-6 text-end"> <div class="col-6 text-end">
<a asp-controller="Pokemon" asp-action="PokemonCreate" class="btn btn-outline-primary"><i class="bi bi-plus-square"></i> Add New Pokemon</a> <!--
<button @onclick="ShowCreateForm" class="btn btn-outline-primary">
<i class="bi bi-plus-square"></i> Add New Pokemon
</button>
-->
<NavLink class="btn btn-outline-primary" href="pokemonsleep/add-new-pokemon">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-plus-circle-fill" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0M8.5 4.5a.5.5 0 0 0-1 0v3h-3a.5.5 0 0 0 0 1h3v3a.5.5 0 0 0 1 0v-3h3a.5.5 0 0 0 0-1h-3z" />
</svg> Add New Pokemon
</NavLink>
</div> </div>
</div> </div>
<table class="table">
<table class="table">
<thead> <thead>
<tr> <tr>
<th scope="col" style="width: 50%;"></th> <th scope="col" style="width: 50%;"></th>
@ -41,45 +50,89 @@ else
<th scope="col" style="padding-right: 30px;">Speciality</th> <th scope="col" style="padding-right: 30px;">Speciality</th>
<th scope="col"></th> <th scope="col"></th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@foreach (var pokemon in pokemons) @foreach (var pokemon in pokemons)
{ {
string URL = "https://www.serebii.net/pokemonsleep/pokemon/" + pokemon.Id + ".png";
string ShinyURL = "https://www.serebii.net/pokemonsleep/pokemon/shiny/" + pokemon.Id + ".png";
<tr style=" text-align: center; margin:0; padding: 0;"> <tr style=" text-align: center; margin:0; padding: 0;">
<td style="display: block; margin:0; padding: 0;"> @if (pokemon.IsVariation)
<img style=" width: 90px; height: 90px; " src=@URL /> {
<img style=" width: 90px; height: 90px; " src=@ShinyURL /> @if (pokemon.VariationName == "Alolan")
</td> {
<th scope="row">@pokemon.Id</th> string URL = $"/pokemon_images/normal/{pokemon.PokemonId}-{pokemon.VariationName.ToLower()}{pokemon.PokemonName.ToLower()}.png";
<td> @pokemon.PokemonName</td> string ShinyURL = $"/pokemon_images/shiny/{pokemon.PokemonId}-{pokemon.VariationName.ToLower()}{pokemon.PokemonName.ToLower()}.png";
<td>@pokemon.SleepType</td> <td>
<td style="padding-right: 30px;">@pokemon.Speciality</td> <img style=" width: 90px; height: 90px; " src=@URL />
<td> <img style=" width: 90px; height: 90px; " src=@ShinyURL />
<a asp-controller="Pokemon" asp-action="PokemonDelete" asp-route-Id="@pokemon.Id" class="btn btn-danger"> </td>
<i class="bi bi-trash"></i> }
</a> @if (pokemon.VariationName == "Paldean")
</td> {
string URL = $"/pokemon_images/normal/{pokemon.PokemonId}-{pokemon.VariationName.ToLower()}{pokemon.PokemonName.ToLower()}.png";
string ShinyURL = $"/pokemon_images/shiny/{pokemon.PokemonId}-{pokemon.VariationName.ToLower()}{pokemon.PokemonName.ToLower()}.png";
<td>
<img style=" width: 90px; height: 90px; " src=@URL />
<img style=" width: 90px; height: 90px; " src=@ShinyURL />
</td>
}
}
else // Base Case
{
string URL = $"/pokemon_images/normal/{pokemon.PokemonId}.png"; ;
string ShinyURL = $"/pokemon_images/shiny/{pokemon.PokemonId}.png";
<td>
<img style=" width: 90px; height: 90px; " src=@URL />
<img style=" width: 90px; height: 90px; " src=@ShinyURL />
</td>
}
</tr> <th scope="row">@pokemon.PokemonId</th>
}
</tbody>
</table>
</div> @if (pokemon.IsVariation)
{
@if (pokemon.VariationName == "Alolan")
{
<td> Alolan @pokemon.PokemonName</td>
}
@if (pokemon.VariationName == "Paldean")
{
<td> Paldean @pokemon.PokemonName</td>
}
}
else // Base Case
{
<td> @pokemon.PokemonName</td>
}
<td>@pokemon.SleepType</td>
<td style="padding-right: 30px;">@pokemon.Speciality</td>
<td>
<a asp-controller="Pokemon" asp-action="PokemonDelete" asp-route-Id="@pokemon.Id" class="btn btn-danger">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-trash" viewBox="0 0 16 16">
<path d="M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5m2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5m3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0z" />
<path d="M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1zM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4zM2.5 3h11V2h-11z" />
</svg>
</a>
</td>
</tr>
}
</tbody>
</table>
</div>
</div>
</div>
} }
@code { @code {
private List<Pokemon> pokemons = new List<Pokemon>(); private List<Pokemon> pokemons = new List<Pokemon>();
private bool showForm = true;
protected override async Task OnInitializedAsync() protected override async Task OnInitializedAsync()
{ {
// Simulate asynchronous loading to demonstrate streaming rendering
await Task.Delay(500);
var result = await PokemonService.GetAllPokemonAsync(); var result = await PokemonService.GetAllPokemonAsync();
if (result is not null) if (result is not null)
@ -87,4 +140,6 @@ else
pokemons = result; pokemons = result;
} }
} }
} }

View File

Before

Width:  |  Height:  |  Size: 31 KiB

After

Width:  |  Height:  |  Size: 31 KiB

View File

Before

Width:  |  Height:  |  Size: 32 KiB

After

Width:  |  Height:  |  Size: 32 KiB