Started layout editor implementation

Rearranged VMs/Views
Updated RGB.NET

src/Artemis.UI/Artemis.UI.csproj

@@ -99,20 +99,44 @@
     <Reference Include="PropertyChanged, Version=2.6.1.0, Culture=neutral, PublicKeyToken=ee3ee20bcf148ddd, processorArchitecture=MSIL">
       <HintPath>..\packages\PropertyChanged.Fody.2.6.1\lib\net452\PropertyChanged.dll</HintPath>
     </Reference>
-    <Reference Include="RGB.NET.Brushes, Version=0.1.22.0, Culture=neutral, processorArchitecture=MSIL">
-      <HintPath>..\packages\RGB.NET.Brushes.0.1.22\lib\net45\RGB.NET.Brushes.dll</HintPath>
+    <Reference Include="RGB.NET.Brushes, Version=0.1.25.0, Culture=neutral, processorArchitecture=MSIL">
+      <HintPath>..\packages\RGB.NET.Brushes.0.1.25\lib\net45\RGB.NET.Brushes.dll</HintPath>
     </Reference>
-    <Reference Include="RGB.NET.Core, Version=0.1.22.0, Culture=neutral, processorArchitecture=MSIL">
-      <HintPath>..\packages\RGB.NET.Core.0.1.22\lib\net45\RGB.NET.Core.dll</HintPath>
+    <Reference Include="RGB.NET.Core, Version=0.1.25.0, Culture=neutral, processorArchitecture=MSIL">
+      <HintPath>..\packages\RGB.NET.Core.0.1.25\lib\net45\RGB.NET.Core.dll</HintPath>
     </Reference>
-    <Reference Include="RGB.NET.Decorators, Version=0.1.22.0, Culture=neutral, processorArchitecture=MSIL">
-      <HintPath>..\packages\RGB.NET.Decorators.0.1.22\lib\net45\RGB.NET.Decorators.dll</HintPath>
+    <Reference Include="RGB.NET.Decorators, Version=0.1.25.0, Culture=neutral, processorArchitecture=MSIL">
+      <HintPath>..\packages\RGB.NET.Decorators.0.1.25\lib\net45\RGB.NET.Decorators.dll</HintPath>
     </Reference>
-    <Reference Include="RGB.NET.Devices.Corsair, Version=0.1.22.0, Culture=neutral, processorArchitecture=MSIL">
-      <HintPath>..\packages\RGB.NET.Devices.Corsair.0.1.22\lib\net45\RGB.NET.Devices.Corsair.dll</HintPath>
+    <Reference Include="RGB.NET.Devices.Corsair, Version=0.1.25.0, Culture=neutral, processorArchitecture=MSIL">
+      <HintPath>..\packages\RGB.NET.Devices.Corsair.0.1.25\lib\net45\RGB.NET.Devices.Corsair.dll</HintPath>
     </Reference>
-    <Reference Include="RGB.NET.Groups, Version=0.1.22.0, Culture=neutral, processorArchitecture=MSIL">
-      <HintPath>..\packages\RGB.NET.Groups.0.1.22\lib\net45\RGB.NET.Groups.dll</HintPath>
+    <Reference Include="RGB.NET.Groups, Version=0.1.25.0, Culture=neutral, processorArchitecture=MSIL">
+      <HintPath>..\packages\RGB.NET.Groups.0.1.25\lib\net45\RGB.NET.Groups.dll</HintPath>
+    </Reference>
+    <Reference Include="SharpVectors.Converters.Wpf, Version=1.3.0.0, Culture=neutral, PublicKeyToken=b532964b8548be77, processorArchitecture=MSIL">
+      <HintPath>..\packages\SharpVectors.Reloaded.1.3.0\lib\net40\SharpVectors.Converters.Wpf.dll</HintPath>
+    </Reference>
+    <Reference Include="SharpVectors.Core, Version=1.3.0.0, Culture=neutral, PublicKeyToken=7407205e337c98ef, processorArchitecture=MSIL">
+      <HintPath>..\packages\SharpVectors.Reloaded.1.3.0\lib\net40\SharpVectors.Core.dll</HintPath>
+    </Reference>
+    <Reference Include="SharpVectors.Css, Version=1.3.0.0, Culture=neutral, PublicKeyToken=7a46e3f532fdb787, processorArchitecture=MSIL">
+      <HintPath>..\packages\SharpVectors.Reloaded.1.3.0\lib\net40\SharpVectors.Css.dll</HintPath>
+    </Reference>
+    <Reference Include="SharpVectors.Dom, Version=1.3.0.0, Culture=neutral, PublicKeyToken=517340b6277b1a7a, processorArchitecture=MSIL">
+      <HintPath>..\packages\SharpVectors.Reloaded.1.3.0\lib\net40\SharpVectors.Dom.dll</HintPath>
+    </Reference>
+    <Reference Include="SharpVectors.Model, Version=1.3.0.0, Culture=neutral, PublicKeyToken=2236cfc76b505845, processorArchitecture=MSIL">
+      <HintPath>..\packages\SharpVectors.Reloaded.1.3.0\lib\net40\SharpVectors.Model.dll</HintPath>
+    </Reference>
+    <Reference Include="SharpVectors.Rendering.Gdi, Version=1.3.0.0, Culture=neutral, PublicKeyToken=03902092284347e3, processorArchitecture=MSIL">
+      <HintPath>..\packages\SharpVectors.Reloaded.1.3.0\lib\net40\SharpVectors.Rendering.Gdi.dll</HintPath>
+    </Reference>
+    <Reference Include="SharpVectors.Rendering.Wpf, Version=1.3.0.0, Culture=neutral, PublicKeyToken=d0902381100df30e, processorArchitecture=MSIL">
+      <HintPath>..\packages\SharpVectors.Reloaded.1.3.0\lib\net40\SharpVectors.Rendering.Wpf.dll</HintPath>
+    </Reference>
+    <Reference Include="SharpVectors.Runtime.Wpf, Version=1.3.0.0, Culture=neutral, PublicKeyToken=d16e717f0a981fb9, processorArchitecture=MSIL">
+      <HintPath>..\packages\SharpVectors.Reloaded.1.3.0\lib\net40\SharpVectors.Runtime.Wpf.dll</HintPath>
     </Reference>
     <Reference Include="SQLitePCLRaw.batteries_green, Version=1.1.12.351, Culture=neutral, PublicKeyToken=a84b7dcfb1391f7f, processorArchitecture=MSIL">
       <HintPath>..\packages\SQLitePCLRaw.bundle_green.1.1.12\lib\net45\SQLitePCLRaw.batteries_green.dll</HintPath>
@@ -162,17 +186,22 @@
     <Compile Include="Services\Interfaces\IArtemisUIService.cs" />
     <Compile Include="Stylet\ArtemisViewManager.cs" />
     <Compile Include="Stylet\NinjectBootstrapper.cs" />
-    <Compile Include="ViewModels\Settings\DeviceSettingsViewModel.cs" />
+    <Compile Include="ViewModels\Screens\EditorViewModel.cs" />
+    <Compile Include="ViewModels\Interfaces\IEditorViewModel.cs" />
+    <Compile Include="ViewModels\Controls\RgbDevice\RgbDeviceViewModel.cs" />
+    <Compile Include="ViewModels\Controls\RgbDevice\RgbLedViewModel.cs" />
+    <Compile Include="ViewModels\Controls\Settings\RgbDeviceSettingsViewModel.cs" />
     <Compile Include="ViewModels\Interfaces\IHomeViewModel.cs" />
-    <Compile Include="ViewModels\Interfaces\IArtemisViewModel.cs" />
-    <Compile Include="ViewModels\HomeViewModel.cs" />
+    <Compile Include="ViewModels\Interfaces\IScreenViewModel.cs" />
+    <Compile Include="ViewModels\Screens\HomeViewModel.cs" />
     <Compile Include="ViewModels\Interfaces\ISettingsViewModel.cs" />
-    <Compile Include="ViewModels\RootViewModel.cs" />
+    <Compile Include="ViewModels\Screens\RootViewModel.cs" />
     <Compile Include="App.xaml.cs">
       <DependentUpon>App.xaml</DependentUpon>
       <SubType>Code</SubType>
     </Compile>
-    <Compile Include="ViewModels\Settings\SettingsViewModel.cs" />
+    <Compile Include="ViewModels\Screens\SettingsViewModel.cs" />
+    <Compile Include="ViewModels\Controls\Editor\SurfaceEditorViewModel.cs" />
     <Page Include="Styles\Visualizers\LedVisualizer.xaml">
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
@@ -185,19 +214,35 @@
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </Page>
-    <Page Include="Views\HomeView.xaml">
+    <Page Include="Views\Screens\HomeView.xaml">
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </Page>
-    <Page Include="Views\RootView.xaml">
+    <Page Include="Views\Controls\RgbDevice\RgbDeviceView.xaml">
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </Page>
-    <Page Include="Views\Settings\DeviceSettingsView.xaml">
+    <Page Include="Views\Controls\RgbDevice\RgbLedView.xaml">
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </Page>
-    <Page Include="Views\Settings\SettingsView.xaml">
+    <Page Include="Views\Screens\RootView.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
+    <Page Include="Views\Screens\EditorView.xaml">
+      <Generator>MSBuild:Compile</Generator>
+      <SubType>Designer</SubType>
+    </Page>
+    <Page Include="Views\Controls\Settings\RgbDeviceSettingsView.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
+    <Page Include="Views\Screens\SettingsView.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
+    <Page Include="Views\Controls\Editor\SurfaceEditorView.xaml">
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </Page>

src/Artemis.UI/Bootstrapper.cs

@@ -4,6 +4,7 @@ using Artemis.Core.Services.Interfaces;
 using Artemis.UI.Ninject;
 using Artemis.UI.Stylet;
 using Artemis.UI.ViewModels;
+using Artemis.UI.ViewModels.Screens;
 using Ninject;
 
 namespace Artemis.UI

src/Artemis.UI/Ninject/UiModule.cs

@@ -15,7 +15,7 @@ namespace Artemis.UI.Ninject
             {
                 x.FromThisAssembly()
                     .SelectAllClasses()
-                    .InheritedFrom<IArtemisViewModel>()
+                    .InheritedFrom<IScreenViewModel>()
                     .BindAllInterfaces();
             });
 

src/Artemis.UI/ViewModels/Controls/Editor/SurfaceEditorViewModel.cs

@@ -0,0 +1,43 @@
+using System.Collections.ObjectModel;
+using System.Linq;
+using Artemis.Core.Events;
+using Artemis.Core.Services.Interfaces;
+using Artemis.UI.ViewModels.Controls.RgbDevice;
+using RGB.NET.Core;
+
+namespace Artemis.UI.ViewModels.Controls.Editor
+{
+    public class SurfaceEditorViewModel
+    {
+        private readonly IRgbService _rgbService;
+
+        public SurfaceEditorViewModel(IRgbService rgbService)
+        {
+            Devices = new ObservableCollection<RgbDeviceViewModel>();
+
+            _rgbService = rgbService;
+            _rgbService.DeviceLoaded += RgbServiceOnDeviceLoaded;
+            _rgbService.Surface.Updated += SurfaceOnUpdated;
+
+            foreach (var surfaceDevice in _rgbService.Surface.Devices)
+                Devices.Add(new RgbDeviceViewModel(surfaceDevice));
+        }
+
+
+        public ObservableCollection<RgbDeviceViewModel> Devices { get; set; }
+
+        private void RgbServiceOnDeviceLoaded(object sender, DeviceEventArgs e)
+        {
+            if (Devices.All(d => d.Device != e.Device))
+                Devices.Add(new RgbDeviceViewModel(e.Device));
+        }
+
+        private void SurfaceOnUpdated(UpdatedEventArgs args)
+        {
+            foreach (var rgbDeviceViewModel in Devices)
+            {
+                rgbDeviceViewModel.Update();
+            }
+        }
+    }
+}

src/Artemis.UI/ViewModels/Controls/RgbDevice/RgbDeviceViewModel.cs

@@ -0,0 +1,28 @@
+using System.Collections.Generic;
+using RGB.NET.Core;
+
+namespace Artemis.UI.ViewModels.Controls.RgbDevice
+{
+    public class RgbDeviceViewModel
+    {
+        private readonly List<RgbLedViewModel> _leds;
+
+        public RgbDeviceViewModel(IRGBDevice device)
+        {
+            Device = device;
+            _leds = new List<RgbLedViewModel>();
+
+            foreach (var led in Device)
+                _leds.Add(new RgbLedViewModel(led));
+        }
+
+        public IRGBDevice Device { get; }
+        public IReadOnlyCollection<RgbLedViewModel> Leds => _leds.AsReadOnly();
+
+        public void Update()
+        {
+            foreach (var rgbLedViewModel in _leds)
+                rgbLedViewModel.Update();
+        }
+    }
+}

src/Artemis.UI/ViewModels/Controls/RgbDevice/RgbLedViewModel.cs

@@ -0,0 +1,96 @@
+using System;
+using System.Windows;
+using System.Windows.Media;
+using RGB.NET.Core;
+using SharpVectors.Converters;
+using SharpVectors.Renderers.Wpf;
+using Stylet;
+using Color = System.Windows.Media.Color;
+
+namespace Artemis.UI.ViewModels.Controls.RgbDevice
+{
+    public class RgbLedViewModel : PropertyChangedBase
+    {
+        public RgbLedViewModel(Led led)
+        {
+            Led = led;
+
+            Execute.OnUIThread(CreateLedGeometry);
+            Update();
+        }
+
+        public Led Led { get; }
+
+        public double X { get; private set; }
+
+        public double Y { get; private set; }
+
+        public double Width { get; private set; }
+
+        public double Height { get; private set; }
+
+        public Color FillColor { get; set; }
+
+        public DrawingImage DisplayDrawing { get; private set; }
+
+        public string Tooltip => $"{Led.Id} - {Led.LedRectangle}";
+
+        private void CreateLedGeometry()
+        {
+            // Prepare the SVG for this LED
+            var converter = new FileSvgReader(new WpfDrawingSettings {OptimizePath = true});
+            if (Led.Image != null)
+            {
+                DisplayDrawing = new DrawingImage(converter.Read(Led.Image));
+            }
+            else
+            {
+                var relativeRectangle = new Rect(0, 0, Led.LedRectangle.Width, Led.LedRectangle.Height);
+                Geometry geometry;
+                switch (Led.Shape)
+                {
+                    case Shape.Custom:
+                        geometry = Geometry.Parse(Led.ShapeData);
+                        break;
+                    case Shape.Rectangle:
+                        geometry = new RectangleGeometry(relativeRectangle, 2, 2);
+                        break;
+                    case Shape.Circle:
+                        geometry = new EllipseGeometry(relativeRectangle);
+                        break;
+                    default:
+                        throw new ArgumentOutOfRangeException();
+                }
+
+                var drawing = new GeometryDrawing(null, new Pen(null, 2), geometry);
+                DisplayDrawing = new DrawingImage(drawing);
+            }
+
+            NotifyOfPropertyChange(() => DisplayDrawing);
+        }
+
+        public void Update()
+        {
+            FillColor = Color.FromRgb((byte) Math.Round(255 * Led.Color.R), (byte) Math.Round(255 * Led.Color.G), (byte) Math.Round(255 * Led.Color.B));
+            X = Led.LedRectangle.X;
+            Y = Led.LedRectangle.Y;
+            Width = Led.LedRectangle.Width;
+            Height = Led.LedRectangle.Height;
+
+            if (DisplayDrawing != null)
+            {
+                Execute.OnUIThread(() =>
+                {
+                    if (DisplayDrawing.Drawing is GeometryDrawing geometryDrawing)
+                    {
+                        geometryDrawing.Brush = new SolidColorBrush(FillColor) {Opacity = 0.6};
+                        geometryDrawing.Pen.Brush = new SolidColorBrush(FillColor);
+                    }
+                    else if (DisplayDrawing.Drawing is DrawingGroup drawingGroup)
+                        drawingGroup.OpacityMask = new SolidColorBrush(FillColor);
+                });
+                NotifyOfPropertyChange(() => DisplayDrawing);
+            }
+        }
+    }
+}

src/Artemis.UI/ViewModels/Controls/Settings/RgbDeviceSettingsViewModel.cs

@@ -0,0 +1,25 @@
+using Humanizer;
+using RGB.NET.Core;
+
+namespace Artemis.UI.ViewModels.Controls.Settings
+{
+    public class RgbDeviceSettingsViewModel
+    {
+        public IRGBDevice Device { get; }
+
+        public RgbDeviceSettingsViewModel(IRGBDevice device)
+        {
+            Device = device;
+
+            Type = Device.DeviceInfo.DeviceType.ToString().Humanize();
+            Name = Device.DeviceInfo.Model;
+            Manufacturer = Device.DeviceInfo.Manufacturer;
+            Enabled = true;
+        }
+
+        public string Type { get; set; }
+        public string Name { get; set; }
+        public string Manufacturer { get; set; }
+        public bool Enabled { get; set; }
+    }
+}

src/Artemis.UI/ViewModels/Interfaces/IEditorViewModel.cs

@@ -0,0 +1,7 @@
+namespace Artemis.UI.ViewModels.Interfaces
+{
+    public interface IEditorViewModel : IScreenViewModel
+    {
+        
+    }
+}

src/Artemis.UI/ViewModels/Interfaces/IHomeViewModel.cs

@@ -1,6 +1,6 @@
 namespace Artemis.UI.ViewModels.Interfaces
 {
-    public interface IHomeViewModel : IArtemisViewModel
+    public interface IHomeViewModel : IScreenViewModel
     {
         void OpenUrl(string url);
     }

src/Artemis.UI/ViewModels/Interfaces/IScreenViewModel.cs

@@ -2,7 +2,7 @@
 
 namespace Artemis.UI.ViewModels.Interfaces
 {
-    public interface IArtemisViewModel : IScreen
+    public interface IScreenViewModel : IScreen
     {
         string Title { get; }
     }

src/Artemis.UI/ViewModels/Interfaces/ISettingsViewModel.cs

@@ -1,6 +1,6 @@
 namespace Artemis.UI.ViewModels.Interfaces
 {
-    public interface ISettingsViewModel : IArtemisViewModel
+    public interface ISettingsViewModel : IScreenViewModel
     {
     }
 }

src/Artemis.UI/ViewModels/Screens/EditorViewModel.cs

@@ -0,0 +1,18 @@
+using Artemis.Core.Services.Interfaces;
+using Artemis.UI.ViewModels.Controls.Editor;
+using Artemis.UI.ViewModels.Interfaces;
+using Stylet;
+
+namespace Artemis.UI.ViewModels.Screens
+{
+    public class EditorViewModel : Screen, IEditorViewModel
+    {
+        public EditorViewModel(IRgbService rgbService)
+        {
+            SurfaceEditorViewModel = new SurfaceEditorViewModel(rgbService);
+        }
+
+        public SurfaceEditorViewModel SurfaceEditorViewModel { get; set; }
+        public string Title => "Editor";
+    }
+}

src/Artemis.UI/ViewModels/Screens/HomeViewModel.cs

@@ -3,7 +3,7 @@ using System.Diagnostics;
 using Artemis.UI.ViewModels.Interfaces;
 using Stylet;
 
-namespace Artemis.UI.ViewModels
+namespace Artemis.UI.ViewModels.Screens
 {
     public class HomeViewModel : Screen, IHomeViewModel
     {

src/Artemis.UI/ViewModels/Screens/RootViewModel.cs

@@ -5,20 +5,18 @@ using System.Threading.Tasks;
 using System.Windows.Controls;
 using Artemis.Core.Events;
 using Artemis.Core.Plugins.Abstract;
-using Artemis.Core.Plugins.Interfaces;
 using Artemis.Core.Services.Interfaces;
 using Artemis.UI.ViewModels.Interfaces;
-using Artemis.UI.ViewModels.Settings;
 using Stylet;
 
-namespace Artemis.UI.ViewModels
+namespace Artemis.UI.ViewModels.Screens
 {
     public class RootViewModel : Conductor<IScreen>.Collection.OneActive
     {
-        private readonly ICollection<IArtemisViewModel> _artemisViewModels;
+        private readonly ICollection<IScreenViewModel> _artemisViewModels;
         private readonly IPluginService _pluginService;
 
-        public RootViewModel(ICollection<IArtemisViewModel> artemisViewModels, IPluginService pluginService)
+        public RootViewModel(ICollection<IScreenViewModel> artemisViewModels, IPluginService pluginService)
         {
             _artemisViewModels = artemisViewModels;
             _pluginService = pluginService;
@@ -104,6 +102,9 @@ namespace Artemis.UI.ViewModels
                 case "Workshop":
                     // ActivateItem(_artemisViewModels.First(v => v.GetType() == typeof(WorkshopViewModel)));
                     break;
+                case "Editor":
+                    ActivateItem(_artemisViewModels.First(v => v.GetType() == typeof(EditorViewModel)));
+                    break;
                 case "Settings":
                     ActivateItem(_artemisViewModels.First(v => v.GetType() == typeof(SettingsViewModel)));
                     break;

src/Artemis.UI/ViewModels/Screens/SettingsViewModel.cs

@@ -1,28 +1,28 @@
-using System.Collections.Generic;
-using Artemis.Core.Events;
+using Artemis.Core.Events;
 using Artemis.Core.Services.Interfaces;
+using Artemis.UI.ViewModels.Controls.Settings;
 using Artemis.UI.ViewModels.Interfaces;
 using Stylet;
 
-namespace Artemis.UI.ViewModels.Settings
+namespace Artemis.UI.ViewModels.Screens
 {
     public class SettingsViewModel : Screen, ISettingsViewModel
     {
         public SettingsViewModel(IRgbService rgbService)
         {
-            DeviceSettingsViewModels = new List<DeviceSettingsViewModel>();
+            DeviceSettingsViewModels = new BindableCollection<RgbDeviceSettingsViewModel>();
             foreach (var device in rgbService.Surface.Devices)
-                DeviceSettingsViewModels.Add(new DeviceSettingsViewModel(device));
+                DeviceSettingsViewModels.Add(new RgbDeviceSettingsViewModel(device));
 
             rgbService.DeviceLoaded += UpdateDevices;
         }
 
-        public List<DeviceSettingsViewModel> DeviceSettingsViewModels { get; set; }
+        public BindableCollection<RgbDeviceSettingsViewModel> DeviceSettingsViewModels { get; set; }
         public string Title => "Settings";
 
         private void UpdateDevices(object sender, DeviceEventArgs deviceEventArgs)
         {
-            DeviceSettingsViewModels.Add(new DeviceSettingsViewModel(deviceEventArgs.Device));
+            DeviceSettingsViewModels.Add(new RgbDeviceSettingsViewModel(deviceEventArgs.Device));
         }
     }
 }

src/Artemis.UI/ViewModels/Settings/DeviceSettingsViewModel.cs

@@ -1,25 +0,0 @@
-using Humanizer;
-using RGB.NET.Core;
-
-namespace Artemis.UI.ViewModels.Settings
-{
-    public class DeviceSettingsViewModel
-    {
-        private readonly IRGBDevice _device;
-
-        public DeviceSettingsViewModel(IRGBDevice device)
-        {
-            _device = device;
-
-            Type = _device.DeviceInfo.DeviceType.ToString().Humanize();
-            Name = _device.DeviceInfo.Model;
-            Manufacturer = _device.DeviceInfo.Manufacturer;
-            Enabled = true;
-        }
-
-        public string Type { get; set; }
-        public string Name { get; set; }
-        public string Manufacturer { get; set; }
-        public bool Enabled { get; set; }
-    }
-}

src/Artemis.UI/Views/Controls/Editor/SurfaceEditorView.xaml

@@ -0,0 +1,33 @@
+<UserControl x:Class="Artemis.UI.Views.Controls.Editor.SurfaceEditorView"
+             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:editor="clr-namespace:Artemis.UI.ViewModels.Controls.Editor"
+             xmlns:xaml="https://github.com/canton7/Stylet"
+             mc:Ignorable="d"
+             d:DesignHeight="450"
+             d:DesignWidth="800"
+             d:DataContext="{d:DesignInstance editor:SurfaceEditorViewModel}">
+    <Grid>
+        <TextBlock>Surface editor view</TextBlock>
+        <ItemsControl ItemsSource="{Binding Devices}">
+            <ItemsControl.ItemsPanel>
+                <ItemsPanelTemplate>
+                    <Canvas />
+                </ItemsPanelTemplate>
+            </ItemsControl.ItemsPanel>
+            <ItemsControl.ItemContainerStyle>
+                <Style TargetType="ContentPresenter">
+                    <Setter Property="Canvas.Left" Value="{Binding Device.Location.X}" />
+                    <Setter Property="Canvas.Top" Value="{Binding Device.Location.Y}" />
+                </Style>
+            </ItemsControl.ItemContainerStyle>
+            <ItemsControl.ItemTemplate>
+                <DataTemplate>
+                    <ContentControl Width="{Binding Device.Size.Width}" Height="{Binding Device.Size.Height}" xaml:View.Model="{Binding }"/>
+                </DataTemplate>
+            </ItemsControl.ItemTemplate>
+        </ItemsControl>
+    </Grid>
+</UserControl>

src/Artemis.UI/Views/Controls/RgbDevice/RgbDeviceView.xaml

@@ -0,0 +1,31 @@
+<UserControl x:Class="Artemis.UI.Views.Controls.RgbDevice.RgbDeviceView"
+             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:rgbDevice="clr-namespace:Artemis.UI.ViewModels.Controls.RgbDevice"
+             xmlns:xaml="https://github.com/canton7/Stylet"
+             mc:Ignorable="d"
+             d:DataContext="{d:DesignInstance rgbDevice:RgbDeviceViewModel}"
+             d:DesignHeight="450" d:DesignWidth="800">
+    <Grid>
+        <ItemsControl ItemsSource="{Binding Leds}">
+            <ItemsControl.ItemsPanel>
+                <ItemsPanelTemplate>
+                    <Canvas />
+                </ItemsPanelTemplate>
+            </ItemsControl.ItemsPanel>
+            <ItemsControl.ItemContainerStyle>
+                <Style TargetType="ContentPresenter">
+                    <Setter Property="Canvas.Left" Value="{Binding Led.LedRectangle.X}" />
+                    <Setter Property="Canvas.Top" Value="{Binding Led.LedRectangle.Y}" />
+                </Style>
+            </ItemsControl.ItemContainerStyle>
+            <ItemsControl.ItemTemplate>
+                <DataTemplate>
+                    <ContentControl Width="{Binding Led.LedRectangle.Width}" Height="{Binding Led.LedRectangle.Width}" xaml:View.Model="{Binding}" ToolTip="{Binding Tooltip}" />
+                </DataTemplate>
+            </ItemsControl.ItemTemplate>
+        </ItemsControl>
+    </Grid>
+</UserControl>

src/Artemis.UI/Views/Controls/RgbDevice/RgbLedView.xaml

@@ -0,0 +1,12 @@
+<UserControl x:Class="Artemis.UI.Views.Controls.RgbDevice.RgbLedView"
+             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.Views.Controls.RgbDevice"
+             xmlns:rgbDevice="clr-namespace:Artemis.UI.ViewModels.Controls.RgbDevice"
+             mc:Ignorable="d"
+             d:DataContext="{d:DesignInstance rgbDevice:RgbLedViewModel}"
+             d:DesignHeight="450" d:DesignWidth="800">
+    <Image Width="Auto" Height="Auto" Source="{Binding DisplayDrawing}" Margin="2" />
+</UserControl>

src/Artemis.UI/Views/Controls/Settings/RgbDeviceSettingsView.xaml

@@ -1,10 +1,10 @@
-<UserControl x:Class="Artemis.UI.Views.Settings.DeviceSettingsView"
+<UserControl x:Class="Artemis.UI.Views.Controls.Settings.RgbDeviceSettingsView"
              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:vms="clr-namespace:Artemis.UI.ViewModels.Settings"
-             d:DataContext="{d:DesignInstance vms:DeviceSettingsViewModel}"
+             xmlns:settings="clr-namespace:Artemis.UI.ViewModels.Controls.Settings"
+             d:DataContext="{d:DesignInstance settings:RgbDeviceSettingsViewModel}"
              mc:Ignorable="d"
              d:DesignHeight="450" d:DesignWidth="800">
     <Grid>

src/Artemis.UI/Views/Screens/EditorView.xaml

@@ -0,0 +1,23 @@
+<UserControl x:Class="Artemis.UI.Views.Screens.EditorView"
+             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:screens="clr-namespace:Artemis.UI.ViewModels.Screens"
+             xmlns:xaml="https://github.com/canton7/Stylet"
+             mc:Ignorable="d"
+             d:DataContext="{d:DesignInstance screens:EditorViewModel}"
+             d:DesignHeight="600" d:DesignWidth="600">
+    <UserControl.Resources>
+        <ResourceDictionary>
+            <ResourceDictionary.MergedDictionaries>
+                <ResourceDictionary
+                    Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.TextBlock.xaml" />
+            </ResourceDictionary.MergedDictionaries>
+        </ResourceDictionary>
+    </UserControl.Resources>
+    <StackPanel Margin="16">
+        <TextBlock>In the editor you can either edit your surface layout or edit a profile.</TextBlock>
+        <ContentControl xaml:View.Model="{Binding SurfaceEditorViewModel}"/>
+    </StackPanel>
+</UserControl>

src/Artemis.UI/Views/Screens/HomeView.xaml

@@ -1,4 +1,4 @@
-<UserControl x:Class="Artemis.UI.Views.HomeView"
+<UserControl x:Class="Artemis.UI.Views.Screens.HomeView"
              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:s="https://github.com/canton7/Stylet"
@@ -6,10 +6,11 @@
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:vms="clr-namespace:Artemis.UI.ViewModels"
              xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
+             xmlns:screens="clr-namespace:Artemis.UI.ViewModels.Screens"
              mc:Ignorable="d"
              d:DesignHeight="574.026"
              d:DesignWidth="1029.87"
-             d:DataContext="{d:DesignInstance vms:HomeViewModel, IsDesignTimeCreatable=True}">
+             d:DataContext="{d:DesignInstance screens:HomeViewModel, IsDesignTimeCreatable=True}">
     <UserControl.Resources>
         <ResourceDictionary>
             <ResourceDictionary.MergedDictionaries>

src/Artemis.UI/Views/Screens/RootView.xaml

@@ -1,4 +1,4 @@
-<metro:MetroWindow x:Class="Artemis.UI.Views.RootView"
+<metro:MetroWindow x:Class="Artemis.UI.Views.Screens.RootView"
                    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"
@@ -10,13 +10,14 @@
                    xmlns:models="clr-namespace:Artemis.Core.Plugins.Models;assembly=Artemis.Core"
                    xmlns:interfaces="clr-namespace:Artemis.Core.Plugins.Interfaces;assembly=Artemis.Core"
                    xmlns:abstract="clr-namespace:Artemis.Core.Plugins.Abstract;assembly=Artemis.Core"
+                   xmlns:screens="clr-namespace:Artemis.UI.ViewModels.Screens"
                    mc:Ignorable="d"
                    GlowBrush="{DynamicResource AccentColorBrush}"
                    FontFamily="{StaticResource DefaultFont}"
                    Title="Artemis"
                    d:DesignHeight="639.411"
                    d:DesignWidth="1113.251"
-                   d:DataContext="{d:DesignInstance vms:RootViewModel}"
+                   d:DataContext="{d:DesignInstance screens:RootViewModel}"
                    Icon="/Artemis.UI;component/Resources/logo-512.png">
     <metro:MetroWindow.Resources>
         <DrawingImage x:Key="BowIcon">
@@ -106,6 +107,13 @@
                                 <TextBlock>Workshop</TextBlock>
                             </StackPanel>
                         </ListBoxItem>
+                        <ListBoxItem x:Name="Editor">
+                            <StackPanel Orientation="Horizontal">
+                                <materialDesign:PackIcon Kind="Edit"
+                                                         Margin="0,0,8,0" />
+                                <TextBlock>Editor</TextBlock>
+                            </StackPanel>
+                        </ListBoxItem>
                         <ListBoxItem x:Name="Settings">
                             <StackPanel Orientation="Horizontal">
                                 <materialDesign:PackIcon Kind="Settings"

src/Artemis.UI/Views/Screens/SettingsView.xaml

@@ -1,11 +1,12 @@
-<UserControl x:Class="Artemis.UI.Views.Settings.SettingsView"
+<UserControl x:Class="Artemis.UI.Views.Screens.SettingsView"
              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:screens="clr-namespace:Artemis.UI.ViewModels.Screens"
+             xmlns:xaml="https://github.com/canton7/Stylet"
              mc:Ignorable="d"
-             xmlns:vms="clr-namespace:Artemis.UI.ViewModels.Settings"
-             d:DataContext="{d:DesignInstance vms:SettingsViewModel}"
+             d:DataContext="{d:DesignInstance screens:SettingsViewModel}"
              d:DesignHeight="600" d:DesignWidth="600">
     <UserControl.Resources>
         <ResourceDictionary>
@@ -23,7 +24,14 @@
 
         <TextBlock Style="{StaticResource MaterialDesignHeadlineTextBlock}">Devices</TextBlock>
         <Grid>
-            <TextBlock>A list of plugins and options to disable them</TextBlock>
+            <TextBlock>A list of devices and options to disable them</TextBlock>
+            <ItemsControl ItemsSource="{Binding DeviceSettingsViewModels}">
+                <ItemsControl.ItemTemplate>
+                    <DataTemplate>
+                        <ContentControl xaml:View.Model="{Binding}"/>
+                    </DataTemplate>
+                </ItemsControl.ItemTemplate>
+            </ItemsControl>
         </Grid>
 
         <TextBlock Style="{StaticResource MaterialDesignHeadlineTextBlock}">Plugins</TextBlock>

src/Artemis.UI/packages.config

@@ -14,12 +14,13 @@
   <package id="Ninject.Extensions.Conventions" version="3.3.0" targetFramework="net461" />
   <package id="Ninject.Extensions.Factory" version="3.3.2" targetFramework="net461" />
   <package id="PropertyChanged.Fody" version="2.6.1" targetFramework="net461" />
-  <package id="RGB.NET.Brushes" version="0.1.22" targetFramework="net461" />
-  <package id="RGB.NET.Core" version="0.1.22" targetFramework="net461" />
-  <package id="RGB.NET.Decorators" version="0.1.22" targetFramework="net461" />
-  <package id="RGB.NET.Devices.Corsair" version="0.1.22" targetFramework="net461" />
-  <package id="RGB.NET.Groups" version="0.1.22" targetFramework="net461" />
+  <package id="RGB.NET.Brushes" version="0.1.25" targetFramework="net472" />
+  <package id="RGB.NET.Core" version="0.1.25" targetFramework="net472" />
+  <package id="RGB.NET.Decorators" version="0.1.25" targetFramework="net472" />
+  <package id="RGB.NET.Devices.Corsair" version="0.1.25" targetFramework="net472" />
+  <package id="RGB.NET.Groups" version="0.1.25" targetFramework="net472" />
   <package id="RGB.NET.Resources.Corsair" version="0.3.0.234" targetFramework="net461" />
+  <package id="SharpVectors.Reloaded" version="1.3.0" targetFramework="net472" />
   <package id="SQLitePCLRaw.bundle_green" version="1.1.12" targetFramework="net472" />
   <package id="SQLitePCLRaw.core" version="1.1.12" targetFramework="net472" />
   <package id="SQLitePCLRaw.lib.e_sqlite3.linux" version="1.1.12" targetFramework="net472" />