Implemented layer elements

Added a brush layer element
Corsair - Added ST100 RGB layout

src/Artemis.UI/App.xaml

@@ -27,11 +27,11 @@
 
                 <!-- Material Design: MahApps Compatibility -->
                 <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.MahApps;component/Themes/MaterialDesignTheme.MahApps.NumericUpDown.xaml" />
-                
+
                 <!-- Include the Dragablz Material Design style -->
                 <ResourceDictionary Source="pack://application:,,,/Dragablz;component/Themes/materialdesign.xaml" />
 
-                <ResourceDictionary Source="ResourceDictionaries/Scrollbar.xaml"/>
+                <ResourceDictionary Source="ResourceDictionaries/Scrollbar.xaml" />
             </ResourceDictionary.MergedDictionaries>
 
             <!-- MahApps Brushes -->

src/Artemis.UI/Artemis.UI.csproj

@@ -148,11 +148,14 @@
       <SubType>Designer</SubType>
     </ApplicationDefinition>
     <Compile Include="Bootstrapper.cs" />
+    <Compile Include="Converters\ColorToDrawingColorConverter.cs" />
     <Compile Include="Converters\ColorToSolidColorBrushConverter.cs" />
     <Compile Include="Converters\InverseBooleanConverter.cs" />
     <Compile Include="Converters\NullToImageConverter.cs" />
     <Compile Include="Converters\NullToVisibilityConverter.cs" />
     <Compile Include="Events\MainWindowFocusChangedEvent.cs" />
+    <Compile Include="Screens\GradientEditor\GradientEditorViewModel.cs" />
+    <Compile Include="Screens\Module\ProfileEditor\LayerElements\Dialogs\AddLayerElementViewModel.cs" />
     <Compile Include="Services\Interfaces\IProfileEditorService.cs" />
     <Compile Include="Services\ProfileEditorService.cs" />
     <Compile Include="Utilities\BindableSelectedItemBehavior.cs" />
@@ -179,7 +182,6 @@
     <Compile Include="Screens\Module\ProfileEditor\DisplayConditions\DisplayConditionsViewModel.cs" />
     <Compile Include="Screens\Module\ProfileEditor\DisplayConditions\DisplayConditionViewModel.cs" />
     <Compile Include="Screens\Module\ProfileEditor\ElementProperties\ElementPropertiesViewModel.cs" />
-    <Compile Include="Screens\Module\ProfileEditor\ElementProperties\ElementPropertyViewModel.cs" />
     <Compile Include="Screens\Module\ProfileEditor\LayerElements\LayerElementsViewModel.cs" />
     <Compile Include="Screens\Module\ProfileEditor\LayerElements\LayerElementViewModel.cs" />
     <Compile Include="Screens\Module\ProfileEditor\ProfileTree\TreeItem\FolderViewModel.cs" />
@@ -226,6 +228,10 @@
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </Page>
+    <Page Include="Screens\GradientEditor\GradientEditorView.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
     <Page Include="Screens\Module\ProfileEditor\Dialogs\ProfileCreateView.xaml">
       <Generator>MSBuild:Compile</Generator>
       <SubType>Designer</SubType>
@@ -246,7 +252,7 @@
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </Page>
-    <Page Include="Screens\Module\ProfileEditor\ElementProperties\ElementPropertyView.xaml">
+    <Page Include="Screens\Module\ProfileEditor\LayerElements\Dialogs\AddLayerElementView.xaml">
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </Page>
@@ -254,10 +260,6 @@
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </Page>
-    <Page Include="Screens\Module\ProfileEditor\LayerElements\LayerElementView.xaml">
-      <SubType>Designer</SubType>
-      <Generator>MSBuild:Compile</Generator>
-    </Page>
     <Page Include="Screens\Module\ProfileEditor\ProfileTree\TreeItem\FolderView.xaml">
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>

src/Artemis.UI/Converters/ColorToDrawingColorConverter.cs

@@ -0,0 +1,33 @@
+using System;
+using System.Drawing;
+using System.Globalization;
+using System.Windows.Data;
+
+namespace Artemis.UI.Converters
+{
+    /// <inheritdoc />
+    /// <summary>
+    ///     Converts <see cref="T:System.Drawing.Color" /> into <see cref="T:System.Windows.Media.Color" />.
+    /// </summary>
+    [ValueConversion(typeof(Color), typeof(System.Windows.Media.Color))]
+    public class ColorToDrawingColorConverter : IValueConverter
+    {
+        /// <inheritdoc />
+        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
+        {
+            if (value is Color drawingColor)
+                return System.Windows.Media.Color.FromArgb(drawingColor.A, drawingColor.R, drawingColor.G, drawingColor.B);
+
+            return default(System.Windows.Media.Color);
+        }
+
+        /// <inheritdoc />
+        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
+        {
+            if (value is System.Windows.Media.Color mediaColor)
+                return Color.FromArgb(mediaColor.A, mediaColor.R, mediaColor.G, mediaColor.B);
+
+            return default(Color);
+        }
+    }
+}

src/Artemis.UI/Ninject/UiModule.cs

@@ -20,7 +20,7 @@ namespace Artemis.UI.Ninject
         {
             if (Kernel == null)
                 throw new ArgumentNullException("Kernel shouldn't be null here.");
-            
+
             // Bind all built-in VMs
             Kernel.Bind(x =>
             {
@@ -51,7 +51,7 @@ namespace Artemis.UI.Ninject
             Kernel.Bind<IDeviceSettingsViewModelFactory>().ToFactory();
             Kernel.Bind<IModuleViewModelFactory>().ToFactory();
             Kernel.Bind<IProfileEditorViewModelFactory>().ToFactory();
-            
+
             // Bind profile editor VMs
             Kernel.Bind(x =>
             {

src/Artemis.UI/Screens/GradientEditor/GradientEditorView.xaml

@@ -0,0 +1,16 @@
+<mah:MetroWindow x:Class="Artemis.UI.Screens.GradientEditor.GradientEditorView"
+                 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:gradientEditor="clr-namespace:Artemis.UI.Screens.GradientEditor"
+                 xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
+                 xmlns:mah="http://metro.mahapps.com/winfx/xaml/controls"
+                 mc:Ignorable="d"
+                 Title="Gradient Editor"
+                 Height="450" Width="800"
+                 d:DataContext="{d:DesignInstance {x:Type gradientEditor:GradientEditorViewModel}}">
+    <Grid>
+        <materialDesign:ColorPicker Color="{Binding CurrentColor}" />
+    </Grid>
+</mah:MetroWindow>

src/Artemis.UI/Screens/GradientEditor/GradientEditorViewModel.cs

@@ -0,0 +1,10 @@
+using System.Windows.Media;
+using Stylet;
+
+namespace Artemis.UI.Screens.GradientEditor
+{
+    public class GradientEditorViewModel : Screen
+    {
+        public Color CurrentColor { get; set; }
+    }
+}

src/Artemis.UI/Screens/Module/ProfileEditor/Dialogs/ProfileElementRenameView.xaml

@@ -16,7 +16,7 @@
                  Margin="0 8 0 16"
                  Style="{StaticResource MaterialDesignFloatingHintTextBox}"
                  Text="{Binding ElementName, UpdateSourceTrigger=PropertyChanged}"
-                 Loaded="FrameworkElement_OnLoaded"/>
+                 Loaded="FrameworkElement_OnLoaded" />
 
         <StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
             <Button Style="{StaticResource MaterialDesignFlatButton}" IsCancel="True" Margin="0 8 8 0" Command="{s:Action Cancel}">

src/Artemis.UI/Screens/Module/ProfileEditor/ElementProperties/ElementPropertiesView.xaml

@@ -3,15 +3,23 @@
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-             xmlns:local="clr-namespace:Artemis.UI.Screens.Module.ProfileEditor.ElementProperties"
+             xmlns:elementProperties="clr-namespace:Artemis.UI.Screens.Module.ProfileEditor.ElementProperties"
+             xmlns:s="https://github.com/canton7/Stylet"
              mc:Ignorable="d"
-             d:DesignHeight="450" d:DesignWidth="800">
+             d:DesignHeight="450" d:DesignWidth="800"
+             d:DataContext="{d:DesignInstance {x:Type elementProperties:ElementPropertiesViewModel}}">
     <Grid>
-        <StackPanel>
+        <Grid.RowDefinitions>
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="*" />
+        </Grid.RowDefinitions>
+        <StackPanel Grid.Row="0">
             <TextBlock Style="{StaticResource MaterialDesignSubheadingTextBlock}" Margin="10 5 0 -4">
                 Layer element properties
             </TextBlock>
             <Separator Style="{StaticResource MaterialDesignDarkSeparator}" Margin="8 0" />
         </StackPanel>
+        <ContentControl Grid.Row="1" s:View.Model="{Binding LayerElementViewModel}" />
     </Grid>
+
 </UserControl>

src/Artemis.UI/Screens/Module/ProfileEditor/ElementProperties/ElementPropertiesViewModel.cs

@@ -1,6 +1,25 @@
-namespace Artemis.UI.Screens.Module.ProfileEditor.ElementProperties
+using System;
+using Artemis.Core.Plugins.LayerElement;
+using Artemis.UI.Services.Interfaces;
+
+namespace Artemis.UI.Screens.Module.ProfileEditor.ElementProperties
 {
     public class ElementPropertiesViewModel : ProfileEditorPanelViewModel
     {
+        private readonly IProfileEditorService _profileEditorService;
+
+        public ElementPropertiesViewModel(IProfileEditorService profileEditorService)
+        {
+            _profileEditorService = profileEditorService;
+
+            _profileEditorService.SelectedLayerElementChanged += OnSelectedLayerElementChanged;
+        }
+
+        public LayerElementViewModel LayerElementViewModel { get; set; }
+
+        private void OnSelectedLayerElementChanged(object sender, EventArgs e)
+        {
+            LayerElementViewModel = _profileEditorService.SelectedLayerElement?.GetViewModel();
+        }
     }
 }

src/Artemis.UI/Screens/Module/ProfileEditor/ElementProperties/ElementPropertyView.xaml

@@ -1,10 +0,0 @@
-<UserControl x:Class="Artemis.UI.Screens.Module.ProfileEditor.ElementProperties.ElementPropertyView"
-             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-             xmlns:local="clr-namespace:Artemis.UI.Screens.Module.ProfileEditor.ElementProperties"
-             mc:Ignorable="d"
-             d:DesignHeight="450" d:DesignWidth="800">
-    <Grid />
-</UserControl>

src/Artemis.UI/Screens/Module/ProfileEditor/ElementProperties/ElementPropertyViewModel.cs

@@ -1,6 +0,0 @@
-namespace Artemis.UI.Screens.Module.ProfileEditor.ElementProperties
-{
-    public class ElementPropertyViewModel
-    {
-    }
-}

src/Artemis.UI/Screens/Module/ProfileEditor/LayerElements/Dialogs/AddLayerElementView.xaml

@@ -0,0 +1,45 @@
+<UserControl x:Class="Artemis.UI.Screens.Module.ProfileEditor.LayerElements.Dialogs.AddLayerElementView"
+             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+             xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
+             xmlns:layerElement="clr-namespace:Artemis.Core.Plugins.LayerElement;assembly=Artemis.Core"
+             xmlns:layerElements="clr-namespace:Artemis.UI.Screens.Module.ProfileEditor.LayerElements.Dialogs"
+             xmlns:s="https://github.com/canton7/Stylet"
+             mc:Ignorable="d"
+             d:DataContext="{d:DesignInstance {x:Type layerElements:AddLayerElementViewModel}}">
+    <Grid>
+        <Grid.RowDefinitions>
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="*" />
+            <RowDefinition Height="Auto" />
+        </Grid.RowDefinitions>
+
+        <TextBlock Margin="15">Select a new layer element below</TextBlock>
+        <ListBox Grid.Row="1" ItemsSource="{Binding LayerElementDescriptors}" SelectedItem="{Binding SelectedLayerElementDescriptor}" HorizontalContentAlignment="Stretch">
+            <ListBox.ItemTemplate>
+                <DataTemplate DataType="{x:Type layerElement:LayerElementDescriptor}">
+                    <Border Padding="8" BorderThickness="0 0 0 1" BorderBrush="{DynamicResource MaterialDesignDivider}" VerticalAlignment="Stretch" MouseDown="{s:Action ListBoxItemMouseClick}">
+                        <Grid>
+                            <Grid.ColumnDefinitions>
+                                <ColumnDefinition Width="Auto" />
+                                <ColumnDefinition Width="*" />
+                            </Grid.ColumnDefinitions>
+                            <materialDesign:PackIcon Kind="{Binding Icon}" Width="20" Height="20" VerticalAlignment="Center" />
+                            <StackPanel Margin="8 0 0 0" Grid.Column="1" VerticalAlignment="Stretch">
+                                <TextBlock FontWeight="Bold" Text="{Binding DisplayName}" />
+                                <TextBlock Text="{Binding Description}" />
+                            </StackPanel>
+                        </Grid>
+                    </Border>
+                </DataTemplate>
+            </ListBox.ItemTemplate>
+        </ListBox>
+
+        <StackPanel Grid.Row="2" Orientation="Horizontal" HorizontalAlignment="Right" Margin="10 15">
+            <Button Style="{StaticResource MaterialDesignFlatButton}" IsCancel="True" Margin="0 8 8 0" Command="{s:Action Cancel}">CANCEL</Button>
+            <Button Style="{StaticResource MaterialDesignFlatButton}" IsDefault="True" Margin="0 8 8 0" Command="{s:Action Accept}">ACCEPT</Button>
+        </StackPanel>
+    </Grid>
+</UserControl>

src/Artemis.UI/Screens/Module/ProfileEditor/LayerElements/Dialogs/AddLayerElementViewModel.cs

@@ -0,0 +1,53 @@
+using System.Windows.Input;
+using Artemis.Core.Models.Profile;
+using Artemis.Core.Plugins.LayerElement;
+using Artemis.Core.Services.Interfaces;
+using Artemis.UI.ViewModels.Dialogs;
+using Stylet;
+
+namespace Artemis.UI.Screens.Module.ProfileEditor.LayerElements.Dialogs
+{
+    public class AddLayerElementViewModel : DialogViewModelBase
+    {
+        private readonly ILayerService _layerService;
+
+
+        public AddLayerElementViewModel(IPluginService pluginService, ILayerService layerService, Layer layer)
+        {
+            _layerService = layerService;
+            Layer = layer;
+
+            LayerElementDescriptors = new BindableCollection<LayerElementDescriptor>();
+            var layerElementProviders = pluginService.GetPluginsOfType<LayerElementProvider>();
+            foreach (var layerElementProvider in layerElementProviders)
+                LayerElementDescriptors.AddRange(layerElementProvider.LayerElementDescriptors);
+        }
+
+        public Layer Layer { get; }
+
+        public LayerElementDescriptor SelectedLayerElementDescriptor { get; set; }
+        public BindableCollection<LayerElementDescriptor> LayerElementDescriptors { get; set; }
+        public bool CanAccept => SelectedLayerElementDescriptor != null;
+
+        public void Accept()
+        {
+            var layerElement = _layerService.InstantiateLayerElement(Layer, SelectedLayerElementDescriptor);
+            Session.Close(layerElement);
+        }
+
+        public void Cancel()
+        {
+            Session.Close();
+        }
+
+        #region View event handlers
+
+        public void ListBoxItemMouseClick(object sender, MouseButtonEventArgs args)
+        {
+            if (args.ClickCount > 1 && SelectedLayerElementDescriptor != null)
+                Accept();
+        }
+
+        #endregion
+    }
+}

src/Artemis.UI/Screens/Module/ProfileEditor/LayerElements/LayerElementView.xaml

@@ -1,10 +0,0 @@
-<UserControl x:Class="Artemis.UI.Screens.Module.ProfileEditor.LayerElements.LayerElementView"
-             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-             xmlns:local="clr-namespace:Artemis.UI.Screens.Module.ProfileEditor.LayerElements"
-             mc:Ignorable="d"
-             d:DesignHeight="450" d:DesignWidth="800">
-    <Grid />
-</UserControl>

src/Artemis.UI/Screens/Module/ProfileEditor/LayerElements/LayerElementViewModel.cs

@@ -1,6 +1,19 @@
-namespace Artemis.UI.Screens.Module.ProfileEditor.LayerElements
+using Artemis.Core.Models.Profile;
+using Artemis.Core.Plugins.LayerElement;
+
+namespace Artemis.UI.Screens.Module.ProfileEditor.LayerElements
 {
     public class LayerElementViewModel
     {
+        public LayerElementViewModel(LayerElement layerElement)
+        {
+            Layer = layerElement.Layer;
+            LayerElement = layerElement;
+            LayerElementDescriptor = layerElement.Descriptor;
+        }
+
+        public Layer Layer { get; set; }
+        public LayerElement LayerElement { get; set; }
+        public LayerElementDescriptor LayerElementDescriptor { get; set; }
     }
 }

src/Artemis.UI/Screens/Module/ProfileEditor/LayerElements/LayerElementsView.xaml

@@ -3,15 +3,69 @@
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-             xmlns:local="clr-namespace:Artemis.UI.Screens.Module.ProfileEditor.LayerElements"
+             xmlns:layerElements="clr-namespace:Artemis.UI.Screens.Module.ProfileEditor.LayerElements"
+             xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
+             xmlns:s="https://github.com/canton7/Stylet"
              mc:Ignorable="d"
-             d:DesignHeight="450" d:DesignWidth="800">
-    <Grid>
-        <StackPanel>
-            <TextBlock Style="{StaticResource MaterialDesignSubheadingTextBlock}" Margin="10 5 0 -4">
-                Layer elements
-            </TextBlock>
-            <Separator Style="{StaticResource MaterialDesignDarkSeparator}" Margin="8 0" />
-        </StackPanel>
-    </Grid>
+             d:DesignHeight="450" d:DesignWidth="800"
+             d:DataContext="{d:DesignInstance {x:Type layerElements:LayerElementsViewModel}}">
+
+    <materialDesign:DialogHost Identifier="LayerElementsDialogHost" CloseOnClickAway="True">
+        <Grid>
+            <Grid.RowDefinitions>
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="*" />
+            </Grid.RowDefinitions>
+            <StackPanel Grid.Row="0">
+                <TextBlock Style="{StaticResource MaterialDesignSubheadingTextBlock}" Margin="10 5 0 -4">
+                    Layer elements
+                </TextBlock>
+                <Separator Style="{StaticResource MaterialDesignDarkSeparator}" Margin="8 0" />
+            </StackPanel>
+            <Grid Grid.Row="1">
+                <Grid.ColumnDefinitions>
+                    <ColumnDefinition Width="*" />
+                    <ColumnDefinition Width="Auto" />
+                </Grid.ColumnDefinitions>
+                <ListBox ItemsSource="{Binding LayerElements}" SelectedItem="{Binding SelectedLayerElement}" HorizontalContentAlignment="Stretch">
+                    <ListBox.ItemTemplate>
+                        <DataTemplate DataType="{x:Type layerElements:LayerElementViewModel}">
+                            <Border Padding="8" BorderThickness="0 0 0 1" BorderBrush="{DynamicResource MaterialDesignDivider}">
+                                <Grid>
+                                    <Grid.ColumnDefinitions>
+                                        <ColumnDefinition Width="Auto" />
+                                        <ColumnDefinition Width="*" />
+                                    </Grid.ColumnDefinitions>
+                                    <materialDesign:PackIcon Kind="{Binding LayerElementDescriptor.Icon}" Width="20" Height="20" VerticalAlignment="Center" />
+                                    <StackPanel Margin="8 0 0 0" Grid.Column="1">
+                                        <TextBlock FontWeight="Bold" Text="{Binding LayerElementDescriptor.DisplayName}" />
+                                        <TextBlock Text="{Binding LayerElementDescriptor.Description}" />
+                                    </StackPanel>
+                                </Grid>
+                            </Border>
+                        </DataTemplate>
+                    </ListBox.ItemTemplate>
+                </ListBox>
+                <StackPanel VerticalAlignment="Bottom" Grid.Column="1" Orientation="Vertical" Margin="8">
+                    <Button Style="{StaticResource MaterialDesignToolButton}"
+                            Width="30"
+                            Padding="2 0 2 0"
+                            materialDesign:RippleAssist.IsCentered="True"
+                            ToolTip="Add a new layer element"
+                            Command="{s:Action AddLayerElement}">
+                        <materialDesign:PackIcon Kind="LibraryAdd" />
+                    </Button>
+                    <Button Style="{StaticResource MaterialDesignToolButton}"
+                            Width="30"
+                            Padding="2 0 2 0"
+                            materialDesign:RippleAssist.IsCentered="True"
+                            ToolTip="Delete selected layer element"
+                            Command="{s:Action DeleteSelectedLayerElement}">
+                        <materialDesign:PackIcon Kind="Delete" />
+                    </Button>
+                </StackPanel>
+            </Grid>
+        </Grid>
+    </materialDesign:DialogHost>
+
 </UserControl>

src/Artemis.UI/Screens/Module/ProfileEditor/LayerElements/LayerElementsViewModel.cs

@@ -1,6 +1,95 @@
-namespace Artemis.UI.Screens.Module.ProfileEditor.LayerElements
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using Artemis.Core.Models.Profile;
+using Artemis.Core.Models.Profile.Abstract;
+using Artemis.Core.Plugins.LayerElement;
+using Artemis.UI.Screens.Module.ProfileEditor.LayerElements.Dialogs;
+using Artemis.UI.Services.Interfaces;
+using Stylet;
+
+namespace Artemis.UI.Screens.Module.ProfileEditor.LayerElements
 {
     public class LayerElementsViewModel : ProfileEditorPanelViewModel
     {
+        private readonly IDialogService _dialogService;
+        private readonly IProfileEditorService _profileEditorService;
+        private LayerElementViewModel _selectedLayerElement;
+
+        public LayerElementsViewModel(IProfileEditorService profileEditorService, IDialogService dialogService)
+        {
+            _profileEditorService = profileEditorService;
+            _dialogService = dialogService;
+
+            LayerElements = new BindableCollection<LayerElementViewModel>();
+            SelectedProfileElement = _profileEditorService.SelectedProfileElement;
+            PopulateLayerElements();
+
+            _profileEditorService.SelectedProfileElementChanged += OnSelectedProfileElementChanged;
+            _profileEditorService.SelectedLayerElementChanged += OnSelectedLayerElementChanged;
+        }
+
+        public ProfileElement SelectedProfileElement { get; private set; }
+        public BindableCollection<LayerElementViewModel> LayerElements { get; set; }
+
+        public LayerElementViewModel SelectedLayerElement
+        {
+            get => _selectedLayerElement;
+            set
+            {
+                _selectedLayerElement = value;
+                _profileEditorService.ChangeSelectedLayerElement(value?.LayerElement);
+            }
+        }
+
+        public bool CanAddLayerElement => SelectedProfileElement is Layer;
+        public bool CanDeleteSelectedLayerElement => SelectedLayerElement != null;
+
+        private void OnSelectedLayerElementChanged(object sender, EventArgs e)
+        {
+            _selectedLayerElement = LayerElements.FirstOrDefault(l => l.LayerElement == _profileEditorService.SelectedLayerElement);
+            NotifyOfPropertyChange(() => SelectedLayerElement);
+        }
+
+        private void OnSelectedProfileElementChanged(object sender, EventArgs e)
+        {
+            SelectedProfileElement = _profileEditorService.SelectedProfileElement;
+            PopulateLayerElements();
+        }
+
+        private void PopulateLayerElements()
+        {
+            LayerElements.Clear();
+            if (SelectedProfileElement is Layer layer)
+            {
+                foreach (var layerElement in layer.LayerElements)
+                    LayerElements.Add(new LayerElementViewModel(layerElement));
+            }
+        }
+
+        public async void AddLayerElement()
+        {
+            var result = await _dialogService.ShowDialogAt<AddLayerElementViewModel>(
+                "LayerElementsDialogHost",
+                new Dictionary<string, object> {{"layer", (Layer) SelectedProfileElement}}
+            );
+
+            if (result is LayerElement layerElement)
+                LayerElements.Add(new LayerElementViewModel(layerElement));
+        }
+
+        public async void DeleteSelectedLayerElement()
+        {
+            if (SelectedLayerElement == null)
+                return;
+
+            var result = await _dialogService.ShowConfirmDialogAt(
+                "LayerElementsDialogHost",
+                "Delete layer element",
+                "Are you sure you want to delete the selected layer element?"
+            );
+            if (!result)
+                return;
+        }
     }
 }

src/Artemis.UI/Screens/Module/ProfileEditor/ProfileEditorViewModel.cs

@@ -8,7 +8,6 @@ using Artemis.Core.Plugins.Abstract;
 using Artemis.Core.Plugins.Models;
 using Artemis.Core.Services;
 using Artemis.Core.Services.Storage.Interfaces;
-using Artemis.UI.Events;
 using Artemis.UI.Screens.Module.ProfileEditor.Dialogs;
 using Artemis.UI.Screens.Module.ProfileEditor.DisplayConditions;
 using Artemis.UI.Screens.Module.ProfileEditor.ElementProperties;
@@ -29,8 +28,8 @@ namespace Artemis.UI.Screens.Module.ProfileEditor
         public ProfileEditorViewModel(ProfileModule module,
             ICollection<ProfileEditorPanelViewModel> viewModels,
             IProfileEditorService profileEditorService,
-            IProfileService profileService, 
-            IDialogService dialogService, 
+            IProfileService profileService,
+            IDialogService dialogService,
             ISettingsService settingsService)
         {
             _profileEditorService = profileEditorService;
@@ -81,8 +80,8 @@ namespace Artemis.UI.Screens.Module.ProfileEditor
                 return;
 
             var oldProfile = Module.ActiveProfile;
-            Module.ChangeActiveProfile(profile);
-            
+            _profileService.ActivateProfile(Module, profile);
+
             if (oldProfile != null)
                 _profileService.UpdateProfile(oldProfile, false);
             if (profile != null)
@@ -186,7 +185,7 @@ namespace Artemis.UI.Screens.Module.ProfileEditor
             _profileEditorService.ChangeSelectedProfile(SelectedProfile);
 
             if (!activeProfile.IsActivated)
-                Module.ChangeActiveProfile(activeProfile);
+                _profileService.ActivateProfile(Module, activeProfile);
         }
     }
 }

src/Artemis.UI/Screens/Module/ProfileEditor/ProfileTree/ProfileTreeView.xaml

@@ -25,7 +25,7 @@
             </TextBlock>
             <Separator Style="{StaticResource MaterialDesignDarkSeparator}" Margin="8 0" />
         </StackPanel>
-        
+
         <TreeView Grid.Row="1"
                   ItemsSource="{Binding RootFolder.Children}"
                   HorizontalContentAlignment="Stretch"

src/Artemis.UI/Screens/Module/ProfileEditor/ProfileTree/ProfileTreeViewModel.cs

@@ -132,10 +132,10 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.ProfileTree
 
         private void OnSelectedElementChanged(object sender, EventArgs e)
         {
-            var vms = RootFolder.GetAllChildren();
+            var vms = RootFolder?.GetAllChildren();
 
             // Don't set it using the setter or that will trigger the event again
-            _selectedTreeItem = vms.FirstOrDefault(vm => vm.ProfileElement == _profileEditorService.SelectedProfileElement);
+            _selectedTreeItem = vms?.FirstOrDefault(vm => vm.ProfileElement == _profileEditorService.SelectedProfileElement);
             NotifyOfPropertyChange(() => SelectedTreeItem);
         }
 

src/Artemis.UI/Screens/Module/ProfileEditor/ProfileTree/TreeItem/FolderView.xaml

@@ -37,9 +37,11 @@
             </ContextMenu>
         </StackPanel.ContextMenu>
         <StackPanel Orientation="Horizontal" Margin="10">
-            <materialDesign:PackIcon Kind="Folder" Visibility="{Binding IsExpanded, Converter={x:Static s:BoolToVisibilityConverter.InverseInstance}, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type TreeViewItem}}}"/>
-            <materialDesign:PackIcon Kind="FolderOpen" Visibility="{Binding IsExpanded, Converter={x:Static s:BoolToVisibilityConverter.Instance}, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type TreeViewItem}}}"/>
-            
+            <materialDesign:PackIcon Kind="Folder"
+                                     Visibility="{Binding IsExpanded, Converter={x:Static s:BoolToVisibilityConverter.InverseInstance}, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type TreeViewItem}}}" />
+            <materialDesign:PackIcon Kind="FolderOpen"
+                                     Visibility="{Binding IsExpanded, Converter={x:Static s:BoolToVisibilityConverter.Instance}, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type TreeViewItem}}}" />
+
             <TextBlock Text="{Binding ProfileElement.Name}" Margin="10 0 0 0" />
         </StackPanel>
     </StackPanel>

src/Artemis.UI/Screens/Module/ProfileEditor/Visualization/ProfileLedViewModel.cs

@@ -38,7 +38,6 @@ namespace Artemis.UI.Screens.Module.ProfileEditor.Visualization
         public Geometry StrokeGeometry { get; private set; }
         public Color DisplayColor { get; private set; }
 
-
         private void CreateLedGeometry()
         {
             switch (Led.RgbLed.Shape)

src/Artemis.UI/Screens/RootViewModel.cs

@@ -1,7 +1,5 @@
-using System;
-using System.Collections.Generic;
+using System.Collections.Generic;
 using System.ComponentModel;
-using System.Diagnostics;
 using System.Linq;
 using System.Threading.Tasks;
 using System.Windows;
@@ -15,7 +13,6 @@ using Artemis.UI.Screens.News;
 using Artemis.UI.Screens.Settings;
 using Artemis.UI.Screens.SurfaceEditor;
 using Artemis.UI.Screens.Workshop;
-using MahApps.Metro.Controls;
 using Stylet;
 
 namespace Artemis.UI.Screens
@@ -23,8 +20,8 @@ namespace Artemis.UI.Screens
     public class RootViewModel : Conductor<IScreen>
     {
         private readonly ICollection<IScreenViewModel> _artemisViewModels;
-        private readonly IModuleViewModelFactory _moduleViewModelFactory;
         private readonly IEventAggregator _eventAggregator;
+        private readonly IModuleViewModelFactory _moduleViewModelFactory;
         private readonly IPluginService _pluginService;
         private bool _lostFocus;
 

src/Artemis.UI/Screens/SurfaceEditor/SurfaceEditorViewModel.cs

@@ -332,7 +332,7 @@ namespace Artemis.UI.Screens.SurfaceEditor
         {
             if (IsPanKeyDown())
                 return;
-            
+
             var selectedRect = new Rect(_mouseDragStartPoint, position);
             SelectionRectangle.Rect = selectedRect;
 

src/Artemis.UI/Screens/Workshop/WorkshopView.xaml

@@ -4,6 +4,7 @@
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:local="clr-namespace:Artemis.UI.Screens.Workshop"
+             xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
              mc:Ignorable="d"
              d:DesignHeight="450" d:DesignWidth="800">
     <Grid>

src/Artemis.UI/Services/Dialog/DialogService.cs

@@ -29,8 +29,8 @@ namespace Artemis.UI.Services.Dialog
             {
                 new ConstructorArgument("header", header),
                 new ConstructorArgument("text", text),
-                new ConstructorArgument("confirmText", confirmText),
-                new ConstructorArgument("cancelText", cancelText)
+                new ConstructorArgument("confirmText", confirmText.ToUpper()),
+                new ConstructorArgument("cancelText", cancelText.ToUpper())
             };
             var result = await ShowDialog<ConfirmDialogViewModel>(arguments);
             return (bool) result;
@@ -42,8 +42,8 @@ namespace Artemis.UI.Services.Dialog
             {
                 new ConstructorArgument("header", header),
                 new ConstructorArgument("text", text),
-                new ConstructorArgument("confirmText", confirmText),
-                new ConstructorArgument("cancelText", cancelText)
+                new ConstructorArgument("confirmText", confirmText.ToUpper()),
+                new ConstructorArgument("cancelText", cancelText.ToUpper())
             };
             var result = await ShowDialogAt<ConfirmDialogViewModel>(identifier, arguments);
             return (bool) result;

src/Artemis.UI/Services/Interfaces/IProfileEditorService.cs

@@ -1,6 +1,7 @@
 using System;
 using Artemis.Core.Models.Profile;
 using Artemis.Core.Models.Profile.Abstract;
+using Artemis.Core.Plugins.LayerElement;
 
 namespace Artemis.UI.Services.Interfaces
 {
@@ -8,15 +9,18 @@ namespace Artemis.UI.Services.Interfaces
     {
         Profile SelectedProfile { get; }
         ProfileElement SelectedProfileElement { get; }
+        LayerElement SelectedLayerElement { get; }
 
         void ChangeSelectedProfile(Profile profile);
         void UpdateSelectedProfile();
         void ChangeSelectedProfileElement(ProfileElement profileElement);
         void UpdateSelectedProfileElement();
+        void ChangeSelectedLayerElement(LayerElement layerElement);
 
         event EventHandler SelectedProfileChanged;
         event EventHandler SelectedProfileUpdated;
         event EventHandler SelectedProfileElementChanged;
         event EventHandler SelectedProfileElementUpdated;
+        event EventHandler SelectedLayerElementChanged;
     }
 }

src/Artemis.UI/Services/ProfileEditorService.cs

@@ -1,6 +1,7 @@
 using System;
 using Artemis.Core.Models.Profile;
 using Artemis.Core.Models.Profile.Abstract;
+using Artemis.Core.Plugins.LayerElement;
 using Artemis.Core.Services.Storage.Interfaces;
 using Artemis.UI.Services.Interfaces;
 
@@ -17,6 +18,7 @@ namespace Artemis.UI.Services
 
         public Profile SelectedProfile { get; private set; }
         public ProfileElement SelectedProfileElement { get; private set; }
+        public LayerElement SelectedLayerElement { get; private set; }
 
         public void ChangeSelectedProfile(Profile profile)
         {
@@ -42,10 +44,17 @@ namespace Artemis.UI.Services
             OnSelectedProfileElementUpdated();
         }
 
+        public void ChangeSelectedLayerElement(LayerElement layerElement)
+        {
+            SelectedLayerElement = layerElement;
+            OnSelectedLayerElementChanged();
+        }
+
         public event EventHandler SelectedProfileChanged;
         public event EventHandler SelectedProfileUpdated;
         public event EventHandler SelectedProfileElementChanged;
         public event EventHandler SelectedProfileElementUpdated;
+        public event EventHandler SelectedLayerElementChanged;
 
         protected virtual void OnSelectedProfileElementUpdated()
         {
@@ -66,5 +75,10 @@ namespace Artemis.UI.Services
         {
             SelectedProfileChanged?.Invoke(this, EventArgs.Empty);
         }
+
+        protected virtual void OnSelectedLayerElementChanged()
+        {
+            SelectedLayerElementChanged?.Invoke(this, EventArgs.Empty);
+        }
     }
 }

src/Artemis.UI/packages.config

@@ -1,4 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
+
 <packages>
   <package id="Castle.Core" version="4.4.0" targetFramework="net461" />
   <package id="ControlzEx" version="3.0.2.4" targetFramework="net472" />