PPC. Color Selection Tools. OutOfGamut behavior

10 files changed, 272 insertions, 164 deletions

diff --git a/Software/Visual_Studio/Tango.Touch/Resources/Fonts.xaml b/Software/Visual_Studio/Tango.Touch/Resources/Fonts.xaml
index 27408f2bb..e322b6faa 100644
--- a/Software/Visual_Studio/Tango.Touch/Resources/Fonts.xaml
+++ b/Software/Visual_Studio/Tango.Touch/Resources/Fonts.xaml
@@ -4,8 +4,9 @@
                     xmlns:local="clr-namespace:Tango.Touch.Resources">
 
     <FontFamily x:Key="TangoFlexoFontFamily">Flexo</FontFamily>
-    
 
+
+    <sys:Double x:Key="TangoSmallerFontSize">9</sys:Double>
     <sys:Double x:Key="TangoSmallFontSize">14</sys:Double>
     <sys:Double x:Key="TangoDefaultFontSize">16</sys:Double>
     <sys:Double x:Key="TangoDataGridHeaderFontSize">16</sys:Double>
@@ -19,6 +20,7 @@
     <sys:Double x:Key="TangoMessageBoxButtonFontSize">22</sys:Double>
 
     <sys:Double x:Key="TangoExpanderHeaderFontSize">23</sys:Double>
+    <sys:Double x:Key="TangoExpanderItemFontSize">21</sys:Double>
 
     <sys:Double x:Key="TangoComboBoxTitleFontSize">26</sys:Double>
     <sys:Double x:Key="TangoComboBoxItemFontSize">18</sys:Double>
diff --git a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerCMYKControl.cs b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerCMYKControl.cs
index 7e1bb1d96..4c60ed579 100644
--- a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerCMYKControl.cs
+++ b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerCMYKControl.cs
@@ -146,7 +146,7 @@ namespace Tango.Touch.Controls
             base.OnApplyTemplate();
 
             Cmyk cmyk = new Cmyk(Cyan, Magenta, Yellow, Key);
-            SelectedColor = ConvertCMYKToRGBColor(Cyan / 100, Magenta / 100, Yellow / 100, Key / 100);
+            SelectedColor = ConvertCMYKToRGBColor(Cyan / 200, Magenta / 200, Yellow / 200, Key / 200);
 
             if (_cyanColorSlider != null)
             {
@@ -156,8 +156,8 @@ namespace Tango.Touch.Controls
             if (_cyanColorSlider != null)
             {
                 _cyanColorSlider.MinValue = 0;
-                _cyanColorSlider.MaxValue = 100;
-                CreateCyanBrush(cmyk.M / 100, cmyk.Y / 100, cmyk.K / 100);
+                _cyanColorSlider.MaxValue = 200;
+                CreateCyanBrush(cmyk.M / 200, cmyk.Y / 200, cmyk.K / 200);
                 _cyanColorSlider.ColorValue = cmyk.C;
                 _cyanColorSlider.ColorPickerText = "CYAN";
                 _cyanColorSlider.PickerSliderValueChanged += OnCyanChanged;
@@ -171,8 +171,8 @@ namespace Tango.Touch.Controls
             if (_magentaColorSlider != null)
             {
                 _magentaColorSlider.MinValue = 0;
-                _magentaColorSlider.MaxValue = 100;
-                CreateMagentaBrush(cmyk.C / 100, cmyk.Y / 100, cmyk.K / 100);
+                _magentaColorSlider.MaxValue = 200;
+                CreateMagentaBrush(cmyk.C / 200, cmyk.Y / 200, cmyk.K / 200);
                 _magentaColorSlider.ColorValue = cmyk.M;
                 _magentaColorSlider.ColorPickerText = "MAGENTA";
                 _magentaColorSlider.PickerSliderValueChanged += OnMagentaChanged;
@@ -186,8 +186,8 @@ namespace Tango.Touch.Controls
             if (_yellowColorSlider != null)
             {
                 _yellowColorSlider.MinValue = 0;
-                _yellowColorSlider.MaxValue = 100;
-                CreateYellowBrush(cmyk.C / 100, cmyk.M / 100, cmyk.K / 100);
+                _yellowColorSlider.MaxValue = 200;
+                CreateYellowBrush(cmyk.C / 200, cmyk.M / 200, cmyk.K / 200);
                 _yellowColorSlider.ColorValue = cmyk.Y;
                 _yellowColorSlider.ColorPickerText = "YELLOW";
                 _yellowColorSlider.PickerSliderValueChanged += OnYellowChanged;
@@ -201,8 +201,8 @@ namespace Tango.Touch.Controls
             if (_keyColorSlider != null)
             {
                 _keyColorSlider.MinValue = 0;
-                _keyColorSlider.MaxValue = 100;
-                CreateKeyBrush(cmyk.C / 100, cmyk.M / 100, cmyk.Y / 100);
+                _keyColorSlider.MaxValue = 200;
+                CreateKeyBrush(cmyk.C / 200, cmyk.M / 200, cmyk.Y / 200);
                 _keyColorSlider.ColorValue = cmyk.K;
                 _keyColorSlider.ColorPickerText = "KEY";
                 _keyColorSlider.PickerSliderValueChanged += OnKeyChanged;
@@ -298,8 +298,8 @@ namespace Tango.Touch.Controls
         {
             LinearGradientBrush cyanBrush = new LinearGradientBrush();
             cyanBrush.ColorInterpolationMode = ColorInterpolationMode.SRgbLinearInterpolation;
-            cyanBrush.GradientStops.Add(new GradientStop(ConvertCMYKToRGBColor(0, magenta, yellow, key), 0.0));
-            cyanBrush.GradientStops.Add(new GradientStop(ConvertCMYKToRGBColor(1, magenta, yellow, key), 1));
+            cyanBrush.GradientStops.Add(new GradientStop(Colors.White, 0.0));
+            cyanBrush.GradientStops.Add(new GradientStop(Colors.Cyan, 1));
             _cyanColorSlider.PickerBrush = cyanBrush;
         }
 
@@ -310,8 +310,8 @@ namespace Tango.Touch.Controls
         {
             LinearGradientBrush magentaBrush = new LinearGradientBrush();
             magentaBrush.ColorInterpolationMode = ColorInterpolationMode.SRgbLinearInterpolation;
-            magentaBrush.GradientStops.Add(new GradientStop(ConvertCMYKToRGBColor(cyan, 0, yellow, key), 0.0));
-            magentaBrush.GradientStops.Add(new GradientStop(ConvertCMYKToRGBColor(cyan, 1, yellow, key), 1.0));
+            magentaBrush.GradientStops.Add(new GradientStop(Colors.White, 0.0));
+            magentaBrush.GradientStops.Add(new GradientStop(Colors.Magenta, 1.0));
             _magentaColorSlider.PickerBrush = magentaBrush;
         }
 
@@ -322,8 +322,8 @@ namespace Tango.Touch.Controls
         {
             LinearGradientBrush yellowBrush = new LinearGradientBrush();
             yellowBrush.ColorInterpolationMode = ColorInterpolationMode.SRgbLinearInterpolation;
-            yellowBrush.GradientStops.Add(new GradientStop(ConvertCMYKToRGBColor(cyan, magenta, 0, key), 0.0));
-            yellowBrush.GradientStops.Add(new GradientStop(ConvertCMYKToRGBColor(cyan, magenta, 1, key), 1.0));
+            yellowBrush.GradientStops.Add(new GradientStop(Colors.White, 0.0));
+            yellowBrush.GradientStops.Add(new GradientStop(Colors.Yellow, 1.0));
             _yellowColorSlider.PickerBrush = yellowBrush;
         }
 
@@ -334,8 +334,8 @@ namespace Tango.Touch.Controls
         {
             LinearGradientBrush keyBrush = new LinearGradientBrush();
             keyBrush.ColorInterpolationMode = ColorInterpolationMode.SRgbLinearInterpolation;
-            keyBrush.GradientStops.Add(new GradientStop(ConvertCMYKToRGBColor(cyan, magenta, yellow, 0), 0.0));
-            keyBrush.GradientStops.Add(new GradientStop(ConvertCMYKToRGBColor(cyan, magenta, yellow, 1), 1.0));
+            keyBrush.GradientStops.Add(new GradientStop(Colors.White, 0.0));
+            keyBrush.GradientStops.Add(new GradientStop(Colors.Black, 1.0));
             _keyColorSlider.PickerBrush = keyBrush;
         }
 
@@ -346,16 +346,18 @@ namespace Tango.Touch.Controls
         {
             if (e.OldValue != e.NewValue)
             {
-                SelectedColor = ConvertCMYKToRGBColor(e.NewValue / 100, _magentaColorSlider.ColorValue / 100, _yellowColorSlider.ColorValue / 100, _keyColorSlider.ColorValue / 100);
-                _cyanColorSlider.SelectedColor = SelectedColor;
+                SelectedColor = ConvertCMYKToRGBColor(e.NewValue / 200, _magentaColorSlider.ColorValue / 200, _yellowColorSlider.ColorValue / 200, _keyColorSlider.ColorValue / 200);
+                //_cyanColorSlider.SelectedColor = SelectedColor;
                 Cyan = Math.Round(e.NewValue, 2, MidpointRounding.AwayFromZero);
+                _cyanColorSlider.SelectedColor = GetRelativeColor(_cyanColorSlider.PickerBrush.GradientStops, GetOffset(e.NewValue, _cyanColorSlider.MinValue, _cyanColorSlider.MaxValue));
 
-                CreateMagentaBrush(e.NewValue / 100, _yellowColorSlider.ColorValue / 100, _keyColorSlider.ColorValue / 100);
-                _magentaColorSlider.SelectedColor = SelectedColor;
-                CreateYellowBrush(e.NewValue / 100, _magentaColorSlider.ColorValue / 100, _keyColorSlider.ColorValue / 100);
-                _yellowColorSlider.SelectedColor = SelectedColor;
-                CreateKeyBrush(e.NewValue / 100, _magentaColorSlider.ColorValue / 100, _keyColorSlider.ColorValue / 100);
-                _keyColorSlider.SelectedColor = SelectedColor;
+
+                //CreateMagentaBrush(e.NewValue / 100, _yellowColorSlider.ColorValue / 100, _keyColorSlider.ColorValue / 100);
+                // _magentaColorSlider.SelectedColor = SelectedColor;
+                //CreateYellowBrush(e.NewValue / 100, _magentaColorSlider.ColorValue / 100, _keyColorSlider.ColorValue / 100);
+                // _yellowColorSlider.SelectedColor = SelectedColor;
+                //CreateKeyBrush(e.NewValue / 100, _magentaColorSlider.ColorValue / 100, _keyColorSlider.ColorValue / 100);
+                //_keyColorSlider.SelectedColor = SelectedColor;
             }
         }
 
@@ -366,16 +368,18 @@ namespace Tango.Touch.Controls
         {
             if (e.OldValue != e.NewValue)
             {
-                SelectedColor = ConvertCMYKToRGBColor(_cyanColorSlider.ColorValue / 100, e.NewValue / 100, _yellowColorSlider.ColorValue / 100, _keyColorSlider.ColorValue / 100);
-                _magentaColorSlider.SelectedColor = SelectedColor;
+                SelectedColor = ConvertCMYKToRGBColor(_cyanColorSlider.ColorValue / 200, e.NewValue / 200, _yellowColorSlider.ColorValue / 200, _keyColorSlider.ColorValue / 200);
+                //_magentaColorSlider.SelectedColor = SelectedColor;
                 Magenta = Math.Round(e.NewValue, 2, MidpointRounding.AwayFromZero);
+                _magentaColorSlider.SelectedColor = GetRelativeColor(_magentaColorSlider.PickerBrush.GradientStops, GetOffset(e.NewValue, _magentaColorSlider.MinValue, _magentaColorSlider.MaxValue));
+
 
-                CreateCyanBrush(e.NewValue / 100, _yellowColorSlider.ColorValue / 100, _keyColorSlider.ColorValue / 100);
-                _cyanColorSlider.SelectedColor = SelectedColor;
-                CreateYellowBrush(_cyanColorSlider.ColorValue / 100, e.NewValue / 100, _keyColorSlider.ColorValue / 100);
-                _yellowColorSlider.SelectedColor = SelectedColor;
-                CreateKeyBrush(_cyanColorSlider.ColorValue / 100, e.NewValue / 100, _yellowColorSlider.ColorValue / 100);
-                _keyColorSlider.SelectedColor = SelectedColor;
+                //CreateCyanBrush(e.NewValue / 100, _yellowColorSlider.ColorValue / 100, _keyColorSlider.ColorValue / 100);
+                //_cyanColorSlider.SelectedColor = SelectedColor;
+                //CreateYellowBrush(_cyanColorSlider.ColorValue / 100, e.NewValue / 100, _keyColorSlider.ColorValue / 100);
+                //_yellowColorSlider.SelectedColor = SelectedColor;
+                //CreateKeyBrush(_cyanColorSlider.ColorValue / 100, e.NewValue / 100, _yellowColorSlider.ColorValue / 100);
+                //_keyColorSlider.SelectedColor = SelectedColor;
             }
         }
 
@@ -386,16 +390,18 @@ namespace Tango.Touch.Controls
         {
             if (e.OldValue != e.NewValue)
             {
-                SelectedColor = ConvertCMYKToRGBColor(_cyanColorSlider.ColorValue / 100, _magentaColorSlider.ColorValue / 100, e.NewValue / 100, _keyColorSlider.ColorValue / 100);
-                _yellowColorSlider.SelectedColor = SelectedColor;
+                SelectedColor = ConvertCMYKToRGBColor(_cyanColorSlider.ColorValue / 200, _magentaColorSlider.ColorValue / 200, e.NewValue / 200, _keyColorSlider.ColorValue / 200);
+                //_yellowColorSlider.SelectedColor = SelectedColor;
                 Yellow = Math.Round(e.NewValue, 2, MidpointRounding.AwayFromZero);
+                _yellowColorSlider.SelectedColor = GetRelativeColor(_yellowColorSlider.PickerBrush.GradientStops, GetOffset(e.NewValue, _yellowColorSlider.MinValue, _yellowColorSlider.MaxValue));
+
 
-                CreateCyanBrush(_magentaColorSlider.ColorValue / 100, e.NewValue / 100, _keyColorSlider.ColorValue / 100);
-                _cyanColorSlider.SelectedColor = SelectedColor;
-                CreateMagentaBrush(_cyanColorSlider.ColorValue / 100, e.NewValue / 100, _keyColorSlider.ColorValue / 100);
-                _magentaColorSlider.SelectedColor = SelectedColor;
-                CreateKeyBrush(_cyanColorSlider.ColorValue / 100, _magentaColorSlider.ColorValue / 100, e.NewValue / 100);
-                _keyColorSlider.SelectedColor = SelectedColor;
+                //CreateCyanBrush(_magentaColorSlider.ColorValue / 100, e.NewValue / 100, _keyColorSlider.ColorValue / 100);
+                //_cyanColorSlider.SelectedColor = SelectedColor;
+                //CreateMagentaBrush(_cyanColorSlider.ColorValue / 100, e.NewValue / 100, _keyColorSlider.ColorValue / 100);
+                //_magentaColorSlider.SelectedColor = SelectedColor;
+                //CreateKeyBrush(_cyanColorSlider.ColorValue / 100, _magentaColorSlider.ColorValue / 100, e.NewValue / 100);
+                //_keyColorSlider.SelectedColor = SelectedColor;
             }
         }
 
@@ -406,16 +412,18 @@ namespace Tango.Touch.Controls
         {
             if (e.OldValue != e.NewValue)
             {
-                SelectedColor = ConvertCMYKToRGBColor(_cyanColorSlider.ColorValue / 100, _magentaColorSlider.ColorValue / 100, _yellowColorSlider.ColorValue / 100, e.NewValue / 100);
-                _keyColorSlider.SelectedColor = SelectedColor;
+                SelectedColor = ConvertCMYKToRGBColor(_cyanColorSlider.ColorValue / 200, _magentaColorSlider.ColorValue / 200, _yellowColorSlider.ColorValue / 200, e.NewValue / 200);
+                //_keyColorSlider.SelectedColor = SelectedColor;
                 Key = Math.Round(e.NewValue, 2, MidpointRounding.AwayFromZero);
+                _keyColorSlider.SelectedColor = GetRelativeColor(_keyColorSlider.PickerBrush.GradientStops, GetOffset(e.NewValue, _keyColorSlider.MinValue, _keyColorSlider.MaxValue));
 
-                CreateCyanBrush(_magentaColorSlider.ColorValue / 100, _yellowColorSlider.ColorValue / 100, e.NewValue / 100);
-                _cyanColorSlider.SelectedColor = SelectedColor;
-                CreateMagentaBrush(_cyanColorSlider.ColorValue / 100, _yellowColorSlider.ColorValue / 100, e.NewValue / 100);
-                _magentaColorSlider.SelectedColor = SelectedColor;
-                CreateYellowBrush(_cyanColorSlider.ColorValue / 100, _magentaColorSlider.ColorValue / 100, e.NewValue / 100);
-                _yellowColorSlider.SelectedColor = SelectedColor;
+
+                //CreateCyanBrush(_magentaColorSlider.ColorValue / 100, _yellowColorSlider.ColorValue / 100, e.NewValue / 100);
+                //_cyanColorSlider.SelectedColor = SelectedColor;
+                //CreateMagentaBrush(_cyanColorSlider.ColorValue / 100, _yellowColorSlider.ColorValue / 100, e.NewValue / 100);
+                //_magentaColorSlider.SelectedColor = SelectedColor;
+                //CreateYellowBrush(_cyanColorSlider.ColorValue / 100, _magentaColorSlider.ColorValue / 100, e.NewValue / 100);
+                //_yellowColorSlider.SelectedColor = SelectedColor;
             }
         }
 
@@ -424,20 +432,6 @@ namespace Tango.Touch.Controls
         /// </summary>
         public Color ConvertCMYKToRGBColor(double cyan, double magenta, double yellow, double key)
         {
-            //var t = 255 * (1 - cyan) * (1 - black);
-            //var red = (int)(255 * (1 - cyan) * (1 - black));
-            //var green = (int)(255 * (1 - magenta) * (1 - black));
-            //var blue = (int)(255 * (1 - yellow) * (1 - black));
-            //Cmyk cmyk = new Cmyk(cyan, magenta, yellow, black);
-            //Rgb rgb = new Rgb(cmyk.ToRgb());
-
-            //var test1 = Color.FromArgb(255, (byte)red, (byte)green, (byte)blue);
-            //var test2 = Color.FromArgb(255, (byte)rgb.R, (byte)rgb.G, (byte)rgb.B);
-            //if(test1 != test2)
-            //{
-            //    int b = 0;
-            //    b = 1;
-            //}
             Cmyk cmyk = new Cmyk(cyan, magenta, yellow, key);
             Rgb rgb = new Rgb(cmyk.ToRgb());
             return Color.FromArgb(255, (byte)rgb.R, (byte)rgb.G, (byte)rgb.B);
@@ -448,15 +442,6 @@ namespace Tango.Touch.Controls
         /// </summary>
         public static Cmyk ConvertRgbToCmyk(int r, int g, int b)
         {
-            //float c, m, y, k, rf, gf, bf;
-            //rf = r / 255F;
-            //gf = g / 255F;
-            //bf = b / 255F;
-
-            //k = Convert.ToUInt32(ClampCmyk(1 - Math.Max(Math.Max(rf, gf), bf)));
-            //c = Convert.ToUInt32(ClampCmyk((1 - rf - k) / (1 - k)));
-            //m = Convert.ToUInt32(ClampCmyk((1 - gf - k) / (1 - k)));
-            //y = Convert.ToUInt32(ClampCmyk((1 - bf - k) / (1 - k)));
             Rgb rgb = new Rgb(r, g, b);
             var cmyk = rgb.To<Cmyk>();
 
@@ -470,6 +455,42 @@ namespace Tango.Touch.Controls
         {
             return (value < 0 || float.IsNaN(value)) ? 0 : value;
         }
+
+        public static Color GetRelativeColor(GradientStopCollection gsc, double offset)
+        {
+            var point = gsc.SingleOrDefault(f => f.Offset == offset);
+            if (point != null) return point.Color;
+
+            GradientStop before = gsc.Where(w => w.Offset == gsc.Min(m => m.Offset)).First();
+            GradientStop after = gsc.Where(w => w.Offset == gsc.Max(m => m.Offset)).First();
+
+            foreach (var gs in gsc)
+            {
+                if (gs.Offset < offset && gs.Offset > before.Offset)
+                {
+                    before = gs;
+                }
+                if (gs.Offset > offset && gs.Offset < after.Offset)
+                {
+                    after = gs;
+                }
+            }
+
+            var color = new Color();
+
+            color.ScA = (float)((offset - before.Offset) * (after.Color.ScA - before.Color.ScA) / (after.Offset - before.Offset) + before.Color.ScA);
+            color.ScR = (float)((offset - before.Offset) * (after.Color.ScR - before.Color.ScR) / (after.Offset - before.Offset) + before.Color.ScR);
+            color.ScG = (float)((offset - before.Offset) * (after.Color.ScG - before.Color.ScG) / (after.Offset - before.Offset) + before.Color.ScG);
+            color.ScB = (float)((offset - before.Offset) * (after.Color.ScB - before.Color.ScB) / (after.Offset - before.Offset) + before.Color.ScB);
+
+            return color;
+        }
+
+        public static double GetOffset(double value, double minValue, double maxValue)
+        {
+            return ((value - minValue) / (maxValue - minValue));
+        }
+
         #endregion
 
         #region Events
diff --git a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerCMYKControl.xaml b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerCMYKControl.xaml
index 513909c9e..e25ed8572 100644
--- a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerCMYKControl.xaml
+++ b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerCMYKControl.xaml
@@ -12,20 +12,20 @@
             <Setter.Value>
                 <ControlTemplate TargetType="{x:Type local:TouchColorPickerCMYKControl}">
                     <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" SnapsToDevicePixels="True" CornerRadius="16" Padding="0">
-                        <UniformGrid Margin="4" Columns="1" Rows="4">
-                            <local:TouchColorPickerControl x:Name="PART_CTouchColorPickerControl" Grid.Row="0" Margin=" 0 10 0 0" HorizontalAlignment="Stretch" BorderBrush="{TemplateBinding BorderBrush}"  MinWidth="160" VerticalAlignment="Bottom" MinValue="0" MaxValue="100"
+                        <UniformGrid Margin="0" Columns="1" Rows="4">
+                            <local:TouchColorPickerControl x:Name="PART_CTouchColorPickerControl" Grid.Row="0" Margin=" 0 10 0 0" HorizontalAlignment="Stretch" BorderBrush="{TemplateBinding BorderBrush}"  MinWidth="160" VerticalAlignment="Bottom" MinValue="0" MaxValue="200"
                                                            ThumbHeight="{Binding ThumbHeight, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerCMYKControl}}" 
                                                            ThumbHeightInside="{Binding ThumbHeightInside, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerCMYKControl}}"
                                                            ThumbColor="{Binding ThumbColor, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerCMYKControl}}"/>
-                            <local:TouchColorPickerControl x:Name="PART_MTouchColorPickerControl" Grid.Row="1" Margin=" 0 4 0 0" HorizontalAlignment="Stretch" BorderBrush="{TemplateBinding BorderBrush}"  MinWidth="160" VerticalAlignment="Bottom" MinValue="0" MaxValue="100"
+                            <local:TouchColorPickerControl x:Name="PART_MTouchColorPickerControl" Grid.Row="1" Margin=" 0 4 0 0" HorizontalAlignment="Stretch" BorderBrush="{TemplateBinding BorderBrush}"  MinWidth="160" VerticalAlignment="Bottom" MinValue="0" MaxValue="200"
                                                            ThumbHeight="{Binding ThumbHeight, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerCMYKControl}}" 
                                                            ThumbHeightInside="{Binding ThumbHeightInside, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerCMYKControl}}"
                                                            ThumbColor="{Binding ThumbColor, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerCMYKControl}}"/>
-                            <local:TouchColorPickerControl x:Name="PART_YTouchColorPickerControl" Grid.Row="2" Margin=" 0 4 0 0" HorizontalAlignment="Stretch" BorderBrush="{TemplateBinding BorderBrush}"   MinWidth="160" VerticalAlignment="Bottom" MinValue="0" MaxValue="100"
+                            <local:TouchColorPickerControl x:Name="PART_YTouchColorPickerControl" Grid.Row="2" Margin=" 0 4 0 0" HorizontalAlignment="Stretch" BorderBrush="{TemplateBinding BorderBrush}"   MinWidth="160" VerticalAlignment="Bottom" MinValue="0" MaxValue="200"
                                                            ThumbHeight="{Binding ThumbHeight, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerCMYKControl}}"
                                                            ThumbHeightInside="{Binding ThumbHeightInside, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerCMYKControl}}"
                                                            ThumbColor="{Binding ThumbColor, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerCMYKControl}}"/>
-                            <local:TouchColorPickerControl x:Name="PART_KTouchColorPickerControl" Grid.Row="3" Margin=" 0 4 0 0" HorizontalAlignment="Stretch" BorderBrush="{TemplateBinding BorderBrush}"   MinWidth="160" VerticalAlignment="Bottom" MinValue="0" MaxValue="100"
+                            <local:TouchColorPickerControl x:Name="PART_KTouchColorPickerControl" Grid.Row="3" Margin=" 0 4 0 0" HorizontalAlignment="Stretch" BorderBrush="{TemplateBinding BorderBrush}"   MinWidth="160" VerticalAlignment="Bottom" MinValue="0" MaxValue="200"
                                                            ThumbHeight="{Binding ThumbHeight, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerCMYKControl}}"
                                                            ThumbHeightInside="{Binding ThumbHeightInside, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerCMYKControl}}"
                                                            ThumbColor="{Binding ThumbColor, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerCMYKControl}}"/>
diff --git a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerHSBControl.xaml b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerHSBControl.xaml
index d2e28ca74..bd596a7c7 100644
--- a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerHSBControl.xaml
+++ b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerHSBControl.xaml
@@ -13,7 +13,7 @@
             <Setter.Value>
                 <ControlTemplate TargetType="{x:Type local:TouchColorPickerHSBControl}">
                     <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" SnapsToDevicePixels="True" CornerRadius="16" Padding="0">
-                        <UniformGrid Margin="4" Columns="1" Rows="3">
+                        <UniformGrid Margin="0" Columns="1" Rows="3">
                             <local:TouchColorPickerControl x:Name="PART_HColorPickerControl" Grid.Row="0" Margin=" 0 10 0 0" HorizontalAlignment="Stretch" BorderBrush="{TemplateBinding BorderBrush}"  MinWidth="160" VerticalAlignment="Bottom" MinValue="0" MaxValue="360"
                                                            ThumbHeight="{Binding ThumbHeight, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerHSBControl}}" 
                                                            ThumbHeightInside="{Binding ThumbHeightInside, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerHSBControl}}"
diff --git a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerLABControl.cs b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerLABControl.cs
index 98fb01aea..d80ec410c 100644
--- a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerLABControl.cs
+++ b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerLABControl.cs
@@ -15,7 +15,6 @@ namespace Tango.Touch.Controls
     [TemplatePart(Name = PART_GRTouchColorPickerControl, Type = typeof(TouchColorPickerControl))]
     [TemplatePart(Name = PART_BYTouchColorPickerControl, Type = typeof(TouchColorPickerControl))]
     public class TouchColorPickerLABControl : Control
-    
     {
         private const string PART_LTouchColorPickerControl = "PART_LTouchColorPickerControl";
         private const string PART_GRTouchColorPickerControl = "PART_GRTouchColorPickerControl";
@@ -304,8 +303,9 @@ namespace Tango.Touch.Controls
                 SelectedColor = ConvertLabToRgb(e.NewValue, _greenRedColorSlider.ColorValue, _blueYellowColorSlider.ColorValue);
 
                 L = Math.Round(e.NewValue, 2, MidpointRounding.AwayFromZero);
-                _greenRedColorSlider.SelectedColor = SelectedColor;
-                _blueYellowColorSlider.SelectedColor = SelectedColor;
+                _luminanceColorSlider.SelectedColor = GetRelativeColor(_luminanceColorSlider.PickerBrush.GradientStops, GetOffset(e.NewValue, _luminanceColorSlider.MinValue, _luminanceColorSlider.MaxValue));
+                //_greenRedColorSlider.SelectedColor = SelectedColor;
+                //_blueYellowColorSlider.SelectedColor = SelectedColor;
                 // CreateGreenRedBrush(e.NewValue, _greenRedColorSlider.ColorValue, _blueYellowColorSlider.ColorValue);
                 //CreateBlueYellowBrush(e.NewValue, _greenRedColorSlider.ColorValue, _blueYellowColorSlider.ColorValue);
             }
@@ -320,10 +320,11 @@ namespace Tango.Touch.Controls
             {
                 SelectedColor = ConvertLabToRgb(_luminanceColorSlider.ColorValue, e.NewValue, _blueYellowColorSlider.ColorValue);
                 A = Math.Round(e.NewValue, 2, MidpointRounding.AwayFromZero);
-                _greenRedColorSlider.SelectedColor = SelectedColor;
+                _greenRedColorSlider.SelectedColor = GetRelativeColor(_greenRedColorSlider.PickerBrush.GradientStops, GetOffset(e.NewValue, _greenRedColorSlider.MinValue, _greenRedColorSlider.MaxValue));
+                //_greenRedColorSlider.SelectedColor = ConvertLabToRgb(100, e.NewValue, 0); ;
 
-                _luminanceColorSlider.SelectedColor = SelectedColor;
-                _blueYellowColorSlider.SelectedColor = SelectedColor;
+                //_luminanceColorSlider.SelectedColor = SelectedColor;
+                //_blueYellowColorSlider.SelectedColor = SelectedColor;
                 //CreateLuminanceBrush(_luminanceColorSlider.ColorValue, e.NewValue, _blueYellowColorSlider.ColorValue);
                 //CreateBlueYellowBrush(_luminanceColorSlider.ColorValue, e.NewValue, _blueYellowColorSlider.ColorValue);
             }
@@ -339,10 +340,11 @@ namespace Tango.Touch.Controls
 
                 SelectedColor = ConvertLabToRgb(_luminanceColorSlider.ColorValue, _greenRedColorSlider.ColorValue, e.NewValue);
                 B = Math.Round(e.NewValue, 2, MidpointRounding.AwayFromZero);
-                _blueYellowColorSlider.SelectedColor = SelectedColor;
+                _blueYellowColorSlider.SelectedColor = GetRelativeColor(_blueYellowColorSlider.PickerBrush.GradientStops, GetOffset(e.NewValue, _blueYellowColorSlider.MinValue, _blueYellowColorSlider.MaxValue));
+                //_blueYellowColorSlider.SelectedColor = ConvertLabToRgb(100, 0, e.NewValue);
 
-                _luminanceColorSlider.SelectedColor = SelectedColor;
-                _greenRedColorSlider.SelectedColor = SelectedColor;
+                //_luminanceColorSlider.SelectedColor = SelectedColor;
+               // _greenRedColorSlider.SelectedColor = SelectedColor;
                 //CreateLuminanceBrush(_luminanceColorSlider.ColorValue, _greenRedColorSlider.ColorValue, e.NewValue);
                 //CreateGreenRedBrush(_luminanceColorSlider.ColorValue, _greenRedColorSlider.ColorValue, e.NewValue);
             }
@@ -382,6 +384,42 @@ namespace Tango.Touch.Controls
             return lab;
 
         }
+
+        public static Color GetRelativeColor(GradientStopCollection gsc, double offset)
+        {
+            var point = gsc.SingleOrDefault(f => f.Offset == offset);
+            if (point != null) return point.Color;
+
+            GradientStop before = gsc.Where(w => w.Offset == gsc.Min(m => m.Offset)).First();
+            GradientStop after = gsc.Where(w => w.Offset == gsc.Max(m => m.Offset)).First();
+
+            foreach (var gs in gsc)
+            {
+                if (gs.Offset < offset && gs.Offset > before.Offset)
+                {
+                    before = gs;
+                }
+                if (gs.Offset > offset && gs.Offset < after.Offset)
+                {
+                    after = gs;
+                }
+            }
+
+            var color = new Color();
+
+            color.ScA = (float)((offset - before.Offset) * (after.Color.ScA - before.Color.ScA) / (after.Offset - before.Offset) + before.Color.ScA);
+            color.ScR = (float)((offset - before.Offset) * (after.Color.ScR - before.Color.ScR) / (after.Offset - before.Offset) + before.Color.ScR);
+            color.ScG = (float)((offset - before.Offset) * (after.Color.ScG - before.Color.ScG) / (after.Offset - before.Offset) + before.Color.ScG);
+            color.ScB = (float)((offset - before.Offset) * (after.Color.ScB - before.Color.ScB) / (after.Offset - before.Offset) + before.Color.ScB);
+
+            return color;
+        }
+
+        public static double GetOffset( double  value, double minValue, double maxValue)
+        {
+            return ((value - minValue) / (maxValue - minValue));
+        }
+
         #endregion
     }
 }
diff --git a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerLABControl.xaml b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerLABControl.xaml
index 4ccf71295..b39796540 100644
--- a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerLABControl.xaml
+++ b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerLABControl.xaml
@@ -13,7 +13,7 @@
             <Setter.Value>
                 <ControlTemplate TargetType="{x:Type local:TouchColorPickerLABControl}">
                     <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" SnapsToDevicePixels="True" CornerRadius="16" Padding="0">
-                        <UniformGrid Margin="4" Columns="1" Rows="3">
+                        <UniformGrid Margin="0" Columns="1" Rows="3">
                             <local:TouchColorPickerControl x:Name="PART_LTouchColorPickerControl" Grid.Row="0" Margin=" 0 10 0 0" HorizontalAlignment="Stretch" BorderBrush="{TemplateBinding BorderBrush}"  MinWidth="160" VerticalAlignment="Bottom" MinValue="0" MaxValue="360"
                                                            ThumbHeight="{Binding ThumbHeight, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerLABControl}}" 
                                                            ThumbHeightInside="{Binding ThumbHeightInside, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerLABControl}}"
diff --git a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerRGBControl.cs b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerRGBControl.cs
index 1d5b285ea..271f04c9d 100644
--- a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerRGBControl.cs
+++ b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerRGBControl.cs
@@ -253,11 +253,11 @@ namespace Tango.Touch.Controls
           //  if (e.OldValue != e.NewValue)
             {
                 Color color = Color.FromRgb((byte)e.NewValue, (byte)_GColorSlider.ColorValue, (byte)_BColorSlider.ColorValue);
-                _RColorSlider.SelectedColor = color;
+                _RColorSlider.SelectedColor = Color.FromRgb(255, 0, 0); ;
                 R = Math.Round(e.NewValue, 2, MidpointRounding.AwayFromZero);
                 SelectedColor = color;
-                _GColorSlider.SelectedColor = SelectedColor;
-                _BColorSlider.SelectedColor = SelectedColor;
+                //_GColorSlider.SelectedColor = SelectedColor;
+                //_BColorSlider.SelectedColor = SelectedColor;
                 //CreateGBrush(color);
                 //CreateBBrush(color);
             }
@@ -271,11 +271,11 @@ namespace Tango.Touch.Controls
           //  if (e.OldValue != e.NewValue)
             {
                 Color color = Color.FromRgb((byte)_RColorSlider.ColorValue, (byte)_GColorSlider.ColorValue, (byte)_BColorSlider.ColorValue);
-                _GColorSlider.SelectedColor = color;
+                _GColorSlider.SelectedColor = Color.FromRgb(0, 255, 0);
                 G = Math.Round(e.NewValue, 2, MidpointRounding.AwayFromZero);
                 SelectedColor = color;
-                _RColorSlider.SelectedColor = SelectedColor;
-                _BColorSlider.SelectedColor = SelectedColor;
+                //_RColorSlider.SelectedColor = SelectedColor;
+                //_BColorSlider.SelectedColor = SelectedColor;
                 //CreateRBrush(color);
                 //CreateBBrush(color);
             }
@@ -289,11 +289,11 @@ namespace Tango.Touch.Controls
          //   if (e.OldValue != e.NewValue)
             {
                 Color color = Color.FromRgb((byte)_RColorSlider.ColorValue, (byte)_GColorSlider.ColorValue, (byte)_BColorSlider.ColorValue);
-                _BColorSlider.SelectedColor = color;
+                _BColorSlider.SelectedColor = Color.FromRgb(0, 0, 255);
                 B = Math.Round(e.NewValue, 2, MidpointRounding.AwayFromZero);
                 SelectedColor = color;
-                _RColorSlider.SelectedColor = SelectedColor;
-                _GColorSlider.SelectedColor = SelectedColor;
+                //_RColorSlider.SelectedColor = SelectedColor;
+                //_GColorSlider.SelectedColor = SelectedColor;
                 //CreateRBrush(color);
                 //CreateGBrush(color);
             }
@@ -311,7 +311,7 @@ namespace Tango.Touch.Controls
             rBrush.GradientStops.Add(new GradientStop(Color.FromRgb(255, 0, 0), 0.0));
             rBrush.GradientStops.Add(new GradientStop(Color.FromRgb(255, 0, 0), 1.0));
             _RColorSlider.PickerBrush = rBrush;
-            _RColorSlider.SelectedColor = Color.FromRgb((byte)_RColorSlider.ColorValue, color.G, color.B);
+            _RColorSlider.SelectedColor = Color.FromRgb(255, 0, 0);// Color.FromRgb((byte)_RColorSlider.ColorValue, color.G, color.B);
         }
 
         /// <summary>
@@ -326,7 +326,7 @@ namespace Tango.Touch.Controls
             gBrush.GradientStops.Add(new GradientStop(Color.FromRgb(0, 255, 0), 0.0));
             gBrush.GradientStops.Add(new GradientStop(Color.FromRgb(0, 255, 0), 1.0));
             _GColorSlider.PickerBrush = gBrush;
-            _GColorSlider.SelectedColor = Color.FromRgb(color.R, (byte) _GColorSlider.ColorValue, color.B);
+            _GColorSlider.SelectedColor = Color.FromRgb(0, 255, 0);// Color.FromRgb(color.R, (byte) _GColorSlider.ColorValue, color.B);
         }
 
         /// <summary>
@@ -341,7 +341,7 @@ namespace Tango.Touch.Controls
             bBrush.GradientStops.Add(new GradientStop(Color.FromRgb(0, 0, 255), 0.0));
             bBrush.GradientStops.Add(new GradientStop(Color.FromRgb(0, 0, 255), 1.0));
             _BColorSlider.PickerBrush = bBrush;
-            _BColorSlider.SelectedColor = Color.FromRgb(color.R, color.G, (byte)_BColorSlider.ColorValue);
+            _BColorSlider.SelectedColor = Color.FromRgb(0, 0, 255);// Color.FromRgb(color.R, color.G, (byte)_BColorSlider.ColorValue);
         }
 
         #endregion
diff --git a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerRGBControl.xaml b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerRGBControl.xaml
index 86a3e35bb..4940e38fd 100644
--- a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerRGBControl.xaml
+++ b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchColorPickerRGBControl.xaml
@@ -11,7 +11,7 @@
             <Setter.Value>
                 <ControlTemplate TargetType="{x:Type local:TouchColorPickerRGBControl}">
                     <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" SnapsToDevicePixels="True" CornerRadius="16" Padding="0">
-                        <UniformGrid Margin="4" Columns="1" Rows="3">
+                        <UniformGrid Margin="0" Columns="1" Rows="3">
                             <local:TouchColorPickerControl x:Name="PART_RTouchColorPickerControl" Grid.Row="0" Margin=" 0 10 0 0" HorizontalAlignment="Stretch" BorderBrush="{TemplateBinding BorderBrush}"  VerticalAlignment="Stretch" MinValue="0" MaxValue="255"
                                                            ThumbHeight="{Binding ThumbHeight, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerRGBControl}}" 
                                                            ThumbHeightInside="{Binding ThumbHeightInside, RelativeSource={RelativeSource AncestorType=local:TouchColorPickerRGBControl}}"
diff --git a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchSliderThreeThumbs.cs b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchSliderThreeThumbs.cs
index 52321a7a2..fa2a2d5b0 100644
--- a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchSliderThreeThumbs.cs
+++ b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchSliderThreeThumbs.cs
@@ -1,16 +1,19 @@
 using System;
 using System.Collections.Generic;
+using System.Diagnostics;
 using System.Linq;
 using System.Text;
 using System.Threading.Tasks;
 using System.Windows;
 using System.Windows.Controls;
+using System.Windows.Controls.Primitives;
 
 namespace Tango.Touch.Controls
 {
-    [TemplatePart(Name = PART_LowerSlider, Type = typeof(TouchSlider))]
-    [TemplatePart(Name = Part_MiddleSlider, Type = typeof(TouchSlider))]
-    [TemplatePart(Name = PART_UpperSlider, Type = typeof(TouchSlider))]
+    [TemplatePart(Name = PART_LowerSlider, Type = typeof(Slider))]
+    [TemplatePart(Name = Part_MiddleSlider, Type = typeof(Slider))]
+    [TemplatePart(Name = PART_UpperSlider, Type = typeof(Slider))]
+
     public class TouchSliderThreeThumbs : Control
     {
         private const string PART_LowerSlider = "PART_LowerSlider";
@@ -19,9 +22,9 @@ namespace Tango.Touch.Controls
 
         #region Members
 
-        private TouchSlider _lowerSlider;
-        private TouchSlider _middleSlider;
-        private TouchSlider _upperSlider;
+        private Slider _lowerSlider;
+        private Slider _middleSlider;
+        private Slider _upperSlider;
 
         #endregion
 
@@ -40,7 +43,8 @@ namespace Tango.Touch.Controls
         }
 
         public static readonly DependencyProperty LowerValueProperty =
-            DependencyProperty.Register("LowerValue", typeof(double), typeof(TouchSliderThreeThumbs), new UIPropertyMetadata(0d, null, LowerValueCoerceValueCallback));
+            DependencyProperty.Register("LowerValue", typeof(double), typeof(TouchSliderThreeThumbs), 
+                new FrameworkPropertyMetadata(0d, null, new CoerceValueCallback(LowerValueCoerceValueCallback)));
 
         public double UpperValue
         {
@@ -48,7 +52,8 @@ namespace Tango.Touch.Controls
             set { SetValue(UpperValueProperty, value); }
         }
         public static readonly DependencyProperty UpperValueProperty =
-            DependencyProperty.Register("UpperValue", typeof(double), typeof(TouchSliderThreeThumbs), new UIPropertyMetadata(1d, null, UpperValueCoerceValueCallback));
+            DependencyProperty.Register("UpperValue", typeof(double), typeof(TouchSliderThreeThumbs), 
+                new FrameworkPropertyMetadata(100d, null, new CoerceValueCallback(UpperValueCoerceValueCallback)));
 
         public double MiddleValue
         {
@@ -56,7 +61,10 @@ namespace Tango.Touch.Controls
             set { SetValue(MiddleValueProperty, value); }
         }
         public static readonly DependencyProperty MiddleValueProperty = 
-            DependencyProperty.Register("MiddleValue", typeof(double), typeof(TouchSliderThreeThumbs), new UIPropertyMetadata(0d, null, MiddleValueCoerceValueCallback));
+            DependencyProperty.Register("MiddleValue", typeof(double), typeof(TouchSliderThreeThumbs), 
+                new FrameworkPropertyMetadata(50d, null, new CoerceValueCallback(MiddleValueCoerceValueCallback)));
+
+        
 
         public double MinimumMiddleRange
         {
@@ -67,7 +75,7 @@ namespace Tango.Touch.Controls
         /// The minimum middle range property in meters
         /// </summary>
         public static readonly DependencyProperty MinimumMiddleRangeProperty =
-            DependencyProperty.Register("MinimumMiddleRange", typeof(double), typeof(TouchSliderThreeThumbs), new UIPropertyMetadata(5d));
+            DependencyProperty.Register("MinimumMiddleRange", typeof(double), typeof(TouchSliderThreeThumbs), new FrameworkPropertyMetadata(5d));
 
        
         public double Length
@@ -80,7 +88,8 @@ namespace Tango.Touch.Controls
         /// The length property in meters
         /// </summary>
         public static readonly DependencyProperty LengthProperty =
-            DependencyProperty.Register("Length", typeof(double), typeof(TouchSliderThreeThumbs), new FrameworkPropertyMetadata(5d, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault, new PropertyChangedCallback(OnLengthPropertyChanged)));
+            DependencyProperty.Register("Length", typeof(double), typeof(TouchSliderThreeThumbs), 
+                new FrameworkPropertyMetadata(5d, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault, new PropertyChangedCallback(OnLengthPropertyChanged)));
 
         public double MaxLowerValue {
             get
@@ -111,11 +120,43 @@ namespace Tango.Touch.Controls
             //if (_lowerSlider != null)
             //    _lowerSlider.ValueChanged -= LowerSlider_ValueChanged;
 
-            _lowerSlider = GetTemplateChild(PART_LowerSlider) as TouchSlider;
+            _lowerSlider = GetTemplateChild(PART_LowerSlider) as Slider;
+
+            _middleSlider = GetTemplateChild(Part_MiddleSlider) as Slider;
+
+            _upperSlider = GetTemplateChild(PART_UpperSlider) as Slider;
+            
+            var track = _upperSlider.Template.FindName("PART_Track", _upperSlider) as Track;
+            
+            if(track != null)
+            {
+                track.Thumb.DragDelta += Thumb_DragDelta_Upper;
+            }
+            _upperSlider.ValueChanged += _upperSlider_ValueChanged;
+
+            //_upperSlider.PreviewTouchMove += _upperSlider_PreviewTouchMove;
+
+        }
 
-            _middleSlider = GetTemplateChild(Part_MiddleSlider) as TouchSlider;
+        
+
+        private void _upperSlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
+        {
+            if (_upperSlider != null && _upperSlider.Value != (double)e.NewValue)
+            {
+                var value = (double)e.NewValue;
+                Debug.WriteLine($" !!!!!! MinUpperValue = {MinUpperValue}.");
+                var test = Math.Max(Math.Max(value, MinUpperValue), MiddleValue);
+                _upperSlider.Value = (double)e.NewValue;
+            }
+            e.Handled = true;
+        }
 
-            _upperSlider = GetTemplateChild(PART_UpperSlider) as TouchSlider;
+        private void Thumb_DragDelta_Upper(object sender, DragDeltaEventArgs e)
+        {
+            UIElement thumb = e.Source as UIElement;
+            var test = e.HorizontalChange;
+            Debug.WriteLine($" !!!!!! Thumb_DragDelta_Upper {test}.");
         }
 
         #endregion
@@ -140,23 +181,25 @@ namespace Tango.Touch.Controls
         {
             TouchSliderThreeThumbs targetSlider = (TouchSliderThreeThumbs)target;
             double value = (double)valueObject;
-            
             return Math.Min(Math.Min(value, targetSlider.MaxLowerValue), targetSlider.MiddleValue);
         }
-
-        private static object MiddleValueCoerceValueCallback(DependencyObject target, object valueObject)
+        
+        private static object UpperValueCoerceValueCallback(DependencyObject target, object valueObject)
         {
             TouchSliderThreeThumbs targetSlider = (TouchSliderThreeThumbs)target;
             double value = (double)valueObject;
-            //var testValue = Math.Max(value, targetSlider.LowerValue);
-            return Math.Min(Math.Max(value, targetSlider.LowerValue), targetSlider.UpperValue);
+            
+            var test = Math.Max(Math.Max(value, targetSlider.MinUpperValue), targetSlider.MiddleValue);
+            return test;
         }
-        private static object UpperValueCoerceValueCallback(DependencyObject target, object valueObject)
+
+        private static object MiddleValueCoerceValueCallback(DependencyObject target, object valueObject)
         {
             TouchSliderThreeThumbs targetSlider = (TouchSliderThreeThumbs)target;
             double value = (double)valueObject;
-
-            return Math.Max(Math.Max(value, targetSlider.MinUpperValue), targetSlider.MiddleValue);
+            //var testValue = Math.Max(value, targetSlider.LowerValue);
+            var test = Math.Min(Math.Max(value, targetSlider.LowerValue), targetSlider.UpperValue);
+            return test;
         }
 
         #endregion
diff --git a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchSliderThreeThumbs.xaml b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchSliderThreeThumbs.xaml
index f4cbd46b6..1c53f1f9f 100644
--- a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchSliderThreeThumbs.xaml
+++ b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchSliderThreeThumbs.xaml
@@ -1,55 +1,59 @@
 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-                    xmlns:local="clr-namespace:Tango.Touch.Controls">
-
+                    xmlns:local="clr-namespace:Tango.Touch.Controls"
+                    >
     <ResourceDictionary.MergedDictionaries>
         <ResourceDictionary Source="../Resources/Colors.xaml" />
     </ResourceDictionary.MergedDictionaries>
-    
+
+    <ControlTemplate x:Key="simpleSlider" TargetType="{x:Type Slider}">
+        <Border SnapsToDevicePixels="true" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
+            <Grid>
+                <Grid.RowDefinitions>
+                    <RowDefinition Height="Auto"/>
+                    <RowDefinition Height="Auto" MinHeight="{TemplateBinding MinHeight}"/>
+                    <RowDefinition Height="Auto"/>
+                </Grid.RowDefinitions>
+
+                <Rectangle x:Name="PART_SelectionRange"/>
+
+                <Track x:Name="PART_Track" Grid.Row="1">
+                    <Track.Thumb>
+                        <Thumb x:Name="Thumb">
+                            <Thumb.Template>
+                                <ControlTemplate TargetType="Thumb">
+                                    <Grid Width="{Binding RelativeSource={RelativeSource Self},Path=ActualHeight}">
+                                        <local:TouchDropShadowBorder  CornerRadius="16" Width="31" Height="31" Background="#15C1C1C1">
+                                            <local:TouchIcon Grid.Column="1" Grid.Row="1" Foreground="#4e556f" Width="13" Height="13" Icon="Triangle" Angle="0" VerticalAlignment="Center" HorizontalAlignment="Center"/>
+                                        </local:TouchDropShadowBorder>
+                                    </Grid>
+                                </ControlTemplate>
+                            </Thumb.Template>
+                        </Thumb>
+                    </Track.Thumb>
+                </Track>
+            </Grid>
+        </Border>
+    </ControlTemplate>
+
+
     <Style  TargetType="{x:Type local:TouchSliderThreeThumbs}">
         <Setter Property="Background" Value="Transparent"/>
         <Setter Property="MinHeight" Value="60"/>
         <Setter Property="Template">
             <Setter.Value>
                 <ControlTemplate TargetType="{x:Type local:TouchSliderThreeThumbs}">
-                    <UniformGrid Rows="1" Columns="3">
-                        <local:TouchSlider x:Name="PART_LowerSlider"  Style="{StaticResource TouchSliderHInvisibleTrack}"   Height="60" Margin="10 0 0 0" Minimum="0"  Foreground="{StaticResource TangoDarkForegroundBrush}" 
-                                           Maximum="{Binding MiddleValue, RelativeSource={RelativeSource AncestorType=local:TouchSliderThreeThumbs}}" 
-                                           Value="{Binding LowerValue, RelativeSource={RelativeSource AncestorType=local:TouchSliderThreeThumbs}}">
-                            <local:TouchSlider.ThumbTemplate>
-                                <ControlTemplate>
-                                    <local:TouchDropShadowBorder  CornerRadius="18" Width="31" Height="31">
-                                        <local:TouchIcon Foreground="{Binding RelativeSource={RelativeSource AncestorType=local:TouchSlider},Path=Foreground}" Width="11" Height="9" Icon="Triangle" Angle="0" VerticalAlignment="Center" />
-                                    </local:TouchDropShadowBorder>
-                                </ControlTemplate>
-                            </local:TouchSlider.ThumbTemplate>
-                        </local:TouchSlider>
-                        <local:TouchSlider x:Name="Part_MiddleSlider"  Style="{StaticResource TouchSliderHInvisibleTrack}"  Height="60" Margin="10 0 0 0" Foreground="{StaticResource TangoDarkForegroundBrush}" 
-                                           Minimum="{Binding LowerValue, RelativeSource={RelativeSource AncestorType=local:TouchSliderThreeThumbs}}" 
-                                           Maximum="{Binding UpperValue, RelativeSource={RelativeSource AncestorType=local:TouchSliderThreeThumbs}}" 
-                                           Value="{Binding MiddleValue, RelativeSource={RelativeSource AncestorType=local:TouchSliderThreeThumbs}}">
-                            <local:TouchSlider.ThumbTemplate>
-                                <ControlTemplate>
-                                    <local:TouchDropShadowBorder  CornerRadius="18" Width="31" Height="31">
-                                        <local:TouchIcon Foreground="{Binding RelativeSource={RelativeSource AncestorType=local:TouchSlider},Path=Foreground}" Width="11" Height="9" Icon="Triangle" Angle="0" />
-                                    </local:TouchDropShadowBorder>
-                                </ControlTemplate>
-                            </local:TouchSlider.ThumbTemplate>
-                        </local:TouchSlider>
-                        <local:TouchSlider x:Name="PART_UpperSlider"  Style="{StaticResource TouchSliderHInvisibleTrack}"   Height="60" Margin="10 0 0 0" Maximum="100" Foreground="{StaticResource TangoDarkForegroundBrush}" 
-                                           Minimum="{Binding MiddleValue, RelativeSource={RelativeSource AncestorType=local:TouchSliderThreeThumbs}}"  
-                                           Value="{Binding UpperValue, RelativeSource={RelativeSource AncestorType=local:TouchSliderThreeThumbs}}">
-                            <local:TouchSlider.ThumbTemplate>
-                                <ControlTemplate>
-                                    <local:TouchDropShadowBorder  CornerRadius="18" Width="31" Height="31">
-                                        <local:TouchIcon Foreground="{Binding RelativeSource={RelativeSource AncestorType=local:TouchSlider},Path=Foreground}" Width="11" Height="9" Icon="Triangle" Angle="0" />
-                                    </local:TouchDropShadowBorder>
-                                </ControlTemplate>
-                            </local:TouchSlider.ThumbTemplate>
-                        </local:TouchSlider>
-                    </UniformGrid>
+                    <Grid >
+                        <Slider x:Name="PART_LowerSlider" Height="32" Margin="0 0 0 0" Minimum="0"  Foreground="{StaticResource TangoDarkForegroundBrush}" Maximum="100" Template="{StaticResource simpleSlider}"
+                                           Value="{Binding LowerValue, RelativeSource={RelativeSource AncestorType=local:TouchSliderThreeThumbs}, Mode=TwoWay, FallbackValue=0.0}" IsSnapToTickEnabled="True"  TickFrequency="1"/>
+                        <Slider x:Name="Part_MiddleSlider" Height="32" Margin="10 0 0 0" Minimum="0"  Foreground="{StaticResource TangoDarkForegroundBrush}" Maximum="100" Template="{StaticResource simpleSlider}"
+                                           Value="{Binding MiddleValue, RelativeSource={RelativeSource AncestorType=local:TouchSliderThreeThumbs}, Mode=TwoWay, FallbackValue=0.0}" IsSnapToTickEnabled="True"  TickFrequency="1"/>
+                        <Slider x:Name="PART_UpperSlider" Height="32" Margin="10 0 0 0" Minimum="0"  Foreground="{StaticResource TangoDarkForegroundBrush}" Maximum="100" Template="{StaticResource simpleSlider}"
+                                           Value="{Binding UpperValue, RelativeSource={RelativeSource AncestorType=local:TouchSliderThreeThumbs}, Mode=TwoWay, FallbackValue=0.0, Delay=20}" IsSnapToTickEnabled="True"  TickFrequency="1"></Slider>
+
+                    </Grid>
                 </ControlTemplate>
-                </Setter.Value>
+            </Setter.Value>
         </Setter>
     </Style>