diff --git a/ValblazeProject/Components/Card.razor b/ValblazeProject/Components/Card.razor
new file mode 100644
index 0000000..874f2bc
--- /dev/null
+++ b/ValblazeProject/Components/Card.razor
@@ -0,0 +1,7 @@
+
Card
+@typeparam TItem
+
+ @CardHeader(Item)
+ @CardBody(Item)
+ @CardFooter
+
\ No newline at end of file
diff --git a/ValblazeProject/Components/Card.razor.cs b/ValblazeProject/Components/Card.razor.cs
new file mode 100644
index 0000000..f444b0c
--- /dev/null
+++ b/ValblazeProject/Components/Card.razor.cs
@@ -0,0 +1,19 @@
+using Microsoft.AspNetCore.Components;
+
+namespace ValblazeProject.Components
+{
+ public partial class Card
+ {
+ [Parameter]
+ public RenderFragment CardBody { get; set; }
+
+ [Parameter]
+ public RenderFragment CardFooter { get; set; }
+
+ [Parameter]
+ public RenderFragment CardHeader { get; set; }
+
+ [Parameter]
+ public TItem Item { get; set; }
+ }
+}
diff --git a/ValblazeProject/Components/Crafting.razor b/ValblazeProject/Components/Crafting.razor
new file mode 100644
index 0000000..65c9b93
--- /dev/null
+++ b/ValblazeProject/Components/Crafting.razor
@@ -0,0 +1,50 @@
+
+
+
+
+
+
Available items:
+
+
+
+ @foreach (var item in Items)
+ {
+
+ }
+
+
+
+
+
+
+
Recipe
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Result
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/ValblazeProject/Components/Crafting.razor.css b/ValblazeProject/Components/Crafting.razor.css
new file mode 100644
index 0000000..291bff1
--- /dev/null
+++ b/ValblazeProject/Components/Crafting.razor.css
@@ -0,0 +1,19 @@
+.css-grid {
+ grid-template-columns: repeat(4,minmax(0,1fr));
+ gap: 10px;
+ display: grid;
+ width: 286px;
+}
+
+.css-recipe {
+ grid-template-columns: repeat(3,minmax(0,1fr));
+ gap: 10px;
+ display: grid;
+ width: 212px;
+}
+
+.actions {
+ border: 1px solid black;
+ height: 250px;
+ overflow: scroll;
+}
\ No newline at end of file
diff --git a/ValblazeProject/Components/Crafting.razor.js b/ValblazeProject/Components/Crafting.razor.js
new file mode 100644
index 0000000..8fdb58e
--- /dev/null
+++ b/ValblazeProject/Components/Crafting.razor.js
@@ -0,0 +1,16 @@
+window.Crafting =
+{
+ 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);
+ });
+ }
+}
\ No newline at end of file
diff --git a/ValblazeProject/Components/CraftingAction.cs b/ValblazeProject/Components/CraftingAction.cs
new file mode 100644
index 0000000..d82bab8
--- /dev/null
+++ b/ValblazeProject/Components/CraftingAction.cs
@@ -0,0 +1,11 @@
+using ValblazeProject.Models;
+
+namespace ValblazeProject.Components
+{
+ public class CraftingAction
+ {
+ public string Action { get; set; }
+ public int Index { get; set; }
+ public Item Item { get; set; }
+ }
+}
diff --git a/ValblazeProject/Components/CraftingItem.razor b/ValblazeProject/Components/CraftingItem.razor
new file mode 100644
index 0000000..c1043b8
--- /dev/null
+++ b/ValblazeProject/Components/CraftingItem.razor
@@ -0,0 +1,14 @@
+
+
+ @if (Item != null)
+ {
+ @Item.DisplayName
+ }
+
\ No newline at end of file
diff --git a/ValblazeProject/Components/CraftingItem.razor.cs b/ValblazeProject/Components/CraftingItem.razor.cs
new file mode 100644
index 0000000..23f6b0a
--- /dev/null
+++ b/ValblazeProject/Components/CraftingItem.razor.cs
@@ -0,0 +1,64 @@
+using Blazorise;
+using Microsoft.AspNetCore.Components;
+using ValblazeProject.Models;
+
+namespace ValblazeProject.Components
+{
+ public partial class CraftingItem
+ {
+ [Parameter]
+ public int Index { get; set; }
+
+ [Parameter]
+ public Item Item { get; set; }
+
+ [Parameter]
+ public bool NoDrop { get; set; }
+
+ [CascadingParameter]
+ public Crafting Parent { get; set; }
+
+ internal void OnDragEnter()
+ {
+ if (NoDrop)
+ {
+ return;
+ }
+
+ Parent.Actions.Add(new CraftingAction { Action = "Drag Enter", Item = this.Item, Index = this.Index });
+ }
+
+ internal void OnDragLeave()
+ {
+ if (NoDrop)
+ {
+ return;
+ }
+
+ Parent.Actions.Add(new CraftingAction { Action = "Drag Leave", Item = this.Item, Index = this.Index });
+ }
+
+ internal void OnDrop()
+ {
+ if (NoDrop)
+ {
+ return;
+ }
+
+ this.Item = Parent.CurrentDragItem;
+ Parent.RecipeItems[this.Index] = this.Item;
+
+ Parent.Actions.Add(new CraftingAction { Action = "Drop", Item = this.Item, Index = this.Index });
+
+ // Check recipe
+ Parent.CheckRecipe();
+ }
+
+ private void OnDragStart()
+ {
+ Parent.CurrentDragItem = this.Item;
+
+ Parent.Actions.Add(new CraftingAction { Action = "Drag Start", Item = this.Item, Index = this.Index });
+ }
+ }
+}
diff --git a/ValblazeProject/Components/CraftingItem.razor.css b/ValblazeProject/Components/CraftingItem.razor.css
new file mode 100644
index 0000000..b2d4521
--- /dev/null
+++ b/ValblazeProject/Components/CraftingItem.razor.css
@@ -0,0 +1,6 @@
+.item {
+ width: 64px;
+ height: 64px;
+ border: 1px solid;
+ overflow: hidden;
+}
diff --git a/ValblazeProject/Components/CraftingRecipe.cs b/ValblazeProject/Components/CraftingRecipe.cs
new file mode 100644
index 0000000..17127ad
--- /dev/null
+++ b/ValblazeProject/Components/CraftingRecipe.cs
@@ -0,0 +1,10 @@
+using ValblazeProject.Models;
+
+namespace ValblazeProject.Components
+{
+ public class CraftingRecipe
+ {
+ public Item Give { get; set; }
+ public List> Have { get; set; }
+ }
+}
diff --git a/ValblazeProject/Components/ShowItems.razor b/ValblazeProject/Components/ShowItems.razor
new file mode 100644
index 0000000..7739061
--- /dev/null
+++ b/ValblazeProject/Components/ShowItems.razor
@@ -0,0 +1,12 @@
+@typeparam TItem
+
+
+ @if ((Items?.Count ?? 0) != 0)
+ {
+ @foreach (var item in Items)
+ {
+ @ShowTemplate(item)
+ ;
+ }
+ }
+
\ No newline at end of file
diff --git a/ValblazeProject/Components/ShowItems.razor.cs b/ValblazeProject/Components/ShowItems.razor.cs
new file mode 100644
index 0000000..543679f
--- /dev/null
+++ b/ValblazeProject/Components/ShowItems.razor.cs
@@ -0,0 +1,13 @@
+using Microsoft.AspNetCore.Components;
+
+namespace ValblazeProject.Components
+{
+ public partial class ShowItems
+ {
+ [Parameter]
+ public List Items { get; set; }
+
+ [Parameter]
+ public RenderFragment ShowTemplate { get; set; }
+ }
+}
diff --git a/ValblazeProject/Models/Cake.cs b/ValblazeProject/Models/Cake.cs
new file mode 100644
index 0000000..77812fd
--- /dev/null
+++ b/ValblazeProject/Models/Cake.cs
@@ -0,0 +1,9 @@
+namespace ValblazeProject.Models
+{
+ public class Cake
+ {
+ public int Id { get; set; }
+ public string Name { get; set; }
+ public decimal Cost { get; set; }
+ }
+}
diff --git a/ValblazeProject/Pages/Index.razor b/ValblazeProject/Pages/Index.razor
index 85f572e..f8de525 100644
--- a/ValblazeProject/Pages/Index.razor
+++ b/ValblazeProject/Pages/Index.razor
@@ -1,4 +1,7 @@
@using System.Globalization
+@using ValblazeProject.Components
+@using ValblazeProject.Models
+
@page "/"
@@ -14,3 +17,90 @@ Welcome to your new app.
+
+
+
+
+
+
+
+
+
+
@context.Name
+
$ @context.Cost
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@cakeContext.Name
+
$ @cakeContext.Cost
+
+
+
+
+
+
+
+
+
+
@CakeContext.Name
+
Price $@CakeContext.Cost
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/ValblazeProject/Pages/Index.razor.cs b/ValblazeProject/Pages/Index.razor.cs
new file mode 100644
index 0000000..8b3586a
--- /dev/null
+++ b/ValblazeProject/Pages/Index.razor.cs
@@ -0,0 +1,61 @@
+using Microsoft.AspNetCore.Components;
+using ValblazeProject.Components;
+using ValblazeProject.Models;
+using ValblazeProject.Services;
+
+namespace ValblazeProject.Pages
+{
+ public partial class Index
+ {
+ public List Cakes { get; set; }
+
+ protected override Task OnAfterRenderAsync(bool firstRender)
+ {
+ LoadCakes();
+ StateHasChanged();
+ return base.OnAfterRenderAsync(firstRender);
+ }
+
+ public void LoadCakes()
+ {
+ Cakes = new List
+ {
+ // items hidden for display purpose
+ new Cake
+ {
+ Id = 1,
+ Name = "Red Velvet",
+ Cost = 60
+ },
+ };
+ }
+ private Cake CakeItem = new Cake
+ {
+ Id = 1,
+ Name = "Black Forest",
+ Cost = 50
+ };
+
+ [Inject]
+ public IDataService DataService { get; set; }
+
+ public List- Items { get; set; } = new List
- ();
+
+ private List Recipes { get; set; } = new List();
+
+ protected override async Task OnAfterRenderAsync(bool firstRender)
+ {
+ base.OnAfterRenderAsync(firstRender);
+
+ if (!firstRender)
+ {
+ return;
+ }
+
+ Items = await DataService.List(0, await DataService.Count());
+ Recipes = await DataService.GetRecipes();
+
+ StateHasChanged();
+ }
+ }
+}
diff --git a/ValblazeProject/Pages/_Layout.cshtml b/ValblazeProject/Pages/_Layout.cshtml
index 5f604c0..782a83f 100644
--- a/ValblazeProject/Pages/_Layout.cshtml
+++ b/ValblazeProject/Pages/_Layout.cshtml
@@ -38,5 +38,7 @@
+
+