@inject NavigationManager NavManager

<div class="pokemon-background">
    @foreach (var image in BackgroundImages)
    {
        <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();

    // Your specified set of Pokémon numbers
    private readonly int[] AllowedPokemonNumbers = new int[]
    {
        1, 2, 3, 4, 5, 6, 7, 8, 9, 10,
        11, 12, 19, 20, 23, 24, 25, 26, 35, 36,
        37, 38, 39, 40, 50, 51, 52, 53, 54, 55,
        56, 57, 58, 59, 69, 70, 71, 74, 75, 76,
        79, 80, 81, 82, 84, 85, 92, 93, 94, 95,
        104, 105, 115, 122, 127, 132, 133, 134,
        135, 136, 147, 148, 149, 152, 153, 154,
        155, 156, 157, 158, 159, 160, 172, 173,
        174, 175, 176, 179, 180, 181, 185, 194,
        195, 196, 197, 199, 202, 208, 214, 215,
        225, 228, 229, 243, 244, 245, 246, 247,
        248, 280, 281, 282, 287, 288, 289, 302,
        304, 305, 306, 316, 317, 333, 334, 353,
        354, 359, 360, 363, 364, 365, 403, 404,
        405, 425, 426, 438, 439, 447, 448, 453,
        454, 459, 460, 461, 462, 468, 470, 471,
        475, 627, 628, 700, 702, 736, 737, 738,
        759, 760, 764, 778, 845, 906, 907, 908,
        909, 910, 911, 912, 913, 914, 921, 922,
        923, 980
    };

    protected override void OnInitialized()
    {
        GeneratePokemonBackground();
    }

    private void GeneratePokemonBackground()
    {
        var normalPath = $"/pokemon_images/normal/";
        var shinyPath = $"/pokemon_images/shiny/";

        for (int i = 0; i < 30; i++) // Generate 30 Pokémon images
        {
            int pokemonNumber = AllowedPokemonNumbers[random.Next(AllowedPokemonNumbers.Length)];

            // 10% chance to use a shiny version
            bool isShiny = random.NextDouble() < 0.1;
            string imageUrl = isShiny
                ? $"{shinyPath}{pokemonNumber}.png"
                : $"{normalPath}{pokemonNumber}.png";

            BackgroundImages.Add(new PokemonImage
                {
                    Url = imageUrl,
                    Left = random.Next(0, 100), // 0-100% of background container width
                    Top = random.Next(0, 100), // 0-100% of background container height
                    Size = random.Next(50, 130), // 50px to 130px
                    Rotation = random.Next(0, 360) // Random rotation
                });
        }
    }

    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; }
    }
}