<reactiveui:ReactiveUserControl x:Class="ImageSort.WPF.Views.ImagesView"
                                x:TypeArguments="vm:ImagesViewModel"
                                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"
                                xmlns:System="clr-namespace:System;assembly=System.Runtime"
                                xmlns:reactiveui="http://reactiveui.net"
                                xmlns:converters="clr-namespace:ImageSort.WPF.Converters"
                                xmlns:vm="clr-namespace:ImageSort.ViewModels;assembly=ImageSort"
                                xmlns:adonisExtensions="clr-namespace:AdonisUI.Extensions;assembly=AdonisUI"
                                xmlns:adonisUi="clr-namespace:AdonisUI;assembly=AdonisUI"
                                xmlns:text="clr-namespace:ImageSort.Localization;assembly=ImageSort.Localization"
                                xmlns:gif="http://wpfanimatedgif.codeplex.com"
                                xmlns:metadata="clr-namespace:ImageSort.WPF.Views.Metadata"
                                mc:Ignorable="d"
                                d:DesignHeight="450" d:DesignWidth="800">
    <UserControl.Resources>
        <converters:PathToFilenameConverter x:Key="PathToFilenameConverter" />
        <converters:PathToBitmapImageConverter x:Key="PathToBitmapImageConverter" LoadWidth="120" />
        <converters:PathToBitmapImageConverter x:Key="GifPathToBitmapImageConverter" LoadWidth="120" ForGifThumbnails="True"/>

        <DataTemplate x:Key="ImageEntry" DataType="{x:Type System:String}">
            <Grid Height="100" Width="120">
                <Grid.RowDefinitions>
                    <RowDefinition Height="*" />
                    <RowDefinition Height="auto" />
                </Grid.RowDefinitions>

                <Image Source="{Binding Converter={StaticResource PathToBitmapImageConverter}}" gif:ImageBehavior.AnimatedSource="{Binding Converter={StaticResource GifPathToBitmapImageConverter}}"/>

                <TextBlock Text="{Binding Converter={StaticResource PathToFilenameConverter}}" Grid.Row="1"/>
            </Grid>
        </DataTemplate>
    </UserControl.Resources>

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="auto" />
        </Grid.RowDefinitions>

        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="auto" />
            <ColumnDefinition Width="auto" x:Name="MetadataColumn"/>
        </Grid.ColumnDefinitions>

        <Image x:Name="SelectedImage" Source="/Icons/Image Sort.png"
               Margin="{adonisUi:Space 0, 0, 0, 1}" />

        <GridSplitter Grid.Column="1" Width="5"/>

        <metadata:MetadataView x:Name="Metadata"
                               Grid.Column="2"/>

        <Grid Grid.Row="1" Grid.ColumnSpan="3">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="auto" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="auto" />
            </Grid.ColumnDefinitions>

            <Button x:Name="GoLeft" Content="←" ToolTip="{x:Static text:Text.GoLeftTooltip}" />

            <Grid Grid.Column="1">
                <Grid.RowDefinitions>
                    <RowDefinition Height="auto" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>

                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="auto" />
                    </Grid.ColumnDefinitions>

                    <TextBox x:Name="SearchTerm"
                             adonisExtensions:WatermarkExtension.Watermark="{x:Static text:Text.SearchTermWatermark}" />

                    <Button x:Name="Rename" Content="{x:Static text:Text.Rename}" Grid.Column="1" />
                </Grid>

                <ListBox x:Name="Images" Grid.Row="1" ItemTemplate="{StaticResource ImageEntry}"
                         SelectionChanged="OnSelectedImageChanged">
                    <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                            <VirtualizingStackPanel Orientation="Horizontal" />
                        </ItemsPanelTemplate>
                    </ListBox.ItemsPanel>
                </ListBox>
            </Grid>

            <Button x:Name="GoRight" Content="→" ToolTip="{x:Static text:Text.GoRightTooltip}" Grid.Column="2" />
        </Grid>
    </Grid>
</reactiveui:ReactiveUserControl>