<?xml version="1.0" encoding="UTF-8"?>
<ContentView 
    xmlns="http://xamarin.com/schemas/2014/forms" 
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"    
    xmlns:ffimageloading="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms"
    xmlns:controls="clr-namespace:eShopOnContainers.Core.Controls;assembly=eShopOnContainers.Core"
    x:Class="eShopOnContainers.Core.Views.Templates.ProductTemplate">
    <ContentView.Resources>
        <ResourceDictionary>
            
            <Style x:Key="ProductNameStyle" 
               TargetType="{x:Type Label}">
                <Setter Property="FontFamily"
                        Value="{StaticResource MontserratRegular}" />
                <Setter Property="FontSize"
                        Value="{StaticResource LargeSize}" />
                <Setter Property="HorizontalOptions"
                        Value="Center" />
                <Setter Property="Margin"
                        Value="0, 12, 0, 6" />
            </Style>
            
            <Style x:Key="ProductPriceStyle" 
               TargetType="{x:Type Label}">
                <Setter Property="FontAttributes"
                        Value="Bold" />
                <Setter Property="FontFamily"
                        Value="{StaticResource MontserratRegular}" />
                <Setter Property="FontSize"
                        Value="{StaticResource BigSize}" />
                <Setter Property="TextColor"
                        Value="{StaticResource BlackColor}" />
                <Setter Property="HorizontalOptions"
                        Value="Center" />
                <Setter Property="Margin"
                        Value="0, 6, 0, 12" />
            </Style>
            
            <Style x:Key="AddButtonStyle" 
               TargetType="{x:Type Grid}">
                <Setter Property="HeightRequest"
                        Value="42" />
                <Setter Property="WidthRequest"
                        Value="42" />
                <Setter Property="HorizontalOptions"
                        Value="Center" />
                <Setter Property="VerticalOptions"
                        Value="End" />
                <Setter Property="Margin"
                        Value="0,0,0,24" />
            </Style>
            
            <Style x:Key="AddImageStyle" 
               TargetType="{x:Type Image}">
                <Setter Property="HeightRequest"
                        Value="24" />
                <Setter Property="WidthRequest"
                        Value="24" />
            </Style>
            
        </ResourceDictionary>
    </ContentView.Resources>
    <ContentView.Content>
        <Grid
            BackgroundColor="{StaticResource BackgroundColor}"
            Padding="0"
            Margin="0">
            <Grid.RowDefinitions>
                <RowDefinition Height="250" />
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <!-- IMAGE -->
            <ffimageloading:CachedImage 
                Grid.Row="0"
                Source="{Binding PictureUri}"     
                Aspect="AspectFill">
                <ffimageloading:CachedImage.LoadingPlaceholder>
                    <OnPlatform   
                        x:TypeArguments="ImageSource"
                        iOS="default_product"
                        Android="default_product"
                        WinPhone="Assets/default_product.png"/>
                </ffimageloading:CachedImage.LoadingPlaceholder>
                <ffimageloading:CachedImage.ErrorPlaceholder>
                    <OnPlatform   
                        x:TypeArguments="ImageSource"
                        iOS="noimage"
                        Android="noimage"
                        WinPhone="Assets/noimage.png"/>
                </ffimageloading:CachedImage.ErrorPlaceholder>
            </ffimageloading:CachedImage>
            <Grid
                Grid.Row="0"
                Grid.RowSpan="2"
                Style="{StaticResource AddButtonStyle}">
                <controls:AddBasketButton />
            </Grid>
            <!-- NAME -->
            <Label 
                Grid.Row="1"
                Text="{Binding Name, Converter={StaticResource ToUpperConverter}}"
                Style="{StaticResource ProductNameStyle}"/>
            <!-- PRICE -->
            <Label 
                Grid.Row="2"
                Text="{Binding Price, StringFormat='${0:N}'}"
                Style="{StaticResource ProductPriceStyle}"/>
        </Grid>
    </ContentView.Content>
</ContentView>
