From be4997033b195359bd12689b8f9c9883e762492b Mon Sep 17 00:00:00 2001
From: SpoinkyNL <spoinky.nl@gmail.com>
Date: Thu, 17 Mar 2016 15:49:59 +0100
Subject: [PATCH] Progress on the layers display

---
 .../Games/TheDivision/TheDivisionView.xaml    |   6 +-
 .../Games/TheDivision/TheDivisionViewModel.cs |   5 +
 .../ViewModels/ProfileEditorViewModel.cs      |   2 +-
 Artemis/Artemis/Views/ProfileEditorView.xaml  | 272 ++++++++++++++++--
 4 files changed, 260 insertions(+), 25 deletions(-)

diff --git a/Artemis/Artemis/Modules/Games/TheDivision/TheDivisionView.xaml b/Artemis/Artemis/Modules/Games/TheDivision/TheDivisionView.xaml
index 5bd90ab14..57a5b9df0 100644
--- a/Artemis/Artemis/Modules/Games/TheDivision/TheDivisionView.xaml
+++ b/Artemis/Artemis/Modules/Games/TheDivision/TheDivisionView.xaml
@@ -17,6 +17,7 @@
                 <RowDefinition Height="Auto" />
                 <RowDefinition Height="Auto" />
                 <RowDefinition Height="Auto" />
+                <RowDefinition Height="Auto" />
                 <RowDefinition Height="*" />
             </Grid.RowDefinitions>
             <StackPanel Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2">
@@ -40,7 +41,10 @@
                        Foreground="{DynamicResource HighlightBrush}" MaxWidth="510" TextAlignment="Justify">
                 Note: For this game to work with Artemis, please open up your Division settings, navigate to 3rd Party and set LED keyboard support to Yes. (This only works if you have Artemis running before starting the game)
             </TextBlock>
-
+            
+            <!-- Profile editor -->
+            <ContentControl Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="2" x:Name="ProfileEditor" />
+            
             <!-- Buttons -->
             <StackPanel Grid.Column="0" Grid.Row="4" Orientation="Horizontal" VerticalAlignment="Bottom">
                 <Button x:Name="ResetSettings" Content="Reset effect" VerticalAlignment="Top" Width="100"
diff --git a/Artemis/Artemis/Modules/Games/TheDivision/TheDivisionViewModel.cs b/Artemis/Artemis/Modules/Games/TheDivision/TheDivisionViewModel.cs
index e9478d8c6..48b392456 100644
--- a/Artemis/Artemis/Modules/Games/TheDivision/TheDivisionViewModel.cs
+++ b/Artemis/Artemis/Modules/Games/TheDivision/TheDivisionViewModel.cs
@@ -1,4 +1,5 @@
 using Artemis.Managers;
+using Artemis.ViewModels;
 using Artemis.ViewModels.Abstract;
 
 namespace Artemis.Modules.Games.TheDivision
@@ -15,8 +16,12 @@ namespace Artemis.Modules.Games.TheDivision
             // Create effect model and add it to MainManager
             GameModel = new TheDivisionModel(mainManager, (TheDivisionSettings) GameSettings);
             MainManager.EffectManager.EffectModels.Add(GameModel);
+
+            ProfileEditor = new ProfileEditorViewModel(MainManager.KeyboardManager.ActiveKeyboard);
         }
 
+        public ProfileEditorViewModel ProfileEditor { get; set; }
+
         public static string Name => "The Division";
     }
 }
\ No newline at end of file
diff --git a/Artemis/Artemis/ViewModels/ProfileEditorViewModel.cs b/Artemis/Artemis/ViewModels/ProfileEditorViewModel.cs
index b5bd81d5d..7689dd64b 100644
--- a/Artemis/Artemis/ViewModels/ProfileEditorViewModel.cs
+++ b/Artemis/Artemis/ViewModels/ProfileEditorViewModel.cs
@@ -4,7 +4,7 @@ using Caliburn.Micro;
 
 namespace Artemis.ViewModels
 {
-    internal class ProfileEditorViewModel : Screen
+    public class ProfileEditorViewModel : Screen
     {
         private readonly KeyboardProvider _keyboard;
 
diff --git a/Artemis/Artemis/Views/ProfileEditorView.xaml b/Artemis/Artemis/Views/ProfileEditorView.xaml
index ead4e1cfd..eaf042c15 100644
--- a/Artemis/Artemis/Views/ProfileEditorView.xaml
+++ b/Artemis/Artemis/Views/ProfileEditorView.xaml
@@ -1,30 +1,256 @@
 <UserControl x:Class="Artemis.Views.ProfileEditorView"
              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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:local="clr-namespace:Artemis.Views"
-             mc:Ignorable="d" 
-             d:DesignHeight="300" d:DesignWidth="800">
-    <Grid>
-        <Grid.ColumnDefinitions>
-            <ColumnDefinition Width="Auto" />
-            <ColumnDefinition Width="Auto"/>
-        </Grid.ColumnDefinitions>
-        <Grid.RowDefinitions>
-            <RowDefinition Height="Auto" />
+             mc:Ignorable="d"
+             d:DesignHeight="772.5" d:DesignWidth="1335">
+    <Grid Width="Auto" Height="Auto">
+        <Grid.ColumnDefinitions>
+            <ColumnDefinition Width="Auto" />
+            <ColumnDefinition Width="Auto" />
+        </Grid.ColumnDefinitions>
+        <Grid.RowDefinitions>
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="*" />
         </Grid.RowDefinitions>
-        <Image Grid.Column="0" Grid.Row="0" Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\keyboards\k95.png" Height="200"/>
-        <StackPanel Grid.Column="1" Grid.Row="0">
-            <Label Content="Layers" Style="{DynamicResource DescriptionHeaderStyle}" />
-            <ListView Margin="10,10,0,13" Name="ListView1" HorizontalAlignment="Left" VerticalAlignment="Top" Width="78" Height="178" Style="{StaticResource VirtualisedMetroListView}">>
-                <ListViewItem Content="Coffie"></ListViewItem>
-                <ListViewItem Content="Tea"></ListViewItem>
-                <ListViewItem Content="Orange Juice"></ListViewItem>
-                <ListViewItem Content="Milk"></ListViewItem>
-                <ListViewItem Content="Iced Tea"></ListViewItem>
-                <ListViewItem Content="Mango Shake"></ListViewItem>
-            </ListView>
-        </StackPanel>
+
+        <!-- Preview -->
+        <Label Grid.Column="0" Grid.Row="0" FontSize="20" HorizontalAlignment="Left" Content="Preview" />
+        <Border Grid.Column="0" Grid.Row="1" Background="#FF232323" BorderBrush="{DynamicResource HighlightBrush}"
+                BorderThickness="3" Width="800" Height="400">
+            <Border>
+                <Border.Effect>
+                    <!-- TODO: Pulse 10-20 -->
+                    <DropShadowEffect ShadowDepth="0"
+                                      Color="{DynamicResource HighlightColor}"
+                                      Opacity="1"
+                                      BlurRadius="20" />
+                </Border.Effect>
+                <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\keyboards\k95.png" Margin="50" />
+            </Border>
+        </Border>
+
+        <!-- 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="200">
+            <!--<ListView x:Name="ListView1" BorderThickness="0">
+                <ListView.Resources>
+                    <ResourceDictionary
+                        Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseDark.xaml" />
+                </ListView.Resources>
+                <ListViewItem>
+                    <StackPanel Orientation="Horizontal" Margin="5">
+                        <CheckBox VerticalAlignment="Center" />
+                        <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\Config concept\rect.png"
+                               Height="30" Margin="5,0" />
+                        <TextBlock Text="Layer" VerticalAlignment="Center" />
+                    </StackPanel>
+                </ListViewItem>
+                <ListViewItem>
+                    <StackPanel Orientation="Horizontal" Margin="5">
+                        <CheckBox VerticalAlignment="Center" />
+                        <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\Config concept\circle.png"
+                               Height="30" Margin="5,0" />
+                        <TextBlock Text="Layer" VerticalAlignment="Center" />
+                    </StackPanel>
+                </ListViewItem>
+                <ListViewItem>
+                    <StackPanel Orientation="Horizontal" Margin="5">
+                        <CheckBox VerticalAlignment="Center" />
+                        <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\Config concept\rect.png"
+                               Height="30" Margin="5,0" />
+                        <TextBlock Text="Layer" VerticalAlignment="Center" />
+                    </StackPanel>
+                </ListViewItem>
+                <ListViewItem>
+                    <StackPanel Orientation="Horizontal" Margin="5">
+                        <CheckBox VerticalAlignment="Center" />
+                        <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\Config concept\circle.png"
+                               Height="30" Margin="5,0" />
+                        <TextBlock Text="Layer" VerticalAlignment="Center" />
+                    </StackPanel>
+                </ListViewItem>
+                <ListViewItem>
+                    <StackPanel Orientation="Horizontal" Margin="5">
+                        <CheckBox VerticalAlignment="Center" />
+                        <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\Config concept\circle.png"
+                               Height="30" Margin="5,0" />
+                        <TextBlock Text="Layer" VerticalAlignment="Center" />
+                    </StackPanel>
+                </ListViewItem>
+                <ListViewItem>
+                    <StackPanel Orientation="Horizontal" Margin="5">
+                        <CheckBox VerticalAlignment="Center" />
+                        <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\Config concept\circle.png"
+                               Height="30" Margin="5,0" />
+                        <TextBlock Text="Layer" VerticalAlignment="Center" />
+                    </StackPanel>
+                </ListViewItem>
+                <ListViewItem>
+                    <StackPanel Orientation="Horizontal" Margin="5">
+                        <CheckBox VerticalAlignment="Center" />
+                        <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\Config concept\circle.png"
+                               Height="30" Margin="5,0" />
+                        <TextBlock Text="Layer" VerticalAlignment="Center" />
+                    </StackPanel>
+                </ListViewItem>
+                <ListViewItem>
+                    <StackPanel Orientation="Horizontal" Margin="5">
+                        <CheckBox VerticalAlignment="Center" />
+                        <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\Config concept\circle.png"
+                               Height="30" Margin="5,0" />
+                        <TextBlock Text="Layer" VerticalAlignment="Center" />
+                    </StackPanel>
+                </ListViewItem>
+                <ListViewItem>
+                    <StackPanel Orientation="Horizontal" Margin="5">
+                        <CheckBox VerticalAlignment="Center" />
+                        <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\Config concept\circle.png"
+                               Height="30" Margin="5,0" />
+                        <TextBlock Text="Layer" VerticalAlignment="Center" />
+                    </StackPanel>
+                </ListViewItem>
+                <ListViewItem>
+                    <StackPanel Orientation="Horizontal" Margin="5">
+                        <CheckBox VerticalAlignment="Center" />
+                        <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\Config concept\circle.png"
+                               Height="30" Margin="5,0" />
+                        <TextBlock Text="Layer" VerticalAlignment="Center" />
+                    </StackPanel>
+                </ListViewItem>
+                <ListViewItem>
+                    <StackPanel Orientation="Horizontal" Margin="5">
+                        <CheckBox VerticalAlignment="Center" />
+                        <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\Config concept\circle.png"
+                               Height="30" Margin="5,0" />
+                        <TextBlock Text="Layer" VerticalAlignment="Center" />
+                    </StackPanel>
+                </ListViewItem>
+                <ListViewItem>
+                    <StackPanel Orientation="Horizontal" Margin="5">
+                        <CheckBox VerticalAlignment="Center" />
+                        <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\Config concept\circle.png"
+                               Height="30" Margin="5,0" />
+                        <TextBlock Text="Layer" VerticalAlignment="Center" />
+                    </StackPanel>
+                </ListViewItem>
+                <ListViewItem>
+                    <StackPanel Orientation="Horizontal" Margin="5">
+                        <CheckBox VerticalAlignment="Center" />
+                        <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\Config concept\circle.png"
+                               Height="30" Margin="5,0" />
+                        <TextBlock Text="Layer" VerticalAlignment="Center" />
+                    </StackPanel>
+                </ListViewItem>
+                <ListViewItem>
+                    <StackPanel Orientation="Horizontal" Margin="5">
+                        <CheckBox VerticalAlignment="Center" />
+                        <Image Source="D:\Gebruiker folder\Mijn afbeeldingen\Artemis logo\Config concept\circle.png"
+                               Height="30" Margin="5,0" />
+                        <TextBlock Text="Layer" VerticalAlignment="Center" />
+                    </StackPanel>
+                </ListViewItem>
+            </ListView>-->
+            <TreeView>
+                <TreeView.Resources>
+                    <ResourceDictionary
+                        Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseDark.xaml" />
+                </TreeView.Resources>
+                <TreeViewItem>
+                    <!-- Layer example -->
+                    <!-- Content -->
+                    <TreeViewItem.Header>
+                        <StackPanel Orientation="Horizontal">
+                            <CheckBox VerticalAlignment="Center" ToolTip="Layer enabled" />
+                            <Rectangle Height="18" Width="18" Stroke="Black" VerticalAlignment="Bottom"
+                                       Fill="#FFFFE800" />
+                            <TextBlock Margin="5,0,0,0" Text="Layer 1" VerticalAlignment="Center" />
+                        </StackPanel>
+                    </TreeViewItem.Header>
+                    <!-- Context menu -->
+                    <TreeViewItem.ContextMenu>
+                        <ContextMenu>
+                            <MenuItem Header="Rename" />
+                            <MenuItem Header="Delete" />
+                            <MenuItem Header="Properties" />
+                        </ContextMenu>
+                    </TreeViewItem.ContextMenu>
+                </TreeViewItem>
+                <TreeViewItem Header="Group 1">
+                    <!-- Context menu -->
+                    <TreeViewItem.ContextMenu>
+                        <ContextMenu>
+                            <MenuItem Header="Rename" />
+                            <MenuItem Header="Delete" />
+                            <MenuItem Header="Properties" />
+                        </ContextMenu>
+                    </TreeViewItem.ContextMenu>
+                    <!-- Group example -->
+                    <TreeViewItem>
+                        <!-- Content -->
+                        <TreeViewItem.Header>
+                            <StackPanel Orientation="Horizontal">
+                                <CheckBox VerticalAlignment="Center" ToolTip="Layer enabled" />
+                                <Rectangle Height="18" Width="18" Stroke="Black" VerticalAlignment="Bottom"
+                                           Fill="#FFC50A0A" />
+                                <TextBlock Margin="5,0,0,0" Text="Layer 2" VerticalAlignment="Center" />
+                            </StackPanel>
+                        </TreeViewItem.Header>
+                    </TreeViewItem>
+                    <!-- Circular Layer example -->
+                    <TreeViewItem>
+                        <TreeViewItem.Header>
+                            <StackPanel Orientation="Horizontal">
+                                <CheckBox VerticalAlignment="Center" ToolTip="Layer enabled" />
+                                <Rectangle Height="18" Width="18" Stroke="Black" VerticalAlignment="Bottom"
+                                         Fill="#FF0AC50A" RadiusX="18" RadiusY="18" />
+                                
+                                <TextBlock Margin="5,0,0,0" Text="Layer 3" VerticalAlignment="Center" />
+                            </StackPanel>
+                        </TreeViewItem.Header>
+                    </TreeViewItem>
+                    <TreeViewItem>
+                        <TreeViewItem.Header>
+                            <StackPanel Orientation="Horizontal">
+                                <CheckBox VerticalAlignment="Center" ToolTip="Layer enabled" />
+                                <Rectangle Height="18" Width="18" Stroke="Black" VerticalAlignment="Bottom" Fill="#FF2C0AC5" />
+                                <TextBlock Margin="5,0,0,0" Text="Layer 4" VerticalAlignment="Center" />
+                            </StackPanel>
+                        </TreeViewItem.Header>
+                    </TreeViewItem>
+                </TreeViewItem>
+                <TreeViewItem Header="Group 2">
+                    <TreeViewItem>
+                        <TreeViewItem.Header>
+                            <StackPanel Orientation="Horizontal">
+                                <CheckBox VerticalAlignment="Center" ToolTip="Layer enabled" />
+                                <Rectangle Height="18" Width="18" Stroke="Black" VerticalAlignment="Bottom"
+                                         Fill="#FF0AC5C5" RadiusX="18" RadiusY="18" />
+                                <TextBlock Margin="5,0,0,0" Text="Layer 5" VerticalAlignment="Center" />
+                            </StackPanel>
+                        </TreeViewItem.Header>
+                    </TreeViewItem>
+                    <TreeViewItem>
+                        <TreeViewItem.Header>
+                            <StackPanel Orientation="Horizontal">
+                                <CheckBox VerticalAlignment="Center" ToolTip="Layer enabled" />
+                                <Rectangle Height="18" Width="18" Stroke="Black" VerticalAlignment="Bottom" Fill="White" RadiusX="18" RadiusY="18" />
+                                <TextBlock Margin="5,0,0,0" Text="Layer 6" VerticalAlignment="Center" />
+                            </StackPanel>
+                        </TreeViewItem.Header>
+                    </TreeViewItem>
+                </TreeViewItem>
+            </TreeView>
+        </Border>
+        <Grid Grid.Column="1" Grid.Row="2" Margin="10,5,0,0">
+            <Button x:Name="AddLayer" Content="Add layer" VerticalAlignment="Top"
+                    Style="{DynamicResource SquareButtonStyle}" Width="95" HorizontalAlignment="Left" />
+            <Button x:Name="RemoveLayer" Content="Remove layer" VerticalAlignment="Top"
+                    Style="{DynamicResource SquareButtonStyle}" Width="95" HorizontalAlignment="Right" />
+        </Grid>
     </Grid>
 </UserControl>
\ No newline at end of file