diff --git a/blazor_lab/Components/InventoryGrid.razor.cs b/blazor_lab/Components/InventoryGrid.razor.cs index 87a879b..13696f3 100644 --- a/blazor_lab/Components/InventoryGrid.razor.cs +++ b/blazor_lab/Components/InventoryGrid.razor.cs @@ -1,11 +1,5 @@ using Microsoft.AspNetCore.Components; using Minecraft.Crafting.Api.Models; -using System; -using System.Collections.Generic; -using System.Linq; -using System.Net.Http; -using System.Net.Http.Json; -using System.Threading.Tasks; namespace blazor_lab.Components @@ -16,18 +10,12 @@ namespace blazor_lab.Components [Parameter] public List Inventory { get; set; } - public List Items { get; set; } = new List(); - - [Inject] - public HttpClient HttpClient { get; set; } - - [Inject] - public IConfiguration Config { get; set; } - - protected override async Task OnInitializedAsync() - { - Items = await HttpClient.GetFromJsonAsync>($"{Config["CraftingApi:BaseUrl"]}/api/Crafting/all"); - } + /// + /// Used by GetItemImageBase64 in this component, rather than calling our DataService every time. + /// A very basic cache, not kept up to date in any way, but event listeners could be set up in the future + /// + [Parameter] + public List Items { get; set; } public string GetItemImageBase64(string displayName) { diff --git a/blazor_lab/Components/InventoryList.razor b/blazor_lab/Components/InventoryList.razor new file mode 100644 index 0000000..a437545 --- /dev/null +++ b/blazor_lab/Components/InventoryList.razor @@ -0,0 +1,35 @@ +
+
+ +
+ +
+ @foreach (var item in VisibleItems) + { +
+ @item.DisplayName +
@item.DisplayName
+
+ } +
+ +
+ @for (var i = 1; i <= TotalPages; i++) + { + var pageNumber = i; // copy the loop variable to avoid closure issues + + } +
+
+ @if (VisibleItems.Any()) + { + var firstItem = (currentPage - 1) * pageSize + 1; + var lastItem = Math.Min(currentPage * pageSize, TotalItems); + @firstItem - @lastItem @Localizer["out_of"] @TotalItems + } + else + { + @Localizer["no_items_found"] + } +
+
\ No newline at end of file diff --git a/blazor_lab/Components/InventoryList.razor.cs b/blazor_lab/Components/InventoryList.razor.cs new file mode 100644 index 0000000..adb79ed --- /dev/null +++ b/blazor_lab/Components/InventoryList.razor.cs @@ -0,0 +1,71 @@ +using blazor_lab.Models; +using Microsoft.AspNetCore.Components; +using Microsoft.Extensions.Localization; + +namespace blazor_lab.Components +{ + public partial class InventoryList + { + [Inject] + public IStringLocalizer Localizer { get; set; } + + [Parameter] + public List Items { get; set; } + + private List _filteredItems; + + private string searchQuery = ""; + + private int currentPage = 1; + private int pageSize = 10; + + private void UpdateFilteredItems() + { + _filteredItems = string.IsNullOrEmpty(searchQuery) ? Items : Items.Where(i => i.DisplayName.ToLower().Contains(searchQuery.ToLower())).ToList(); + VisibleItems = _filteredItems.Skip((currentPage - 1) * pageSize).Take(pageSize).ToList(); + } + + private List _visibleItems; + + private List VisibleItems + { + get => _visibleItems; + set + { + _visibleItems = value; + StateHasChanged(); + } + } + + private int TotalPages => (int)Math.Ceiling((double)_filteredItems.Count / pageSize); + + private int TotalItems => _filteredItems.Count; + + private void GoToPage(int page) + { + currentPage = page; + UpdateFilteredItems(); + } + + protected override void OnParametersSet() + { + UpdateFilteredItems(); + } + + private async Task OnInputChange(ChangeEventArgs e) + { + searchQuery = e.Value.ToString(); + await Task.Delay(250); // debounce the search to avoid excessive API requests + UpdateFilteredItems(); + } + + protected override void OnAfterRender(bool firstRender) + { + if (firstRender) + { + UpdateFilteredItems(); + } + } + } + +} diff --git a/blazor_lab/Components/InventoryList.razor.css b/blazor_lab/Components/InventoryList.razor.css new file mode 100644 index 0000000..6756e33 --- /dev/null +++ b/blazor_lab/Components/InventoryList.razor.css @@ -0,0 +1,35 @@ +.inventory-list { + margin-top: 20px; +} + +.search-container { + margin-bottom: 20px; +} + +.inventory-list-item { + margin-bottom: 10px; + padding: 10px; + border: 1px solid #ddd; + border-radius: 5px; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); +} + + .inventory-list-item img { + max-width: 64px; + max-height: 64px; + margin-right: 10px; + } + +.item-name { + font-weight: bold; +} + +.side-by-side { + display: flex; + flex-direction: row; +} + +button[disabled] { + opacity: 0.5; + cursor: default; +} \ No newline at end of file diff --git a/blazor_lab/Pages/Inventory.razor b/blazor_lab/Pages/Inventory.razor index 6837b6b..8db9eac 100644 --- a/blazor_lab/Pages/Inventory.razor +++ b/blazor_lab/Pages/Inventory.razor @@ -2,6 +2,14 @@ @using Minecraft.Crafting.Api.Models @using blazor_lab.Components -

Inventory

+
+
+

@Localizer["my_inventory"]

- \ No newline at end of file + +
+
+

@Localizer["list_of_items"]

+ +
+
\ No newline at end of file diff --git a/blazor_lab/Pages/Inventory.razor.cs b/blazor_lab/Pages/Inventory.razor.cs index b5b367f..759fcfb 100644 --- a/blazor_lab/Pages/Inventory.razor.cs +++ b/blazor_lab/Pages/Inventory.razor.cs @@ -1,9 +1,26 @@ -using Minecraft.Crafting.Api.Models; +using blazor_lab.Services; +using Microsoft.AspNetCore.Components; +using Microsoft.Extensions.Localization; +using Minecraft.Crafting.Api.Models; +using System.Diagnostics; namespace blazor_lab.Pages { public partial class Inventory { - private List Stuff = Enumerable.Range(1, 18).Select(_ => new InventoryModel()).ToList(); + private List Items = new(); + + [Inject] + public IStringLocalizer Localizer { get; set; } + + [Inject] + private DataApiService DataApiService { get; set; } + + protected override async Task OnInitializedAsync() + { + Items = await DataApiService.All(); + } + + private List FreshInventory = Enumerable.Range(1, 18).Select(_ => new InventoryModel()).ToList(); } } diff --git a/blazor_lab/Pages/Inventory.razor.css b/blazor_lab/Pages/Inventory.razor.css new file mode 100644 index 0000000..ff5602f --- /dev/null +++ b/blazor_lab/Pages/Inventory.razor.css @@ -0,0 +1,4 @@ +.side-by-side { + display: flex; + flex-direction: row; +} diff --git a/blazor_lab/Pages/List.razor b/blazor_lab/Pages/List.razor index 5d06430..2b84609 100644 --- a/blazor_lab/Pages/List.razor +++ b/blazor_lab/Pages/List.razor @@ -1,7 +1,7 @@ @page "/list" @using Models -

@Localizer["Title"]

+

List

diff --git a/blazor_lab/Pages/List.razor.cs b/blazor_lab/Pages/List.razor.cs index a8e3c87..43cca97 100644 --- a/blazor_lab/Pages/List.razor.cs +++ b/blazor_lab/Pages/List.razor.cs @@ -15,9 +15,6 @@ namespace blazor_lab.Pages private int totalItems; - [Inject] - public IStringLocalizer Localizer { get; set; } - [Inject] public IDataService DataService { get; set; } diff --git a/blazor_lab/Program.cs b/blazor_lab/Program.cs index 52dbb2f..af4cca6 100644 --- a/blazor_lab/Program.cs +++ b/blazor_lab/Program.cs @@ -43,7 +43,7 @@ builder.Services.Configure(options => options.SupportedUICultures = new List { new CultureInfo("en-US"), new CultureInfo("fr-FR") }; }); -builder.Services.AddScoped(); +builder.Services.AddScoped(); var app = builder.Build(); diff --git a/blazor_lab/Resources/Components.InventoryList.fr-FR.resx b/blazor_lab/Resources/Components.InventoryList.fr-FR.resx new file mode 100644 index 0000000..51dfb55 --- /dev/null +++ b/blazor_lab/Resources/Components.InventoryList.fr-FR.resx @@ -0,0 +1,129 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + text/microsoft-resx + + + 2.0 + + + System.Resources.ResXResourceReader, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 + + + System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 + + + Pas d'objet trouvé + + + de + + + Rechercher + + \ No newline at end of file diff --git a/blazor_lab/Resources/Components.InventoryList.resx b/blazor_lab/Resources/Components.InventoryList.resx new file mode 100644 index 0000000..517c3a8 --- /dev/null +++ b/blazor_lab/Resources/Components.InventoryList.resx @@ -0,0 +1,129 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + text/microsoft-resx + + + 2.0 + + + System.Resources.ResXResourceReader, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 + + + System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 + + + No items found + + + out of + + + Search + + \ No newline at end of file diff --git a/blazor_lab/Resources/Pages.List.resx b/blazor_lab/Resources/Pages.Inventory.fr-FR.resx similarity index 96% rename from blazor_lab/Resources/Pages.List.resx rename to blazor_lab/Resources/Pages.Inventory.fr-FR.resx index a8fea6f..3aee12a 100644 --- a/blazor_lab/Resources/Pages.List.resx +++ b/blazor_lab/Resources/Pages.Inventory.fr-FR.resx @@ -117,7 +117,10 @@ System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 - - Items list + + Liste des objets + + + Mon inventaire \ No newline at end of file diff --git a/blazor_lab/Resources/Pages.List.fr-FR.resx b/blazor_lab/Resources/Pages.Inventory.resx similarity index 96% rename from blazor_lab/Resources/Pages.List.fr-FR.resx rename to blazor_lab/Resources/Pages.Inventory.resx index 50bb302..d509ad6 100644 --- a/blazor_lab/Resources/Pages.List.fr-FR.resx +++ b/blazor_lab/Resources/Pages.Inventory.resx @@ -117,7 +117,10 @@ System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 - - Liste des éléments + + List of items + + + My inventory \ No newline at end of file diff --git a/blazor_lab/Services/DataApiService.cs b/blazor_lab/Services/DataApiService.cs index afc9ecb..4b90f17 100644 --- a/blazor_lab/Services/DataApiService.cs +++ b/blazor_lab/Services/DataApiService.cs @@ -28,6 +28,11 @@ namespace blazor_lab.Services return await _http.GetFromJsonAsync("https://localhost:7234/api/Crafting/count"); } + public async Task> All() + { + return await _http.GetFromJsonAsync>($"https://localhost:7234/api/Crafting/all"); + } + public async Task> List(int currentPage, int pageSize) { return await _http.GetFromJsonAsync>($"https://localhost:7234/api/Crafting/?currentPage={currentPage}&pageSize={pageSize}"); diff --git a/blazor_lab/blazor_lab.csproj b/blazor_lab/blazor_lab.csproj index b9ae0e1..2e58a00 100644 --- a/blazor_lab/blazor_lab.csproj +++ b/blazor_lab/blazor_lab.csproj @@ -22,4 +22,13 @@ + + + Designer + + + Designer + + +