Added swatches

PixiEditor/App.xaml

@@ -13,6 +13,7 @@
                 <ResourceDictionary Source="Styles/ColorSliderStyle.xaml"/>
                 <ResourceDictionary Source="Styles/ColorToggleButton.xaml"/>
                 <ResourceDictionary Source="Styles/AnchorPointToggleButtonStyle.xaml"/>
+                <ResourceDictionary Source="Styles/DockingManagerStyle.xaml"/>
             </ResourceDictionary.MergedDictionaries>
         </ResourceDictionary>
     </Application.Resources>

PixiEditor/Styles/DockingManagerStyle.xaml

@@ -0,0 +1,9 @@
+<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+                    xmlns:xcad="http://schemas.xceed.com/wpf/xaml/avalondock"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    
+    <Style TargetType="xcad:DockingManager">
+        <Setter Property="Foreground" Value="Snow"/>
+        <Setter Property="Background" Value="{StaticResource AccentColor}"/>
+    </Style>
+</ResourceDictionary>

PixiEditor/ViewModels/ViewModelMain.cs

@@ -13,6 +13,7 @@ using System;
 using System.Collections.Generic;
 using System.Collections.ObjectModel;
 using System.Linq;
+using System.Security.Cryptography.X509Certificates;
 using System.Windows;
 using System.Windows.Input;
 using System.Windows.Media;
@@ -50,6 +51,7 @@ namespace PixiEditor.ViewModels
         public RelayCommand ClipCanvasCommand { get; set; }
         public RelayCommand DeletePixelsCommand { get; set; }
         public RelayCommand OpenResizePopupCommand { get; set; }
+        public RelayCommand SelectColorCommand { get; set; }
 
 
         private double _mouseXonCanvas;
@@ -118,6 +120,7 @@ namespace PixiEditor.ViewModels
         }
 
         public ObservableCollection<Tool> ToolSet { get; set; }
+        public ObservableCollection<Color> Swatches { get; set; } = new ObservableCollection<Color>();
 
         private LayerChange[] _undoChanges;
 
@@ -198,8 +201,9 @@ namespace PixiEditor.ViewModels
             ClipCanvasCommand = new RelayCommand(ClipCanvas, DocumentIsNotNull);
             DeletePixelsCommand = new RelayCommand(DeletePixels, SelectionIsNotEmpty);
             OpenResizePopupCommand = new RelayCommand(OpenResizePopup, DocumentIsNotNull);
+            SelectColorCommand = new RelayCommand(SelectColor);
             ToolSet = new ObservableCollection<Tool> {new MoveTool(), new PenTool(), new SelectTool(), new FloodFill(), new LineTool(),
-            new CircleTool(), new RectangleTool(), new EarserTool(), new ColorPickerTool(), new BrightnessTool()};
+            new CircleTool(), new RectangleTool(), new EarserTool(), new ColorPickerTool(), new BrightnessTool()};            
             ShortcutController = new ShortcutController
             {
                 Shortcuts = new List<Shortcut> {
@@ -238,12 +242,29 @@ namespace PixiEditor.ViewModels
             Current = this;
         }
 
+        private void SelectColor(object parameter)
+        {
+            if(!(parameter is Color))
+            {
+                throw new ArgumentException();
+            }
+            PrimaryColor = (Color)parameter;
+        }
+
         private void ActiveDocument_DocumentSizeChanged(object sender, DocumentSizeChangedEventArgs e)
         {
             ActiveSelection = new Selection(Array.Empty<Coordinates>());
             RecenterZoombox = true;
         }
 
+        public void AddSwatch(Color color)
+        {
+            if (!Swatches.Contains(color))
+            {
+                Swatches.Add(color);
+            }
+        }
+
         private void OpenResizePopup(object parameter)
         {
             bool isCanvasDialog = (string)parameter == "canvas";
@@ -501,6 +522,7 @@ namespace PixiEditor.ViewModels
                 {
                     BitmapManager.MouseController.StartRecordingMouseMovementChanges();
                     BitmapManager.MouseController.RecordMouseMovementChange(MousePositionConverter.CurrentCoordinates);
+                    AddSwatch(PrimaryColor);
                 }
             }
         }

PixiEditor/Views/MainWindow.xaml

@@ -9,7 +9,6 @@
         xmlns:converters="clr-namespace:PixiEditor.Helpers.Converters"
         xmlns:behaviors="clr-namespace:PixiEditor.Helpers.Behaviours"
         xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
-        xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
         xmlns:xcad="http://schemas.xceed.com/wpf/xaml/avalondock"
         xmlns:ui="clr-namespace:PixiEditor.Helpers.UI"
         xmlns:cmd="http://www.galasoft.ch/mvvmlight" xmlns:shell="clr-namespace:Microsoft.Windows.Shell;assembly=Xceed.Wpf.AvalonDock"
@@ -180,15 +179,15 @@
             </ItemsControl>
         </StackPanel>
 
-        <DockPanel Grid.Column="2" Background="{StaticResource AccentColor}" Margin="0,30,0,0" Grid.RowSpan="3">
-            <vws:ColorPicker Grid.Column="2" Grid.Row="1" DockPanel.Dock="Top" SelectedColor="{Binding PrimaryColor, Mode=TwoWay}" 
+        <Grid Grid.Column="2" Background="{StaticResource AccentColor}" Margin="0,30,0,0" Grid.RowSpan="3">
+            <Grid.RowDefinitions>
+                <RowDefinition Height="340"/>
+                <RowDefinition Height="250*"/>
+                <RowDefinition Height="209*"/>
+            </Grid.RowDefinitions>
+            <vws:ColorPicker Grid.Row="0" SelectedColor="{Binding PrimaryColor, Mode=TwoWay}" 
                              SecondaryColor="{Binding SecondaryColor, Mode=TwoWay}"/>
-            <xcad:DockingManager Grid.Column="2" BorderThickness="0" Grid.Row="1" DockPanel.Dock="Top">
-                <xcad:DockingManager.Style>
-                    <Style TargetType="xcad:DockingManager">
-                        <Setter Property="Foreground" Value="Snow"/>
-                    </Style>
-                </xcad:DockingManager.Style>
+            <xcad:DockingManager BorderThickness="0" Grid.Row="1">
                 <xcad:LayoutRoot x:Name="LayoutRoot">
                     <xcad:LayoutPanel Orientation="Vertical">
                         <xcad:LayoutAnchorablePane>
@@ -235,7 +234,53 @@
                     </xcad:LayoutPanel>
                 </xcad:LayoutRoot>
             </xcad:DockingManager>
-        </DockPanel>
+            <xcad:DockingManager Grid.Row="2">
+                <xcad:LayoutRoot>
+                    <xcad:LayoutPanel>
+                        <xcad:LayoutAnchorablePane>
+                            <xcad:LayoutAnchorable ContentId="swatches" Title="Swatches" CanHide="False" CanClose="False" CanAutoHide="False" CanDockAsTabbedDocument="False" CanFloat="True">
+                                <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
+                                    <ItemsControl ItemsSource="{Binding Swatches}">
+                                        <ItemsControl.ItemsPanel>
+                                            <ItemsPanelTemplate>
+                                                <WrapPanel Margin="10,0,0,0" Orientation="Horizontal" VerticalAlignment="Top" HorizontalAlignment="Left"/>
+                                            </ItemsPanelTemplate>
+                                        </ItemsControl.ItemsPanel>
+                                        <ItemsControl.ItemTemplate>
+                                            <DataTemplate>
+                                                <Grid Width="50" Height="50" Margin="2">
+                                                    <Border Width="48" Height="48">
+                                                        <Border.Background>
+                                                            <ImageBrush ImageSource="../Images/transparentbg.png" Stretch="UniformToFill">
+                                                                <ImageBrush.RelativeTransform>
+                                                                    <ScaleTransform ScaleX="6" ScaleY="6" CenterX="0.5" CenterY="0.5"/>
+                                                                </ImageBrush.RelativeTransform>
+                                                            </ImageBrush>
+                                                        </Border.Background>
+                                                    </Border>
+                                                    <Border BorderThickness="0.25" Cursor="Hand" BorderBrush="White">
+                                                        <Border.Background>
+                                                            <SolidColorBrush Color="{Binding}"/>
+                                                        </Border.Background>
+                                                    </Border>
+                                                    <i:Interaction.Triggers>
+                                                        <i:EventTrigger EventName="MouseDown">
+                                                            <i:InvokeCommandAction Command="{Binding
+                                                                    RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, Path=DataContext.SelectColorCommand}"
+                                                                                       CommandParameter="{Binding}"/>
+                                                        </i:EventTrigger>
+                                                    </i:Interaction.Triggers>
+                                                </Grid>
+                                            </DataTemplate>
+                                        </ItemsControl.ItemTemplate>
+                                    </ItemsControl>
+                                </ScrollViewer>
+                            </xcad:LayoutAnchorable>
+                        </xcad:LayoutAnchorablePane>
+                    </xcad:LayoutPanel>
+                </xcad:LayoutRoot>
+            </xcad:DockingManager>
+        </Grid>
 
     </Grid>
 </Window>