Added label to touch slider three thumbs.

Related Work Items: #6227

7 files changed, 215 insertions, 13 deletions

diff --git a/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Converters/MarginOffsetSliderConverter .cs b/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Converters/MarginOffsetSliderConverter .cs
new file mode 100644
index 000000000..e0893b41d
--- /dev/null
+++ b/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Converters/MarginOffsetSliderConverter .cs
@@ -0,0 +1,101 @@
+using System;
+using System.Collections.Generic;
+using System.Diagnostics;
+using System.Globalization;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows;
+using System.Windows.Data;
+
+namespace Tango.PPC.Jobs.Converters
+{
+    public class MarginOffsetSliderConverter : IMultiValueConverter
+    {
+        private enum SliderType
+        {
+            Left = 1,
+            Middle = 2,
+            Right = 3
+        };
+        private double _leftOffset;
+        private double _middleOffset;
+        private double _rightOffset;
+
+        public MarginOffsetSliderConverter()
+        {
+            _leftOffset = _middleOffset = _rightOffset = 0;
+        }
+
+
+        public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
+        {
+            if(values.Count() < 5)
+                return new Thickness(0, 0, 0, 0);
+
+            double sliderValue = System.Convert.ToDouble(values[0]);
+            double sliderMaximum = System.Convert.ToDouble(values[1]);
+            double sliderMinimum = System.Convert.ToDouble(values[2]);
+            if (sliderMaximum == sliderMinimum)
+                sliderMaximum = sliderMinimum + 1;
+
+            var test = System.Convert.ToDouble(values[3]);
+            Debug.WriteLine($" @@@@@@@   LENGTH:{test} ");
+
+            var slider_width = System.Convert.ToDouble(values[3]);
+            if (slider_width > 60)
+                slider_width -= 60;
+
+            double xValRation = sliderValue / (sliderMaximum - sliderMinimum);
+            double thumbPos = Math.Round(xValRation * slider_width, 0, MidpointRounding.AwayFromZero);
+
+            SliderType type = (SliderType)Enum.Parse(typeof(SliderType), System.Convert.ToString(parameter));
+            var widthOfText = System.Convert.ToDouble(values[4]);
+            
+            switch (type)
+            {
+                case SliderType.Left:
+                    {
+                        _leftOffset = Math.Min((slider_width - widthOfText), Math.Max(thumbPos, 0));
+                        
+                        if(_middleOffset > widthOfText)
+                            _leftOffset = Math.Min(_leftOffset, _middleOffset - widthOfText);
+                        
+
+                        return new Thickness(_leftOffset, 0, 0, 0);
+                    }
+                   
+                case SliderType.Middle:
+                    {
+                        _middleOffset = Math.Min((slider_width - widthOfText-5), Math.Max(thumbPos, 0));
+                        
+                        _middleOffset = Math.Max(_middleOffset, _leftOffset + widthOfText);
+                        if(_rightOffset > (widthOfText+5))
+                            _middleOffset = Math.Min(_middleOffset, (_rightOffset- widthOfText-5));
+                        
+                        return new Thickness(_middleOffset, 0, 0, 0);
+                    }
+                   
+                case SliderType.Right:
+                    {
+                        _rightOffset = Math.Min((slider_width - widthOfText/2), Math.Max(thumbPos, 0));
+                        if(_rightOffset == 0 && slider_width > widthOfText)
+                        {
+                            _rightOffset = slider_width - widthOfText / 2;
+                        }
+                        
+                        _rightOffset = Math.Max((_middleOffset + widthOfText), _rightOffset);
+                        
+                        return new Thickness(_rightOffset, 0, 0, 0);
+                    }
+            }
+            return new Thickness(thumbPos, 0, 0, 0);
+                           
+        }
+
+        public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
+        {
+            return null;
+        }
+    }
+}
diff --git a/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Models/SegmentModel.cs b/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Models/SegmentModel.cs
index 44ae0da51..28f6a9b72 100644
--- a/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Models/SegmentModel.cs
+++ b/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Models/SegmentModel.cs
@@ -230,6 +230,7 @@ namespace Tango.PPC.Jobs.Models
                     RaisePropertyChangedAuto();
                     IsOffsetChanged = true;
                     RaisePropertyChanged(nameof(SegmentBrush));
+                    RaisePropertyChanged(nameof(LeftOffsetLabel));
                     IsOffsetChanged = false;
                 }
             }
@@ -273,6 +274,7 @@ namespace Tango.PPC.Jobs.Models
                    RaisePropertyChangedAuto();
                     IsOffsetChanged = true;
                     RaisePropertyChanged(nameof(SegmentBrush));
+                    RaisePropertyChanged(nameof(MiddleOffsetLabel));
                     IsOffsetChanged = false;
                 }
             }
@@ -316,6 +318,7 @@ namespace Tango.PPC.Jobs.Models
                     RaisePropertyChangedAuto();
                     IsOffsetChanged = true;
                     RaisePropertyChanged(nameof(SegmentBrush));
+                    RaisePropertyChanged(nameof(RightOffsetLabel));
                     IsOffsetChanged = false;
                 }
             }
@@ -349,6 +352,36 @@ namespace Tango.PPC.Jobs.Models
             }
         }
 
+        public String LeftOffsetLabel
+        {
+            get
+            {
+                double length = Math.Round( LeftOffset * Length / 100, 1);
+                return String.Format($"{Math.Round(LeftOffset,0)}%({length}m)" );
+            }
+        }
+
+        public String RightOffsetLabel
+        {
+            get
+            {
+                double length = Math.Round((100-RightOffset) * Length / 100, 1);
+                return String.Format($"{Math.Round(RightOffset, 0)}%({length}m)");
+            }
+        }
+
+        public String MiddleOffsetLabel
+        {
+            get
+            {
+                double offset = Math.Abs(MiddleOffset - 50);
+                double length = Math.Round(offset * Length / 100, 1);
+                double roundValue = Math.Round(MiddleOffset, 0);
+                return String.Format($"{Math.Round(MiddleOffset, 0)}%({length}m)");
+            }
+        }
+
+
         public bool HasColors
         {
             get
@@ -769,6 +802,9 @@ namespace Tango.PPC.Jobs.Models
                 //_lastLength = Length;
                 //RaisePropertyChanged(nameof(LengthWithFactor));
                 RaisePropertyChanged(nameof(LengthWithInterSegment));
+                RaisePropertyChanged(nameof(LeftOffsetLabel));
+                RaisePropertyChanged(nameof(MiddleOffsetLabel));
+                RaisePropertyChanged(nameof(RightOffsetLabel));
             }
         }
 
diff --git a/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Tango.PPC.JobsV2.csproj b/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Tango.PPC.JobsV2.csproj
index dc79f92df..ecd77328c 100644
--- a/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Tango.PPC.JobsV2.csproj
+++ b/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Tango.PPC.JobsV2.csproj
@@ -213,6 +213,7 @@
     <Compile Include="Converters\JobToEmbroideryImageConverter.cs" />
     <Compile Include="Converters\JobToPieImageConverter.cs" />
     <Compile Include="Converters\JobTypeToImageConverter.cs" />
+    <Compile Include="Converters\MarginOffsetSliderConverter .cs" />
     <Compile Include="Dialogs\AddSegmentWarningDialog.xaml.cs">
       <DependentUpon>AddSegmentWarningDialog.xaml</DependentUpon>
     </Compile>
diff --git a/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Views/JobView.xaml b/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Views/JobView.xaml
index e5dc84755..0e296b0bf 100644
--- a/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Views/JobView.xaml
+++ b/Software/Visual_Studio/PPC/Modules/Tango.PPC.JobsV2/Views/JobView.xaml
@@ -30,6 +30,7 @@
         <converters:BooleanToVisibilityInverseConverter x:Key="BooleanToVisibilityInverseConverter"/>
         <converters:EnumToDescriptionConverter x:Key="EnumToDescriptionConverter"/>
         <converters:TimeSpanToMinutesConverter x:Key="TimeSpanToMinutesConverter"/>
+        <localConverters:MarginOffsetSliderConverter x:Key="MarginOffsetSliderConverter"/>
 
         <BitmapImage x:Key="Image_Out_Of_Gamut" UriSource="../Images/JobView/error.png" />
         <BitmapImage x:Key="Image_Replace_Color" UriSource="../Images/JobView/replace-color.png" />
@@ -206,16 +207,17 @@
         </DataTemplate>
 
         <DataTemplate x:Key="Segment_Template" DataType="{x:Type model:SegmentModel}">
-            <Grid Height="390" Margin="57 15 57 0">
+            <Grid Height="400" Margin="57 15 57 0">
                 <Grid.RowDefinitions>
                     <RowDefinition Height="Auto" />
                     <RowDefinition Height="Auto" />
                     <RowDefinition Height="Auto" />
                     <RowDefinition Height="Auto" />
+                    <RowDefinition Height="Auto" />
                     <RowDefinition Height="1*" />
                 </Grid.RowDefinitions>
 
-                <DockPanel>
+                <DockPanel x:Name="header">
                     <StackPanel Orientation="Horizontal" DockPanel.Dock="Right"  Height="60">
                         <touch:TouchButton Margin="20 0 0 0" VerticalAlignment="Center"   EnableDropShadow="False" Background="Transparent" BorderThickness="0" Command="{Binding ElementName=view,Path=DataContext.RemoveSegmentCommand}" CommandParameter="{Binding}">
                             <Border  Height="24" Width="24"  BorderThickness="0" BorderBrush="{StaticResource TangoKeyboardKeyDarkBrush}" Background="Transparent" HorizontalAlignment="Left">
@@ -241,7 +243,51 @@
 
                 </DockPanel>
 
-                <Border Grid.Row="1" x:Name="segmentBrush" Height="90" Margin="0 20 0 0" CornerRadius="20" Background="{StaticResource TangoPrimaryBackgroundBrush}" BorderThickness="1" BorderBrush="{StaticResource TangoGrayBrush}">
+                <Grid Grid.Row="1" x:Name="displayOffset" Margin="0 10 0 -10" Visibility="{Binding IsGradient, Converter={StaticResource BooleanToVisibilityConverter}}">
+                    <Border Visibility="{Binding IsGradient, Converter={StaticResource BooleanToVisibilityConverter}}">
+                        <TextBlock x:Name="leftoffsetLabel" HorizontalAlignment="Left" MaxWidth="80" Margin="0 0 10 0" FontSize="{StaticResource TangoSmallFontSize}" Foreground="{StaticResource TangoNotificationBarMaskBrush}" Text="{Binding LeftOffsetLabel,Mode=OneWay}"/>
+
+                        <Border.Margin>
+                            <MultiBinding Converter="{StaticResource MarginOffsetSliderConverter}" ConverterParameter="1" Delay="200" Mode="OneWay">
+                                <Binding ElementName="sliderOffset" Path="LowerValue" ></Binding>
+                                <Binding ElementName="sliderOffset" Path="Maximum"></Binding>
+                                <Binding ElementName="sliderOffset" Path="Minimum"></Binding>
+                                <Binding ElementName="sliderOffset" Path="ActualWidth"></Binding>
+                                <Binding ElementName="leftoffsetLabel" Path="ActualWidth"></Binding>
+
+                            </MultiBinding>
+                        </Border.Margin>
+                    </Border>
+                    <Border>
+                        <TextBlock x:Name="middleoffsetLabel" HorizontalAlignment="Left" MaxWidth="80" Margin="10 0 10 0" FontSize="{StaticResource TangoSmallFontSize}" Foreground="{StaticResource TangoNotificationBarMaskBrush}" Text="{Binding MiddleOffsetLabel,Mode=OneWay}"/>
+
+                        <Border.Margin>
+                            <MultiBinding Converter="{StaticResource MarginOffsetSliderConverter}" ConverterParameter="2" Delay="200" Mode="OneWay">
+                                <Binding ElementName="sliderOffset" Path="MiddleValue"></Binding>
+                                <Binding ElementName="sliderOffset" Path="Maximum"></Binding>
+                                <Binding ElementName="sliderOffset" Path="Minimum"></Binding>
+                                <Binding ElementName="sliderOffset" Path="ActualWidth"></Binding>
+                                <Binding ElementName="middleoffsetLabel" Path="ActualWidth"></Binding>
+                            </MultiBinding>
+                        </Border.Margin>
+                    </Border>
+                    <Border>
+                        <TextBlock x:Name="upperoffsetLabel" HorizontalAlignment="Left" MaxWidth="80" Margin="0 0 0 0" FontSize="{StaticResource TangoSmallFontSize}" Foreground="{StaticResource TangoNotificationBarMaskBrush}" Text="{Binding RightOffsetLabel,Mode=OneWay}"/>
+
+
+                        <Border.Margin>
+                            <MultiBinding Converter="{StaticResource MarginOffsetSliderConverter}" ConverterParameter="3" Delay="200" Mode="OneWay">
+                                <Binding ElementName="sliderOffset" Path="UpperValue"></Binding>
+                                <Binding ElementName="sliderOffset" Path="Maximum"></Binding>
+                                <Binding ElementName="sliderOffset" Path="Minimum"></Binding>
+                                <Binding ElementName="sliderOffset" Path="ActualWidth"></Binding>
+                                <Binding ElementName="upperoffsetLabel" Path="ActualWidth"></Binding>
+                            </MultiBinding>
+                        </Border.Margin>
+                    </Border>
+                </Grid>
+
+                <Border Grid.Row="2" x:Name="segmentBrush" Height="90" Margin="0 20 0 0" CornerRadius="20" Background="{StaticResource TangoPrimaryBackgroundBrush}" BorderThickness="1" BorderBrush="{StaticResource TangoGrayBrush}">
 
                     <Border Background="{Binding SegmentBrush}" CornerRadius="20">
                         <Grid>
@@ -282,14 +328,14 @@
                     </touch:TouchButton>
                 </Canvas>-->
 
-                <Grid Grid.Row="2"  x:Name="sliderThreeThumbs" Visibility="{Binding IsGradient, Converter={StaticResource BooleanToVisibilityConverter}}" >
-                    <touch:TouchSliderThreeThumbs Height="40" MinimumMiddleRange="5.0" Length="{Binding Length}" LowerValue="{Binding LeftOffset, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" MiddleValue="{Binding MiddleOffset, Mode=TwoWay}"  UpperValue="{Binding RightOffset, Mode=TwoWay}" 
+                <Grid Grid.Row="3"  x:Name="sliderThreeThumbs" Visibility="{Binding IsGradient, Converter={StaticResource BooleanToVisibilityConverter}}" >
+                    <touch:TouchSliderThreeThumbs x:Name="sliderOffset" Height="40" MinimumMiddleRange="5.0" Length="{Binding Length}" LowerValue="{Binding LeftOffset, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" MiddleValue="{Binding MiddleOffset, Mode=TwoWay}"  UpperValue="{Binding RightOffset, Mode=TwoWay}" 
                                                   LowerValueEndChanging ="{Binding LeftOffsetChangeComleted}" LowerValueStartChanging="{Binding LeftOffsetStartChanging}"
                                                   UpperValueStartChanging ="{Binding RightOffsetStartChanging}" UpperValueEndChanging="{Binding RightOffsetChangeComleted}"
                                                   MiddleValueStartChanging ="{Binding MiddleOffsetStartChanging}" MiddleValueEndChanging ="{Binding MiddleOffsetChangeComleted}"/>
                 </Grid>
 
-                <Grid  Grid.Row="3" Margin="0 10 0 0" x:Name="colorSpacesSegment" >
+                <Grid  Grid.Row="4" Margin="0 10 0 0" x:Name="colorSpacesSegment" >
                     <Grid.ColumnDefinitions>
                         <ColumnDefinition Width="Auto"/>
                         <ColumnDefinition Width="1*" MinWidth="10"/>
@@ -358,7 +404,7 @@
 
                 </Grid>
 
-                <Grid Grid.Row="4" x:Name="add_new_segment_gap"  HorizontalAlignment="Stretch"  Margin="0 30 0 0" >
+                <Grid Grid.Row="5" x:Name="add_new_segment_gap"  HorizontalAlignment="Stretch"  Margin="0 30 0 0" >
                     <Grid.RowDefinitions>
                         <RowDefinition Height="Auto"/>
                         <RowDefinition Height="1*"/>
@@ -417,7 +463,7 @@
         </DataTemplate>
 
         <DataTemplate x:Key="GroupSegment_Template" DataType="{x:Type model:SegmentsGroupModel}">
-            <Grid Height="390" Margin="57 15 57 0">
+            <Grid Height="400" Margin="57 15 57 0">
                 <Grid.RowDefinitions>
                     <RowDefinition Height="Auto" />
                     <RowDefinition Height="Auto" />
diff --git a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/MultiRangeSlider.cs b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/MultiRangeSlider.cs
index 0cfd74f5c..b0b7167ee 100644
--- a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/MultiRangeSlider.cs
+++ b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/MultiRangeSlider.cs
@@ -6,6 +6,7 @@ using System.Threading.Tasks;
 using System.Windows.Controls;
 using System.Windows;
 using System.Windows.Controls.Primitives;
+using System.Windows.Input;
 
 namespace Tango.Touch.Controls
 {
@@ -167,7 +168,22 @@ namespace Tango.Touch.Controls
         {
             DefaultStyleKeyProperty.OverrideMetadata(typeof(MultiRangeSlider), new FrameworkPropertyMetadata(typeof(MultiRangeSlider)));
         }
-        
+
+        public override void OnApplyTemplate()
+        {
+            base.OnApplyTemplate();
+            
+            TouchDown -= TouchDownSlider;
+            TouchDown += TouchDownSlider;
+            OnValueChanged(Double.NaN, Value);
+            IsMoveToPointEnabled = true;
+        }
+
+        private void TouchDownSlider(object sender, TouchEventArgs e)
+        {
+            e.Handled = true;
+        }
+
         #region change and validate value
 
         protected override void  OnThumbDragStarted(DragStartedEventArgs e)
diff --git a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/MultiRangeSlider.xaml b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/MultiRangeSlider.xaml
index 2d76c6845..1d1ce4f89 100644
--- a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/MultiRangeSlider.xaml
+++ b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/MultiRangeSlider.xaml
@@ -45,7 +45,9 @@
                     <RowDefinition Height="Auto" MinHeight="{TemplateBinding MinHeight}"/>
                     <RowDefinition Height="Auto"/>
                 </Grid.RowDefinitions>
-
+                <Grid.ColumnDefinitions>
+                    <ColumnDefinition Width="*"/>
+                </Grid.ColumnDefinitions>
                 <!--<Rectangle x:Name="PART_SelectionRange"/>-->
                 <Border x:Name="PART_SelectionRange" Grid.Row="1"  BorderThickness="0"  Height="0" />
 
diff --git a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchSliderThreeThumbs.xaml b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchSliderThreeThumbs.xaml
index 20319c8ad..08df0a428 100644
--- a/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchSliderThreeThumbs.xaml
+++ b/Software/Visual_Studio/Tango.Touch/TouchColorPickerControls/TouchSliderThreeThumbs.xaml
@@ -17,12 +17,12 @@
                            
                         </Border>
                         <local:MultiRangeSlider x:Name="PART_LowerSlider" Height="32" Margin="0 0 0 0" Minimum="0" Maximum="100" Foreground="{StaticResource TangoDarkForegroundBrush}"
-                                           IsSnapToTickEnabled="True"  TickFrequency="1" AutoToolTipPlacement="BottomRight"/>
+                                           IsSnapToTickEnabled="True"  TickFrequency="1" />
                         <local:MultiRangeSlider x:Name="Part_MiddleSlider" Height="32" Margin="10 0 0 0" Minimum="0" Maximum="100" Foreground="{StaticResource TangoDarkForegroundBrush}" 
-                                           IsSnapToTickEnabled="True"  TickFrequency="1" AutoToolTipPlacement="BottomRight" />
+                                           IsSnapToTickEnabled="True"  TickFrequency="1"  />
 
                         <local:MultiRangeSlider x:Name="PART_UpperSlider" Height="32" Margin="10 0 2 0" Minimum="0" Maximum="100" Foreground="{StaticResource TangoDarkForegroundBrush}" 
-                                            IsSnapToTickEnabled="True"  TickFrequency="1" AutoToolTipPlacement="BottomRight"/>
+                                            IsSnapToTickEnabled="True"  TickFrequency="1"/>
 
                     </Grid>
                 </ControlTemplate>