<UserControl x:Class="JuliusSweetland.OptiKey.UI.Views.Management.DictionaryView"
             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:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    
    <UserControl.Resources>
        <CollectionViewSource x:Key="EntriesCollectionViewSource" Source="{Binding Entries}" />
    </UserControl.Resources>
    
    <Grid IsSharedSizeScope="True">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        
        <StackPanel Grid.Row="0" 
                    Orientation="Horizontal" 
                    HorizontalAlignment="Center">
            <Label Content="Add new entry:" 
                   FontWeight="Bold"
                   Margin="2" 
                   VerticalAlignment="Center" />
            <TextBox MinWidth="150" 
                     Text="{Binding NewEntry, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" 
                     Margin="2" 
                     VerticalAlignment="Center" />
            <Button Content="Add" 
                    Command="{Binding AddCommand}" 
                    Margin="2" 
                    VerticalAlignment="Center" />
        </StackPanel>
        
        <ItemsControl Grid.Row="1"
                      VirtualizingStackPanel.IsVirtualizing="True"
                      ScrollViewer.CanContentScroll="True"
                      ItemsSource="{Binding Source={StaticResource EntriesCollectionViewSource}, Mode=OneWay}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="Auto" SharedSizeGroup="ToggleDeleteButtonColumn" />
                        </Grid.ColumnDefinitions>

                        <TextBlock Grid.Column="0" 
                                   Text="{Binding Entry}"
                                   HorizontalAlignment="Left" 
                                   VerticalAlignment="Center" 
                                   Margin="50,2,50,2">
                            <TextBlock.Style>
                                <Style TargetType="{x:Type TextBlock}" BasedOn="{StaticResource {x:Type TextBlock}}">
                                    <Style.Triggers>
                                        <DataTrigger Binding="{Binding Deleted}" Value="True">
                                            <Setter Property="Foreground" Value="Red" />
                                            <Setter Property="TextDecorations" Value="Strikethrough" />
                                        </DataTrigger>
                                        <DataTrigger Binding="{Binding Added}" Value="True">
                                            <Setter Property="Foreground" Value="Green" />
                                        </DataTrigger>
                                    </Style.Triggers>
                                </Style>
                            </TextBlock.Style>        
                       </TextBlock>

                        <Button Grid.Column="1" 
                                VerticalAlignment="Center" 
                                MinWidth="100" 
                                Margin="50,2,50,2"
                                Command="{Binding RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}, Path=DataContext.ToggleDeleteCommand}" 
                                CommandParameter="{Binding Entry}">
                            <Button.Style>
                                <Style TargetType="{x:Type Button}" BasedOn="{StaticResource {x:Type Button}}">
                                    <Setter Property="Content" Value="Delete" />
                                    <Style.Triggers>
                                        <DataTrigger Binding="{Binding Deleted}" Value="True">
                                            <Setter Property="Content" Value="Restore" />
                                        </DataTrigger>
                                    </Style.Triggers>
                                </Style>
                            </Button.Style>        
                        </Button>
                    </Grid>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <VirtualizingStackPanel />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.Template>
                <ControlTemplate>
                    <Border BorderThickness="{TemplateBinding Border.BorderThickness}"
                            Padding="{TemplateBinding Control.Padding}"
                            BorderBrush="{TemplateBinding Border.BorderBrush}"
                            Background="{TemplateBinding Panel.Background}"
                            SnapsToDevicePixels="True">
                        <ScrollViewer Padding="{TemplateBinding Control.Padding}" Focusable="False">
                            <ItemsPresenter SnapsToDevicePixels="{TemplateBinding UIElement.SnapsToDevicePixels}" />
                        </ScrollViewer>
                    </Border>
                </ControlTemplate>
            </ItemsControl.Template>
        </ItemsControl>
    </Grid>
</UserControl>
