Try to have a working inventory

.vs/VSWorkspaceState.json

@@ -2,7 +2,8 @@
   "ExpandedNodes": [
     "",
     "\\Code",
-    "\\Code\\ProjetBlazor"
+    "\\Code\\ProjetBlazor",
+    "\\Code\\ProjetBlazor\\Properties"
   ],
   "SelectedNode": "\\Code\\BlazorApp.sln",
   "PreviewInSolutionExplorer": false

Code/ProjetBlazor/Components/ActionInInventory.cs

@@ -0,0 +1,17 @@
+using ProjetBlazor.Models;
+
+namespace ProjetBlazor.Components
+{
+    public class ActionInInventory
+    {
+        public ActionInInventory(String ac, int num, Item objet)
+        {
+            Action = ac;
+            Index = num;
+            Item = objet;
+        }
+        public string Action { get; set; }
+        public int Index { get; set; }
+        public Item Item { get; set; }
+    }
+}

Code/ProjetBlazor/Components/GetItemInInventory.razor

@@ -1,13 +1,30 @@
 <div class="item"
      ondragover="event.preventDefault();"
-     draggable="true"
-     @ondragstart="@OnDragStart"
-     @ondrop="@OnDrop"
+     @ondragstart="@OnDragStartAsync"
+     @ondrop="@OnDropAsync"
      @ondragenter="@OnDragEnter"
      @ondragleave="@OnDragLeave">
-
-    @if (Item != null)
+    @if(Items != null)
     {
-        <img src="data:image/png;base64, @(Item.ImageBase64)" class="img-thumbnail" title="@Item.DisplayName" alt="@Item.DisplayName" style="min-width: 50px; max-width: 150px" />
+        @if(!string.IsNullOrWhiteSpace(Items.item.ImageBase64))
+        {
+            <div Class="item">
+                <img src="data:image/png;base64, @(Items.item.ImageBase64)" title="@Items.item.DisplayName" alt="@Items.item.DisplayName" style="width: 50px; height: 50px" />
+                <span class="number-item">@Items.Stack</span>
+            </div>
+        }
+        else
+        {
+            <div class="item">
+                <img src="images/background.png" title="@Items.item.DisplayName" alt="@Items.item.DisplayName" style="width: 50px; height: 50px"/>
+                <span class="number-item">@Items.Stack</span>
+            </div>
+        }
     }
-</div>
+    else
+    {
+        <div class="item">
+            <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAAAXNSR0IArs4c6QAAAINJREFUeF7t18ENACAMAzE6OuLD1jDImREiGitz9n0r/EYAfoAT0AHhDlxKkAIUoAAFKBBOAIMYxCAGMRhGwBjCIAYxiEEMYjCcAAYxiEEMYjCMgDWIQQxiEIMYxGA4AQxiEIMYxGAYAWsQgxjEIAYxiMFwAhjEIAYxiMEwAtYgBusMfuMLowEYJcXzAAAAAElFTkSuQmCC" class="img-thumbnail" title="empty" alt="empty slot" style="width: 50px; height: 50px" />
+        </div>
+    }
+</div>

Code/ProjetBlazor/Components/GetItemInInventory.razor.cs

@@ -1,4 +1,5 @@
-using Blazorise;
+using Blazored.LocalStorage;
+using Blazorise;
 using Microsoft.AspNetCore.Components;
 using ProjetBlazor.Models;
 
@@ -7,48 +8,123 @@ namespace ProjetBlazor.Components
     public partial class GetItemInInventory
     {
         [Parameter]
-        public int Index { get; set; }
+        public bool NoDrop { get; set; }
 
         [Parameter]
-        public Item? Item { get; set; }
+        public ItemInInventory? Items { get; set; }
 
         [Parameter]
-        public bool NoDrop { get; set; }
+        public int Index { get; set; }
 
         [CascadingParameter]
         public ItemsList Parent { get; set; }
 
-        internal void OnDragEnter()
+        [Inject]
+        public ILocalStorageService LocalStorage { get; set; }
+
+        public async Task OnDragStartAsync()
         {
-            if (NoDrop){
+
+            if (this.Items == null)
+            {
+                Parent.CurrentDragItem = null;
                 return;
             }
-            this.Item = Parent.CurrentDragItem;
 
+            Parent.CurrentDragItem = this.Items;
+            Parent.Actions.Add(new ActionInInventory("On drag start", this.Index, Items.item));
+            this.Items = null;
+            Parent.inventory.inventoryItems[this.Index] = null;
+            await LocalStorage.RemoveItemAsync("data" + this.Index);
+            await LocalStorage.RemoveItemAsync("stack" + this.Index);
         }
 
-        internal void OnDragLeave()
+
+        public async Task OnDropAsync()
         {
-            if (NoDrop)
+
+            if (Parent.CurrentDragItem == null)
             {
                 return;
             }
 
-        }
+            if (this.Items == null)
+            {
+                this.Items = Parent.CurrentDragItem;
+                Parent.CurrentDragItem = null;
+                await LocalStorage.SetItemAsync<Item>("data" + this.Index, this.Items.item);
+                await LocalStorage.SetItemAsync<int>("stack" + this.Index, this.Items.Stack);
+                Parent.Actions.Add(new ActionInInventory("On drag drop", this.Index, Items.item));
+                return;
+            }
 
-        internal void OnDrop()
-        {
-            if (NoDrop)
+            if (Parent.CurrentDragItem.item.Id != this.Items.item.Id)
             {
+                this.Items = Parent.CurrentDragItem;
+                Parent.CurrentDragItem = null;
+                await LocalStorage.SetItemAsync<Item>("data" + this.Index, this.Items.item);
+                await LocalStorage.SetItemAsync<int>("stack" + this.Index, this.Items.Stack);
+                Parent.Actions.Add(new ActionInInventory("On drag drop", this.Index, Items.item));
                 return;
             }
+            else
+            {
+                int total = Parent.CurrentDragItem.Stack + this.Items.Stack;
+                if (total > this.Items.item.StackSize)
+                {
+                    this.Items.Stack = this.Items.item.StackSize;
+                    Parent.CurrentDragItem = null;
 
-            this.Item = Parent.CurrentDragItem;
+                    await LocalStorage.SetItemAsync<Item>("data" + this.Index, this.Items.item);
+                    await LocalStorage.SetItemAsync<int>("stack" + this.Index, this.Items.Stack);
+                    Parent.Actions.Add(new ActionInInventory("On drag drop", this.Index, Items.item));
+                    return;
+                }
+                else
+                {
+                    this.Items.Stack = total;
+                    Parent.CurrentDragItem = null;
+                    await LocalStorage.SetItemAsync<Item>("data" + this.Index, this.Items.item);
+                    await LocalStorage.SetItemAsync<int>("stack" + this.Index, this.Items.Stack);
+                    Parent.Actions.Add(new ActionInInventory("On drag drop", this.Index, Items.item));
+                    return;
+                }
+            }
+        }
+        internal void OnDragEnter()
+        {
+            if (this.Items == null) return;
+            Parent.Actions.Add(new ActionInInventory("Drag Enter", this.Index, Items.item));
         }
 
-        private void OnDragStart()
+        internal void OnDragLeave()
         {
-            Parent.CurrentDragItem = this.Item;
+            if (this.Items == null) return;
+            Parent.Actions.Add(new ActionInInventory("Drag Leave", this.Index, Items.item));
+        }
+
+
+        protected override async Task OnAfterRenderAsync(bool firstRender)
+        {
+            base.OnAfterRenderAsync(firstRender);
+
+            if (!firstRender)
+            {
+                return;
+            }
+            var item = await LocalStorage.GetItemAsync<Item>("data" + this.Index);
+            int stack = await LocalStorage.GetItemAsync<int>("stack" + this.Index);
+
+            if (item != null)
+            {
+                this.Items = new Models.ItemInInventory(item, stack);
+            }
+            else
+            {
+                this.Items = null;
+            }
+            StateHasChanged();
+            return;
         }
     }
 }

Code/ProjetBlazor/Components/GetItemInInventory.razor.css

@@ -3,5 +3,14 @@
     width: 100px;
     height: 100px;
     border: 1px solid;
-    overflow: hidden;
 }
+
+.number-item {
+    position: absolute;
+    bottom: 5px;
+    right: 5px;
+    font-size: 1em;
+    font-weight: bold;
+    -webkit-text-stroke: 2px black;
+    font-family: 'Segoe UI', Tahoma, Verdana, Geneva, Tahoma, sans-serif
+}

Code/ProjetBlazor/Components/InventoryImageList.razor

@@ -0,0 +1,23 @@
+@using ProjetBlazor.Models;
+
+
+
+
+<div class="item"
+     ondragover="event.preventDefault();"
+     draggable="true"
+     @ondragstart="@OnDragStart"
+     @ondrop="@OnDrop"
+     @ondragenter="@OnDragEnter"
+     @ondragleave="@OnDragLeave">
+
+    @if (!string.IsNullOrWhiteSpace(Item.ImageBase64))
+    {
+        <img src="data:image/png;base64, @(Item.ImageBase64)" class="img-thumbnail" title="Item.DisplayName" alt="Item.DisplayName" style="width: 60px" />
+    }
+    else
+    {
+        <img src="images/default.png" class="img-thumbnail" title="Item.DisplayName" alt="Item.DisplayName" style="width: 60px" />
+    }
+
+</div>

Code/ProjetBlazor/Components/InventoryImageList.razor.cs

@@ -0,0 +1,42 @@
+using Microsoft.AspNetCore.Components;
+using ProjetBlazor.Models;
+
+namespace ProjetBlazor.Components
+{
+    public partial class InventoryImageList
+    {
+
+        [Parameter]
+        public Item Item { get; set; }
+
+        [CascadingParameter]
+        public ItemsList Parent { get; set; }
+
+        internal void OnDragEnter()
+        {
+
+            Parent.Actions.Add(new ActionInInventory("On drag enter", Item.Id, Item));
+            return;
+        }
+
+        internal void OnDragLeave()
+        {
+            Parent.Actions.Add(new ActionInInventory("On drag leave", Item.Id, Item));
+            return;
+        }
+
+        internal void OnDrop()
+        {
+            Parent.Actions.Add(new ActionInInventory("On drop", Item.Id, Item));
+            Parent.CurrentDragItem = null;
+            return;
+        }
+
+        private void OnDragStart()
+        {
+            Parent.CurrentDragItem = new ItemInInventory(Item);
+            Parent.Actions.Add(new ActionInInventory("On drag start", Item.Id, Item));
+            return;
+        }
+    }
+}

Code/ProjetBlazor/Components/ItemsList.razor

@@ -2,37 +2,42 @@
 
 <CascadingValue Value="@this">
     <div class="css-grid" draggable="true">
-    <div><h1>@Localizer["List"]</h1></div>
+        <div><h1>@Localizer["List"]</h1></div>
 
         <DataGrid TItem="Item"
                   Data="@items"
-                  
-                TotalItems="8"
-                PageSize="8"
-                Filterable
-                ShowPager
-                Responsive>
+                  TotalItems="8"
+                  PageSize="8"
+                  Filterable
+                  ShowPager
+                  Responsive>
             <DataGridColumn TItem="Item" Field="@nameof(Item.Id)" Caption="@Localizer["Image"]" Filterable="false" Sortable="false">
                 <DisplayTemplate>
-                        @if (!string.IsNullOrWhiteSpace(context.ImageBase64))
-                        {
-                            <img src="data:image/png;base64, @(context.ImageBase64)" class="img-thumbnail" title="@context.DisplayName" alt="@context.DisplayName" style="min-width: 50px; max-width: 150px"/>
-                        }
+                    @if (!string.IsNullOrWhiteSpace(context.ImageBase64))
+                    {
+                        <img src="data:image/png;base64, @(context.ImageBase64)" class="img-thumbnail" title="@context.DisplayName" alt="@context.DisplayName" style="min-width: 50px; max-width: 150px"/>
+                    }
                 </DisplayTemplate>
             </DataGridColumn>
             <DataGridColumn TItem="Item" Field="@nameof(Item.DisplayName)" Caption="@Localizer["Nom"]"/>
             <DataGridColumn TItem="Item" Field="@nameof(Item.StackSize)" Caption="@Localizer["Stack"]" Filterable="false"  Sortable="false"/>
         </DataGrid>
     </div>
-        
     <div><h1>@Localizer["Inventory"]</h1></div>
-    <div class="css-recipe">
-        @for (int i = 0; i < 27; i++)
+    <div class="css-grid">
+        @for(int i = 0; i<Models.Inventory.size;i++)
+        {
+            @if (inventory.inventoryItems[i] != null)
             {
-                <GetItemInInventory Index="@i" />
-
+                <ItemInventory items="@inventory.inventoryItems[i]" Index="@i" NoDrop=true />
             }
-    </div>
+            else
+            {
+                <ItemInventory items="@inventory.inventoryItems[i]" Index="@i"/>
+            }
+            <GetItemInInventory Index="@i" />
+        }
+    </div>   
 
 
     <div class="actions" id="actions"> 

Code/ProjetBlazor/Components/ItemsList.razor.cs

@@ -1,10 +1,7 @@
-using Blazored.Modal;
-using Blazored.Modal.Services;
-using Blazorise.DataGrid;
+using Blazored.Modal.Services;
 using Microsoft.AspNetCore.Components;
 using Microsoft.Extensions.Localization;
 using Microsoft.JSInterop;
-using ProjetBlazor.Modals;
 using ProjetBlazor.Models;
 using ProjetBlazor.Services;
 using System.Collections.ObjectModel;
@@ -14,7 +11,9 @@ namespace ProjetBlazor.Components
 {
     public partial class ItemsList
     {
-        public Item CurrentDragItem { get; set; }
+        public Models.Inventory inventory = new Models.Inventory();
+        public ObservableCollection<ActionInInventory> Actions { get; set; }
+        public ItemInInventory CurrentDragItem { get; set; }
 
         [Parameter]
         public List<Item> Items { get; set; }

Code/ProjetBlazor/Components/ItemsList.razor.css

@@ -14,6 +14,7 @@
     padding-top: 1px;
     padding-left: 5px;
     border: 1px solid black;
-    height: 250px;
+    height: 200px;
     clear: both;
+    overflow: scroll;
 }

Code/ProjetBlazor/Components/ItemsList.razor.js

@@ -0,0 +1,16 @@
+window.Inventory =
+{
+    AddActions: function (data) {
+
+        data.forEach(element => {
+            var div = document.createElement('div');
+            div.innerHTML = 'Action: ' + element.action + ' - Index: ' + element.index;
+
+            if (element.item) {
+                div.innerHTML += ' - Item Name: ' + element.item.name;
+            }
+
+            document.getElementById('actions').appendChild(div);
+        });
+    }
+}

Code/ProjetBlazor/Models/Inventory.cs

@@ -0,0 +1,22 @@
+namespace ProjetBlazor.Models
+{
+    public partial class Inventory
+    {
+
+        static public int size = 18;
+
+        /// <summary>
+        /// List of inventory items.
+        /// </summary>
+        public List<ItemInInventory> inventoryItems = new List<ItemInInventory>(new ItemInInventory[size]);
+
+        /// <summary>
+        /// Constructor for InventoryList.
+        /// </summary>
+        public Inventory()
+        {
+            inventoryItems[0] = new ItemInInventory();
+        }
+    }
+}
+

Code/ProjetBlazor/Models/ItemInInventory.cs

@@ -0,0 +1,42 @@
+namespace ProjetBlazor.Models
+{
+    public class ItemInInventory
+    {
+        public Item item;
+        int stack;
+
+        /// <summary>
+        /// The number of items in the stack.
+        /// </summary>
+        public int Stack { get; set; }
+
+        /// <summary>
+        /// Constructor for InventoryItem with no parameters.
+        /// </summary>
+        public ItemInInventory()
+        {
+            item = new Item();
+            Stack = 64;
+        }
+        /// <summary>
+        /// Constructor for InventoryItem with a single item.
+        /// </summary>
+        /// <param name="item">The item.</param>
+        public ItemInInventory(Item item)
+        {
+            this.item = item;
+            Stack = 1;
+        }
+
+        /// <summary>
+        /// Constructor for InventoryItem with a stack of items.
+        /// </summary>
+        /// <param name="item">The item</param>
+        /// <param name="stock">The number of items in the stack.</param>
+        public ItemInInventory(Item item, int stock)
+        {
+            this.item = item;
+            Stack = stock;
+        }
+    }
+}

Code/ProjetBlazor/Services/DataApiService.cs

@@ -8,53 +8,87 @@ namespace ProjetBlazor.Services
     {
         private readonly HttpClient _http;
 
-        public DataApiService(
-            HttpClient http)
+        /// <summary>
+        /// Constructor for DataApiService.
+        /// </summary>
+        /// <param name="http">HttpClient for making API requests.</param>
+        public DataApiService(HttpClient http)
         {
             _http = http;
         }
 
+        /// <summary>
+        /// Add a new item to the API.
+        /// </summary>
+        /// <param name="model">Model containing data for the new item.</param>
         public async Task Add(ItemModel model)
         {
             // Get the item
             var item = ItemFactory.Create(model);
 
             // Save the data
-            await _http.PostAsJsonAsync("https://localhost:7234/api/Crafting/", item);
+            await _http.PostAsJsonAsync("https://codefirst.iut.uca.fr/containers/container-blazor-web-api-marcchevaldonne/api/Crafting/", item);
         }
 
+        /// <summary>
+        /// Get the number of items in the API.
+        /// </summary>
+        /// <returns>Task representing the asynchronous operation, returning the number of items.</returns>
         public async Task<int> Count()
         {
-            return await _http.GetFromJsonAsync<int>("https://localhost:7234/api/Crafting/count");
+            return await _http.GetFromJsonAsync<int>("https://codefirst.iut.uca.fr/containers/container-blazor-web-api-marcchevaldonne/api/Crafting/count");
         }
 
+        /// <summary>
+        /// Get a list of items from the API, paginated.
+        /// </summary>
+        /// <param name="currentPage">The current page number.</param>
+        /// <param name="pageSize">The number of items per page.</param>
+        /// <returns>Task representing the asynchronous operation, returning a list of items.</returns>
         public async Task<List<Item>> List(int currentPage, int pageSize)
         {
-            return await _http.GetFromJsonAsync<List<Item>>($"https://localhost:7234/api/Crafting/?currentPage={currentPage}&pageSize={pageSize}");
+            return await _http.GetFromJsonAsync<List<Item>>($"https://codefirst.iut.uca.fr/containers/container-blazor-web-api-marcchevaldonne/api/Crafting/?currentPage={currentPage}&pageSize={pageSize}");
         }
 
+        /// <summary>
+        /// Get a list of all items from the API.
+        /// </summary>
+        /// <returns>Task representing the asynchronous operation, returning a list of items.</returns>
+        public async Task<List<Item>> getAll()
+        {
+            return await _http.GetFromJsonAsync<List<Item>>($"https://codefirst.iut.uca.fr/containers/container-blazor-web-api-marcchevaldonne/api/Crafting/all");
+        }
+
+        /// <summary>
+        /// Get a single item from the API by its ID.
+        /// </summary>
+        /// <param name="id">The ID of the item to retrieve.</param>
+        /// <returns>Task representing the asynchronous operation, returning the item with the specified ID.</returns>
         public async Task<Item> GetById(int id)
         {
-            return await _http.GetFromJsonAsync<Item>($"https://localhost:7234/api/Crafting/{id}");
+            return await _http.GetFromJsonAsync<Item>($"https://codefirst.iut.uca.fr/containers/container-blazor-web-api-marcchevaldonne/api/Crafting/{id}");
         }
 
+        /// <summary>
+        /// Update an existing item in the API.
+        /// </summary>
+        /// <param name="id">The ID of the item to update.</param>
+        /// <param name="model">Model containing the updated data for the item.</param>
         public async Task Update(int id, ItemModel model)
         {
             // Get the item
             var item = ItemFactory.Create(model);
 
-            await _http.PutAsJsonAsync($"https://localhost:7234/api/Crafting/{id}", item);
+            await _http.PutAsJsonAsync($"https://codefirst.iut.uca.fr/containers/container-blazor-web-api-marcchevaldonne/api/Crafting/{id}", item);
         }
 
+        /// <summary>
+        /// Delete an existing item from the API.
+        /// </summary>
+        /// <param name="id">The ID of the item to delete.</param>
         public async Task Delete(int id)
         {
-            await _http.DeleteAsync($"https://localhost:7234/api/Crafting/{id}");
+            await _http.DeleteAsync($"https://codefirst.iut.uca.fr/containers/container-blazor-web-api-marcchevaldonne/api/Crafting/{id}");
         }
-
-        public async Task<List<Item>> getAll()
-        {
-            return await _http.GetFromJsonAsync<List<Item>>($"https://codefirst.iut.uca.fr/containers/container-blazor-web-api-marcchevaldonne/api/Crafting/all");
-        }
-
     }
 }