Shared UI - Moved initialization code

Color picker - Added toggle to preview color on devices
Settings - Added toggable auto-save

src/Artemis.UI.Shared/Bootstrapper.cs

@@ -0,0 +1,22 @@
+using Artemis.UI.Shared.Services;
+using Ninject;
+
+namespace Artemis.UI.Shared
+{
+    public static class Bootstrapper
+    {
+        public static bool Initialized { get; private set; }
+
+        public static void Initialize(IKernel kernel)
+        {
+            if (Initialized)
+                return;
+
+            var colorPickerService = kernel.Get<IColorPickerService>();
+            GradientPicker.ColorPickerService = colorPickerService;
+            ColorPicker.ColorPickerService = colorPickerService;
+
+            Initialized = true;
+        }
+    }
+}

src/Artemis.UI.Shared/Controls/ColorPicker.xaml

@@ -94,17 +94,18 @@
                StaysOpen="{Binding StaysOpen, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}"
                PopupAnimation="Fade"
                IsOpen="{Binding PopupOpen, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}">
-            <materialDesign:Card Width="200" Height="200" Margin="30" materialDesign:ShadowAssist.ShadowDepth="Depth4">
+            <materialDesign:Card Width="200" Height="230" Margin="30" materialDesign:ShadowAssist.ShadowDepth="Depth4">
                 <Grid>
                     <Grid.RowDefinitions>
                         <RowDefinition Height="160" />
                         <RowDefinition />
+                        <RowDefinition />
                     </Grid.RowDefinitions>
-                    <materialDesign:ColorPicker Grid.Row="0" 
-                                                Color="{Binding Color, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}" 
+                    <materialDesign:ColorPicker Grid.Row="0"
+                                                Color="{Binding Color, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}"
                                                 MouseUp="ColorGradient_OnMouseUp"
                                                 PreviewMouseDown="Slider_OnMouseDown"
-                                                PreviewMouseUp="Slider_OnMouseUp"/>
+                                                PreviewMouseUp="Slider_OnMouseUp" />
                     <Slider Grid.Row="1" Margin="8"
                             IsMoveToPointEnabled="True"
                             Orientation="Horizontal"
@@ -114,6 +115,17 @@
                             PreviewMouseDown="Slider_OnMouseDown"
                             PreviewMouseUp="Slider_OnMouseUp"
                             Maximum="255" />
+
+                    <!-- Checkboxes don't work inside popups inside tree views, which is where the color picker is regularly used -->
+                    <shared:TreeViewPopupCompatibleCheckBox Grid.Row="2"
+                                                     x:Name="PreviewCheckBox"
+                                                     Margin="10 0"
+                                                     VerticalAlignment="Center"
+                                                     Style="{StaticResource MaterialDesignCheckBox}" 
+                                                     Click="PreviewCheckBoxClick">
+                        Preview on devices
+                    </shared:TreeViewPopupCompatibleCheckBox>
+
                 </Grid>
             </materialDesign:Card>
         </Popup>

src/Artemis.UI.Shared/Controls/ColorPicker.xaml.cs

@@ -5,6 +5,7 @@ using System.Windows;
 using System.Windows.Controls;
 using System.Windows.Input;
 using System.Windows.Media;
+using Artemis.UI.Shared.Services;
 
 namespace Artemis.UI.Shared
 {
@@ -13,6 +14,8 @@ namespace Artemis.UI.Shared
     /// </summary>
     public partial class ColorPicker : UserControl, INotifyPropertyChanged
     {
+        private static IColorPickerService _colorPickerService;
+
         public static readonly DependencyProperty ColorProperty = DependencyProperty.Register(nameof(Color), typeof(Color), typeof(ColorPicker),
             new FrameworkPropertyMetadata(default(Color), FrameworkPropertyMetadataOptions.BindsTwoWayByDefault, ColorPropertyChangedCallback));
 
@@ -44,6 +47,21 @@ namespace Artemis.UI.Shared
         public ColorPicker()
         {
             InitializeComponent();
+            Loaded += OnLoaded;
+            Unloaded += OnUnloaded;
+        }
+
+        /// <summary>
+        ///     Used by the gradient picker to load saved gradients, do not touch or it'll just throw an exception
+        /// </summary>
+        internal static IColorPickerService ColorPickerService
+        {
+            set
+            {
+                if (_colorPickerService != null)
+                    throw new AccessViolationException("This is not for you to touch");
+                _colorPickerService = value;
+            }
         }
 
         public Color Color
@@ -87,6 +105,7 @@ namespace Artemis.UI.Shared
 
             colorPicker.SetCurrentValue(ColorOpacityProperty, ((Color) e.NewValue).A);
             colorPicker.OnPropertyChanged(nameof(Color));
+            _colorPickerService.UpdateColorDisplay(colorPicker.Color);
 
             colorPicker._inCallback = false;
         }
@@ -126,6 +145,7 @@ namespace Artemis.UI.Shared
                 color = Color.FromArgb(opacity, color.R, color.G, color.B);
             colorPicker.SetCurrentValue(ColorProperty, color);
             colorPicker.OnPropertyChanged(nameof(ColorOpacity));
+            _colorPickerService.UpdateColorDisplay(colorPicker.Color);
 
             colorPicker._inCallback = false;
         }
@@ -135,7 +155,7 @@ namespace Artemis.UI.Shared
             PopupOpen = !PopupOpen;
             e.Handled = true;
         }
-        
+
         private void ColorGradient_OnMouseUp(object sender, MouseButtonEventArgs e)
         {
             e.Handled = true;
@@ -144,13 +164,39 @@ namespace Artemis.UI.Shared
         private void Slider_OnMouseDown(object sender, MouseButtonEventArgs e)
         {
             OnDragStarted();
+
+            if (_colorPickerService.PreviewSetting.Value)
+                _colorPickerService.StartColorDisplay();
         }
 
         private void Slider_OnMouseUp(object sender, MouseButtonEventArgs e)
         {
             OnDragEnded();
+            _colorPickerService.StopColorDisplay();
         }
 
+        private void PreviewCheckBoxClick(object sender, RoutedEventArgs e)
+        {
+            _colorPickerService.PreviewSetting.Value = PreviewCheckBox.IsChecked.Value;
+        }
+
+        private void OnLoaded(object sender, RoutedEventArgs e)
+        {
+            PreviewCheckBox.IsChecked = _colorPickerService.PreviewSetting.Value;
+            _colorPickerService.PreviewSetting.SettingChanged += PreviewSettingOnSettingChanged;
+        }
+
+        private void OnUnloaded(object sender, RoutedEventArgs e)
+        {
+            _colorPickerService.PreviewSetting.SettingChanged -= PreviewSettingOnSettingChanged;
+        }
+
+        private void PreviewSettingOnSettingChanged(object sender, EventArgs e)
+        {
+            PreviewCheckBox.IsChecked = _colorPickerService.PreviewSetting.Value;
+        }
+
+
         #region Events
 
         public event EventHandler DragStarted;
@@ -167,6 +213,5 @@ namespace Artemis.UI.Shared
         }
 
         #endregion
-
     }
 }

src/Artemis.UI.Shared/Controls/GradientPicker.xaml.cs

@@ -16,7 +16,7 @@ namespace Artemis.UI.Shared
     /// </summary>
     public partial class GradientPicker : UserControl, INotifyPropertyChanged
     {
-        private static IGradientPickerService _gradientPickerService;
+        private static IColorPickerService _colorPickerService;
         private bool _inCallback;
 
         public GradientPicker()
@@ -27,14 +27,13 @@ namespace Artemis.UI.Shared
         /// <summary>
         ///     Used by the gradient picker to load saved gradients, do not touch or it'll just throw an exception
         /// </summary>
-        public static IGradientPickerService GradientPickerService
+        internal static IColorPickerService ColorPickerService
         {
-            private get => _gradientPickerService;
             set
             {
-                if (_gradientPickerService != null)
+                if (_colorPickerService != null)
                     throw new AccessViolationException("This is not for you to touch");
-                _gradientPickerService = value;
+                _colorPickerService = value;
             }
         }
 
@@ -93,7 +92,7 @@ namespace Artemis.UI.Shared
             Execute.OnUIThread(async () =>
             {
                 OnDialogOpened();
-                await GradientPickerService.ShowGradientPicker(ColorGradient, DialogHost);
+                await _colorPickerService.ShowGradientPicker(ColorGradient, DialogHost);
                 OnDialogClosed();
             });
         }

src/Artemis.UI.Shared/Controls/TreeViewPopupCompatibleCheckBox.cs

@@ -0,0 +1,22 @@
+using System.Windows.Controls;
+using System.Windows.Input;
+
+namespace Artemis.UI.Shared
+{
+    // Workaround for https://developercommunity.visualstudio.com/content/problem/190202/button-controls-hosted-in-popup-windows-do-not-wor.html
+    /// <inheritdoc />
+    public class TreeViewPopupCompatibleCheckBox : CheckBox
+    {
+        /// <inheritdoc />
+        protected override void OnPreviewMouseLeftButtonDown(MouseButtonEventArgs e)
+        {
+            base.OnMouseLeftButtonDown(e);
+        }
+
+        /// <inheritdoc />
+        protected override void OnPreviewMouseLeftButtonUp(MouseButtonEventArgs e)
+        {
+            base.OnMouseLeftButtonUp(e);
+        }
+    }
+}

src/Artemis.UI.Shared/Services/ColorPickerService.cs

@@ -0,0 +1,80 @@
+using System.Collections.Generic;
+using System.Threading.Tasks;
+using System.Windows.Media;
+using Artemis.Core;
+using Artemis.Core.Services;
+using Artemis.UI.Shared.Screens.GradientEditor;
+using SkiaSharp;
+
+namespace Artemis.UI.Shared.Services
+{
+    internal class ColorPickerService : IColorPickerService
+    {
+        private readonly ICoreService _coreService;
+        private readonly IDialogService _dialogService;
+
+        private bool _mustRenderOverlay;
+        private SKColor _overlayColor;
+        private float _overlayOpacity;
+
+        public ColorPickerService(IDialogService dialogService, ICoreService coreService, ISettingsService settingsService)
+        {
+            _dialogService = dialogService;
+            _coreService = coreService;
+
+            PreviewSetting = settingsService.GetSetting("UI.PreviewColorPickerOnDevices", false);
+            PreviewSetting.AutoSave = true;
+        }
+
+        public PluginSetting<bool> PreviewSetting { get; }
+        
+        public Task<object> ShowGradientPicker(ColorGradient colorGradient, string dialogHost)
+        {
+            if (!string.IsNullOrWhiteSpace(dialogHost))
+                return _dialogService.ShowDialogAt<GradientEditorViewModel>(dialogHost, new Dictionary<string, object> {{"colorGradient", colorGradient}});
+            return _dialogService.ShowDialog<GradientEditorViewModel>(new Dictionary<string, object> {{"colorGradient", colorGradient}});
+        }
+
+        public void StartColorDisplay()
+        {
+            if (_mustRenderOverlay)
+                return;
+
+            _overlayOpacity = 0f;
+            _mustRenderOverlay = true;
+
+            _coreService.FrameRendering += RenderColorPickerOverlay;
+        }
+
+        public void StopColorDisplay()
+        {
+            _mustRenderOverlay = false;
+        }
+
+        public void UpdateColorDisplay(Color color)
+        {
+            _overlayColor = new SKColor(color.R, color.G, color.B, color.A);
+        }
+
+        private void RenderColorPickerOverlay(object sender, FrameRenderingEventArgs e)
+        {
+            if (_mustRenderOverlay)
+                _overlayOpacity += 0.2f;
+            else
+                _overlayOpacity -= 0.2f;
+
+            if (_overlayOpacity <= 0f)
+            {
+                _coreService.FrameRendering -= RenderColorPickerOverlay;
+                return;
+            }
+
+            if (_overlayOpacity > 1f)
+                _overlayOpacity = 1f;
+
+            using var overlayPaint = new SKPaint {Color = new SKColor(0, 0, 0, (byte) (255 * _overlayOpacity))};
+            overlayPaint.Color = _overlayColor.WithAlpha((byte) (_overlayColor.Alpha * _overlayOpacity));
+            e.Canvas.DrawRect(0, 0, e.Canvas.LocalClipBounds.Width, e.Canvas.LocalClipBounds.Height, overlayPaint);
+        }
+    }
+}

src/Artemis.UI.Shared/Services/GradientPickerService.cs

@@ -1,24 +0,0 @@
-using System.Collections.Generic;
-using System.Threading.Tasks;
-using Artemis.Core;
-using Artemis.UI.Shared.Screens.GradientEditor;
-
-namespace Artemis.UI.Shared.Services
-{
-    internal class GradientPickerService : IGradientPickerService
-    {
-        private readonly IDialogService _dialogService;
-
-        public GradientPickerService(IDialogService dialogService)
-        {
-            _dialogService = dialogService;
-        }
-
-        public Task<object> ShowGradientPicker(ColorGradient colorGradient, string dialogHost)
-        {
-            if (!string.IsNullOrWhiteSpace(dialogHost))
-                return _dialogService.ShowDialogAt<GradientEditorViewModel>(dialogHost, new Dictionary<string, object> {{"colorGradient", colorGradient}});
-            return _dialogService.ShowDialog<GradientEditorViewModel>(new Dictionary<string, object> {{"colorGradient", colorGradient}});
-        }
-    }
-}

src/Artemis.UI.Shared/Services/Interfaces/IColorPickerService.cs

@@ -0,0 +1,16 @@
+using System.Threading.Tasks;
+using System.Windows.Media;
+using Artemis.Core;
+
+namespace Artemis.UI.Shared.Services
+{
+    internal interface IColorPickerService : IArtemisSharedUIService
+    {
+        Task<object> ShowGradientPicker(ColorGradient colorGradient, string dialogHost);
+
+        PluginSetting<bool> PreviewSetting { get; }
+        void StartColorDisplay();
+        void StopColorDisplay();
+        void UpdateColorDisplay(Color color);
+    }
+}

src/Artemis.UI.Shared/Services/Interfaces/IGradientPickerService.cs

@@ -1,10 +0,0 @@
-using System.Threading.Tasks;
-using Artemis.Core;
-
-namespace Artemis.UI.Shared.Services
-{
-    public interface IGradientPickerService : IArtemisSharedUIService
-    {
-        Task<object> ShowGradientPicker(ColorGradient colorGradient, string dialogHost);
-    }
-}