Added Pokemon Table to home page and extracted pokemon images from Serebii

PokemonSleep.Web/Controllers/HomeController.cs

@@ -1,5 +1,7 @@
 using Microsoft.AspNetCore.Mvc;
+using Newtonsoft.Json;
 using PokemonSleep.Web.Models;
+using PokemonSleep.Web.Service.IService;
 using System.Diagnostics;
 
 namespace PokemonSleep.Web.Controllers
@@ -7,15 +9,42 @@ namespace PokemonSleep.Web.Controllers
     public class HomeController : Controller
     {
         private readonly ILogger<HomeController> _logger;
+        private readonly IPokemonService _pokemonService;
+        private readonly IPokemonNatureService _natureService;
+        private readonly IPokemonSubskillService _subskillService;
 
-        public HomeController(ILogger<HomeController> logger)
+        public HomeController(ILogger<HomeController> logger, IPokemonService pokemonService, IPokemonNatureService natureService, IPokemonSubskillService subskillService)
         {
+            _pokemonService = pokemonService;
+            _natureService = natureService;
+            _subskillService = subskillService;
             _logger = logger;
         }
 
-        public IActionResult Index()
+
+        public async Task<IActionResult> Index()
         {
-            return View();
+            PokemonSleepDto? list = new();
+
+            ResponseDto? presponse = await _pokemonService.GetAllPokemonAsync();
+            ResponseDto? nresponse = await _natureService.GetAllPokemonNaturesAsync();
+            ResponseDto? sresponse = await _subskillService.GetAllPokemonSubskillsAsync();
+
+            if (presponse != null && presponse.IsSuccess)
+            {
+                list.pokemonList = JsonConvert.DeserializeObject<List<PokemonDto>>(Convert.ToString(presponse.Result));
+            }
+            if (nresponse != null && nresponse.IsSuccess)
+            {
+                list.natureList = JsonConvert.DeserializeObject<List<PokemonNatureDto>>(Convert.ToString(nresponse.Result));
+            }
+            if (sresponse != null && sresponse.IsSuccess)
+            {
+                list.subskillList = JsonConvert.DeserializeObject<List<PokemonSubskillDto>>(Convert.ToString(sresponse.Result));
+            }
+
+
+            return View(list);
         }
 
         public IActionResult Privacy()

PokemonSleep.Web/Controllers/PokemonController.cs

@@ -28,7 +28,13 @@ namespace PokemonSleep.Web.Controllers
             if (presponse != null && presponse.IsSuccess)
             {
                 list.pokemonList = JsonConvert.DeserializeObject<List<PokemonDto>>(Convert.ToString(presponse.Result));
+            }
+			if (nresponse != null && nresponse.IsSuccess)
+			{
 				list.natureList = JsonConvert.DeserializeObject<List<PokemonNatureDto>>(Convert.ToString(nresponse.Result));
+			}
+			if (sresponse != null && sresponse.IsSuccess)
+			{
 				list.subskillList = JsonConvert.DeserializeObject<List<PokemonSubskillDto>>(Convert.ToString(sresponse.Result));
 			}
 

PokemonSleep.Web/PokemonSleep.Web.csproj

@@ -10,4 +10,8 @@
     <PackageReference Include="Newtonsoft.Json" Version="13.0.3" />
   </ItemGroup>
 
+  <ItemGroup>
+    <ProjectReference Include="..\PokemonSleepAPI\PokemonSleepAPI.csproj" />
+  </ItemGroup>
+
 </Project>

PokemonSleep.Web/Service/IService/IPokeAPI.cs

@@ -0,0 +1,14 @@
+using PokemonSleep.Web.Models;
+using PokemonSleepAPI.Models;
+using System.Threading.Tasks;
+
+namespace PokemonSleep.Web.Service.IService
+{
+	public interface IPokeAPI 
+	{
+		Task<ResponseDto?> GetPokemonAsync(string species);
+		Task<Pokemon> GetPokemonByUrlAsync(string url);
+		Task<List<Pokemon>> GetAllPokemonWithDetailsAsync();
+
+	}
+}

PokemonSleep.Web/Views/Home/Index.cshtml

@@ -2,7 +2,41 @@
     ViewData["Title"] = "Home Page";
 }
 
+@model PokemonSleepDto
+
 <div class="text-center">
     <h1 class="display-4">Welcome</h1>
     <p>Learn about <a href="https://learn.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
+    <button>Add Pokemon</button>
+</div>
+<div style ="margin: auto; width: 600px; max-width: 50%; ">
+    <table class="table" style="text-align: center; border: 1px solid purple;">
+        <thead style="border-bottom: 1px solid purple;">
+            <tr>
+                <th scope="col" style="width: 50%;"></th>
+                <th scope="col">#</th>
+                <th scope="col">Pokemon</th>
+                <th scope="col">Sleep Type</th>
+                <th scope="col" style="padding-right: 30px;">Speciality</th>
+            </tr>
+        </thead>
+        <tbody>
+            @foreach (var pokemon in Model.pokemonList)
+            {
+                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; border-bottom: 1px solid purple;">
+                    <td style="display: block; margin:0; padding: 0;">
+                        <img style=" width: 90px; height: 90px;  " src=@URL />
+                        <img style=" width: 90px; height: 90px;  " src=@ShinyURL />
+                    </td>
+                    <th scope="row">@pokemon.Id</th>
+                    <td> @pokemon.Name</td>
+                    <td>@pokemon.SleepType</td>
+                    <td style="padding-right: 30px;">@pokemon.Speciality</td>
+                </tr>
+            }
+        </tbody>
+    </table>
 </div>

PokemonSleep.Web/Views/Pokemon/PokemonIndex.cshtml

@@ -1,4 +1,5 @@
 @model PokemonSleepDto
+
 <div class="card shadow border-0 mt-4">
 	<div class="card-header bg-secondary bg-gradient ml-0 py-3">
 		<div class="row">
@@ -34,12 +35,18 @@
 			<tbody>
 
 				<tr>
+                    <!--<td><img src="https://www.serebii.net/pokemonsleep/pokemon/{pokemon.Id}.png" alt="Girl in a jacket" width="300" height="300"></td> -->
 					<td>
 						<select class="form-control form-control-lg">
 							<option value="" disabled selected>Choose your Pokémon...</option>
 							@foreach(var pokemon in Model.pokemonList)
 							{
+								string URL = "https://www.serebii.net/pokemonsleep/pokemon/" + pokemon.Id + ".png";
+									
+										<img style=" width: 30px; height: 30px; border: 1px solid green; " src=@URL />
 										<option>@pokemon.Id @pokemon.Name</option>
+								
+								
 							}
 						</select>
 					</td>
@@ -113,3 +120,4 @@
 
 </div>
 
+

PokemonSleepAPI/Models/Dto/PokemonDto.cs

@@ -6,5 +6,6 @@
         public string Name { get; set; }
         public string SleepType { get; set; }
         public string Speciality { get; set; }
+
     }
 }