<UserControl x:Class="PixiEditor.Views.UserControls.PreviewWindow"
             x:ClassModifier="internal"
             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:local="clr-namespace:PixiEditor.Views.UserControls"
             xmlns:coll="clr-namespace:System.Collections.ObjectModel;assembly=System"
             xmlns:converters="clr-namespace:PixiEditor.Helpers.Converters" xmlns:system="clr-namespace:System;assembly=System.Runtime"
             mc:Ignorable="d" 
             d:DesignHeight="400" d:DesignWidth="400" x:Name="uc"
             Foreground="White" Background="Transparent">

    <UserControl.Resources>
        <BoolToVisibilityConverter x:Key="BoolToVisibilityConverter"/>
    </UserControl.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="5"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>

        <Grid x:Name="imageGrid" RenderOptions.BitmapScalingMode="NearestNeighbor"
              Visibility="{Binding Document, Converter={converters:NotNullToVisibilityConverter}, ElementName=uc}"
              Margin="10" Background="Transparent"
              d:Width="8" d:Height="8">
            <local:FixedViewport
                Delayed="True"
                x:Name="viewport"
                Document="{Binding Document, ElementName=uc}"
                Background="{Binding ActiveItem.Value, ElementName=backgroundButton}"/>
            <Border 
                    x:Name="colorCursor" Width="1" Height="1"
                    Margin="{Binding ColorCursorPosition, ElementName=uc}"
                    HorizontalAlignment="Left" VerticalAlignment="Top"
                    BorderBrush="Black" BorderThickness=".1"
                    Visibility="{Binding IsMouseOver, ElementName=imageGrid, Converter={StaticResource BoolToVisibilityConverter}}">
                <Border BorderThickness=".1" BorderBrush="White"/>
            </Border>
        </Grid>

        <Grid Grid.Row="1">
            <Grid.Background>
                <SolidColorBrush Color="{Binding ColorCursorColor, ElementName=uc, FallbackValue=Black}"/>
            </Grid.Background>
        </Grid>
        <StackPanel Grid.Row="2" Orientation="Horizontal" MinHeight="30"
                    Background="{StaticResource MainColor}" MaxHeight="60">
            <StackPanel.Resources>
                <Style TargetType="local:PrependTextBlock">
                    <Setter Property="VerticalAlignment" Value="Center"/>
                </Style>
            </StackPanel.Resources>

            <local:PrependTextBlock Prepend=" X: " Text="{Binding ColorCursorPosition.Left, ElementName=uc}"/>
            <local:PrependTextBlock Prepend=" Y: " Text="{Binding ColorCursorPosition.Top, ElementName=uc}"/>

            <TextBlock VerticalAlignment="Center" Margin="10, 0, 0, 0">
                <TextBlock.Text>
                    <MultiBinding Converter="{converters:FormattedColorConverter}">
                        <Binding Path="ColorCursorColor" ElementName="uc"/>
                        <Binding Path="ActiveItem.Value" ElementName="formatButton"/>
                    </MultiBinding>
                </TextBlock.Text>
            </TextBlock>
        </StackPanel>
        <Grid Grid.Row="2" HorizontalAlignment="Right" Margin="0,0,5,0" RenderOptions.BitmapScalingMode="{Binding ElementName=backgroundButton, Path=ActiveItem.ScalingMode}">
            <StackPanel Orientation="Horizontal">
                <local:ListSwitchButton x:Name="formatButton" Margin="0,0,5,0" Height="20" Width="40" BorderBrush="Black">
                    <local:ListSwitchButton.Items>
                        <local:SwitchItemObservableCollection>
                            <local:SwitchItem Content="RGBA" Background="#353535" Value="RGBA"/>
                            <local:SwitchItem Content="HEX" Background="#353535" Value="HEX"/>
                        </local:SwitchItemObservableCollection>
                    </local:ListSwitchButton.Items>
                </local:ListSwitchButton>
                <local:ListSwitchButton BorderBrush="{StaticResource DarkerAccentColor}" Width="25" Height="20" x:Name="backgroundButton" ToolTip="Preview background">
                    <local:ListSwitchButton.Items>
                        <local:SwitchItemObservableCollection>
                            <local:SwitchItem ScalingMode="NearestNeighbor">
                                <local:SwitchItem.Background>
                                    <ImageBrush ImageSource="/Images/CheckerTile.png" TileMode="Tile" Viewport="0, 0, 1, 1"/>
                                </local:SwitchItem.Background>
                                <local:SwitchItem.Value>
                                    <ImageBrush Viewport="0, 10, 10, 10" ImageSource="/Images/CheckerTile.png" TileMode="Tile" ViewportUnits="Absolute"/>
                                </local:SwitchItem.Value>
                            </local:SwitchItem>
                            <local:SwitchItem Value="Transparent">
                                <local:SwitchItem.Background>
                                    <ImageBrush ImageSource="/Images/DiagonalRed.png"/>
                                </local:SwitchItem.Background>
                            </local:SwitchItem>
                            <local:SwitchItem Background="White" Value="White"/>
                            <local:SwitchItem Background="Black" Value="Black"/>
                        </local:SwitchItemObservableCollection>
                    </local:ListSwitchButton.Items>
                </local:ListSwitchButton>
            </StackPanel>
        </Grid>
    </Grid>
</UserControl>
