<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    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:local="clr-namespace:AntFu7.LiveDraw"
    x:Class="AntFu7.LiveDraw.MainWindow"
    xmlns:sys="clr-namespace:System;assembly=mscorlib"
    mc:Ignorable="d" ResizeMode="NoResize" UseLayoutRounding="True" WindowStartupLocation="CenterScreen" WindowState="Maximized" Background="{StaticResource FakeTransparent}" AllowsTransparency="True" WindowStyle="None" Title="LiveDraw Dev" Icon="Rescoures/icon.ico" KeyDown="Window_KeyDown" >
    <Window.Resources>
        <SolidColorBrush x:Key="PaintingColor1" Color="#FF86E238"/>
        <SolidColorBrush x:Key="PaintingColor2" Color="#FF38E2A8"/>
        <SolidColorBrush x:Key="PaintingColor3" Color="#FF359EC9"/>
        <SolidColorBrush x:Key="PaintingColor4" Color="#FF7E7E7E"/>
        <SolidColorBrush x:Key="PaintingColor5" Color="#FFE2CF38"/>
        <SolidColorBrush x:Key="PaintingColor6" Color="#FF7855D4"/>
        <SolidColorBrush x:Key="PaintingColor7" Color="#FFD570C2"/>
        <SolidColorBrush x:Key="PaintingColor8" Color="#FFD6D6D6"/>
        <SolidColorBrush x:Key="PaintingColor9" Color="#FFE27F38"/>
        <SolidColorBrush x:Key="PaintingColor10" Color="#FFDF2828"/>
        <SolidColorBrush x:Key="PaintingColor11" Color="#FFE2386D"/>
        <SolidColorBrush x:Key="PaintingColor12" Color="#FF1E1E1E"/>

        <Style TargetType="Path">
            <Setter Property="Fill" Value="White"/>
            <Setter Property="Stretch" Value="Uniform"/>
            <Setter Property="Width" Value="15"/>
            <Setter Property="RenderTransformOrigin" Value ="0.5,0.5"/>
            <Setter Property="VerticalAlignment" Value="Center"/>
            <Setter Property ="HorizontalAlignment" Value="Center"/>
        </Style>
    </Window.Resources>
    <Grid>
        <InkCanvas x:Name="MainInkCanvas" Background="{x:Null}" MoveEnabled="False" ResizeEnabled="False" Cursor="Pen" Margin="0,0,0,-0.333" EditingModeInverted="EraseByPoint">
            <InkCanvas.DefaultDrawingAttributes>
                <DrawingAttributes Color="#FFFF5656" FitToCurve="True" Height="5" IgnorePressure="False" IsHighlighter="False" StylusTip="Ellipse" StylusTipTransform="Identity" Width="5"/>
            </InkCanvas.DefaultDrawingAttributes>
        </InkCanvas>
        <Canvas>
            <Grid x:Name="Palette" HorizontalAlignment="Left" VerticalAlignment="Top" MouseMove="Palette_MouseMove" MouseUp="Palette_MouseUp" MouseLeave="Palette_MouseLeave" Canvas.Top="130" Canvas.Left="130" MinWidth="0">
                <Grid.RenderTransform>
                    <RotateTransform x:Name="PaletteRotate" CenterX="265" CenterY="100" Angle="0"/>
                </Grid.RenderTransform>
                <Grid.Effect>
                    <DropShadowEffect BlurRadius="5" ShadowDepth="2" Opacity="0.3"/>
                </Grid.Effect>
                <Grid>
                    <Grid.Resources>
                        <Style TargetType="Border">
                            <Setter Property="Background" Value="{StaticResource QuartertransparentGray}"/>
                            <Style.Triggers>
                                <Trigger Property ="IsMouseOver" Value="True">
                                    <Trigger.EnterActions>
                                        <BeginStoryboard>
                                            <Storyboard TargetProperty="(Background).(SolidColorBrush.Color)">
                                                <ColorAnimation To ="#9F727272" Duration="{StaticResource Duration2}"/>
                                            </Storyboard>
                                        </BeginStoryboard>
                                    </Trigger.EnterActions>
                                    <Trigger.ExitActions>
                                        <BeginStoryboard>
                                            <Storyboard TargetProperty="(Background).(SolidColorBrush.Color)">
                                                <ColorAnimation To ="#3F727272" Duration="{StaticResource Duration2}"/>
                                            </Storyboard>
                                        </BeginStoryboard>
                                    </Trigger.ExitActions>
                                </Trigger>
                            </Style.Triggers>
                        </Style>
                    </Grid.Resources>
                    <Border x:Name="LeftDockingButton" Width="20" Height="70" HorizontalAlignment="Right" Margin="0,0,30,0" Visibility="Collapsed">
                        <Border.CornerRadius>
                            <CornerRadius TopRight="7" BottomRight="7"></CornerRadius>
                        </Border.CornerRadius>
                        <Path Fill="White" Stretch="Uniform" Width="9" Data="{StaticResource IconArrow}" RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Center" VerticalAlignment="Center">
                            <Path.RenderTransform>
                                <TransformGroup>
                                    <RotateTransform Angle="-90"/>
                                </TransformGroup>
                            </Path.RenderTransform>
                        </Path>
                    </Border>
                    <Border x:Name="TopDuckingButton" Width="70" Height="20" HorizontalAlignment="Center" Margin="0,0,25,30"  Visibility="Collapsed" VerticalAlignment="Bottom">
                        <Border.CornerRadius>
                            <CornerRadius BottomLeft="7" BottomRight="7"></CornerRadius>
                        </Border.CornerRadius>
                        <Path Fill="White" Stretch="Uniform" Width="9" Data="{StaticResource IconArrow}" RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Center" VerticalAlignment="Center">
                            <Path.RenderTransform>
                                <TransformGroup>
                                    <RotateTransform Angle="0"/>
                                </TransformGroup>
                            </Path.RenderTransform>
                        </Path>
                    </Border>
                    <Border x:Name="RightDockingButton" Width="20" Height="70" HorizontalAlignment="Left"  Visibility="Collapsed" Margin="30,0,0,0">
                        <Border.CornerRadius>
                            <CornerRadius TopLeft="7" BottomLeft="7"></CornerRadius>
                        </Border.CornerRadius>
                        <Path Fill="White" Stretch="Uniform" Width="9" Data="{StaticResource IconArrow}" RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Center" VerticalAlignment="Center">
                            <Path.RenderTransform>
                                <TransformGroup>
                                    <RotateTransform Angle="90"/>
                                </TransformGroup>
                            </Path.RenderTransform>
                        </Path>
                    </Border>
                </Grid>
                <Grid x:Name="PaletteFlowPanel" Margin="50" Width="{StaticResource HorizontalModeFlowPanel}" >
                    <WrapPanel x:Name="PaletteFlowInsiderPanel" Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
                        <Grid x:Name="BasicButtonPanel" Width="{StaticResource HorizontalModeColorPickersPanel}" Margin="0">
                            <WrapPanel VerticalAlignment="Top" Margin="0,0,10,0" Orientation="Vertical" HorizontalAlignment="Center">
                                <WrapPanel VerticalAlignment="Top" Margin="0,0,10,0" Orientation="Horizontal" HorizontalAlignment="Center">
                                    <Button x:Name="MinimizeButton" Style="{StaticResource SpinningButton}" Background="#338A8A8A" Click="MinimizeButton_Click"  VerticalAlignment="Center" ToolTip="Minimize" >
                                        <Button.RenderTransform>
                                            <RotateTransform CenterX="12.5" CenterY="12.5" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                        </Button.RenderTransform>
                                        <Path Width="12" Data="{DynamicResource IconMinimize}" Margin="0,0,0,0"/>
                                    </Button>
                                    <Button x:Name="DetailToggler" Style="{StaticResource ResponseButton}" Background="#338A8A8A" VerticalAlignment="Center" Click="DetailToggler_Click" ToolTip="Toggle more options" >
                                        <Path Data="{DynamicResource IconArrow}" Margin="0,0,1,1" Width="10">
                                            <Path.RenderTransform>
                                                <RotateTransform x:Name="DetailTogglerRotate"/>
                                            </Path.RenderTransform>
                                        </Path>
                                    </Button>
                                    <Button x:Name="CloseButton" Style="{StaticResource SpinningButton}" Background="#338A8A8A" Click="CloseButton_Click"  VerticalAlignment="Center" ToolTip="Exit" >
                                        <Path Data="{DynamicResource IconCross}" Margin="0,0,1,1" Width="10">
                                        </Path>
                                    </Button>
                                </WrapPanel>
                                <Border x:Name="PaletteGrip" Width="150" Cursor="SizeAll" Height="25" MouseDown="PaletteGrip_MouseDown"  HorizontalAlignment="Center" VerticalAlignment="Top" Margin="0" Padding="3" >
                                    <Border CornerRadius="5" Background="#338A8A8A">
                                        <TextBlock x:Name="InfoBox" Foreground="White" FontSize="10" FontFamily="Consolas" Margin="0" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                    </Border>
                                </Border>
                            </WrapPanel>
                        </Grid>
                        <Grid x:Name="ColorPickersPanel" Width="{StaticResource HorizontalModeColorPickersPanel}" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="{StaticResource ElementMarginMiddle}">
                            <WrapPanel  Margin="0" HorizontalAlignment="Center">
                                <WrapPanel.Resources>
                                    <Style TargetType="local:ColorPicker" BasedOn="{StaticResource ColorPicker}">
                                        <Setter Property="Size" Value="{Binding ElementName=DefaultColorPicker,Path=Size}"/>
                                    </Style>
                                    <Style TargetType="StackPanel">
                                        <Setter Property="Orientation" Value="Horizontal"></Setter>
                                    </Style>
                                </WrapPanel.Resources>
                                <local:ColorPicker Background="{StaticResource PaintingColor6}" Click="ColorPickers_Click">
                                    <local:ColorPicker.RenderTransform>
                                        <RotateTransform CenterX="17.5" CenterY="17.5" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ColorPicker.RenderTransform>
                                </local:ColorPicker>
                                <local:ColorPicker Background="{StaticResource PaintingColor3}" Click="ColorPickers_Click">
                                    <local:ColorPicker.RenderTransform>
                                        <RotateTransform CenterX="17.5" CenterY="17.5" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ColorPicker.RenderTransform>
                                </local:ColorPicker>
                                <local:ColorPicker Background="{StaticResource PaintingColor2}" Click="ColorPickers_Click">
                                    <local:ColorPicker.RenderTransform>
                                        <RotateTransform CenterX="17.5" CenterY="17.5" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ColorPicker.RenderTransform>
                                </local:ColorPicker>
                                <local:ColorPicker Background="{StaticResource PaintingColor1}" Click="ColorPickers_Click">
                                    <local:ColorPicker.RenderTransform>
                                        <RotateTransform CenterX="17.5" CenterY="17.5" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ColorPicker.RenderTransform>
                                </local:ColorPicker>
                                <local:ColorPicker Background="{StaticResource PaintingColor5}" Click="ColorPickers_Click">
                                    <local:ColorPicker.RenderTransform>
                                        <RotateTransform CenterX="17.5" CenterY="17.5" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ColorPicker.RenderTransform>
                                </local:ColorPicker>
                                <local:ColorPicker Background="{StaticResource PaintingColor9}" Click="ColorPickers_Click" x:Name="DefaultColorPicker" Size="Small">
                                    <local:ColorPicker.RenderTransform>
                                        <RotateTransform CenterX="17.5" CenterY="17.5" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ColorPicker.RenderTransform>
                                </local:ColorPicker>
                                <local:ColorPicker Background="{StaticResource PaintingColor10}" Click="ColorPickers_Click">
                                    <local:ColorPicker.RenderTransform>
                                        <RotateTransform CenterX="17.5" CenterY="17.5" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ColorPicker.RenderTransform>
                                </local:ColorPicker>
                                <local:ColorPicker Background="{StaticResource PaintingColor11}" Click="ColorPickers_Click">
                                    <local:ColorPicker.RenderTransform>
                                        <RotateTransform CenterX="17.5" CenterY="17.5" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ColorPicker.RenderTransform>
                                </local:ColorPicker>
                                <local:ColorPicker Background="{StaticResource PaintingColor7}" Click="ColorPickers_Click">
                                    <local:ColorPicker.RenderTransform>
                                        <RotateTransform CenterX="17.5" CenterY="17.5" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ColorPicker.RenderTransform>
                                </local:ColorPicker>
                                <local:ColorPicker Background="{StaticResource PaintingColor8}" Click="ColorPickers_Click">
                                    <local:ColorPicker.RenderTransform>
                                        <RotateTransform CenterX="17.5" CenterY="17.5" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ColorPicker.RenderTransform>
                                </local:ColorPicker>
                                <local:ColorPicker Background="{StaticResource PaintingColor4}" Click="ColorPickers_Click">
                                    <local:ColorPicker.RenderTransform>
                                        <RotateTransform CenterX="17.5" CenterY="17.5" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ColorPicker.RenderTransform>
                                </local:ColorPicker>
                                <local:ColorPicker Background="{StaticResource PaintingColor12}" Click="ColorPickers_Click">
                                    <local:ColorPicker.RenderTransform>
                                        <RotateTransform CenterX="17.5" CenterY="17.5" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ColorPicker.RenderTransform>
                                </local:ColorPicker>
                            </WrapPanel>
                        </Grid>
                        <StackPanel x:Name="DetailPanel" Width="{Binding ElementName=ColorPickersPanel,Path=ActualWidth}"  Margin="0,3,0,0">
                            <StackPanel.Style>
                                <Style TargetType="StackPanel">
                                    <Style.Triggers>
                                        <Trigger Property="Opacity" Value="0">
                                            <Setter Property="Visibility" Value="Collapsed"/>
                                        </Trigger>
                                    </Style.Triggers>
                                </Style>
                            </StackPanel.Style>
                            <Slider Background="{StaticResource FakeTransparent}" Minimum="1" ValueChanged="Slider_ValueChanged" IsMoveToPointEnabled="True" IsSelectionRangeEnabled="True" Focusable="False" Maximum="5" Template="{StaticResource SliderHorizontal}" Foreground="#FFBC1919" Value="2" Height="20" Visibility="Collapsed"/>
                            <WrapPanel x:Name="ButtonPanel" HorizontalAlignment="Center">
                                <WrapPanel.Resources>
                                    <Style TargetType="local:ActivableButton" BasedOn="{StaticResource FunctionalButton}">
                                        <Setter Property="Padding" Value="0"/>
                                        <Setter Property="Width" Value="32"/>
                                        <Setter Property="Height" Value="32"/>
                                    </Style>
                                </WrapPanel.Resources>
                                <local:ActivableButton x:Name="BrushSwitchButton" Click="BrushSwitchButton_Click" ToolTip="Preview">
                                    <Border x:Name="brushPreview" Width="5" Height="5" Background="#FFD6D6D6" CornerRadius="10"  HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                </local:ActivableButton>
                                <local:ActivableButton x:Name="LineButton" ToolTip="Line Mode" Click="LineButton_Click">
                                    <Path Data="{DynamicResource IconMinimize}" RenderTransformOrigin="0.5,0.5" Height="3" Stretch="Fill" Width="15">
                                        <Path.RenderTransform>
                                            <RotateTransform Angle="-45"/>
                                        </Path.RenderTransform>
                                    </Path>
                                </local:ActivableButton>
                                <local:ActivableButton x:Name="UndoButton" Click="UndoButton_Click" ToolTip="Undo (Z)">
                                    <local:ActivableButton.RenderTransform>
                                        <RotateTransform CenterX="16" CenterY="16" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ActivableButton.RenderTransform>
                                    <Path Data="{DynamicResource IconUndo}"/>
                                </local:ActivableButton>
                                <local:ActivableButton x:Name="RedoButton" ToolTip="Redo (Y)" Click="RedoButton_Click">
                                    <local:ActivableButton.RenderTransform >
                                        <RotateTransform CenterX="16" CenterY="16" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ActivableButton.RenderTransform>
                                    <Path Data="{DynamicResource IconUndo}" RenderTransformOrigin="0.5,0.5">
                                        <Path.RenderTransform>
                                            <ScaleTransform ScaleX="-1"/>
                                        </Path.RenderTransform>
                                    </Path>
                                </local:ActivableButton>
                                <local:ActivableButton x:Name="EraserButton" Click="EraserButton_Click" ToolTip="Toggle eraser mode (E)">
                                    <local:ActivableButton.RenderTransform >
                                        <RotateTransform CenterX="16" CenterY="16" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ActivableButton.RenderTransform>
                                    <Path Data="{DynamicResource IconEraser}"/>
                                </local:ActivableButton>
                                <local:ActivableButton x:Name="ClearButton" Click="ClearButton_Click" ToolTip="Clear screen" >
                                    <local:ActivableButton.RenderTransform >
                                        <RotateTransform CenterX="16" CenterY="16" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ActivableButton.RenderTransform>
                                    <Path Data="{DynamicResource IconTrashBox}" Width="13"/>
                                </local:ActivableButton>
                                <local:ActivableButton x:Name="PinButton" ToolTip="Topmost" Click="PinButton_Click" >
                                    <local:ActivableButton.RenderTransform >
                                        <RotateTransform CenterX="16" CenterY="16" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ActivableButton.RenderTransform>
                                    <Path Data="{DynamicResource IconPin}" Width="13"/>
                                </local:ActivableButton>
                                <local:ActivableButton x:Name="SaveButton" Click="SaveButton_Click" ToolTip="Quick save / Right click to save to file" PreviewMouseRightButtonDown="SaveButton_RightClick">
                                    <local:ActivableButton.RenderTransform >
                                        <RotateTransform CenterX="16" CenterY="16" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ActivableButton.RenderTransform>
                                    <Path Data="{DynamicResource IconSave}" Width="13"/>
                                </local:ActivableButton>
                                <local:ActivableButton x:Name="LoadButton" Click="LoadButton_Click" ToolTip="Load ink from file">
                                    <local:ActivableButton.RenderTransform >
                                        <RotateTransform CenterX="16" CenterY="16" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ActivableButton.RenderTransform>
                                    <Path Data="{DynamicResource IconLoad}" Width="14"/>
                                </local:ActivableButton>
                                <local:ActivableButton x:Name="ExportButton" ToolTip="Export ink to image with transparent / Right click to export to image with screen below" Click="ExportButton_Click" PreviewMouseRightButtonDown="ExportButton_RightClick">
                                    <local:ActivableButton.RenderTransform >
                                        <RotateTransform CenterX="16" CenterY="16" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ActivableButton.RenderTransform>
                                    <Path Data="{DynamicResource IconExport}"/>
                                </local:ActivableButton>
                                <local:ActivableButton x:Name="HideButton"  ToolTip="Hide ink" Click="HideButton_Click" >
                                    <local:ActivableButton.RenderTransform >
                                        <RotateTransform CenterX="16" CenterY="16" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ActivableButton.RenderTransform>
                                    <Path Data="{DynamicResource IconCloseEye}"/>
                                </local:ActivableButton>
                                <local:ActivableButton x:Name="EnableButton" Click="EnableButton_Click" ToolTip="Release/Recover the control of drawing">
                                    <local:ActivableButton.RenderTransform >
                                        <RotateTransform CenterX="16" CenterY="16" Angle="{Binding MinWidth, ElementName=Palette}"/>
                                    </local:ActivableButton.RenderTransform>
                                    <Path Data="{DynamicResource IconNoAccess}" />
                                </local:ActivableButton>
                                <local:ActivableButton x:Name="OrientationButton" Click="OrientationButton_Click" ToolTip="Rotate dock">
                                    <Path Data="{DynamicResource IconMinimize}" RenderTransformOrigin="0.5,0.5">
                                        <Path.RenderTransform>
                                            <RotateTransform Angle="90"/>
                                        </Path.RenderTransform>
                                    </Path>
                                </local:ActivableButton>
                            </WrapPanel>
                        </StackPanel>
                    </WrapPanel>
                </Grid>
            </Grid>
        </Canvas>
    </Grid>
</Window>
