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:
parent
b6b4be9dbb
commit
3aad300f33
|
@ -1,46 +1,8 @@
|
||||||
@inject IPokemonService PokemonService
|
<div class="pokemon-background">
|
||||||
|
@foreach (var image in _pokemonImages)
|
||||||
<div class="pokemon-background">
|
|
||||||
@foreach (var image in BackgroundImages)
|
|
||||||
{
|
{
|
||||||
<img src="@image.Url"
|
<img src="@image.Url"
|
||||||
class="pokemon-bg-img"
|
class="pokemon-bg-img"
|
||||||
style="left:@image.Left%; top:@image.Top%; width:@image.Size}px; transform:rotate(@(image.Rotation)deg);" />
|
style="left:@image.Left%; top:@image.Top%; width:@image.Size}px; transform:rotate(@(image.Rotation)deg);" />
|
||||||
}
|
}
|
||||||
</div>
|
</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; }
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -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
|
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)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -72,8 +72,8 @@ else
|
||||||
<!-- Image and other Pokemon info -->
|
<!-- Image and other Pokemon info -->
|
||||||
<div class="flip-container" @onclick="() => ToggleImage(SelectedPokemon.Id)">
|
<div class="flip-container" @onclick="() => ToggleImage(SelectedPokemon.Id)">
|
||||||
<div class="flipper @(isShiny[SelectedPokemon.Id] ? "flipped" : "")">
|
<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="front" src="@SelectedPokemon.PokemonImageUrl" />
|
||||||
<img class="back" src="/pokemon_images/shiny/@(SelectedPokemon.IsVariation ? $"{SelectedPokemon.PokemonId}-{SelectedPokemon.VariationName.ToLower()}{SelectedPokemon.PokemonName.ToLower()}" : SelectedPokemon.PokemonId).png" />
|
<img class="back" src="@SelectedPokemon.PokemonShinyImageUrl" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|
|
@ -9,7 +9,7 @@
|
||||||
<PageTitle>Pokémon Sleep</PageTitle>
|
<PageTitle>Pokémon Sleep</PageTitle>
|
||||||
|
|
||||||
<div class="w-100">
|
<div class="w-100">
|
||||||
<!-- <PokemonBackground /> -->
|
<PokemonBackground PokemonImages="pokemonImageUrls" ShinyPokemonImages="pokemonShinyImageUrls" />
|
||||||
|
|
||||||
<PokemonHeader />
|
<PokemonHeader />
|
||||||
|
|
||||||
|
|
|
@ -6,8 +6,9 @@ namespace Portfolio.WebUI.Server.Components.Pages
|
||||||
public partial class PokemonSleep
|
public partial class PokemonSleep
|
||||||
{
|
{
|
||||||
public List<Pokemon> pokemons = new List<Pokemon>();
|
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()
|
protected override async Task OnInitializedAsync()
|
||||||
{
|
{
|
||||||
|
@ -17,6 +18,12 @@ namespace Portfolio.WebUI.Server.Components.Pages
|
||||||
pokemons = result;
|
pokemons = result;
|
||||||
pokemons.Sort((x, y) => x.PokemonId.CompareTo(y.PokemonId));
|
pokemons.Sort((x, y) => x.PokemonId.CompareTo(y.PokemonId));
|
||||||
|
|
||||||
|
foreach (var pokemon in pokemons)
|
||||||
|
{
|
||||||
|
pokemonImageUrls.Add(pokemon.PokemonImageUrl);
|
||||||
|
pokemonShinyImageUrls.Add(pokemon.PokemonShinyImageUrl);
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue