<UserControl x:Class="HavenSoft.HexManiac.WPF.Controls.PaletteControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:hsv="clr-namespace:HavenSoft.HexManiac.WPF.Resources"
             HorizontalAlignment="Stretch" VerticalAlignment="Center" Focusable="True"
             Background="Transparent"
             RequestBringIntoView="ControlRequestBringIntoView"
             MouseDown="StartPaletteColorMove" MouseMove="PaletteColorMove" MouseUp="EndPaletteColorMove">
   <UserControl.CommandBindings>
      <CommandBinding Command="Select" Executed="GrabScreenColor"/>
   </UserControl.CommandBindings>
   <UserControl.ContextMenu>
      <ContextMenu>
         <MenuItem Header="Copy" InputGestureText="Ctrl+C" Command="{Binding Copy}" CommandParameter="{DynamicResource FileSystem}"/>
         <MenuItem Header="Paste" InputGestureText="Ctrl+V" Command="{Binding Paste}" CommandParameter="{DynamicResource FileSystem}"/>
         <MenuItem Header="Create Gradient" InputGestureText="Ctrl+G" Command="{Binding CreateGradient}" />
         <MenuItem Header="Merge Colors" InputGestureText="Ctrl+M" Command="{Binding SingleReduce}" />
         <MenuItem Header="Choose Color from Screen" Command="Select">
            <MenuItem.ToolTip>
               <ToolTip Name="EyeDropperToolTip" Content="Click this, then click any color on your screen to pull that color into the palette."/>
            </MenuItem.ToolTip>
         </MenuItem>
      </ContextMenu>
   </UserControl.ContextMenu>
   <UserControl.InputBindings>
      <KeyBinding Modifiers="Ctrl" Key="C" Command="{Binding Copy}" CommandParameter="{DynamicResource FileSystem}"/>
      <KeyBinding Modifiers="Ctrl" Key="V" Command="{Binding Paste}" CommandParameter="{DynamicResource FileSystem}"/>
      <KeyBinding Modifiers="Ctrl" Key="G" Command="{Binding CreateGradient}"/>
      <KeyBinding Modifiers="Ctrl" Key="M" Command="{Binding SingleReduce}"/>
      <KeyBinding Key="Delete" Command="{Binding DeleteColor}"/>
   </UserControl.InputBindings>
   <DockPanel>
      <StackPanel Margin="10,0,0,0" DockPanel.Dock="Left" VerticalAlignment="Center">
         <Decorator>
            <Button Command="{Binding CreateGradient}">
               <Path Data="{hsv:Icon Gradient}" Fill="{DynamicResource Primary}" Stretch="Uniform" Width="20" Height="20"/>
            </Button>
            <Decorator.ToolTip>
               <ToolTip>
                  <TextBlock>
                     <Bold FontSize="18">Create Gradient</Bold> <LineBreak/>
                     Select multiple colors (Shift+Click or Ctrl+Click), then <LineBreak/>
                     Click this button. <LineBreak/>
                     <LineBreak/>
                     The two colors on the ends of the selection will stay the same, <LineBreak/>
                     and the colors between will change to a blend between them. <LineBreak/>
                  </TextBlock>
               </ToolTip>
            </Decorator.ToolTip>
         </Decorator>
         <Decorator>
            <Button Command="{Binding SingleReduce}">
               <Path Data="{hsv:Icon VenDiagram}" Fill="{DynamicResource Primary}" Stretch="Uniform" Width="20" Height="20"/>
            </Button>
            <Decorator.ToolTip>
               <ToolTip>
                  <TextBlock>
                     <Bold FontSize="18">Merge Colors</Bold> <LineBreak/>
                     Select multiple colors (Shift+Click or Ctrl+Click), then <LineBreak/>
                     Click this button. <LineBreak/>
                     <LineBreak/>
                     The selected colors will merge to one less, giving <LineBreak/>
                     you a new palette space to add a new color. <LineBreak/>
                  </TextBlock>
               </ToolTip>
            </Decorator.ToolTip>
         </Decorator>
      </StackPanel>
      <Grid HorizontalAlignment="Center">
         <ItemsControl Name="ItemsControl" RequestBringIntoView="ControlRequestBringIntoView"  HorizontalAlignment="Center" Cursor="Cross" SnapsToDevicePixels="True" IsTabStop="False" ItemsSource="{Binding Elements}">
            <ItemsControl.ToolTip>
               <TextBlock>
                  Drag to Sort <LineBreak/>
                  Click to edit selected color(s).
               </TextBlock>
            </ItemsControl.ToolTip>
            <ItemsControl.ItemsPanel>
               <ItemsPanelTemplate>
                  <UniformGrid Columns="{Binding ColorWidth}" Rows="{Binding ColorHeight}"/>
               </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
               <DataTemplate>
                  <Border BorderThickness="2" Margin="-1" Name="PaletteColor">
                     <Border.Style>
                        <Style TargetType="Border">
                           <Style.Triggers>
                              <DataTrigger Binding="{Binding Selected}" Value="True">
                                 <Setter Property="BorderBrush" Value="{DynamicResource Accent}"/>
                              </DataTrigger>
                           </Style.Triggers>
                        </Style>
                     </Border.Style>
                     <Rectangle Fill="{Binding Color, Converter={StaticResource PaletteColorConverter}}" Width="14" Height="14"/>
                  </Border>
               </DataTemplate>
            </ItemsControl.ItemTemplate>
         </ItemsControl>
         <Canvas HorizontalAlignment="Right" VerticalAlignment="Bottom" Width="0" Height="0">
            <Border Background="Transparent" Canvas.Bottom="5" Canvas.Left="5" ToolTipService.ShowDuration="10000" MouseLeftButtonDown="ShowElementPopup" MouseLeave="HideElementPopup">
               <Path Fill="{DynamicResource Secondary}" Width="20" Height="20" Data="{hsv:Icon Help}" Stretch="Uniform" Opacity=".5"/>
               <Border.ToolTip>
                  <ToolTip>
                     <TextBlock>
                        <Bold FontSize="18">Sort Palette</Bold> <LineBreak/>
                        Click and drag to change the order of the colors in the palette.
                        <LineBreak/>
                        <LineBreak/>

                        <Bold FontSize="18">Merge Colors</Bold> <LineBreak/>
                        Select multiple colors (Shift+Click or Ctrl+Click), then <LineBreak/>
                        Right-click and select "Merge Colors". <LineBreak/>
                        The selected colors will merge to one less, giving <LineBreak/>
                        you a new palette space to add a new color.
                        <LineBreak/>
                        <LineBreak/>

                        <Bold FontSize="18">Multi-Color Shift</Bold> <LineBreak/>
                        Select multiple colors (Shift+Click or Ctrl+Click), then <LineBreak/>
                        Edit one of them. <LineBreak/>
                        The other selected colors will automatically update to <LineBreak/>
                        maintain the same relationship with the edited color.
                        <LineBreak/>
                        <LineBreak/>

                        <Bold FontSize="18">Create Gradient</Bold> <LineBreak/>
                        Select multiple colors (Shift+Click or Ctrl+Click), then <LineBreak/>
                        Right-click and select "Create Gradient". <LineBreak/>
                        The two colors on the ends of the selection will stay the <LineBreak/>
                        same, and the other selected colors between will blend between them.
                        <LineBreak/>
                        <LineBreak/>
                     </TextBlock>
                  </ToolTip>
               </Border.ToolTip>
            </Border>
         </Canvas>
      </Grid>
   </DockPanel>
</UserControl>
