Implemented layer sorting

Artemis/Artemis/App.xaml

@@ -17,7 +17,7 @@
                 <!-- Accent and AppTheme setting -->
                 <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Teal.xaml" />
                 <ResourceDictionary
-                    Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
+                    Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseDark.xaml" />
                 <ResourceDictionary Source="/Resources/Icons.xaml" />
                 <ResourceDictionary Source="Styles/ColorBox.xaml" />
             </ResourceDictionary.MergedDictionaries>

Artemis/Artemis/Artemis.csproj

@@ -398,6 +398,8 @@
     <Compile Include="Utilities\Memory\Win32.cs" />
     <Compile Include="Utilities\Keyboard\Key.cs" />
     <Compile Include="Utilities\Keyboard\KeyboardRectangle.cs" />
+    <Compile Include="Utilities\ParentChild\ChildItemCollection.cs" />
+    <Compile Include="Utilities\ParentChild\IChildItem.cs" />
     <Compile Include="Utilities\ShellLink.cs" />
     <Compile Include="Utilities\StickyValue.cs" />
     <Compile Include="Utilities\Updater.cs" />

Artemis/Artemis/Models/Profiles/LayerModel.cs

@@ -5,10 +5,11 @@ using System.Windows.Media;
 using System.Xml.Serialization;
 using Artemis.Models.Interfaces;
 using Artemis.Utilities;
+using Artemis.Utilities.ParentChild;
 
 namespace Artemis.Models.Profiles
 {
-    public class LayerModel
+    public class LayerModel : IChildItem<LayerModel>, IChildItem<ProfileModel>
     {
         [XmlIgnore] private readonly LayerDrawer _drawer;
         [XmlIgnore] private bool _mustDraw;
@@ -18,7 +19,7 @@ namespace Artemis.Models.Profiles
             UserProps = new LayerPropertiesModel();
             CalcProps = new LayerPropertiesModel();
 
-            Children = new List<LayerModel>();
+            Children = new ChildItemCollection<LayerModel, LayerModel>(this);
             LayerConditions = new List<LayerConditionModel>();
             LayerProperties = new List<LayerDynamicPropertiesModel>();
 
@@ -29,9 +30,10 @@ namespace Artemis.Models.Profiles
         public string Name { get; set; }
         public LayerType LayerType { get; set; }
         public bool Enabled { get; set; }
+        public int Order { get; set; }
         public LayerPropertiesModel UserProps { get; set; }
 
-        public List<LayerModel> Children { get; set; }
+        public ChildItemCollection<LayerModel, LayerModel> Children { get; }
         public List<LayerConditionModel> LayerConditions { get; set; }
         public List<LayerDynamicPropertiesModel> LayerProperties { get; set; }
 
@@ -41,6 +43,28 @@ namespace Artemis.Models.Profiles
         [XmlIgnore]
         public ImageSource LayerImage => _drawer.GetThumbnail();
 
+        [XmlIgnore]
+        public LayerModel ParentLayer { get; internal set; }
+
+        [XmlIgnore]
+        public ProfileModel ParentProfile { get; internal set; }
+
+        #region IChildItem<Parent> Members
+
+        LayerModel IChildItem<LayerModel>.Parent
+        {
+            get { return ParentLayer; }
+            set { ParentLayer = value; }
+        }
+
+        ProfileModel IChildItem<ProfileModel>.Parent
+        {
+            get { return ParentProfile; }
+            set { ParentProfile = value; }
+        }
+        
+        #endregion
+
         public bool ConditionsMet<T>(IGameDataModel dataModel)
         {
             return Enabled && LayerConditions.All(cm => cm.ConditionMet<T>(dataModel));
@@ -49,7 +73,7 @@ namespace Artemis.Models.Profiles
         public void DrawPreview(DrawingContext c)
         {
             GeneralHelpers.CopyProperties(CalcProps, UserProps);
-            if (LayerType == LayerType.KeyboardRectangle || LayerType == LayerType.KeyboardEllipse)
+            if (LayerType == LayerType.Keyboard || LayerType == LayerType.Keyboard)
                 _drawer.Draw(c, _mustDraw);
             else if (LayerType == LayerType.KeyboardGif)
                 _drawer.DrawGif(c);
@@ -62,9 +86,9 @@ namespace Artemis.Models.Profiles
                 return;
 
             if (LayerType == LayerType.Folder)
-                foreach (var layerModel in Children)
+                foreach (var layerModel in Children.OrderByDescending(l => l.Order))
                     layerModel.Draw<T>(dataModel, c);
-            else if (LayerType == LayerType.KeyboardRectangle || LayerType == LayerType.KeyboardEllipse)
+            else if (LayerType == LayerType.Keyboard || LayerType == LayerType.Keyboard)
                 _drawer.Draw(c);
             else if (LayerType == LayerType.KeyboardGif)
                 _drawer.DrawGif(c);
@@ -87,13 +111,38 @@ namespace Artemis.Models.Profiles
             foreach (var dynamicProperty in LayerProperties)
                 dynamicProperty.ApplyProperty<T>(dataModel, UserProps, CalcProps);
         }
+
+        public void Reorder(LayerModel selectedLayer, bool moveUp)
+        {
+            // Fix the sorting just in case
+            FixOrder();
+            
+            int newOrder;
+            if (moveUp)
+                newOrder = selectedLayer.Order - 1;
+            else
+                newOrder = selectedLayer.Order + 1;
+
+            var target = Children.FirstOrDefault(l => l.Order == newOrder);
+            if (target == null)
+                return;
+
+            target.Order = selectedLayer.Order;
+            selectedLayer.Order = newOrder;
+        }
+
+        private void FixOrder()
+        {
+            Children.Sort(l => l.Order);
+            for (var i = 0; i < Children.Count; i++)
+                Children[i].Order = i;
+        }
     }
 
     public enum LayerType
     {
         [Description("Folder")] Folder,
-        [Description("Keyboard - Rectangle")] KeyboardRectangle,
+        [Description("Keyboard")] Keyboard,
-        [Description("Keyboard - Ellipse")] KeyboardEllipse,
         [Description("Keyboard - GIF")] KeyboardGif,
         [Description("Mouse")] Mouse,
         [Description("Headset")] Headset

Artemis/Artemis/Models/Profiles/ProfileModel.cs

@@ -1,8 +1,11 @@
-using System.Collections.Generic;
+using System.Drawing;
+using System.Linq;
+using System.Windows;
 using System.Windows.Media;
-using System.Xml.Serialization;
+using Artemis.Models.Interfaces;
 using Artemis.Utilities;
-using CUE.NET.Helper;
+using Artemis.Utilities.ParentChild;
+using Color = System.Windows.Media.Color;
 
 namespace Artemis.Models.Profiles
 {
@@ -10,16 +13,17 @@ namespace Artemis.Models.Profiles
     {
         public ProfileModel()
         {
-            Layers = new List<LayerModel>();
+            Layers = new ChildItemCollection<ProfileModel, LayerModel>(this);
             DrawingVisual = new DrawingVisual();
         }
 
+        public ChildItemCollection<ProfileModel, LayerModel> Layers { get; }
+
         public string Name { get; set; }
         public string KeyboardName { get; set; }
         public string GameName { get; set; }
         public DrawingVisual DrawingVisual { get; set; }
 
-        public List<LayerModel> Layers { get; set; }
 
         protected bool Equals(ProfileModel other)
         {
@@ -56,7 +60,8 @@ namespace Artemis.Models.Profiles
             {
                 Name = "New layer",
                 Enabled = true,
-                LayerType = LayerType.KeyboardRectangle,
+                Order = -1,
+                LayerType = LayerType.Keyboard,
                 UserProps = new LayerPropertiesModel
                 {
                     Brush = new SolidColorBrush(ColorHelpers.GetRandomRainbowMediaColor()),
@@ -70,7 +75,60 @@ namespace Artemis.Models.Profiles
             };
 
             Layers.Add(layer);
+            FixOrder();
+
             return layer;
         }
+
+        public void Reorder(LayerModel selectedLayer, bool moveUp)
+        {
+            // Fix the sorting just in case
+            FixOrder();
+
+            int newOrder;
+            if (moveUp)
+                newOrder = selectedLayer.Order - 1;
+            else
+                newOrder = selectedLayer.Order + 1;
+
+            var target = Layers.FirstOrDefault(l => l.Order == newOrder);
+            if (target == null)
+                return;
+
+            target.Order = selectedLayer.Order;
+            selectedLayer.Order = newOrder;
+        }
+
+        public void FixOrder()
+        {
+            Layers.Sort(l => l.Order);
+            for (var i = 0; i < Layers.Count; i++)
+                Layers[i].Order = i;
+        }
+
+        public Bitmap GenerateBitmap<T>(Rect keyboardRect, IGameDataModel gameDataModel)
+        {
+            Bitmap bitmap = null;
+            DrawingVisual.Dispatcher.Invoke(delegate
+            {
+                var visual = new DrawingVisual();
+                using (var c = visual.RenderOpen())
+                {
+                    // Setup the DrawingVisual's size
+                    c.PushClip(new RectangleGeometry(keyboardRect));
+                    c.DrawRectangle(new SolidColorBrush(Color.FromArgb(0, 0, 0, 0)), null, keyboardRect);
+
+                    // Draw the layers
+                    foreach (var layerModel in Layers.OrderByDescending(l => l.Order))
+                        layerModel.Draw<T>(gameDataModel, c);
+
+                    // Remove the clip
+                    c.Pop();
+                }
+
+                bitmap = ImageUtilities.DrawinVisualToBitmap(visual, keyboardRect);
+            });
+            return bitmap;
+        }
     }
 }

Artemis/Artemis/Modules/Games/CounterStrike/CounterStrikeModel.cs

@@ -57,28 +57,7 @@ namespace Artemis.Modules.Games.CounterStrike
                 return null;
 
             var keyboardRect = MainManager.KeyboardManager.ActiveKeyboard.KeyboardRectangle(Scale);
-            Bitmap bitmap = null;
+            return Profile.GenerateBitmap<CounterStrikeDataModel>(keyboardRect, GameDataModel);
-            Profile.DrawingVisual.Dispatcher.Invoke(delegate
-            {
-                var visual = new DrawingVisual();
-                using (var drawingContext = visual.RenderOpen())
-                {
-                    // Setup the DrawingVisual's size
-                    drawingContext.PushClip(new RectangleGeometry(keyboardRect));
-                    drawingContext.DrawRectangle(new SolidColorBrush(Color.FromArgb(0, 0, 0, 0)),
-                        null, keyboardRect);
-
-                    // Draw the layers
-                    foreach (var layerModel in Profile.Layers)
-                        layerModel.Draw<CounterStrikeDataModel>(GameDataModel, drawingContext);
-                    
-                    // Remove the clip
-                    drawingContext.Pop();
-                }
-                
-                bitmap = ImageUtilities.DrawinVisualToBitmap(visual, keyboardRect);
-            });
-            return bitmap;
         }
 
         public void HandleGameData(object sender, GameDataReceivedEventArgs e)

Artemis/Artemis/Modules/Games/CounterStrike/CounterStrikeView.xaml

@@ -54,7 +54,7 @@
             </StackPanel>
 
             <!-- Profile editor -->
-            <ContentControl Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="2" x:Name="ProfileEditor" />
+            <ContentControl Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="2" x:Name="ProfileEditor" Margin="0,0,-30,0" />
 
             <!-- Buttons -->
             <StackPanel Grid.Column="0" Grid.Row="4" Orientation="Horizontal" VerticalAlignment="Bottom">

Artemis/Artemis/Styles/ColorBox.xaml

@@ -150,17 +150,13 @@
     <!-- ******* ColorBox ******* -->
     <Style TargetType="{x:Type nc:ColorBox}">
         <Setter Property="SnapsToDevicePixels" Value="True" />
-        <Setter Property="BorderThickness" Value="{DynamicResource DefaultBorderThickness}" />
         <Setter Property="Background" Value="{DynamicResource DarkerBaseBrush}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource PopupBorderBrush}" />
+        <Setter Property="BorderBrush" Value="{StaticResource ControlBorderBrush}" />
         <Setter Property="VerticalAlignment" Value="Top" />
         <Setter Property="Template">
             <Setter.Value>
                 <ControlTemplate TargetType="{x:Type nc:ColorBox}">
-                    <Border x:Name="PART_Root" Background="{TemplateBinding Background}"
+                    <Border x:Name="PART_Root" Background="{TemplateBinding Background}" BorderBrush="{StaticResource ControlBorderBrush}">
-                            BorderBrush="{TemplateBinding BorderBrush}"
-                            BorderThickness="{TemplateBinding BorderThickness}"
-                            CornerRadius="{DynamicResource DefaultCornerRadius}">
                         <Border.InputBindings>
                             <KeyBinding Key="Delete" Command="{x:Static nc:ColorBox.RemoveGradientStop}" />
                         </Border.InputBindings>
@@ -224,7 +220,7 @@
                                                                         Padding="0,3">
                                                                     <Path x:Name="Icon" Height="12" Width="20"
                                                                           Stretch="Fill" Fill="#FF403C3C"
-                                                                          StrokeThickness="1" Stroke="Black"
+                                                                          StrokeThickness="1" Stroke="{StaticResource ControlBorderBrush}"
                                                                           Data="M371,190L557,190 557,293 371,293 371,190z" />
                                                                 </Border>
 
@@ -552,11 +548,12 @@
                                             <!-- Reverse gradients button -->
                                             <Button Grid.Column="1" ToolTip="Reverse gradient stops"
                                                     Command="{x:Static nc:ColorBox.ReverseGradientStop}"
-                                                    x:Name="Delete" Width="38" Height="38"
+                                                    x:Name="Delete" Width="50" Height="50"
-                                                    Style="{DynamicResource SquareButtonStyle}" VerticalAlignment="Top"
+                                                    Style="{DynamicResource MetroCircleButtonStyle}" VerticalAlignment="Top"
-                                                    HorizontalAlignment="Right">
+                                                    HorizontalAlignment="Right" Margin="0,-4,0,0">
                                                 <Button.Content>
-                                                    <Rectangle Fill="Black" Width="16" Height="16">
+                                                    <Rectangle Fill="{Binding Path=Foreground, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Button}}}"
+                                                               Width="20" Height="20">
                                                         <Rectangle.OpacityMask>
                                                             <VisualBrush
                                                                 Visual="{StaticResource appbar_arrow_left_right}"
@@ -586,7 +583,6 @@
                                                           ToolTip="Additional Properties" Height="20"
                                                           Content="Show more/less" />
 
-
                                             <StackPanel Margin="0,5,0,0"
                                                         Visibility="{Binding ElementName=PART_AdditionalPropertyOpen, Path=IsChecked, Converter={StaticResource BoolToVis}}">
 

Artemis/Artemis/Utilities/LayerDrawer.cs

@@ -38,10 +38,8 @@ namespace Artemis.Utilities
                 _layerModel.CalcProps.Y*Scale, _layerModel.CalcProps.Width*Scale,
                 _layerModel.CalcProps.Height*Scale);
 
-            if (_layerModel.LayerType == LayerType.KeyboardRectangle)
+            if (_layerModel.LayerType == LayerType.Keyboard)
                 _layerModel.CalcProps.Brush.Dispatcher.Invoke(() => DrawRectangle(c));
-            else if (_layerModel.LayerType == LayerType.KeyboardEllipse)
-                _layerModel.CalcProps.Brush.Dispatcher.Invoke(() => DrawEllipse(c));
         }
 
         private void UpdateAnimation()

Artemis/Artemis/Utilities/ParentChild/ChildItemCollection.cs

@@ -0,0 +1,138 @@
+using System;
+using System.Collections;
+using System.Collections.Generic;
+using System.Linq;
+
+namespace Artemis.Utilities.ParentChild
+{
+    /// <summary>
+    ///     Collection of child items. This collection automatically set the
+    ///     Parent property of the child items when they are added or removed
+    ///     Thomas Levesque - http://www.thomaslevesque.com/2009/06/12/c-parentchild-relationship-and-xml-serialization/
+    /// </summary>
+    /// <typeparam name="P">Type of the parent object</typeparam>
+    /// <typeparam name="T">Type of the child items</typeparam>
+    public class ChildItemCollection<P, T> : IList<T>
+        where P : class
+        where T : IChildItem<P>
+    {
+        private IList<T> _collection;
+        private readonly P _parent;
+
+        public ChildItemCollection(P parent)
+        {
+            _parent = parent;
+            _collection = new List<T>();
+        }
+
+        public ChildItemCollection(P parent, IList<T> collection)
+        {
+            _parent = parent;
+            _collection = collection;
+        }
+
+        #region IEnumerable<T> Members
+
+        public IEnumerator<T> GetEnumerator()
+        {
+            return _collection.GetEnumerator();
+        }
+
+        #endregion
+
+        #region IEnumerable Members
+
+        IEnumerator IEnumerable.GetEnumerator()
+        {
+            return (_collection as IEnumerable).GetEnumerator();
+        }
+
+        #endregion
+
+        #region IList<T> Members
+
+        public int IndexOf(T item)
+        {
+            return _collection.IndexOf(item);
+        }
+
+        public void Insert(int index, T item)
+        {
+            if (item != null)
+                item.Parent = _parent;
+            _collection.Insert(index, item);
+        }
+
+        public void RemoveAt(int index)
+        {
+            var oldItem = _collection[index];
+            _collection.RemoveAt(index);
+            if (oldItem != null)
+                oldItem.Parent = null;
+        }
+
+        public T this[int index]
+        {
+            get { return _collection[index]; }
+            set
+            {
+                var oldItem = _collection[index];
+                if (value != null)
+                    value.Parent = _parent;
+                _collection[index] = value;
+                if (oldItem != null)
+                    oldItem.Parent = null;
+            }
+        }
+
+        #endregion
+
+        #region ICollection<T> Members
+
+        public void Add(T item)
+        {
+            if (item != null)
+                item.Parent = _parent;
+            _collection.Add(item);
+        }
+
+        public void Clear()
+        {
+            foreach (var item in _collection)
+            {
+                if (item != null)
+                    item.Parent = null;
+            }
+            _collection.Clear();
+        }
+
+        public bool Contains(T item)
+        {
+            return _collection.Contains(item);
+        }
+
+        public void CopyTo(T[] array, int arrayIndex)
+        {
+            _collection.CopyTo(array, arrayIndex);
+        }
+
+        public int Count => _collection.Count;
+
+        public bool IsReadOnly => _collection.IsReadOnly;
+
+        public bool Remove(T item)
+        {
+            var b = _collection.Remove(item);
+            if (item != null)
+                item.Parent = null;
+            return b;
+        }
+
+        #endregion
+
+        public void Sort(Func<T, object> func)
+        {
+            _collection = _collection.OrderBy(func).ToList();
+        }
+    }
+}

Artemis/Artemis/Utilities/ParentChild/IChildItem.cs

@@ -0,0 +1,12 @@
+namespace Artemis.Utilities.ParentChild
+{
+    /// <summary>
+    ///     Defines the contract for an object that has a parent object
+    ///     Thomas Levesque - http://www.thomaslevesque.com/2009/06/12/c-parentchild-relationship-and-xml-serialization/
+    /// </summary>
+    /// <typeparam name="P">Type of the parent object</typeparam>
+    public interface IChildItem<P> where P : class
+    {
+        P Parent { get; set; }
+    }
+}

Artemis/Artemis/Utilities/ValueConverters.cs

@@ -1,7 +1,11 @@
 using System;
+using System.Collections;
 using System.ComponentModel;
 using System.Globalization;
+using System.Linq;
 using System.Windows.Data;
+using Artemis.Models.Profiles;
+using Artemis.Utilities.ParentChild;
 
 namespace Artemis.Utilities
 {
@@ -36,4 +40,27 @@ namespace Artemis.Utilities
             return attrib?.Description;
         }
     }
+
+    public class LayerOrderConverter : IValueConverter
+    {
+        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
+        {
+            IList collection;
+            if (value is ChildItemCollection<LayerModel, LayerModel>)
+                collection = ((ChildItemCollection<LayerModel, LayerModel>) value).ToList();
+            else
+                collection = (IList) value;
+
+            var view = new ListCollectionView(collection);
+            var sort = new SortDescription(parameter.ToString(), ListSortDirection.Ascending);
+            view.SortDescriptions.Add(sort);
+
+            return view;
+        }
+
+        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
+        {
+            return null;
+        }
+    }
 }

Artemis/Artemis/ViewModels/ProfileEditorViewModel.cs

@@ -44,7 +44,7 @@ namespace Artemis.ViewModels
             Layers = new BindableCollection<LayerModel>();
             _mainManager.Events.Subscribe(this);
 
-            PropertyChanged += PreviewRefresher;
+            PropertyChanged += PropertyChangeHandler;
             LoadProfiles();
         }
 
@@ -81,6 +81,17 @@ namespace Artemis.ViewModels
             }
         }
 
+        public Cursor KeyboardPreviewCursor
+        {
+            get { return _keyboardPreviewCursor; }
+            set
+            {
+                if (Equals(value, _keyboardPreviewCursor)) return;
+                _keyboardPreviewCursor = value;
+                NotifyOfPropertyChange(() => KeyboardPreviewCursor);
+            }
+        }
+
         public ProfileModel SelectedProfile
         {
             get { return _selectedProfile; }
@@ -113,7 +124,7 @@ namespace Artemis.ViewModels
                     drawingContext.DrawRectangle(new SolidColorBrush(Color.FromArgb(0, 0, 0, 0)), null, keyboardRect);
 
                     // Draw the layers
-                    foreach (var layerModel in _selectedProfile.Layers)
+                    foreach (var layerModel in _selectedProfile.Layers.OrderByDescending(l => l.Order))
                         layerModel.DrawPreview(drawingContext);
 
                     // Get the selection color
@@ -176,17 +187,6 @@ namespace Artemis.ViewModels
 
         public bool CanAddLayer => _selectedProfile != null;
 
-        public Cursor KeyboardPreviewCursor
-        {
-            get { return _keyboardPreviewCursor; }
-            set
-            {
-                if (Equals(value, _keyboardPreviewCursor)) return;
-                _keyboardPreviewCursor = value;
-                NotifyOfPropertyChange(() => KeyboardPreviewCursor);
-            }
-        }
-
         private KeyboardProvider ActiveKeyboard => _mainManager.KeyboardManager.ActiveKeyboard;
 
         public void Handle(ActiveKeyboardChanged message)
@@ -195,7 +195,7 @@ namespace Artemis.ViewModels
             NotifyOfPropertyChange(() => PreviewSettings);
         }
 
-        private void PreviewRefresher(object sender, PropertyChangedEventArgs e)
+        private void PropertyChangeHandler(object sender, PropertyChangedEventArgs e)
         {
             if (e.PropertyName != "KeyboardPreview")
                 NotifyOfPropertyChange(() => KeyboardPreview);
@@ -254,11 +254,6 @@ namespace Artemis.ViewModels
             manager.ShowDialog(_editorVm, null, settings);
         }
 
-        public void SetSelectedLayer(LayerModel layer)
-        {
-            SelectedLayer = layer;
-        }
-
         public void AddLayer()
         {
             if (_selectedProfile == null)
@@ -279,6 +274,38 @@ namespace Artemis.ViewModels
             Layers.Remove(_selectedLayer);
         }
 
+        public void LayerUp()
+        {
+            if (SelectedLayer == null)
+                return;
+
+            var reorderLayer = SelectedLayer;
+
+            if (SelectedLayer.ParentLayer != null)
+                SelectedLayer.ParentLayer.Reorder(SelectedLayer, true);
+            else
+                SelectedLayer.ParentProfile.Reorder(SelectedLayer, true);
+
+            NotifyOfPropertyChange(() => Layers);
+            SelectedLayer = reorderLayer;
+        }
+
+        public void LayerDown()
+        {
+            if (SelectedLayer == null)
+                return;
+
+            var reorderLayer = SelectedLayer;
+
+            if (SelectedLayer.ParentLayer != null)
+                SelectedLayer.ParentLayer.Reorder(SelectedLayer, false);
+            else
+                SelectedLayer.ParentProfile.Reorder(SelectedLayer, false);
+
+            NotifyOfPropertyChange(() => Layers);
+            SelectedLayer = reorderLayer;
+        }
+
         public void MouseDownKeyboardPreview(MouseButtonEventArgs e)
         {
             if (e.LeftButton == MouseButtonState.Pressed)
@@ -295,7 +322,7 @@ namespace Artemis.ViewModels
             var x = pos.X/((double) ActiveKeyboard.PreviewSettings.Width/ActiveKeyboard.Width);
             var y = pos.Y/((double) ActiveKeyboard.PreviewSettings.Height/ActiveKeyboard.Height);
 
-            var hoverLayer = SelectedProfile.Layers.Where(l => l.Enabled)
+            var hoverLayer = SelectedProfile.Layers.OrderBy(l => l.Order).Where(l => l.Enabled)
                 .FirstOrDefault(l => l.UserProps.GetRect(1).Contains(x, y));
             if (hoverLayer != null)
                 SelectedLayer = hoverLayer;
@@ -306,7 +333,7 @@ namespace Artemis.ViewModels
             var pos = e.GetPosition((Image) e.OriginalSource);
             var x = pos.X/((double) ActiveKeyboard.PreviewSettings.Width/ActiveKeyboard.Width);
             var y = pos.Y/((double) ActiveKeyboard.PreviewSettings.Height/ActiveKeyboard.Height);
-            var hoverLayer = SelectedProfile.Layers.Where(l => l.Enabled)
+            var hoverLayer = SelectedProfile.Layers.OrderBy(l => l.Order).Where(l => l.Enabled)
                 .FirstOrDefault(l => l.UserProps.GetRect(1).Contains(x, y));
 
             HandleDragging(e, x, y, hoverLayer);

Artemis/Artemis/Views/LayerEditor/LayerConditionView.xaml

@@ -57,7 +57,7 @@
             <Button Grid.Column="1" x:Name="Delete" Width="26" Height="26" Style="{DynamicResource SquareButtonStyle}"
                     VerticalAlignment="Top" HorizontalAlignment="Right">
                 <Button.Content>
-                    <Rectangle Fill="Black" Width="12" Height="12">
+                    <Rectangle Fill="{Binding Path=Foreground, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Button}}}" Width="12" Height="12">
                         <Rectangle.OpacityMask>
                             <VisualBrush Visual="{StaticResource appbar_delete}" Stretch="Fill" />
                         </Rectangle.OpacityMask>

Artemis/Artemis/Views/LayerEditorView.xaml

@@ -58,7 +58,7 @@
         <!-- Condition editor -->
         <Label Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="4" FontSize="20" Content="Display if.." />
         <Border Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="4" BorderThickness="1"
-                BorderBrush="{StaticResource GrayBrush7}" Margin="10,0">
+                BorderBrush="{StaticResource GrayBrush7}" Margin="10,0" SnapsToDevicePixels="True">
             <ListBox Height="138" x:Name="LayerConditionVms" ScrollViewer.VerticalScrollBarVisibility="Visible">
                 <ListBox.Template>
                     <ControlTemplate>
@@ -90,9 +90,9 @@
         <!-- Colors -->
         <TextBlock Grid.Row="6" Grid.Column="0" Margin="10,13,10,0" FontSize="13.333" Text="Color(s):"
                    VerticalAlignment="Top" Height="18" />
-        <Border Grid.Row="6" Grid.Column="1" Margin="10" BorderThickness="1"
+        <Border Grid.Row="6" Grid.Column="1" Margin="10" BorderBrush="{StaticResource ControlBorderBrush}"
-                BorderBrush="{StaticResource ControlBorderBrush}" ToolTip="Click to edit">
+                BorderThickness="1" SnapsToDevicePixels="True" ToolTip="Click to edit">
-            <ncore:ColorBox Brush="{Binding Path=ProposedProperties.Brush, Mode=TwoWay}" />
+            <ncore:ColorBox Brush="{Binding Path=ProposedProperties.Brush, Mode=TwoWay}" Height="24" />
         </Border>
 
         <!-- ContainedBrush -->
@@ -136,7 +136,7 @@
         <TextBlock Grid.Row="9" Grid.Column="0" Margin="10,13,10,0" FontSize="13.333" Text="Preview:"
                    VerticalAlignment="Top" Height="18" />
         <Border Grid.Row="9" Grid.Column="1" Grid.ColumnSpan="2" Margin="10" BorderThickness="1"
-                BorderBrush="{StaticResource ControlBorderBrush}">
+                BorderBrush="{StaticResource ControlBorderBrush}" SnapsToDevicePixels="True">
             <Image Source="{Binding LayerImage}" />
         </Border>
 

Artemis/Artemis/Views/ProfileEditorView.xaml

@@ -6,12 +6,17 @@
              xmlns:cal="http://www.caliburnproject.org"
              xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
              xmlns:itemBehaviours="clr-namespace:Artemis.ItemBehaviours"
+             xmlns:utilities="clr-namespace:Artemis.Utilities"
              mc:Ignorable="d"
-             d:DesignHeight="482.812" d:DesignWidth="1029.95">
+             d:DesignHeight="473" Width="1055">
+    <UserControl.Resources>
+        <utilities:LayerOrderConverter x:Key="LayerOrderConverter" />
+    </UserControl.Resources>
     <Grid Width="Auto" Height="Auto">
         <Grid.ColumnDefinitions>
             <ColumnDefinition Width="Auto" />
             <ColumnDefinition Width="Auto" />
+            <ColumnDefinition Width="Auto" />
         </Grid.ColumnDefinitions>
         <Grid.RowDefinitions>
             <RowDefinition Height="Auto" />
@@ -57,8 +62,8 @@
         <!-- Layer list -->
         <Label Grid.Column="1" Grid.Row="0" FontSize="20" HorizontalAlignment="Left" Content="Layers" Margin="10,0,0,0" />
         <Border Grid.Column="1" Grid.Row="1" Background="#FF232323" BorderBrush="{DynamicResource HighlightBrush}"
-                BorderThickness="3" Margin="10,0,0,0" Height="400" Width="250">
+                BorderThickness="3" Margin="10,0,0,0" Height="400" Width="233">
-            <TreeView x:Name="ProfileTree" ItemsSource="{Binding Path=Layers}">
+            <TreeView x:Name="ProfileTree" ItemsSource="{Binding Path=Layers, Converter={StaticResource LayerOrderConverter}, ConverterParameter=Order}">
                 <i:Interaction.Behaviors>
                     <itemBehaviours:BindableSelectedItemBehavior SelectedItem="{Binding SelectedLayer, Mode=TwoWay}" />
                 </i:Interaction.Behaviors>
@@ -67,7 +72,7 @@
                         Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseDark.xaml" />
                 </TreeView.Resources>
                 <TreeView.ItemTemplate>
-                    <HierarchicalDataTemplate ItemsSource="{Binding Children}">
+                    <HierarchicalDataTemplate ItemsSource="{Binding Children, Converter={StaticResource LayerOrderConverter}, ConverterParameter=Order}">
                         <StackPanel Orientation="Horizontal" Tag="{Binding DataContext, ElementName=ProfileTree}">
                             <StackPanel.ContextMenu>
                                 <ContextMenu
@@ -95,12 +100,34 @@
             </Grid.ColumnDefinitions>
             <Button Grid.Column="0" x:Name="AddLayer" Content="Add layer" VerticalAlignment="Top"
                     Style="{DynamicResource SquareButtonStyle}" Width="95" />
-            <Button Grid.Column="1" x:Name="LayerUp" Content="^" VerticalAlignment="Top"
-                    Style="{DynamicResource SquareButtonStyle}" Width="26" Margin="2,0,0,0" />
-            <Button Grid.Column="2" x:Name="LayerDown" Content="v" VerticalAlignment="Top"
-                    Style="{DynamicResource SquareButtonStyle}" Width="26" Margin="0,0,2,0" />
             <Button Grid.Column="3" x:Name="RemoveLayer" Content="Remove layer" VerticalAlignment="Top"
                     Style="{DynamicResource SquareButtonStyle}" Width="95" />
         </Grid>
+
+        <!-- Layer movement -->
+        <StackPanel Grid.Column="2" Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="10,0,0,0">
+            <Button x:Name="LayerUp" Width="40" Height="40" Style="{DynamicResource MetroCircleButtonStyle}">
+                <Button.Content>
+                    <Rectangle
+                        Fill="{Binding Path=Foreground, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Button}}}"
+                        Width="16" Height="16">
+                        <Rectangle.OpacityMask>
+                            <VisualBrush Visual="{StaticResource appbar_arrow_up}" Stretch="Fill" />
+                        </Rectangle.OpacityMask>
+                    </Rectangle>
+                </Button.Content>
+            </Button>
+            <Button x:Name="LayerDown" Width="40" Height="40" Style="{DynamicResource MetroCircleButtonStyle}">
+                <Button.Content>
+                    <Rectangle
+                        Fill="{Binding Path=Foreground, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Button}}}"
+                        Width="16" Height="16">
+                        <Rectangle.OpacityMask>
+                            <VisualBrush Visual="{StaticResource appbar_arrow_down}" Stretch="Fill" />
+                        </Rectangle.OpacityMask>
+                    </Rectangle>
+                </Button.Content>
+            </Button>
+        </StackPanel>
     </Grid>
 </UserControl>

Artemis/Artemis/Views/ShellView.xaml

@@ -8,8 +8,8 @@
                       xmlns:dialogs="clr-namespace:MahApps.Metro.Controls.Dialogs;assembly=MahApps.Metro"
                       dialogs:DialogParticipation.Register="{Binding RelativeSource={RelativeSource Self}, Path=DataContext}"
                       mc:Ignorable="d"
-                      Title="Artemis" Height="800" Width="1200"
+                      Title="Artemis" Height="800" Width="1210"
-                      MinWidth="500" MinHeight="400"
+                      MinHeight="800" MinWidth="1210" 
                       GlowBrush="{DynamicResource AccentColorBrush}" Icon="../logo.ico">
     <!-- Bit of extra code to use a different icon than in the taskbar -->
     <Controls:MetroWindow.IconTemplate>