<?xml version="1.0" encoding="utf-8" ?>
<l:AppContentPage
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:l="clr-namespace:Blahblah.FlowerApp"
    xmlns:ctl="clr-namespace:Blahblah.FlowerApp.Controls"
    xmlns:garden="clr-namespace:Blahblah.FlowerApp.Views.Garden"
    x:Class="Blahblah.FlowerApp.Views.Garden.AddFlowerPage"
    x:Name="addFlowerPage"
    x:DataType="garden:AddFlowerPage"
    Title="{l:Lang addFlower, Default=Add Flower}">

    <ContentPage.ToolbarItems>
        <ToolbarItem Text="{l:Lang save, Default=Save}" Clicked="Save_Clicked"/>
    </ContentPage.ToolbarItems>

    <ContentPage.Resources>
        <garden:CoverConverter x:Key="coverConverter"/>
    </ContentPage.Resources>

    <Grid RowDefinitions="Auto,*" BindingContext="{x:Reference addFlowerPage}">
        <Grid ColumnDefinitions="Auto,*" ColumnSpacing="20" Margin="20">
            <VerticalStackLayout>
                <Grid Padding="0,10,10,0">
                    <Image Source="{Binding Cover, Converter={StaticResource coverConverter}}" WidthRequest="80" HeightRequest="80" Aspect="AspectFill">
                        <Image.Clip>
                            <EllipseGeometry Center="40,40" RadiusX="40" RadiusY="40"/>
                        </Image.Clip>
                    </Image>
                    <Button Style="{StaticResource iconButton}" Text="{x:Static l:Res.XMarkLarge}" Clicked="ButtonClearCover_Clicked"
                            IsVisible="{Binding Cover, Converter={StaticResource notNullConverter}}"
                            HorizontalOptions="End" VerticalOptions="Start" Margin="0,-20,-20,0"
                            TextColor="{AppThemeBinding Light={StaticResource Red100Accent}, Dark={StaticResource Red300Accent}}"/>
                </Grid>
                <HorizontalStackLayout HorizontalOptions="Center" Padding="0,0,10,0">
                    <Button Style="{StaticResource iconButton}" Text="{x:Static l:Res.Camera}" Clicked="ButtonTakePhoto_Clicked"/>
                    <Button Style="{StaticResource iconButton}" Text="{x:Static l:Res.Image}" Clicked="ButtonSelectPhoto_Clicked"/>
                </HorizontalStackLayout>
            </VerticalStackLayout>
            <VerticalStackLayout Grid.Column="1" Padding="0,10,0,0">
                <HorizontalStackLayout>
                    <Label Text="{l:Lang flowerName, Default=Flower name}" FontSize="16" Margin="6,0" VerticalOptions="Center"/>
                    <ctl:SecondaryLabel Text="*" VerticalOptions="Center"
                                        TextColor="{AppThemeBinding Light={StaticResource Red100Accent}, Dark={StaticResource Red300Accent}}"/>
                </HorizontalStackLayout>
                <Entry Text="{Binding FlowerName}" Placeholder="{l:Lang enterFlowerName, Default=Please enter the flower name}" Margin="0,12"/>
                <Frame BorderColor="Transparent" Padding="8,6" BackgroundColor="#b6e8e8" CornerRadius="8" HorizontalOptions="Start">
                    <Label Text="{Binding CurrentLocationString}"/>
                </Frame>
            </VerticalStackLayout>
        </Grid>
        <TableView Grid.Row="1" Intent="Settings" HasUnevenRows="True" BackgroundColor="{AppThemeBinding Light={StaticResource White}, Dark={StaticResource Black}}">
            <TableSection>
                <ctl:OptionEntryCell IsRequired="True" Title="{l:Lang locationColon, Default=Location:}"
                                     Placeholder="{Binding FlowerLocation}"/>
                <ctl:OptionSelectCell IsRequired="True" Title="{l:Lang flowerCategoryColon, Default=Flower Category:}"
                                      Detail="{Binding Category}" Tapped="FlowerCategory_Tapped"/>
                <ctl:OptionDateTimePickerCell IsRequired="True" Title="{l:Lang purchaseTimeColon, Default=Purchase time:}"
                                              Date="{Binding PurchaseDate}" Time="{Binding PurchaseTime}"/>
                <ctl:OptionSelectCell Title="{l:Lang purchaseFromColon, Default=Purchase from:}"
                                      Detail="{Binding PurchaseFrom}"/>
                <ctl:OptionEntryCell Title="{l:Lang costColon, Default=Cost:}" Keyboard="Numeric"
                                     Placeholder="{l:Lang enterCost, Default=Please enter the cost}"
                                     Text="{Binding Cost}"/>
                <ctl:OptionEditorCell Title="{l:Lang memoColon, Default=Memo:}"
                                      Text="{Binding Memo}" Height="200"/>
            </TableSection>
        </TableView>
        <Frame Grid.RowSpan="2" x:Name="loading" BorderColor="Transparent" Margin="0" Padding="20" BackgroundColor="#40000000"
           IsVisible="False" Opacity="0" HorizontalOptions="Center" VerticalOptions="Center">
            <ActivityIndicator HorizontalOptions="Center" VerticalOptions="Center" IsRunning="True"/>
        </Frame>
    </Grid>

</l:AppContentPage>