<UserControl x:Class="Tango.PPC.UI.Dialogs.CartridgeValidationView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:local="clr-namespace:Tango.PPC.UI.Dialogs"
             xmlns:entities="clr-namespace:Tango.BL.Entities;assembly=Tango.BL"
             xmlns:touch="clr-namespace:Tango.Touch.Controls;assembly=Tango.Touch"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             Background="{StaticResource TangoPrimaryBackgroundBrush}"  d:DesignHeight="555" d:DesignWidth="560" Width="570" Height="700" d:DataContext="{d:DesignInstance Type=local:CartridgeValidationViewVM, IsDesignTimeCreatable=False}">

    <Grid Margin="20">
        <DockPanel>
            <Grid DockPanel.Dock="Bottom">
                <touch:TouchButton HorizontalAlignment="Left" CornerRadius="25" Command="{Binding CloseCommand}" Style="{StaticResource TangoHollowButton}" Width="150" Height="50" VerticalAlignment="Bottom">CANCEL</touch:TouchButton>
                <touch:TouchButton HorizontalAlignment="Right" CornerRadius="25" Command="{Binding OKCommand}" Style="{StaticResource TangoHollowButton}" Width="150" Height="50" VerticalAlignment="Bottom">CONFIRM</touch:TouchButton>
            </Grid>
            <StackPanel DockPanel.Dock="Top">
                <Image Source="/Images/cartridge_validation.png" RenderOptions.BitmapScalingMode="Fant" Stretch="Uniform" Height="120"></Image>
                <TextBlock HorizontalAlignment="Center" Margin="0 20 0 0" FontSize="{StaticResource TangoHeaderFontSize}">Validate Cartridge Type</TextBlock>
                <TextBlock Margin="20 10" HorizontalAlignment="Center" TextWrapping="Wrap" TextAlignment="Center">
                   Ink cartridge has been inserted to the system. Please validate the cartridge ink by selecting the correct color.
                </TextBlock>
            </StackPanel>
            <Grid>
                <touch:TouchStaticListBox HorizontalAlignment="Center" VerticalAlignment="Center" ItemsSource="{Binding IDSPacks}" SelectedItem="{Binding SelectedIDSPack}">
                    <touch:TouchStaticListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                            <WrapPanel />
                        </ItemsPanelTemplate>
                    </touch:TouchStaticListBox.ItemsPanel>
                    <touch:TouchStaticListBox.ItemContainerStyle>
                        <Style TargetType="touch:TouchStaticListBoxItem">
                            <Setter Property="RenderTransformOrigin" Value="0.5,0.5"></Setter>
                            <Setter Property="RenderTransform">
                                <Setter.Value>
                                    <ScaleTransform ScaleX="1" ScaleY="1"></ScaleTransform>
                                </Setter.Value>
                            </Setter>
                            <Style.Triggers>
                                <Trigger Property="IsSelected" Value="True">
                                    <Setter Property="RenderTransform">
                                        <Setter.Value>
                                            <ScaleTransform ScaleX="1.2" ScaleY="1.2"></ScaleTransform>
                                        </Setter.Value>
                                    </Setter>
                                </Trigger>
                            </Style.Triggers>
                        </Style>
                    </touch:TouchStaticListBox.ItemContainerStyle>
                    <touch:TouchStaticListBox.ItemTemplate>
                        <DataTemplate DataType="{x:Type entities:IdsPack}">
                            <StackPanel Margin="15" Width="70">
                                <Ellipse Width="70" Height="70">
                                    <Ellipse.Fill>
                                        <SolidColorBrush Color="{Binding LiquidType.Color,Converter={StaticResource ColorToIntegerConverter}}"></SolidColorBrush>
                                    </Ellipse.Fill>
                                </Ellipse>
                                <TextBlock Text="{Binding LiquidType.Name}" TextWrapping="Wrap" HorizontalAlignment="Center" Margin="0 10 0 0"></TextBlock>
                            </StackPanel>
                        </DataTemplate>
                    </touch:TouchStaticListBox.ItemTemplate>
                </touch:TouchStaticListBox>
            </Grid>
        </DockPanel>
    </Grid>
</UserControl>