From 03d02a606ba483f5e23a6a40924514df7e31c7e2 Mon Sep 17 00:00:00 2001
From: "maxime.BATISTA@etu.uca.fr" <maximebatista18@gmail.com>
Date: Tue, 11 Apr 2023 16:31:29 +0200
Subject: [PATCH] Add bindings to Recipe views

---
 Resources/Images/password_icon.svg |   2 +-
 Resources/Images/plus.svg          |   4 +-
 ShoopNCook.csproj                  |   3 +
 Views/IngredientView.xaml          |  24 ++++++
 Views/IngredientView.xaml.cs       |  41 +++++++++++
 Views/RecipePage.xaml              | 114 ++++++++++++++++-------------
 Views/RecipePage.xaml.cs           |  86 +++++++++++++++++++++-
 7 files changed, 219 insertions(+), 55 deletions(-)
 create mode 100644 Views/IngredientView.xaml
 create mode 100644 Views/IngredientView.xaml.cs

diff --git a/Resources/Images/password_icon.svg b/Resources/Images/password_icon.svg
index 7a823a5..e242a3d 100644
--- a/Resources/Images/password_icon.svg
+++ b/Resources/Images/password_icon.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="#FFFFFF" height="48" viewBox="0 96 960 960" width="48"><path d="M220.63 997.043q-32.19 0-54.747-22.556-22.557-22.557-22.557-54.748v-432.5q0-32.624 22.557-55.084 22.557-22.459 54.747-22.459h56.805v-90.739q0-85.228 59.245-144.636 59.246-59.408 143.234-59.408 83.989 0 143.32 59.408 59.331 59.408 59.331 144.636v90.739h56.805q32.289 0 54.916 22.459 22.627 22.46 22.627 55.084v432.5q0 32.191-22.627 54.748-22.627 22.556-54.916 22.556H220.63Zm0-77.304h518.74v-432.5H220.63v432.5Zm259.618-133.522q34.035 0 57.817-23.514 23.783-23.514 23.783-56.534 0-32.082-24.031-57.984-24.03-25.902-58.065-25.902t-57.817 25.947q-23.783 25.947-23.783 58.48 0 32.631 24.031 56.069 24.03 23.438 58.065 23.438ZM354.739 409.696h250.522v-90.684q0-53.389-36.478-89.972-36.478-36.583-88.727-36.583-52.248 0-88.782 36.583-36.535 36.583-36.535 89.972v90.684ZM220.63 919.739v-432.5 432.5Z"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" fill="#000000" height="48" viewBox="0 96 960 960" width="48"><path d="M220.63 997.043q-32.19 0-54.747-22.556-22.557-22.557-22.557-54.748v-432.5q0-32.624 22.557-55.084 22.557-22.459 54.747-22.459h56.805v-90.739q0-85.228 59.245-144.636 59.246-59.408 143.234-59.408 83.989 0 143.32 59.408 59.331 59.408 59.331 144.636v90.739h56.805q32.289 0 54.916 22.459 22.627 22.46 22.627 55.084v432.5q0 32.191-22.627 54.748-22.627 22.556-54.916 22.556H220.63Zm0-77.304h518.74v-432.5H220.63v432.5Zm259.618-133.522q34.035 0 57.817-23.514 23.783-23.514 23.783-56.534 0-32.082-24.031-57.984-24.03-25.902-58.065-25.902t-57.817 25.947q-23.783 25.947-23.783 58.48 0 32.631 24.031 56.069 24.03 23.438 58.065 23.438ZM354.739 409.696h250.522v-90.684q0-53.389-36.478-89.972-36.478-36.583-88.727-36.583-52.248 0-88.782 36.583-36.535 36.583-36.535 89.972v90.684ZM220.63 919.739v-432.5 432.5Z"/></svg>
\ No newline at end of file
diff --git a/Resources/Images/plus.svg b/Resources/Images/plus.svg
index aa718df..ffcb182 100644
--- a/Resources/Images/plus.svg
+++ b/Resources/Images/plus.svg
@@ -1 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="#FFFFFF" height="48" viewBox="0 96 960 960" width="48"><path d="M479.825 856Q467 856 458.5 847.375T450 826V606H230q-12.75 0-21.375-8.675-8.625-8.676-8.625-21.5 0-12.825 8.625-21.325T230 546h220V326q0-12.75 8.675-21.375 8.676-8.625 21.5-8.625 12.825 0 21.325 8.625T510 326v220h220q12.75 0 21.375 8.675 8.625 8.676 8.625 21.5 0 12.825-8.625 21.325T730 606H510v220q0 12.75-8.675 21.375-8.676 8.625-21.5 8.625Z"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" fill="#FFFFFF" height="48" viewBox="0 96 960 960" width="48">
+	<path d="M479.825 856Q467 856 458.5 847.375T450 826V606H230q-12.75 0-21.375-8.675-8.625-8.676-8.625-21.5 0-12.825 8.625-21.325T230 546h220V326q0-12.75 8.675-21.375 8.676-8.625 21.5-8.625 12.825 0 21.325 8.625T510 326v220h220q12.75 0 21.375 8.675 8.625 8.676 8.625 21.5 0 12.825-8.625 21.325T730 606H510v220q0 12.75-8.675 21.375-8.676 8.625-21.5 8.625Z"/>
+</svg>
\ No newline at end of file
diff --git a/ShoopNCook.csproj b/ShoopNCook.csproj
index ab4d16c..de34a4b 100644
--- a/ShoopNCook.csproj
+++ b/ShoopNCook.csproj
@@ -77,6 +77,9 @@
 	</ItemGroup>
 
 	<ItemGroup>
+	  <MauiXaml Update="Views\IngredientView.xaml">
+	    <Generator>MSBuild:Compile</Generator>
+	  </MauiXaml>
 	  <MauiXaml Update="Views\ProfilePage.xaml">
 	    <Generator>MSBuild:Compile</Generator>
 	  </MauiXaml>
diff --git a/Views/IngredientView.xaml b/Views/IngredientView.xaml
new file mode 100644
index 0000000..693cdde
--- /dev/null
+++ b/Views/IngredientView.xaml
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+             x:Class="ShoopNCook.Views.IngredientView"
+             x:Name="Ingredient">
+    <HorizontalStackLayout
+        Spacing="2">
+        <Label 
+            Text="•"
+            Style="{StaticResource Small}"/>
+
+        <Label 
+            Text="{Binding Name, Source={x:Reference Ingredient}}"
+            Style="{StaticResource Small}"/>
+
+        <Label 
+            Text="{Binding Quantity, Source={x:Reference Ingredient}}"
+            Style="{StaticResource Small}"/>
+
+        <Label 
+            Text="{Binding Unit, Source={x:Reference Ingredient}}"
+            Style="{StaticResource Small}"/>
+    </HorizontalStackLayout>
+</ContentView>
\ No newline at end of file
diff --git a/Views/IngredientView.xaml.cs b/Views/IngredientView.xaml.cs
new file mode 100644
index 0000000..01288d8
--- /dev/null
+++ b/Views/IngredientView.xaml.cs
@@ -0,0 +1,41 @@
+namespace ShoopNCook.Views;
+
+public partial class IngredientView : ContentView
+{
+
+    public static readonly BindableProperty NameProperty =
+        BindableProperty.Create(nameof(Name), typeof(string), typeof(IngredientView), default(string));
+
+    public static readonly BindableProperty QuantityProperty =
+        BindableProperty.Create(nameof(Quantity), typeof(float), typeof(IngredientView), default(float));
+
+    public static readonly BindableProperty UnitProperty =
+        BindableProperty.Create(nameof(Unit), typeof(string), typeof(IngredientView), default(string));
+
+    public string Name
+    {
+        get => (string)GetValue(NameProperty);
+        set => SetValue(NameProperty, value);
+    }
+
+    public float Quantity
+    {
+        get => (float)GetValue(QuantityProperty);
+        set => SetValue(QuantityProperty, value);
+    }
+
+    public string Unit
+    {
+        get => (string)GetValue(UnitProperty);
+        set => SetValue(UnitProperty, value);
+    }
+
+    public IngredientView(string name, float quantity, string unit)
+    {
+        InitializeComponent();
+
+        Name = name;
+        Quantity = quantity;
+        Unit = unit;
+    }
+}
\ No newline at end of file
diff --git a/Views/RecipePage.xaml b/Views/RecipePage.xaml
index 0e2527a..95bb063 100644
--- a/Views/RecipePage.xaml
+++ b/Views/RecipePage.xaml
@@ -25,12 +25,14 @@
                         Source="arrow_back.svg"/>
                     <Label 
                         Style="{StaticResource h1}"
+                        x:Name="RecipeName"
                         Text="Recipe name"/>
 
                     <ImageButton
+                        x:Name="Favorite"
                         Source="earth_off.svg"
                         Margin="0, 0, 5, 0"
-                    />
+                        Clicked="OnFavorite"/>
                 </FlexLayout>
 
                 <!--Recipe image-->
@@ -50,50 +52,52 @@
                 <VerticalStackLayout
                     Grid.Row="2"
                     Padding="30, 0, 30, 0">
-                    <Label
-                        Style="{StaticResource h2}"
-                        Text="Ingredients"/>
-                    <VerticalStackLayout>
-                        <Label 
-                        Style="{StaticResource Small}"
-                        Text="• Ingredient 1 45 kg"/>
 
-                        <Label 
-                        Style="{StaticResource Small}"
-                        Text="• Ingredient 1 32 g"/>
-
-                        <Label 
-                        Style="{StaticResource Small}"
-                        Text="• Ingredient 1 101 kt"/>
+                    <!--Cook time-->
+                    <VerticalStackLayout>
+                        <HorizontalStackLayout>
+                            <Label 
+                                Style="{StaticResource Small}"
+                                Text="Cooking time: "/>
+                            <Label 
+                                Style="{StaticResource Small}"
+                                x:Name="CookTime"/>
+                            <Label 
+                                Style="{StaticResource Small}"
+                                Text=" min"/>
+                        </HorizontalStackLayout>
+
+                    <!--Energy-->
+
+                        <HorizontalStackLayout>
+                            <Label 
+                                Style="{StaticResource Small}"
+                                Text="Energy: "/>
+                            <Label 
+                                Style="{StaticResource Small}"
+                                x:Name="Energy"/>
+                            <Label 
+                                Style="{StaticResource Small}"
+                                Text="/pers"/>
+                        </HorizontalStackLayout>
                     </VerticalStackLayout>
 
-                    <VerticalStackLayout>
-                        <Label 
-                        Style="{StaticResource Small}"
-                        Text="Cooking time: %Cook_Time%"/>
+                    <!--Ingredient list-->
+                    <Label
+                        Style="{StaticResource h2}"
+                        Text="Ingredients"/>
 
-                        <Label 
-                        Style="{StaticResource Small}"
-                        Text="Energy input: %Nb_Cal%/pers"/>
-                    </VerticalStackLayout>
+                    <VerticalStackLayout 
+                        x:Name="IngredientList"/>
 
+                    <!--Step list-->
                     <Label
                         Style="{StaticResource h2}"
                         Text="Preparation steps"/>
 
-                    <VerticalStackLayout>
-                        <Label 
-                        Style="{StaticResource Small}"
-                        Text="Step 1 : Frist step"/>
-
-                        <Label 
-                        Style="{StaticResource Small}"
-                        Text="Step 2 : Second step"/>
+                    <VerticalStackLayout
+                        x:Name="StepList"/>
 
-                        <Label 
-                        Style="{StaticResource Small}"
-                        Text="Step 3 : Third step"/>
-                    </VerticalStackLayout>
                 </VerticalStackLayout>
             </Grid>
         </ScrollView>
@@ -114,35 +118,47 @@
                     Stroke="Transparent"
                     StrokeShape="RoundRectangle 100"
                     BackgroundColor="{StaticResource Selected}">
-                    <Image 
+                    <ImageButton
                         Source="minus.svg"
                         WidthRequest="40"
-                        HeightRequest="40"/>
+                        HeightRequest="40"
+                        Clicked="OnMinus"/>
                 </Border>
-                
-                <Label 
-                    Grid.Column="1"
-                    Text="%N% pers"
-                    Margin="10, 0, 10, 0"
-                    TextColor="{StaticResource TextColorPrimary}"
-                    VerticalTextAlignment="Center"
-                    FontFamily="PoppinsMedium"/>
-                
+
+                <HorizontalStackLayout
+                    Grid.Column="1">
+                    <Label 
+                        x:Name="NbPersLabel"
+                        Text="1"
+                        Margin="10, 0, 0, 0"
+                        TextColor="{StaticResource TextColorPrimary}"
+                        VerticalTextAlignment="Center"
+                        FontFamily="PoppinsMedium"/>
+
+                    <Label 
+                        Text=" pers"
+                        Margin="0, 0, 10, 0"
+                        TextColor="{StaticResource TextColorPrimary}"
+                        VerticalTextAlignment="Center"
+                        FontFamily="PoppinsMedium"/>
+                </HorizontalStackLayout>
+
                 <Border
                     Grid.Column="2"
                     Stroke="Transparent"
                     StrokeShape="RoundRectangle 100"
                     BackgroundColor="{StaticResource Selected}">
-                    <Image 
+                    <ImageButton 
                         Source="add.svg"
                         WidthRequest="40"
-                        HeightRequest="40"/>
+                        HeightRequest="40"
+                        Clicked="OnPlus"/>
                 </Border>
             </Grid>
 
             <Button
                 Grid.Column="1"
-                Text="Most Recent"
+                Text="Add to list"
                 Style="{StaticResource UserButton}"
                 TextColor="White"
                 BackgroundColor="Gray">
diff --git a/Views/RecipePage.xaml.cs b/Views/RecipePage.xaml.cs
index f5b479b..ba2b5cf 100644
--- a/Views/RecipePage.xaml.cs
+++ b/Views/RecipePage.xaml.cs
@@ -1,9 +1,87 @@
+using Microsoft.Maui.Controls;
+
 namespace ShoopNCook.Views;
 
 public partial class RecipePage : ContentPage
 {
-	public RecipePage()
-	{
-		InitializeComponent();
-	}
+
+	private uint nbPers;
+    private bool isFavorite;
+
+    public RecipePage() :
+        this("Recipe Sample", 32, 250,
+            true, 1,
+            new List<IngredientView> {
+                new IngredientView("Chocolate", 25, "g"),
+                new IngredientView("Flour", 250, "g"),
+                new IngredientView("Sugar", 0.5F, "kg")
+            },
+            new List<string> { "This is the first preparation step", "add to furnace and wait", "Enjoy !" }
+        )
+    {}
+
+    public RecipePage(
+        string name,
+        uint cookTime,
+        uint energy,
+        bool isFavorite,
+        uint nbPers,
+        List<IngredientView> ingredients,
+        List<string> steps
+        )
+    {
+        InitializeComponent();
+        this.nbPers = nbPers;
+        this.isFavorite = isFavorite;
+
+        CookTime.Text = cookTime.ToString();
+        Energy.Text = energy.ToString();
+        RecipeName.Text = name;
+
+        foreach (IngredientView iv in ingredients)
+            IngredientList.Add(iv);
+
+        var styles = Application.Current.Resources.MergedDictionaries.ElementAt(1);
+
+        int count = 0;
+        foreach (string step in steps) {
+            Label label = new Label();
+            label.Style = (Style)styles["Small"];
+            label.Text = "Step " + ++count + ": " + step;
+            StepList.Add(label);
+        }
+    }
+
+    private void OnFavorite(object o, EventArgs e)
+    {
+        isFavorite = !isFavorite;
+        if (isFavorite) 
+        {
+            Favorite.Source = ImageSource.FromFile("earth_on.svg");
+        }
+        else
+        {
+            Favorite.Source = ImageSource.FromFile("earth_off.svg");
+        }
+    }
+
+    private void OnPlus(object o, EventArgs e)
+    {
+        UpdateCounter(++nbPers);
+    }
+
+    private void OnMinus(object o, EventArgs e)
+    {
+        if (nbPers <= 1)
+            return;
+
+        nbPers--;
+        UpdateCounter(nbPers);
+    }
+
+    private void UpdateCounter(uint counter)
+    {
+        NbPersLabel.Text = counter.ToString();
+
+    }
 }
\ No newline at end of file