<UserControl
    x:Class="PixiEditor.AvaloniaUI.Views.Main.ViewportControls.Viewport"
    x:ClassModifier="internal"
    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:sys="clr-namespace:System;assembly=System.Runtime"
    xmlns:ui="clr-namespace:PixiEditor.Extensions.UI;assembly=PixiEditor.Extensions"
    xmlns:xaml="clr-namespace:PixiEditor.AvaloniaUI.Models.Commands.XAML"
    xmlns:zoombox="clr-namespace:PixiEditor.Zoombox;assembly=PixiEditor.Zoombox"
    xmlns:brushShapeOverlay="clr-namespace:PixiEditor.AvaloniaUI.Views.Overlays.BrushShapeOverlay"
    xmlns:viewModels="clr-namespace:PixiEditor.AvaloniaUI.ViewModels"
    xmlns:symmetryOverlay="clr-namespace:PixiEditor.AvaloniaUI.Views.Overlays.SymmetryOverlay"
    xmlns:lineToolOverlay="clr-namespace:PixiEditor.AvaloniaUI.Views.Overlays.LineToolOverlay"
    xmlns:transformOverlay="clr-namespace:PixiEditor.AvaloniaUI.Views.Overlays.TransformOverlay"
    xmlns:converters="clr-namespace:PixiEditor.AvaloniaUI.Helpers.Converters"
    xmlns:ui1="clr-namespace:PixiEditor.AvaloniaUI.Helpers.UI"
    xmlns:visuals="clr-namespace:PixiEditor.AvaloniaUI.Views.Visuals"
    xmlns:viewportControls="clr-namespace:PixiEditor.AvaloniaUI.Views.Main.ViewportControls"
    xmlns:overlays="clr-namespace:PixiEditor.AvaloniaUI.Views.Overlays"
    xmlns:selectionOverlay="clr-namespace:PixiEditor.AvaloniaUI.Views.Overlays.SelectionOverlay"
    xmlns:rendering="clr-namespace:PixiEditor.AvaloniaUI.Views.Rendering"
    mc:Ignorable="d"
    x:Name="vpUc"
    d:DesignHeight="450"
    d:DesignWidth="800"
    FlowDirection="LeftToRight">
    <Grid
        x:Name="viewportGrid">
        <Interaction.Behaviors>
            <!--TODO: Implement stylus support-->
            <!--<EventTriggerBehavior EventName="StylusButtonDown">
                <InvokeCommandAction Command="{Binding StylusButtonDownCommand, ElementName=vpUc}"
                                        PassEventArgsToCommand="True"/>
            </EventTriggerBehavior>
            <EventTriggerBehavior EventName="StylusButtonUp">
                <InvokeCommandAction Command="{Binding StylusButtonUpCommand, ElementName=vpUc}"
                                        PassEventArgsToCommand="True"/>
            </EventTriggerBehavior>
            <EventTriggerBehavior EventName="StylusSystemGesture">
                <InvokeCommandAction Command="{Binding StylusGestureCommand, ElementName=vpUc}"
                                        PassEventArgsToCommand="True"/>
            </EventTriggerBehavior>
            <EventTriggerBehavior EventName="StylusOutOfRange">
                <InvokeCommandAction Command="{Binding StylusOutOfRangeCommand, ElementName=vpUc}"
                                        PassEventArgsToCommand="True"/>
            </EventTriggerBehavior>-->
        </Interaction.Behaviors>
        <overlays:TogglableFlyout Margin="5" Icon="{DynamicResource icon-tool}"
                                  ui:Translator.TooltipKey="VIEWPORT_SETTINGS"
                                  ZIndex="2" HorizontalAlignment="Right" VerticalAlignment="Top">
            <overlays:TogglableFlyout.Child>
                <Border BorderThickness="1" CornerRadius="5" Padding="5" Background="{DynamicResource ThemeBackgroundTranslucentBrush}" ZIndex="2">
                    <StackPanel Orientation="Vertical">
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Margin="5 0" TextAlignment="Center"
                                       Text="{Binding Path=AngleRadians, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport},
             Converter={converters:RadiansToDegreesConverter}, StringFormat={}{0}°}"
                                       Width="35" Foreground="White" VerticalAlignment="Center" FontSize="16" />
                            <Button Width="32" Height="32" ui:Translator.TooltipKey="RESET_VIEWPORT"
                                    Classes="OverlayButton pixi-icon"
                                    Click="ResetViewportClicked"
                                    BorderBrush="{DynamicResource ThemeBorderMidBrush}"
                                    BorderThickness="1"
                                    Content="{DynamicResource icon-reset}"
                                    Cursor="Hand"/>
                        </StackPanel>
                        <Separator />
                        <StackPanel HorizontalAlignment="Right" Orientation="Horizontal">
                            <ToggleButton Width="32" Height="32" ui:Translator.TooltipKey="TOGGLE_VERTICAL_SYMMETRY"
                                          Classes="OverlayToggleButton pixi-icon"
                                          IsChecked="{Binding Document.VerticalSymmetryAxisEnabledBindable, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=TwoWay}"
                                          Content="{DynamicResource icon-y-symmetry}"
                                          Cursor="Hand"/>
                            <ToggleButton Margin="10 0 0 0" Width="32" Height="32"
                                          ui:Translator.TooltipKey="TOGGLE_HORIZONTAL_SYMMETRY"
                                          Classes="OverlayToggleButton pixi-icon"
                                          IsChecked="{Binding Document.HorizontalSymmetryAxisEnabledBindable, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=TwoWay}"
                                            Content="{DynamicResource icon-x-symmetry}"
                                          Cursor="Hand"/>
                        </StackPanel>
                        <Separator />
                        <StackPanel HorizontalAlignment="Right" Orientation="Horizontal">
                            <ToggleButton Width="32" Height="32" ui:Translator.TooltipKey="FLIP_VIEWPORT_HORIZONTALLY"
                                          Classes="OverlayToggleButton pixi-icon"
                                          IsChecked="{Binding FlipX, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=TwoWay}"
                                          Content="{DynamicResource icon-y-flip}"
                                          Cursor="Hand"/>
                            <ToggleButton Margin="10 0 0 0" Width="32" Height="32"
                                          ui:Translator.TooltipKey="FLIP_VIEWPORT_VERTICALLY"
                                          Classes="OverlayToggleButton pixi-icon"
                                          IsChecked="{Binding FlipY, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=TwoWay}"
                                            Content="{DynamicResource icon-x-flip}"
                                          Cursor="Hand"/>
                        </StackPanel>
                    </StackPanel>
                </Border>
            </overlays:TogglableFlyout.Child>
        </overlays:TogglableFlyout>
        <rendering:Scene
            Focusable="False" Name="scene"
            ZIndex="1"
            Surface="{Binding TargetBitmap, ElementName=vpUc}"
            Document="{Binding Document, ElementName=vpUc, Mode=OneWay}"
            UseTouchGestures="{Binding UseTouchGestures, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=OneWay}"
            Center="{Binding Center, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=OneWayToSource}"
            AngleRadians="{Binding AngleRadians, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=OneWayToSource}"
            RealDimensions="{Binding RealDimensions, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=OneWayToSource}"
            Dimensions="{Binding Dimensions, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=OneWayToSource}"
            ZoomMode="{Binding ZoomMode, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=TwoWay}"
            ZoomOutOnClick="{Binding ZoomOutOnClick, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=TwoWay}"
            FlipX="{Binding FlipX, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=TwoWay}"
            FlipY="{Binding FlipY, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=TwoWay}"
            Channels="{Binding Channels, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=TwoWay}"
            AllOverlays="{Binding ElementName=vpUc, Path=ActiveOverlays}"
            FadeOut="{Binding Source={viewModels:ToolVM ColorPickerToolViewModel}, Path=PickOnlyFromReferenceLayer, Mode=OneWay}"
            DefaultCursor="{Binding Source={viewModels:MainVM}, Path=ToolsSubViewModel.ToolCursor, Mode=OneWay}"
            CheckerImagePath="/Images/CheckerTile.png"
            ui:RenderOptionsBindable.BitmapInterpolationMode="{Binding Scale, Converter={converters:ScaleToBitmapScalingModeConverter}, RelativeSource={RelativeSource Self}}"/>
        <!--<zoombox:Zoombox
            Tag="{Binding ElementName=vpUc}"
            x:Name="zoombox"
            UseTouchGestures="{Binding UseTouchGestures, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=OneWay}"
            Scale="{Binding ZoomboxScale, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=OneWayToSource}"
            Center="{Binding Center, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=OneWayToSource}"
            Angle="{Binding Angle, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=OneWayToSource}"
            RealDimensions="{Binding RealDimensions, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=OneWayToSource}"
            Dimensions="{Binding Dimensions, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=OneWayToSource}"
            ZoomMode="{Binding ZoomMode, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=TwoWay}"
            ZoomOutOnClick="{Binding ZoomOutOnClick, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=TwoWay}"
            FlipX="{Binding FlipX, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=TwoWay}"
            FlipY="{Binding FlipY, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}, Mode=TwoWay}">
            <zoombox:Zoombox.AdditionalContent>
                <Border
                    d:Width="64"
                    d:Height="64"
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    DataContext="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=viewportControls:Viewport}}"
                    RenderOptions.BitmapInterpolationMode="None">
                    <Grid>

                        <Rectangle Stroke="{DynamicResource ThemeBackgroundBrush1}" Opacity=".8" ZIndex="2"
                                   IsVisible="{Binding Document.ReferenceLayerViewModel.IsVisibleBindable}">
                            <Rectangle.StrokeThickness>
                                <Binding Converter="{converters:ReciprocalConverter}">
                                    <Binding.Path>Zoombox.Scale</Binding.Path>
                                    <Binding.ConverterParameter>
                                        <sys:Double>
                                            3
                                        </sys:Double>
                                    </Binding.ConverterParameter>
                                </Binding>
                            </Rectangle.StrokeThickness>
                            <Rectangle.Margin>
                                <Binding Converter="{converters:ReciprocalConverter}">
                                    <Binding.Path>Zoombox.Scale</Binding.Path>
                                    <Binding.ConverterParameter>
                                        <sys:Double>
                                            -3
                                        </sys:Double>
                                    </Binding.ConverterParameter>
                                </Binding>
                            </Rectangle.Margin>
                        </Rectangle>
                    </Grid>
                </Border>
            </zoombox:Zoombox.AdditionalContent>
        </zoombox:Zoombox>-->
        <!--<overlays:ReferenceLayerOverlay SizeChanged="OnReferenceImageSizeChanged"
                                        ReferenceLayer="{Binding Document.ReferenceLayerViewModel}"
                                        ReferenceLayerScale="{Binding ReferenceLayerScale}"
                                        FadeOut="{Binding Source={viewModels:ToolVM ColorPickerToolViewModel}, Path=!PickFromReferenceLayer, Mode=OneWay}"
                                        RenderTransformOrigin="0, 0" RenderTransform="{Binding #scene.CanvasTransform}"/>-->

        <!--Brush shape overlay is rendered separately, so it doesn't trigger rerender each mouse movement to scene-->
        <!--I didn't measure it, but I thought that could impact performance-->
        <brushShapeOverlay:BrushShapeOverlay
            DataContext="{Binding ElementName=vpUc}"
            RenderTransform="{Binding #scene.CanvasTransform}"
            RenderTransformOrigin="0, 0"
            Name="brushShapeOverlay"
            Focusable="False" ZIndex="6"
            IsHitTestVisible="False"
            IsVisible="{Binding !Document.TransformViewModel.TransformActive}"
            ZoomScale="{Binding #scene.Scale}"
            Scene="{Binding #scene, Mode=OneTime}"
            BrushSize="{Binding ToolsSubViewModel.ActiveBasicToolbar.ToolSize, Source={viewModels:MainVM}}"
            BrushShape="{Binding ToolsSubViewModel.ActiveTool.BrushShape, Source={viewModels:MainVM}, FallbackValue={x:Static brushShapeOverlay:BrushShape.Hidden}}"
            FlowDirection="LeftToRight" />
        <Button
            ZIndex="99999"
            DockPanel.Dock="Bottom"
            Margin="5"
            Padding="8,5,5,5"
            VerticalAlignment="Bottom"
            HorizontalAlignment="Center"
            Classes="GrayRoundButton"
            Command="{xaml:Command PixiEditor.Tools.ApplyTransform}">
            <Button.IsVisible>
                <MultiBinding Converter="{converters:BoolOrToVisibilityConverter}">
                    <MultiBinding.Bindings>
                        <Binding ElementName="vpUc" Path="Document.TransformViewModel.ShowTransformControls" />
                        <Binding ElementName="vpUc" Path="Document.LineToolOverlayViewModel.IsEnabled" />
                    </MultiBinding.Bindings>
                </MultiBinding>
            </Button.IsVisible>
            <StackPanel Orientation="Horizontal">
                <TextBlock ui:Translator.Key="APPLY_TRANSFORM" VerticalAlignment="Center" Margin="0,0,5,0" />
                <Border Padding="10,3" CornerRadius="5" Background="{DynamicResource ThemeAccentBrush}"
                        IsVisible="{xaml:ShortcutBinding PixiEditor.Tools.ApplyTransform, Converter={converters:NotNullToVisibilityConverter}}">
                    <TextBlock Text="{xaml:ShortcutBinding PixiEditor.Tools.ApplyTransform}" />
                </Border>
            </StackPanel>
        </Button>
    </Grid>
</UserControl>