display img and default one

Blazor/Blazor/Components/Inventory.razor

@@ -5,15 +5,6 @@
 <div class="css-grid">
     @for(int i = 0; i<InventoryList.size;i++)
     {
-        if (inventory.inventoryItems[i] != null)
-        {
-            <ItemInventory items="@inventory.inventoryItems[i]" />
-        }
-        else
-        {
-            <div class="item">
-                <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAAZElEQVR42u3QAQ0AAAQAMAppJz85zB/h2VUTj6UAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBBw3wKq0HRBv18xwgAAAABJRU5ErkJggg==" class="img-thumbnail" title="Empty" style="width: 64px; height: 64px" />
-            </div>
-        }
+            <ItemInventory items="@inventory.inventoryItems[i]" index="@i"/>
     }
 </div>

Blazor/Blazor/Components/Inventory.razor.cs

@@ -1,15 +1,24 @@
 using Blazor.Models;
 using Blazor.Pages;
 using Microsoft.AspNetCore.Components;
+using System.Collections.ObjectModel;
+
 namespace Blazor.Components
 {
     partial class Inventory
     {
+
+        public Inventory() 
+        {
+            Actions = new ObservableCollection<InventoryAction>();
+        }
+        public ObservableCollection<InventoryAction> Actions { get; set; }
         [Parameter]
         public InventoryList inventory { get; set; }
-
         public void Add(Item item)
+        /*peut être useless*/
         {
+            if (item == null) return;
             foreach(InventoryItem element in inventory.inventoryItems)
             {
                 if(item.Id == element.item.Id)
@@ -17,11 +26,13 @@ namespace Blazor.Components
                     if(element.Stack == element.item.StackSize)
                     {
                         addEnd(item);
+                        this.StateHasChanged();
                         return;
                     }
                     else
                     {
                         element.Stack += 1;
+                        this.StateHasChanged();
                         return;
                     }
                 }
@@ -29,6 +40,7 @@ namespace Blazor.Components
                 {
                     element.item = item;
                     element.Stack = 1;
+                    this.StateHasChanged();
                     return;
                 }
             }
@@ -36,6 +48,7 @@ namespace Blazor.Components
         }
 
         public void addEnd(Item item)
+        /*peut être useless*/
         {
             int i = 0;
             while (inventory.inventoryItems[i]!=null)

Blazor/Blazor/Components/InventoryAction.cs

@@ -0,0 +1,11 @@
+using Blazor.Models;
+
+namespace Blazor.Components
+{
+    public class InventoryAction
+    {
+        public string Action { get; set; }
+        public int Index { get; set; }
+        public Item Item { get; set; }
+    }
+}

Blazor/Blazor/Components/ItemInventory.razor

@@ -1,3 +1,19 @@
 <div class="item">
-    @items.item
+    @if(items != null)
+    {
+     @if(!string.IsNullOrWhiteSpace(items.item.ImageBase64))
+     {
+            <img src="data:image/png;base64, @(items.item.ImageBase64)" class="img-thumbnail" title="@items.item.DisplayName" alt="@items.item.DisplayName" style="min-width: 50px;" />
+     }
+     else
+     {
+            <img src="images/default.png" class="img-thumbnail" title="@items.item.DisplayName" alt="@items.item.DisplayName" style="fill" />
+     }
+    }
+    else
+    {
+        <div>
+            <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAAZElEQVR42u3QAQ0AAAQAMAppJz85zB/h2VUTj6UAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBAgQIAAAQIECBBw3wKq0HRBv18xwgAAAABJRU5ErkJggg==" class="img-thumbnail" title="Empty" style="width: 64px; height: 64px" />
+        </div>
+    }
 </div>

Blazor/Blazor/Components/ItemInventory.razor.cs

@@ -7,5 +7,8 @@ namespace Blazor.Components
     {
         [Parameter]
         public InventoryItem items { get; set; }
+
+        [Parameter]
+        public int index { get; set; }
     }
 }

Blazor/Blazor/Components/ItemInventory.razor.css

@@ -1,6 +0,0 @@
-.item {
-    width: 64px;
-    height: 64px;
-    border: 1px solid;
-    overflow: hidden;
-}