kira
/
exciting-aftermath
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Pokemon are being delivered to the pokemon table and pokemon background components; works for table, background still in need of work. But not pertinent.

This commit is contained in:
Kira Jiroux 2025-04-02 10:19:51 -04:00
parent b6b4be9dbb
commit 3aad300f33
5 changed files with 71 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
Portfolio.WebUI.Server/Components/Component/PokemonBackground.razor
View File

@ -1,46 +1,8 @@
@inject IPokemonService PokemonService
<div class="pokemon-background">
@foreach (var image in BackgroundImages)
<div class="pokemon-background">
@foreach (var image in _pokemonImages)
{
<img src="@image.Url"
class="pokemon-bg-img"
style="left:@image.Left%; top:@image.Top%; width:@image.Size}px; transform:rotate(@(image.Rotation)deg);" />
}
</div>
@code {
private List<PokemonImage> BackgroundImages = new();
private Random random = new();
protected override async Task OnInitializedAsync()
{
await LoadPokemonBackgrounds();
}
private async Task LoadPokemonBackgrounds()
{
var pokemonList = await PokemonService.GetAllPokemonAsync(); // Retrieves Pokémon with background URLs
foreach (var pokemon in pokemonList)
{
BackgroundImages.Add(new PokemonImage
{
Url = pokemon.PokemonImageUrl, // URL retrieved from the database
Left = random.Next(0, 100),
Top = random.Next(0, 100),
Size = random.Next(50, 130),
Rotation = random.Next(0, 360)
});
}
}
private class PokemonImage
{
public string Url { get; set; } = "";
public int Left { get; set; }
public int Top { get; set; }
public int Size { get; set; }
public int Rotation { get; set; }
}
}

59
Portfolio.WebUI.Server/Components/Component/PokemonBackground.razor.cs
View File

@ -1,6 +1,63 @@
namespace Portfolio.WebUI.Server.Components.Component
using Microsoft.AspNetCore.Components;
using Portfolio.Domain.Features.Pokemon;
namespace Portfolio.WebUI.Server.Components.Component
{
public partial class PokemonBackground
{
private class PokemonImage
{
public string Url { get; set; } = "";
public int Left { get; set; }
public int Top { get; set; }
public int Size { get; set; }
public int Rotation { get; set; }
}
[Parameter]
public List<string> PokemonImages { get; set; }
[Parameter]
public List<string> ShinyPokemonImages { get; set; }
private List<PokemonImage> _pokemonImages = new List<PokemonImage>();
private List<PokemonImage> _shinyPokemonImages = new List<PokemonImage>();
private Random random = new Random();
protected override async Task OnInitializedAsync()
{
await LoadPokemonBackgrounds();
}
private async Task LoadPokemonBackgrounds()
{
foreach (var pokemonimgurl in PokemonImages)
{
Console.WriteLine(pokemonimgurl);
_pokemonImages.Add(new PokemonImage
{
Url = pokemonimgurl, // URL retrieved from the database
Left = random.Next(0, 100),
Top = random.Next(0, 100),
Size = random.Next(50, 130),
Rotation = random.Next(0, 360)
});
}
foreach (var pokemonimgurl in ShinyPokemonImages)
{
_shinyPokemonImages.Add(new PokemonImage
{
Url = pokemonimgurl, // URL retrieved from the database
Left = random.Next(0, 100),
Top = random.Next(0, 100),
Size = random.Next(50, 130),
Rotation = random.Next(0, 360)
});
}
}
}
}

4
Portfolio.WebUI.Server/Components/Pages/PokemonRate.razor
View File

@ -72,8 +72,8 @@ else
<!-- Image and other Pokemon info -->
<div class="flip-container" @onclick="() => ToggleImage(SelectedPokemon.Id)">
<div class="flipper @(isShiny[SelectedPokemon.Id] ? "flipped" : "")">
<img class="front" src="/pokemon_images/normal/@(SelectedPokemon.IsVariation ? $"{SelectedPokemon.PokemonId}-{SelectedPokemon.VariationName.ToLower()}{SelectedPokemon.PokemonName.ToLower()}" : SelectedPokemon.PokemonId).png" />
<img class="back" src="/pokemon_images/shiny/@(SelectedPokemon.IsVariation ? $"{SelectedPokemon.PokemonId}-{SelectedPokemon.VariationName.ToLower()}{SelectedPokemon.PokemonName.ToLower()}" : SelectedPokemon.PokemonId).png" />
<img class="front" src="@SelectedPokemon.PokemonImageUrl" />
<img class="back" src="@SelectedPokemon.PokemonShinyImageUrl" />
</div>
</div>
<div class="row">

2
Portfolio.WebUI.Server/Components/Pages/PokemonSleep.razor
View File

@ -9,7 +9,7 @@
<PageTitle>Pokémon Sleep</PageTitle>
<div class="w-100">
<!-- <PokemonBackground /> -->
<PokemonBackground PokemonImages="pokemonImageUrls" ShinyPokemonImages="pokemonShinyImageUrls" />
<PokemonHeader />

9
Portfolio.WebUI.Server/Components/Pages/PokemonSleep.razor.cs
View File

@ -6,8 +6,9 @@ namespace Portfolio.WebUI.Server.Components.Pages
public partial class PokemonSleep
{
public List<Pokemon> pokemons = new List<Pokemon>();
public List<string> pokemonImageUrls = new List<string>();
public List<string> pokemonShinyImageUrls = new List<string>();
protected override async Task OnInitializedAsync()
{
@ -17,6 +18,12 @@ namespace Portfolio.WebUI.Server.Components.Pages
pokemons = result;
pokemons.Sort((x, y) => x.PokemonId.CompareTo(y.PokemonId));
foreach (var pokemon in pokemons)
{
pokemonImageUrls.Add(pokemon.PokemonImageUrl);
pokemonShinyImageUrls.Add(pokemon.PokemonShinyImageUrl);
}
}
}
}