<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:m="using:SourceGit.Models"
             xmlns:vm="using:SourceGit.ViewModels"
             xmlns:v="using:SourceGit.Views"
             xmlns:c="using:SourceGit.Converters"
             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
             x:Class="SourceGit.Views.ImageDiffView"
             x:DataType="m:ImageDiff">
  <TabControl SelectedIndex="{Binding Source={x:Static vm:Preferences.Instance}, Path=ImageDiffActiveIdx, Mode=TwoWay}" Margin="0,0,0,8" TabStripPlacement="Bottom">
    <TabControl.Styles>
      <Style Selector="TabControl /template/ ItemsPresenter#PART_ItemsPresenter > WrapPanel">
        <Setter Property="HorizontalAlignment" Value="Center"/>
      </Style>
    </TabControl.Styles>

    <TabItem>
      <TabItem.Header>
        <TextBlock Text="{DynamicResource Text.Diff.Image.SideBySide}" FontSize="11"/>
      </TabItem.Header>

      <UniformGrid Rows="1" Margin="0,16" HorizontalAlignment="Center" VerticalAlignment="Center">
        <Grid RowDefinitions="Auto,*" Margin="16,0" IsVisible="{Binding Old, Converter={x:Static ObjectConverters.IsNotNull}}">
          <StackPanel Grid.Row="0" Orientation="Horizontal" HorizontalAlignment="Center">
            <Border Height="16" Background="{DynamicResource Brush.Badge}" CornerRadius="8" VerticalAlignment="Center">
              <TextBlock Text="{DynamicResource Text.Diff.Old}" Margin="8,0" FontSize="10" Foreground="{DynamicResource Brush.BadgeFG}"/>
            </Border>

            <TextBlock Text="{Binding OldImageSize}" Margin="8,0,0,0"/>
            <TextBlock Text="{Binding OldFileSize, Converter={x:Static c:LongConverters.ToFileSize}}" Foreground="{DynamicResource Brush.FG2}" Margin="16,0,0,0"/>
          </StackPanel>

          <Border Grid.Row="1" Margin="0,12,0,0" HorizontalAlignment="Center" VerticalAlignment="Center" Effect="drop-shadow(0 0 8 #A0000000)">
            <Border Background="{DynamicResource Brush.Popup}" Padding="8">
              <Border BorderThickness="1" BorderBrush="{DynamicResource Brush.Border1}">
                <v:ImageView Image="{Binding Old}"/>
              </Border>
            </Border>
          </Border>
        </Grid>

        <Grid RowDefinitions="Auto,*" Margin="16,0" IsVisible="{Binding New, Converter={x:Static ObjectConverters.IsNotNull}}">
          <StackPanel Grid.Row="0" Orientation="Horizontal" HorizontalAlignment="Center">
            <Border Height="16" Background="Green" CornerRadius="8" VerticalAlignment="Center">
              <TextBlock Text="{DynamicResource Text.Diff.New}" Margin="8,0" FontSize="10" Foreground="White"/>
            </Border>

            <TextBlock Text="{Binding NewImageSize}" Margin="8,0,0,0"/>
            <TextBlock Text="{Binding NewFileSize, Converter={x:Static c:LongConverters.ToFileSize}}" Foreground="{DynamicResource Brush.FG2}" Margin="16,0,0,0"/>
          </StackPanel>

          <Border Grid.Row="1" Margin="0,12,0,0" HorizontalAlignment="Center" VerticalAlignment="Center" Effect="drop-shadow(0 0 8 #A0000000)">
            <Border Background="{DynamicResource Brush.Popup}" Padding="8">
              <Border BorderThickness="1" BorderBrush="{DynamicResource Brush.Border1}">
                <v:ImageView Image="{Binding New}"/>
              </Border>
            </Border>
          </Border>
        </Grid>
      </UniformGrid>
    </TabItem>

    <TabItem>
      <TabItem.Header>
        <TextBlock Text="{DynamicResource Text.Diff.Image.Swipe}" FontSize="11"/>
      </TabItem.Header>

      <Grid RowDefinitions="Auto,*" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="8,16">
        <Grid Grid.Row="0" ColumnDefinitions="Auto,Auto,Auto,Auto,Auto,Auto" HorizontalAlignment="Center">
          <Border Grid.Column="0" Height="16" Background="{DynamicResource Brush.Badge}" CornerRadius="8" VerticalAlignment="Center">
            <TextBlock Text="{DynamicResource Text.Diff.Old}" Margin="8,0" FontSize="10" Foreground="{DynamicResource Brush.BadgeFG}"/>
          </Border>

          <TextBlock Grid.Column="1" Text="{Binding OldImageSize}" Margin="8,0,0,0"/>
          <TextBlock Grid.Column="2" Text="{Binding OldFileSize, Converter={x:Static c:LongConverters.ToFileSize}}" Foreground="{DynamicResource Brush.FG2}" Margin="16,0,0,0"/>

          <Border Grid.Column="3" Height="16" Background="Green" CornerRadius="8" VerticalAlignment="Center" Margin="32,0,0,0">
            <TextBlock Text="{DynamicResource Text.Diff.New}" Margin="8,0" FontSize="10" Foreground="White"/>
          </Border>

          <TextBlock Grid.Column="4" Text="{Binding NewImageSize}" Margin="8,0,0,0"/>
          <TextBlock Grid.Column="5" Text="{Binding NewFileSize, Converter={x:Static c:LongConverters.ToFileSize}}" Foreground="{DynamicResource Brush.FG2}" Margin="16,0,0,0"/>
        </Grid>

        <Border Grid.Row="1" Margin="0,12,0,0" HorizontalAlignment="Center" Effect="drop-shadow(0 0 8 #A0000000)">
          <Border Background="{DynamicResource Brush.Window}">
            <Border BorderThickness="1" BorderBrush="{DynamicResource Brush.Border1}" Margin="8">
              <v:ImageSwipeControl OldImage="{Binding Old}"
                                   NewImage="{Binding New}"
                                   RenderOptions.BitmapInterpolationMode="HighQuality"/>
            </Border>
          </Border>
        </Border>
      </Grid>
    </TabItem>

    <TabItem>
      <TabItem.Header>
        <TextBlock Text="{DynamicResource Text.Diff.Image.Blend}" FontSize="11"/>
      </TabItem.Header>

      <Grid RowDefinitions="Auto,*,Auto" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="8,16,8,0">
        <Grid Grid.Row="0" ColumnDefinitions="Auto,Auto,Auto,Auto,Auto,Auto,Auto,Auto" HorizontalAlignment="Center">
          <Border Grid.Column="0" Height="16" Background="{DynamicResource Brush.Badge}" CornerRadius="8" VerticalAlignment="Center">
            <TextBlock Text="{DynamicResource Text.Diff.Old}" Margin="8,0" FontSize="10" Foreground="{DynamicResource Brush.BadgeFG}"/>
          </Border>

          <TextBlock Grid.Column="1" Text="{Binding OldImageSize}" Margin="8,0,0,0"/>
          <TextBlock Grid.Column="2" Text="{Binding OldFileSize, Converter={x:Static c:LongConverters.ToFileSize}}" Foreground="{DynamicResource Brush.FG2}" Margin="16,0,0,0"/>

          <Border Grid.Column="3" Height="16" Background="Green" CornerRadius="8" VerticalAlignment="Center" Margin="32,0,0,0">
            <TextBlock Text="{DynamicResource Text.Diff.New}" Margin="8,0" FontSize="10" Foreground="White"/>
          </Border>

          <TextBlock Grid.Column="4" Text="{Binding NewImageSize}" Margin="8,0,0,0"/>
          <TextBlock Grid.Column="5" Text="{Binding NewFileSize, Converter={x:Static c:LongConverters.ToFileSize}}" Foreground="{DynamicResource Brush.FG2}" Margin="16,0,0,0"/>
        </Grid>

        <Border Grid.Row="1" Margin="0,12,0,0" HorizontalAlignment="Center" Effect="drop-shadow(0 0 8 #A0000000)">
          <Border Background="{DynamicResource Brush.Window}">
            <Border BorderThickness="1" BorderBrush="{DynamicResource Brush.Border1}" Margin="8">
              <v:ImageBlendControl Alpha="{Binding #ImageBlendSlider.Value}"
                                   OldImage="{Binding Old}"
                                   NewImage="{Binding New}"/>
            </Border>
          </Border>
        </Border>

        <Grid Grid.Row="2" ColumnDefinitions="100,200,100" Margin="0,12,0,0" HorizontalAlignment="Center">
          <StackPanel Grid.Column="0" Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,0,8,0">
            <TextBlock Margin="0,0,8,0"
                       Text="{Binding #ImageBlendSlider.Value, Converter={x:Static c:DoubleConverters.OneMinusToPercentage}}"
                       Foreground="{DynamicResource Brush.FG2}"/>
            <TextBlock Text="{DynamicResource Text.Diff.Old}"/>
          </StackPanel>

          <Slider Grid.Column="1"
                  x:Name="ImageBlendSlider"
                  Minimum="0" Maximum="1"
                  VerticalAlignment="Top"
                  TickFrequency="0.5"
                  TickPlacement="BottomRight"
                  Margin="0"
                  MinHeight="0"
                  Foreground="{DynamicResource Brush.Border1}"
                  Value="0.5"/>

          <StackPanel Grid.Column="2" Orientation="Horizontal" VerticalAlignment="Top" Margin="8,0,0,0">
            <TextBlock Text="{DynamicResource Text.Diff.New}"/>
            <TextBlock Margin="8,0,0,0"
                       Text="{Binding #ImageBlendSlider.Value, Converter={x:Static c:DoubleConverters.ToPercentage}}"
                       Foreground="{DynamicResource Brush.FG2}"/>
          </StackPanel>
        </Grid>
      </Grid>
    </TabItem>

    <TabItem>
      <TabItem.Header>
        <TextBlock Text="{DynamicResource Text.Diff.Image.Difference}" FontSize="11"/>
      </TabItem.Header>

      <Grid RowDefinitions="Auto,*,Auto" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="8,16,8,0">
        <Grid Grid.Row="0" ColumnDefinitions="Auto,Auto,Auto,Auto,Auto,Auto,Auto,Auto" HorizontalAlignment="Center">
          <Border Grid.Column="0" Height="16" Background="{DynamicResource Brush.Badge}" CornerRadius="8" VerticalAlignment="Center">
            <TextBlock Text="{DynamicResource Text.Diff.Old}" Margin="8,0" FontSize="10" Foreground="{DynamicResource Brush.BadgeFG}"/>
          </Border>

          <TextBlock Grid.Column="1" Text="{Binding OldImageSize}" Margin="8,0,0,0"/>
          <TextBlock Grid.Column="2" Text="{Binding OldFileSize, Converter={x:Static c:LongConverters.ToFileSize}}" Foreground="{DynamicResource Brush.FG2}" Margin="16,0,0,0"/>

          <Border Grid.Column="3" Height="16" Background="Green" CornerRadius="8" VerticalAlignment="Center" Margin="32,0,0,0">
            <TextBlock Text="{DynamicResource Text.Diff.New}" Margin="8,0" FontSize="10" Foreground="White"/>
          </Border>

          <TextBlock Grid.Column="4" Text="{Binding NewImageSize}" Margin="8,0,0,0"/>
          <TextBlock Grid.Column="5" Text="{Binding NewFileSize, Converter={x:Static c:LongConverters.ToFileSize}}" Foreground="{DynamicResource Brush.FG2}" Margin="16,0,0,0"/>
        </Grid>

        <Border Grid.Row="1" Margin="0,12,0,0" HorizontalAlignment="Center" Effect="drop-shadow(0 0 8 #A0000000)">
          <Border Background="{DynamicResource Brush.Window}">
            <Border BorderThickness="1" BorderBrush="{DynamicResource Brush.Border1}" Margin="8">
              <v:ImageDifferenceControl Alpha="{Binding #ImageDifferenceSlider.Value}"
                                        OldImage="{Binding Old}"
                                        NewImage="{Binding New}"/>
            </Border>
          </Border>
        </Border>

        <Grid Grid.Row="2" ColumnDefinitions="100,200,100" Margin="0,12,0,0" HorizontalAlignment="Center">
          <StackPanel Grid.Column="0" Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,0,8,0">
            <TextBlock Margin="0,0,8,0"
                       Text="{Binding #ImageDifferenceSlider.Value, Converter={x:Static c:DoubleConverters.OneMinusToPercentage}}"
                       Foreground="{DynamicResource Brush.FG2}"/>
            <TextBlock Text="{DynamicResource Text.Diff.Old}"/>
          </StackPanel>

          <Slider Grid.Column="1"
                  x:Name="ImageDifferenceSlider"
                  Minimum="0" Maximum="1"
                  VerticalAlignment="Top"
                  TickFrequency="0.5"
                  TickPlacement="BottomRight"
                  Margin="0"
                  MinHeight="0"
                  Foreground="{DynamicResource Brush.Border1}"
                  Value="0.5"/>

          <StackPanel Grid.Column="2" Orientation="Horizontal" VerticalAlignment="Top" Margin="8,0,0,0">
            <TextBlock Text="{DynamicResource Text.Diff.New}"/>
            <TextBlock Margin="8,0,0,0"
                       Text="{Binding #ImageDifferenceSlider.Value, Converter={x:Static c:DoubleConverters.ToPercentage}}"
                       Foreground="{DynamicResource Brush.FG2}"/>
          </StackPanel>
        </Grid>
      </Grid>
    </TabItem>

  </TabControl>
</UserControl>
