path: root/Software/Visual_Studio/PPC/Modules/Tango.PPC.Jobs/Views/JobView.xaml

<UserControl x:Class="Tango.PPC.Jobs.Views.JobView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:vm="clr-namespace:Tango.PPC.Jobs.ViewModels"
             xmlns:fa="http://schemas.fontawesome.io/icons/"
             xmlns:touch="clr-namespace:Tango.Touch.Controls;assembly=Tango.Touch"
             xmlns:keyboard="clr-namespace:Tango.Touch.Keyboard;assembly=Tango.Touch"
             xmlns:global="clr-namespace:Tango.PPC.Jobs"
             xmlns:controls="clr-namespace:Tango.SharedUI.Controls;assembly=Tango.SharedUI"
             xmlns:enumerations="clr-namespace:Tango.BL.Enumerations;assembly=Tango.BL"
             xmlns:converters="clr-namespace:Tango.SharedUI.Converters;assembly=Tango.SharedUI"
             xmlns:entities="clr-namespace:Tango.BL.Entities;assembly=Tango.BL"
             xmlns:localConverters="clr-namespace:Tango.PPC.Jobs.Converters"
             xmlns:dragAndDrop="clr-namespace:Tango.DragAndDrop;assembly=Tango.DragAndDrop"
             xmlns:localControls="clr-namespace:Tango.PPC.Jobs.Controls"
             xmlns:local="clr-namespace:Tango.PPC.Jobs.Views"
             mc:Ignorable="d" 
             d:DesignHeight="2000" d:DesignWidth="800" d:DataContext="{d:DesignInstance Type=vm:JobViewVM, IsDesignTimeCreatable=False}" DataContext="{x:Static global:ViewModelLocator.JobViewVM}" x:Name="view">

    <UserControl.Resources>

        <localConverters:ColorSpaceToVisibilityConverter x:Key="ColorSpaceToVisibilityConverter" />
        <localConverters:JobToEmbroideryImageConverter x:Key="JobToEmbroideryImageConverter" />
        <BitmapImage x:Key="Image_Out_Of_Gamut" UriSource="../Images/JobView/error.png" />
        <BitmapImage x:Key="Image_Replace_Color" UriSource="../Images/JobView/replace-color.png" />
        <BitmapImage x:Key="Image_Color_Picker" UriSource="../Images/JobView/color-picker.png" />


        <Style TargetType="FrameworkElement" x:Key="Level1Container">
            <Setter Property="Margin" Value="20 15 60 15"></Setter>
        </Style>
        <Style TargetType="FrameworkElement" x:Key="Level2Container">
            <Setter Property="Margin" Value="80 30 60 0"></Setter>
        </Style>
        <Style TargetType="FrameworkElement" x:Key="Level2ContainerExtraMargin">
            <Setter Property="Margin" Value="80 40 60 0"></Setter>
        </Style>

        <DataTemplate x:Key="Volume_Template" DataType="{x:Type entities:BrushStop}">
            <Grid>
                <ItemsControl ItemsSource="{Binding LiquidVolumesOrderedPigmented}" VerticalAlignment="Center" Margin="0 0 -90 0">
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <StackPanel VerticalAlignment="Center" Orientation="Horizontal" IsItemsHost="True"></StackPanel>
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <Border>
                                <touch:TouchNumericTextBox DisplayWatermarkHint="True" Width="50" Watermark="{Binding IdsPack.LiquidType.Name,IsAsync=True}" Margin="2 0" ValueChanged="OnLiquidVolumeFieldValueChanged" HorizontalContentAlignment="Center" Value="{Binding Volume}" keyboard:KeyboardView.Container="{Binding ElementName=Container}" HasDecimalPoint="True" Minimum="0" Maximum="200" JoggingFactor="0.5" StringFormat="0.0"  />
                            </Border>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>

                <Canvas VerticalAlignment="Bottom" Visibility="{Binding IsLiquidVolumesOutOfRange,Converter={StaticResource BooleanToVisibilityConverter}}">
                    <TextBlock Canvas.Top="2" Foreground="{StaticResource TangoErrorBrush}" FontSize="{StaticResource TangoSmallFontSize}" Text="Liquid volumes are out of range."></TextBlock>
                </Canvas>
            </Grid>
        </DataTemplate>

        <DataTemplate x:Key="RGB_Template" DataType="{x:Type entities:BrushStop}">
            <UniformGrid Rows="1" Columns="3">
                <touch:TouchNumericTextBox Margin="2 0" ValueChanged="OnBrushStopFieldValueChanged" HorizontalContentAlignment="Center" Value="{Binding Red}" keyboard:KeyboardView.Container="{Binding ElementName=Container}" Maximum="255" />
                <touch:TouchNumericTextBox Margin="2 0" ValueChanged="OnBrushStopFieldValueChanged" HorizontalContentAlignment="Center" Value="{Binding Green}" keyboard:KeyboardView.Container="{Binding ElementName=Container}" Maximum="255" />
                <touch:TouchNumericTextBox Margin="2 0" ValueChanged="OnBrushStopFieldValueChanged" HorizontalContentAlignment="Center" Value="{Binding Blue}" keyboard:KeyboardView.Container="{Binding ElementName=Container}" Maximum="255" />
            </UniformGrid>
        </DataTemplate>

        <DataTemplate x:Key="CMYK_Template" DataType="{x:Type entities:BrushStop}">
            <UniformGrid Rows="1" Columns="4">
                <touch:TouchNumericTextBox Margin="2 0" ValueChanged="OnBrushStopFieldValueChanged" HorizontalContentAlignment="Center" Value="{Binding Cyan,Converter={StaticResource OneToPercentConverter}}" keyboard:KeyboardView.Container="{Binding ElementName=Container}" HasDecimalPoint="True" Maximum="100"  StringFormat="0"  />
                <touch:TouchNumericTextBox Margin="2 0" ValueChanged="OnBrushStopFieldValueChanged" HorizontalContentAlignment="Center" Value="{Binding Magenta,Converter={StaticResource OneToPercentConverter}}" keyboard:KeyboardView.Container="{Binding ElementName=Container}" HasDecimalPoint="True" Maximum="100" StringFormat="0" />
                <touch:TouchNumericTextBox Margin="2 0" ValueChanged="OnBrushStopFieldValueChanged" HorizontalContentAlignment="Center" Value="{Binding Yellow,Converter={StaticResource OneToPercentConverter}}" keyboard:KeyboardView.Container="{Binding ElementName=Container}" HasDecimalPoint="True" Maximum="100" StringFormat="0" />
                <touch:TouchNumericTextBox Margin="2 0" ValueChanged="OnBrushStopFieldValueChanged" HorizontalContentAlignment="Center" Value="{Binding Black,Converter={StaticResource OneToPercentConverter}}" keyboard:KeyboardView.Container="{Binding ElementName=Container}" HasDecimalPoint="True" Maximum="100" StringFormat="0" />
            </UniformGrid>
        </DataTemplate>

        <DataTemplate x:Key="LAB_Template" DataType="{x:Type entities:BrushStop}">
            <UniformGrid Rows="1" Columns="3">
                <touch:TouchNumericTextBox Margin="2 0" ValueChanged="OnBrushStopFieldValueChanged" HorizontalContentAlignment="Center" Value="{Binding L}" keyboard:KeyboardView.Container="{Binding ElementName=Container}" HasDecimalPoint="True" Minimum="0" Maximum="100" StringFormat="0.00" />
                <touch:TouchNumericTextBox Margin="2 0" ValueChanged="OnBrushStopFieldValueChanged" HorizontalContentAlignment="Center" Value="{Binding A}" keyboard:KeyboardView.Container="{Binding ElementName=Container}" HasDecimalPoint="True" Minimum="-128" Maximum="128" StringFormat="0.00" />
                <touch:TouchNumericTextBox Margin="2 0" ValueChanged="OnBrushStopFieldValueChanged" HorizontalContentAlignment="Center" Value="{Binding B}" keyboard:KeyboardView.Container="{Binding ElementName=Container}" HasDecimalPoint="True" Minimum="-128" Maximum="128" StringFormat="0.00" />
            </UniformGrid>
        </DataTemplate>

        <DataTemplate x:Key="CATALOG_Template" DataType="{x:Type entities:BrushStop}">
            <DockPanel>
                <touch:TouchIconButton Margin="0 0 -50 -10" CornerRadius="50" Width="50" Height="50" Padding="13" RippleBrush="{StaticResource TangoRippleDarkBrush}" DockPanel.Dock="Right" Icon="Palette" Foreground="{StaticResource TangoPrimaryAccentBrush}" Command="{Binding RelativeSource={RelativeSource AncestorType=UserControl},Path=DataContext.OpenCatalogCommand}" CommandParameter="{Binding}"></touch:TouchIconButton>
                <touch:TouchAutoComplete Margin="2 0" ItemsSource="{Binding ElementName=view,Path=DataContext.CatalogItems}" Watermark="Color Code" PopupHeight="250" DisplayMemberPath="Name" AutoCompleteProvider="{Binding ElementName=view,Path=DataContext.CatalogAutoCompleteProvider}" SelectedItem="{Binding ColorCatalogsItem,Mode=TwoWay,ValidatesOnDataErrors=True,ValidatesOnNotifyDataErrors=True}" keyboard:KeyboardView.Container="{Binding ElementName=Container}">
                    <touch:TouchAutoComplete.ItemTemplate>
                        <DataTemplate>
                            <DockPanel Margin="2">
                                <Rectangle Width="24" Height="24">
                                    <Rectangle.Fill>
                                        <SolidColorBrush Color="{Binding Color,Mode=OneWay}"></SolidColorBrush>
                                    </Rectangle.Fill>
                                </Rectangle>
                                <TextBlock Margin="5 0 0 0" Text="{Binding Name}" VerticalAlignment="Center"></TextBlock>
                            </DockPanel>
                        </DataTemplate>
                    </touch:TouchAutoComplete.ItemTemplate>
                </touch:TouchAutoComplete>
            </DockPanel>
        </DataTemplate>

        <DataTemplate x:Key="BrushStop_Template" DataType="{x:Type entities:BrushStop}">
            <Grid Margin="50 20 140 20">
                <StackPanel>
                    <StackPanel Orientation="Horizontal">
                        <Border Width="48" Height="48" CornerRadius="5" BorderThickness="1" BorderBrush="{StaticResource TangoGrayBrush}">
                            <Border.Background>
                                <SolidColorBrush Color="{Binding Color,IsAsync=True}"></SolidColorBrush>
                            </Border.Background>
                        </Border>

                        <TextBlock Margin="30 0 0 0" FontSize="{StaticResource TangoTitleFontSize}">
                                                                                        <Run>#</Run><Run Text="{Binding Segment.SegmentIndex}"></Run><Run>.</Run><Run Text="{Binding StopIndex}"></Run>
                        </TextBlock>
                    </StackPanel>

                    <DockPanel LastChildFill="False" Margin="0 20 0 0">
                        <TextBlock VerticalAlignment="Bottom" DockPanel.Dock="Left">Color code:</TextBlock>
                        <ContentControl Focusable="False" Margin="20 0 0 0" DockPanel.Dock="Right" HorizontalAlignment="Right" Width="300" Content="{Binding}">
                            <ContentControl.Style>
                                <Style TargetType="ContentControl">
                                    <Setter Property="ContentTemplate">
                                        <Setter.Value>
                                            <DataTemplate/>
                                        </Setter.Value>
                                    </Setter>
                                    <Style.Triggers>
                                        <DataTrigger Binding="{Binding ElementName=view,Path=DataContext.Job.ColorSpace.Name,IsAsync=True}" Value="RGB">
                                            <Setter Property="ContentTemplate" Value="{StaticResource RGB_Template}" />
                                        </DataTrigger>
                                        <DataTrigger Binding="{Binding ElementName=view,Path=DataContext.Job.ColorSpace.Name,IsAsync=True}" Value="CMYK">
                                            <Setter Property="ContentTemplate" Value="{StaticResource CMYK_Template}" />
                                        </DataTrigger>
                                        <DataTrigger Binding="{Binding ElementName=view,Path=DataContext.Job.ColorSpace.Name,IsAsync=True}" Value="LAB">
                                            <Setter Property="ContentTemplate" Value="{StaticResource LAB_Template}" />
                                        </DataTrigger>
                                        <DataTrigger Binding="{Binding ElementName=view,Path=DataContext.Job.ColorSpace.Name,IsAsync=True}" Value="Catalog">
                                            <Setter Property="ContentTemplate" Value="{StaticResource CATALOG_Template}" />
                                        </DataTrigger>
                                        <DataTrigger Binding="{Binding ElementName=view,Path=DataContext.Job.ColorSpace.Name,IsAsync=True}" Value="Volume">
                                            <Setter Property="ContentTemplate" Value="{StaticResource Volume_Template}" />
                                        </DataTrigger>
                                    </Style.Triggers>
                                </Style>
                            </ContentControl.Style>
                        </ContentControl>
                    </DockPanel>

                    <Canvas Visibility="{Binding IsOutOfGamut,IsAsync=True,Converter={StaticResource BooleanToVisibilityConverter}}">
                        <TextBlock Canvas.Top="2" Foreground="{StaticResource TangoErrorBrush}" FontSize="{StaticResource TangoSmallFontSize}" Text="Color is out of gamut. Modify color or select an alternative."></TextBlock>
                    </Canvas>

                    <DockPanel LastChildFill="False" Margin="0 20 0 0" IsEnabled="{Binding IsMiddle}">
                        <TextBlock VerticalAlignment="Bottom" DockPanel.Dock="Left">Position (m):</TextBlock>
                        <Grid Margin="20 0 0 0" Width="300" DockPanel.Dock="Right">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="1*" />
                                <ColumnDefinition Width="2*" />
                            </Grid.ColumnDefinitions>

                            <touch:TouchNumericTextBox Value="{Binding OffsetMeters}" HasDecimalPoint="True" StringFormat="0.0" Maximum="{Binding Segment.Length}" KeyboardContainer="{Binding ElementName=Container}"></touch:TouchNumericTextBox>
                            <!--<touch:TouchSlider Grid.Column="1" Height="30" Margin="10 0 0 -23" Maximum="{Binding Segment.Length}" Value="{Binding OffsetMeters}" />-->
                        </Grid>
                    </DockPanel>
                </StackPanel>

                <StackPanel Orientation="Horizontal" Margin="0 0 -130 0" HorizontalAlignment="Right" VerticalAlignment="Top">
                    <touch:TouchImageButton Command="{Binding ElementName=view,Path=DataContext.ReplaceBrushStopCommand,IsAsync=True}" CommandParameter="{Binding}" Visibility="{Binding IsOutOfGamut,Converter={StaticResource BooleanToVisibilityConverter},IsAsync=True}" Width="50" Height="50" Padding="10" Image="{StaticResource Image_Replace_Color}" CornerRadius="30"></touch:TouchImageButton>
                    <touch:TouchIconButton Margin="0 0 50 0" Visibility="{Binding ElementName=toggleEdit,Path=IsChecked,Converter={StaticResource BooleanToVisibilityConverter}}" Command="{Binding ElementName=view,Path=DataContext.RemoveBrushStopCommand,IsAsync=True}" CommandParameter="{Binding}" EnableDropShadow="False" Icon="TrashAltRegular" Padding="12" Foreground="{StaticResource TangoPrimaryAccentBrush}" Width="50" Height="50" RippleBrush="{StaticResource TangoRippleDarkBrush}" CornerRadius="30" />
                </StackPanel>
            </Grid>
        </DataTemplate>

        <DataTemplate x:Key="Segment_Template" DataType="{x:Type entities:Segment}">
            <touch:TouchVirtualizedContentControl Margin="0 0 0 15">
                <Border RenderOptions.EdgeMode="Unspecified" CornerRadius="8" Background="{StaticResource TangoPrimaryBackgroundBrush}" BorderThickness="1" BorderBrush="{StaticResource TangoGrayBrush}">
                    <Border.CacheMode>
                        <BitmapCache RenderAtScale="1" SnapsToDevicePixels="True" />
                    </Border.CacheMode>
                    <!--<Border.Effect>
                    <DropShadowEffect Opacity="0.5" Color="{StaticResource TangoDropShadowColor}" BlurRadius="10" ShadowDepth="15" />
                </Border.Effect>-->
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <Grid Background="Transparent" dragAndDrop:DragAndDropService.DropCommand="{Binding ElementName=view,Path=DataContext.SegmentDroppedCommand}"  dragAndDrop:DragAndDropService.Draggable="True" dragAndDrop:DragAndDropService.Droppable="True" dragAndDrop:DragAndDropService.DraggingSurface="{Binding ElementName=DraggingSurface}">
                            <Grid.Style>
                                <Style TargetType="Grid">
                                    <Setter Property="Opacity" Value="1"></Setter>
                                    <Style.Triggers>
                                        <Trigger Property="dragAndDrop:DragAndDropService.IsDraggableOver" Value="True">
                                            <Setter Property="Opacity" Value="0.5"></Setter>
                                        </Trigger>
                                    </Style.Triggers>
                                </Style>
                            </Grid.Style>
                            <DockPanel>
                                <DockPanel.Style>
                                    <Style TargetType="DockPanel">
                                        <Setter Property="Height" Value="163"></Setter>
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding ElementName=toggle_small_list,Path=IsChecked,IsAsync=True}" Value="True">
                                                <Setter Property="Height" Value="74"></Setter>
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </DockPanel.Style>
                                <Border DockPanel.Dock="Left" Background="{Binding SegmentBrush}" BorderThickness="0 0 1 0" BorderBrush="{StaticResource TangoLightBorderBrush}">
                                    <Border.Style>
                                        <Style TargetType="Border">
                                            <Setter Property="CornerRadius" Value="8 0 0 8"></Setter>
                                            <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource Self},Path=ActualHeight,IsAsync=True}"></Setter>
                                            <Style.Triggers>
                                                <DataTrigger Binding="{Binding ElementName=toggle_small_list,Path=IsChecked,IsAsync=True}" Value="True">
                                                    <Setter Property="Width" Value="{Binding RelativeSource={RelativeSource Self},Path=ActualHeight,Converter={StaticResource MathOperatorConverter},ConverterParameter='*2',IsAsync=True}"></Setter>
                                                </DataTrigger>
                                                <MultiDataTrigger>
                                                    <MultiDataTrigger.Conditions>
                                                        <Condition Binding="{Binding Converter={StaticResource IsSegmentGradientConverter},IsAsync=True}" Value="True"></Condition>
                                                        <Condition Binding="{Binding ElementName=toggle_large_list,Path=IsChecked,IsAsync=True}" Value="True"></Condition>
                                                    </MultiDataTrigger.Conditions>
                                                    <Setter Property="CornerRadius" Value="8 0 0 0"></Setter>
                                                </MultiDataTrigger>
                                            </Style.Triggers>
                                        </Style>
                                    </Border.Style>
                                </Border>

                                <Grid>
                                    <DockPanel Margin="30 0" VerticalAlignment="Center">
                                        <StackPanel DockPanel.Dock="Top" Orientation="Horizontal">
                                            <Canvas Visibility="{Binding HasOutOfGamutBrushStop,Converter={StaticResource BooleanToVisibilityConverter},IsAsync=True}">
                                                <Image Canvas.Left="-25" Canvas.Top="1" Source="{StaticResource Image_Out_Of_Gamut}"  Width="19" Height="19" />
                                            </Canvas>
                                            <TextBlock FontSize="{StaticResource TangoTitleFontSize}">
                                                                    <Run>Segment #</Run>
                                                                    <Run Text="{Binding SegmentIndex,Mode=OneWay,IsAsync=True}"></Run>
                                            </TextBlock>
                                        </StackPanel>

                                        <StackPanel Margin="0 30 0 0" VerticalAlignment="Bottom" HorizontalAlignment="Left" Width="300" Visibility="{Binding ElementName=toggle_large_list,Path=IsChecked,Converter={StaticResource BooleanToVisibilityConverter},IsAsync=True}">
                                            <DockPanel LastChildFill="False">
                                                <DockPanel.Style>
                                                    <Style TargetType="DockPanel">
                                                        <Setter Property="Visibility" Value="Visible"></Setter>
                                                        <Style.Triggers>
                                                            <DataTrigger Binding="{Binding Converter={StaticResource IsSegmentGradientConverter},IsAsync=True}" Value="True">
                                                                <Setter Property="Visibility" Value="Collapsed"></Setter>
                                                            </DataTrigger>
                                                        </Style.Triggers>
                                                    </Style>
                                                </DockPanel.Style>
                                                <TextBlock VerticalAlignment="Bottom" DockPanel.Dock="Left" Text="Color code:"></TextBlock>

                                                <Grid DockPanel.Dock="Right" DataContext="{Binding BrushStops[0],IsAsync=True}">
                                                    <StackPanel>
                                                        <ContentControl Focusable="False" FocusVisualStyle="{x:Null}" d:DataContext="{d:DesignInstance Type=entities:BrushStop, IsDesignTimeCreatable=False}" Content="{Binding}" Width="180">
                                                            <ContentControl.Style>
                                                                <Style TargetType="ContentControl">
                                                                    <Setter Property="ContentTemplate">
                                                                        <Setter.Value>
                                                                            <DataTemplate>

                                                                            </DataTemplate>
                                                                        </Setter.Value>
                                                                    </Setter>
                                                                    <Style.Triggers>
                                                                        <DataTrigger Binding="{Binding ElementName=view,Path=DataContext.Job.ColorSpace.Name,IsAsync=True}" Value="RGB">
                                                                            <Setter Property="ContentTemplate" Value="{StaticResource RGB_Template}" />
                                                                        </DataTrigger>
                                                                        <DataTrigger Binding="{Binding ElementName=view,Path=DataContext.Job.ColorSpace.Name,IsAsync=True}" Value="CMYK">
                                                                            <Setter Property="ContentTemplate" Value="{StaticResource CMYK_Template}" />
                                                                        </DataTrigger>
                                                                        <DataTrigger Binding="{Binding ElementName=view,Path=DataContext.Job.ColorSpace.Name,IsAsync=True}" Value="LAB">
                                                                            <Setter Property="ContentTemplate" Value="{StaticResource LAB_Template}" />
                                                                        </DataTrigger>
                                                                        <DataTrigger Binding="{Binding ElementName=view,Path=DataContext.Job.ColorSpace.Name,IsAsync=True}" Value="Catalog">
                                                                            <Setter Property="ContentTemplate" Value="{StaticResource CATALOG_Template}" />
                                                                        </DataTrigger>
                                                                        <DataTrigger Binding="{Binding ElementName=view,Path=DataContext.Job.ColorSpace.Name,IsAsync=True}" Value="Volume">
                                                                            <Setter Property="ContentTemplate" Value="{StaticResource Volume_Template}" />
                                                                        </DataTrigger>
                                                                    </Style.Triggers>
                                                                </Style>
                                                            </ContentControl.Style>
                                                        </ContentControl>
                                                    </StackPanel>
                                                </Grid>
                                            </DockPanel>
                                            <Canvas>
                                                <Canvas.Style>
                                                    <Style TargetType="Canvas">
                                                        <Setter Property="Visibility" Value="Collapsed"></Setter>
                                                        <Style.Triggers>
                                                            <MultiDataTrigger>
                                                                <MultiDataTrigger.Conditions>
                                                                    <Condition Binding="{Binding Converter={StaticResource IsSegmentGradientConverter},IsAsync=True}" Value="False" />
                                                                    <Condition Binding="{Binding BrushStops[0].IsOutOfGamut,IsAsync=True}" Value="True" />
                                                                </MultiDataTrigger.Conditions>
                                                                <Setter Property="Visibility" Value="Visible"></Setter>
                                                            </MultiDataTrigger>
                                                        </Style.Triggers>
                                                    </Style>
                                                </Canvas.Style>
                                                <TextBlock Canvas.Top="2" Foreground="{StaticResource TangoErrorBrush}" FontSize="{StaticResource TangoSmallFontSize}" Text="Color is out of gamut. Modify color or select an alternative."></TextBlock>
                                            </Canvas>
                                            <DockPanel LastChildFill="False" Margin="0 20 0 0">
                                                <TextBlock VerticalAlignment="Bottom" DockPanel.Dock="Left" Text="Length (m):"></TextBlock>
                                                <touch:TouchNumericTextBox Width="180" DockPanel.Dock="Right" Value="{Binding Length}" StringFormat="0.0" AutoCalculateJogStep="False" HasDecimalPoint="True" Minimum="1" Maximum="100000" KeyboardContainer="{Binding ElementName=Container}" />
                                            </DockPanel>
                                        </StackPanel>
                                    </DockPanel>

                                    <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0 10 10 0">
                                        <TextBlock Visibility="{Binding ElementName=toggle_small_list,Path=IsChecked,Converter={StaticResource BooleanToVisibilityConverter},IsAsync=True}" HorizontalAlignment="Right" VerticalAlignment="Center" Text="{Binding Length,StringFormat={}{0:N1} m}">
                                            <TextBlock.Style>
                                                <Style TargetType="TextBlock">
                                                    <Setter Property="Margin" Value="0 16 20 0"></Setter>
                                                    <Style.Triggers>
                                                        <DataTrigger Binding="{Binding ElementName=toggleEdit,Path=IsChecked}" Value="True">
                                                            <Setter Property="Margin" Value="0 5 20 0"></Setter>
                                                        </DataTrigger>
                                                    </Style.Triggers>
                                                </Style>
                                            </TextBlock.Style>
                                        </TextBlock>

                                        <touch:TouchImageButton Command="{Binding ElementName=view,Path=DataContext.ReplaceBrushStopCommand}" CommandParameter="{Binding BrushStops[0]}" Width="50" Height="50" Padding="10" Image="{StaticResource Image_Replace_Color}" CornerRadius="30">
                                            <touch:TouchImageButton.Style>
                                                <Style TargetType="{x:Type touch:TouchImageButton}" BasedOn="{StaticResource {x:Type touch:TouchImageButton}}">
                                                    <Setter Property="Visibility" Value="Collapsed"></Setter>
                                                    <Style.Triggers>
                                                        <MultiDataTrigger>
                                                            <MultiDataTrigger.Conditions>
                                                                <Condition Binding="{Binding ElementName=toggle_large_list,Path=IsChecked,IsAsync=True}" Value="True" />
                                                                <Condition Binding="{Binding Converter={StaticResource IsSegmentGradientConverter},IsAsync=True}" Value="False" />
                                                                <Condition Binding="{Binding BrushStops[0].IsOutOfGamut,IsAsync=True}" Value="True" />
                                                            </MultiDataTrigger.Conditions>
                                                            <Setter Property="Visibility" Value="Visible"></Setter>
                                                        </MultiDataTrigger>
                                                    </Style.Triggers>
                                                </Style>
                                            </touch:TouchImageButton.Style>
                                        </touch:TouchImageButton>

                                        <StackPanel Visibility="{Binding ElementName=toggleEdit,Path=IsChecked,Converter={StaticResource BooleanToVisibilityConverter},IsAsync=True}" Orientation="Horizontal">

                                            <touch:TouchIconButton Command="{Binding ElementName=view,Path=DataContext.RemoveSegmentCommand}" CommandParameter="{Binding}" EnableDropShadow="False" Icon="TrashAltRegular" Padding="12" Foreground="{StaticResource TangoPrimaryAccentBrush}" Width="50" Height="50" RippleBrush="{StaticResource TangoRippleDarkBrush}" CornerRadius="30" />

                                            <dragAndDrop:DragThumb Background="Transparent" IsHitTestVisible="True">
                                                <touch:TouchIconButton IsHitTestVisible="False" EnableDropShadow="False" Icon="BarsSolid" Padding="15" Foreground="{StaticResource TangoPrimaryAccentBrush}" Width="50" Height="50" RippleBrush="{StaticResource TangoRippleDarkBrush}" CornerRadius="30" />
                                            </dragAndDrop:DragThumb>
                                        </StackPanel>
                                    </StackPanel>
                                </Grid>
                            </DockPanel>
                        </Grid>

                        <Border Grid.Row="1" BorderBrush="{StaticResource TangoGrayBrush}" BorderThickness="0 1 0 0">
                            <Border.Style>
                                <Style TargetType="Border">
                                    <Setter Property="Visibility" Value="Collapsed"></Setter>
                                    <Style.Triggers>
                                        <MultiDataTrigger>
                                            <MultiDataTrigger.Conditions>
                                                <Condition Binding="{Binding Converter={StaticResource IsSegmentGradientConverter},IsAsync=True}" Value="True"></Condition>
                                                <Condition Binding="{Binding ElementName=toggle_large_list,Path=IsChecked,IsAsync=True}" Value="True"></Condition>
                                            </MultiDataTrigger.Conditions>

                                            <Setter Property="Visibility" Value="Visible"></Setter>
                                        </MultiDataTrigger>
                                    </Style.Triggers>
                                </Style>
                            </Border.Style>

                            <StackPanel>
                                <ItemsControl ItemsSource="{Binding BrushStops}" ItemTemplate="{StaticResource BrushStop_Template}">

                                </ItemsControl>

                                <touch:TouchButton Command="{Binding ElementName=view,Path=DataContext.AddBrushStopCommand}" CommandParameter="{Binding}" Background="Transparent" RippleBrush="{StaticResource TangoRippleDarkBrush}" FontWeight="Normal" Foreground="{StaticResource TangoPrimaryAccentBrush}" HorizontalAlignment="Left" EnableDropShadow="False" Margin="50 30 0 60">
                                    <StackPanel Orientation="Horizontal">
                                        <Grid Width="49" Height="49">
                                            <Rectangle Stroke="{StaticResource TangoPrimaryAccentBrush}" StrokeThickness="1" StrokeDashArray="5 5 5 5" RadiusX="5" RadiusY="5"></Rectangle>
                                            <fa:ImageAwesome Icon="Plus" Width="16" Height="16" Foreground="{StaticResource TangoPrimaryAccentBrush}" />
                                        </Grid>

                                        <TextBlock VerticalAlignment="Center" Margin="20 0 0 0">ADD COLOR</TextBlock>
                                    </StackPanel>
                                </touch:TouchButton>
                            </StackPanel>
                        </Border>
                    </Grid>
                </Border>
            </touch:TouchVirtualizedContentControl>
        </DataTemplate>
    </UserControl.Resources>

    <Grid Background="{StaticResource TangoMidBackgroundBrush}" SnapsToDevicePixels="False">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="1*"/>
        </Grid.RowDefinitions>

        <touch:TouchLoadingPanel Grid.Row="1" IsLoading="{Binding IsBusy}">
            <Grid>

                <Grid.CacheMode>
                    <BitmapCache RenderAtScale="1" SnapsToDevicePixels="False" />
                </Grid.CacheMode>

                <Grid.RowDefinitions>
                    <RowDefinition Height="1*"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>
                <Grid>
                    <Grid x:Name="Container" keyboard:KeyboardView.ContainerOffset="40" Grid.RowSpan="2">
                        <touch:LightTouchScrollViewer x:Name="scrollViewer" Scrolling="scrollViewer_Scrolling">
                            <StackPanel Margin="10 60 10 0">
                                <StackPanel>
                                    <touch:TouchVirtualizedContentControl>
                                        <touch:TouchExpander Padding="20 15" IsExpanded="{Binding IsJobDetailsExpanded}">
                                            <touch:TouchExpander.Header>
                                                <StackPanel Orientation="Horizontal" VerticalAlignment="Center" Margin="0 0 20 0">
                                                    <Image Source="../Images/JobView/job-details.png" Width="39" />
                                                    <TextBlock FontWeight="Medium" Margin="20 0 0 0" VerticalAlignment="Center" FontSize="{StaticResource TangoExpanderHeaderFontSize}">Job Details</TextBlock>

                                                    <TextBlock FontWeight="Medium" Margin="50 0 0 0" VerticalAlignment="Center">
                                                <Run Text="{Binding Job.Rml.Name}"></Run><Run>,</Run>
                                                <Run Text="{Binding Job.ColorSpace.Name}"></Run>
                                                    </TextBlock>
                                                </StackPanel>
                                            </touch:TouchExpander.Header>

                                            <StackPanel Margin="60 30 60 20" TextElement.FontWeight="Medium">
                                                <controls:TableGrid RowHeight="50">

                                                    <TextBlock>Job name:</TextBlock>
                                                    <touch:TouchTextBox Text="{Binding Job.Name,UpdateSourceTrigger=PropertyChanged,ValidatesOnDataErrors=True,ValidatesOnNotifyDataErrors=True}" KeyboardMode="AlphaNumeric"  FocusSelectionMode="SelectAll" KeyboardAction="Next" KeyboardContainer="{Binding ElementName=Container}" />

                                                    <TextBlock>Customer:</TextBlock>
                                                    <touch:TouchAutoComplete ForceItemSelection="False" Text="{Binding CustomersFilter}" ItemsSource="{Binding Customers}" SelectedItem="{Binding Job.Customer}" DisplayMemberPath="Name" AutoCompleteProvider="{Binding CustomersAutoCompleteProvider}" KeyboardMode="AlphaNumeric" KeyboardAction="Next" KeyboardContainer="{Binding ElementName=Container}" />

                                                    <TextBlock>Thread type:</TextBlock>
                                                    <touch:TouchComboBox ItemsSource="{Binding Rmls}" SelectedItem="{Binding Job.Rml}" DisplayMemberPath="Name" Title="Select Thread" />

                                                    <TextBlock>Comment:</TextBlock>
                                                    <TextBox Margin="20 0 0 -42" Text="{Binding Job.Description}" FocusVisualStyle="{x:Null}" BorderBrush="{StaticResource TangoDividerBrush}" Foreground="{StaticResource TangoDarkForegroundBrush}" AcceptsReturn="True" TextWrapping="Wrap" Height="60" Padding="5" keyboard:KeyboardView.Container="{Binding ElementName=Container}" keyboard:KeyboardView.Mode="AlphaNumeric">

                                                    </TextBox>
                                                </controls:TableGrid>

                                                <Grid HorizontalAlignment="Center" Margin="0 20 0 0" TextElement.Foreground="{StaticResource TangoGrayTextBrush}">
                                                    <Grid.ColumnDefinitions>
                                                        <ColumnDefinition Width="Auto" />
                                                        <ColumnDefinition Width="Auto" />
                                                        <ColumnDefinition Width="Auto" />
                                                        <ColumnDefinition Width="Auto" />
                                                        <ColumnDefinition Width="Auto" />
                                                    </Grid.ColumnDefinitions>

                                                    <TextBlock HorizontalAlignment="Left">
                                    <Run Text="Job status:"></Run>
                                    <Run Text="{Binding Job.JobStatus}"></Run>
                                                    </TextBlock>

                                                    <Rectangle Margin="20 0" Grid.Column="1" HorizontalAlignment="Center" StrokeThickness="1" Stroke="{StaticResource TangoGrayTextBrush}" />

                                                    <TextBlock Grid.Column="2" HorizontalAlignment="Center">
                                    <Run Text="Last updated:"></Run>
                                    <Run Text="{Binding Job.LastUpdated,Converter={StaticResource DateTimeUTCToShortDateConverter},TargetNullValue=Never}"></Run>
                                                    </TextBlock>

                                                    <Rectangle Margin="20 0" Grid.Column="3" HorizontalAlignment="Center" StrokeThickness="1" Stroke="{StaticResource TangoGrayTextBrush}" />

                                                    <TextBlock Grid.Column="4" HorizontalAlignment="Right">
                                    <Run Text="Last dye:"></Run>
                                    <Run Text="{Binding Job.LastRun,Converter={StaticResource DateTimeUTCToShortDateConverter},TargetNullValue=Never}"></Run>
                                                    </TextBlock>
                                                </Grid>
                                            </StackPanel>
                                        </touch:TouchExpander>
                                    </touch:TouchVirtualizedContentControl>

                                    <touch:TouchDropShadowBorder Margin="0 12 0 0" Padding="0 0 0 40">
                                        <Grid>
                                            <StackPanel>
                                                <StackPanel Orientation="Horizontal" VerticalAlignment="Center"  Style="{StaticResource Level1Container}">
                                                    <Image Source="../Images/JobView/color-length.png" Width="39" />
                                                    <TextBlock FontWeight="Medium" Margin="20 0 0 0" VerticalAlignment="Center" FontSize="{StaticResource TangoExpanderHeaderFontSize}">Color &amp; Length</TextBlock>
                                                </StackPanel>

                                                <StackPanel>
                                                    <StackPanel.Style>
                                                        <Style TargetType="StackPanel" BasedOn="{StaticResource Level2Container}">
                                                            <Setter Property="Visibility" Value="Collapsed"></Setter>
                                                            <Style.Triggers>
                                                                <DataTrigger Binding="{Binding Job.JobType}" Value="{x:Static enumerations:JobTypes.Embroidery}">
                                                                    <Setter Property="Visibility" Value="Visible"></Setter>
                                                                </DataTrigger>
                                                            </Style.Triggers>
                                                        </Style>
                                                    </StackPanel.Style>
                                                    <UniformGrid Columns="2" Rows="1">
                                                        <DockPanel Margin="0 0 10 0">
                                                            <TextBlock Text="Number of units:" VerticalAlignment="Bottom"></TextBlock>
                                                            <touch:TouchNumericTextBox Margin="20 0 0 0" Value="{Binding Job.NumberOfUnits}" Minimum="1" Maximum="10000" JoggingFactor="0.01" />
                                                        </DockPanel>

                                                        <DockPanel Margin="10 0 0 0">
                                                            <TextBlock Text="Number of heads:" VerticalAlignment="Bottom"></TextBlock>
                                                            <touch:TouchNumericTextBox Margin="20 0 0 0" Value="{Binding Job.NumberOfHeads}" Minimum="1" Maximum="1000" JoggingFactor="0.1" />
                                                        </DockPanel>
                                                    </UniformGrid>
                                                </StackPanel>

                                                <StackPanel>
                                                    <StackPanel.Style>
                                                        <Style TargetType="StackPanel" BasedOn="{StaticResource Level2Container}">
                                                            <Setter Property="Visibility" Value="Visible"></Setter>
                                                            <Style.Triggers>
                                                                <DataTrigger Binding="{Binding Job.JobType}" Value="{x:Static enumerations:JobTypes.Embroidery}">
                                                                    <Setter Property="Visibility" Value="Collapsed"></Setter>
                                                                </DataTrigger>
                                                            </Style.Triggers>
                                                        </Style>
                                                    </StackPanel.Style>
                                                    <DockPanel Margin="0 0 10 0">
                                                        <TextBlock Text="Repetitions:" VerticalAlignment="Bottom"></TextBlock>
                                                        <touch:TouchNumericTextBox Width="200" HorizontalAlignment="Left" Margin="20 0 0 0" Value="{Binding Job.NumberOfUnits}" Minimum="1" Maximum="10000" JoggingFactor="0.01" />
                                                    </DockPanel>
                                                </StackPanel>

                                                <!--<DockPanel Style="{StaticResource Level2Container}">
                                                <TextBlock Text="Color Catalog/Space:" VerticalAlignment="Center"></TextBlock>
                                                <touch:TouchComboBox Margin="20 0 0 0" ItemsSource="{Binding ColorSpaces}" SelectedItem="{Binding Job.ColorSpace}" DisplayMemberPath="Name" Title="Select Color Catalog/Space" />
                                            </DockPanel>-->

                                                <Border x:Name="borderDockFloat" Height="80">
                                                    <DockPanel x:Name="dockEdit" LastChildFill="False" Style="{StaticResource Level2ContainerExtraMargin}" Height="40" Width="640">
                                                        <StackPanel DockPanel.Dock="Left" Orientation="Horizontal">
                                                            <touch:TouchToggleImageButton x:Name="toggle_small_list" UncheckedImage="../Images/small-cards-view.png"  CheckedImage="../Images/small-cards-view - blue.png" 
                                                                                     IsChecked="{Binding ElementName=toggle_large_list,Path=IsChecked,Mode=OneWay,Converter={StaticResource BooleanInverseConverter}}" DockPanel.Dock="Right" 
                                                                                      Padding="8" CornerRadius="30" Width="44" />
                                                            <Rectangle HorizontalAlignment="Left" Stroke="{StaticResource TangoDividerBrush}" Margin="10 8" />
                                                            <touch:TouchToggleImageButton x:Name="toggle_large_list" UncheckedImage="../Images/large-cards-view.png"  CheckedImage="../Images/large-cards-view - blue.png" 
                                                                                     IsChecked="{Binding ElementName=toggle_small_list,Path=IsChecked,Mode=OneWay,Converter={StaticResource BooleanInverseConverter}}" DockPanel.Dock="Right"
                                                                                      Padding="8" CornerRadius="30" Width="44" />
                                                        </StackPanel>
                                                        <touch:TouchToggleImageButton x:Name="toggleEdit" UncheckedImage="../Images/pencil-gray.png" 
                                                                                      CheckedImage="../Images/pencil-blue.png" 
                                                                                      DockPanel.Dock="Right" 
                                                                                      IsChecked="{Binding IsSelected}" 
                                                                                      Padding="8" CornerRadius="30" Width="40" Height="40">
                                                        </touch:TouchToggleImageButton>
                                                        <!--<touch:TouchToggleIconButton x:Name="toggleEdit" DockPanel.Dock="Right" Icon="Pencil" CheckedIcon="Pencil" Padding="8" CornerRadius="20" />-->
                                                    </DockPanel>
                                                </Border>

                                                <ItemsControl x:Name="listSegments" Style="{StaticResource Level2Container}" ItemsSource="{Binding SegmentsCollectionView}" ItemTemplate="{StaticResource Segment_Template}"></ItemsControl>

                                                <StackPanel HorizontalAlignment="Right" Style="{StaticResource Level2Container}" Orientation="Horizontal">
                                                    <touch:TouchButton Command="{Binding AddSolidSegmentCommand}" FontWeight="Normal" RippleBrush="{StaticResource TangoRippleDarkBrush}" FontSize="{StaticResource TangoDefaultFontSize}" EnableDropShadow="False" Foreground="{StaticResource TangoPrimaryAccentBrush}" Width="170" CornerRadius="20" Padding="0 10" Background="Transparent" BorderThickness="2" BorderBrush="{StaticResource TangoPrimaryAccentBrush}">
                                                        <StackPanel Orientation="Horizontal">
                                                            <Image VerticalAlignment="Center" Margin="0 1 0 0" Source="../Images/plus.png" Width="12"/>
                                                            <TextBlock Margin="10 2 0 0">SOLID SEGMENT</TextBlock>
                                                        </StackPanel>
                                                    </touch:TouchButton>
                                                    <touch:TouchButton Command="{Binding AddGradientSegmentCommand}" FontWeight="Normal" RippleBrush="{StaticResource TangoRippleDarkBrush}" FontSize="{StaticResource TangoDefaultFontSize}" Margin="30 0 0 0" EnableDropShadow="False" Foreground="{StaticResource TangoPrimaryAccentBrush}" Padding="0 10" Width="200" CornerRadius="20" Background="Transparent" BorderThickness="2">
                                                        <touch:TouchButton.BorderBrush>
                                                            <LinearGradientBrush>
                                                                <GradientStop Offset="0" Color="{StaticResource TangoPrimaryAccentColor}" />
                                                                <GradientStop Offset="1" Color="#57F157" />
                                                            </LinearGradientBrush>
                                                        </touch:TouchButton.BorderBrush>

                                                        <StackPanel Orientation="Horizontal">
                                                            <Image VerticalAlignment="Center" Margin="0 1 0 0" Source="../Images/plus.png" Width="12"/>
                                                            <TextBlock Margin="10 2 0 0">GRADIENT SEGMENT</TextBlock>
                                                        </StackPanel>
                                                    </touch:TouchButton>
                                                </StackPanel>

                                                <StackPanel Style="{StaticResource Level2ContainerExtraMargin}">
                                                    <DockPanel LastChildFill="False">
                                                        <touch:TouchCheckBox DockPanel.Dock="Left" HorizontalAlignment="Left" IsChecked="{Binding Job.EnableInterSegment}">Include white gap between segments</touch:TouchCheckBox>
                                                        <StackPanel DockPanel.Dock="Right" Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0 -20 5 0">
                                                            <TextBlock Margin="0 3 0 0" Foreground="{StaticResource TangoGrayTextBrush}" VerticalAlignment="Bottom">
                                                    <Run Text="Length (m):"></Run>
                                                            </TextBlock>

                                                            <touch:TouchNumericTextBox Foreground="{StaticResource TangoGrayTextBrush}" Margin="5 0 0 0" Width="50" HorizontalContentAlignment="Center" Minimum="1" Maximum="1000" Value="{Binding Job.InterSegmentLength}" KeyboardContainer="{Binding ElementName=Container}" StringFormat="0" FocusSelectionMode="SelectAll" />

                                                            <Image Margin="10 0 0 0" Source="../Images/JobView/settings.png" VerticalAlignment="Bottom" />
                                                        </StackPanel>
                                                    </DockPanel>
                                                </StackPanel>

                                                <Rectangle Stroke="{StaticResource TangoDividerBrush}" Margin="0 30 0 0" />

                                                <StackPanel x:Name="stackOutput" Orientation="Horizontal" VerticalAlignment="Center"  Style="{StaticResource Level1Container}">
                                                    <Image Source="../Images/JobView/output.png" Width="39" />
                                                    <TextBlock FontWeight="Medium" Margin="20 0 0 0" VerticalAlignment="Center" FontSize="{StaticResource TangoExpanderHeaderFontSize}">Output</TextBlock>
                                                </StackPanel>

                                                <DockPanel Style="{StaticResource Level2Container}">
                                                    <TextBlock Text="Spool Type:" VerticalAlignment="Center"></TextBlock>
                                                    <touch:TouchComboBox ItemsSource="{Binding SpoolTypes}" SelectedItem="{Binding Job.SpoolType}" Margin="40 -15 0 0" DisplayMemberPath="Name" Title="Select Spool Type" />
                                                </DockPanel>

                                                <!--<DockPanel Style="{StaticResource Level2Container}">
                                                    <TextBlock Text="Segments per spool:" VerticalAlignment="Center"></TextBlock>
                                                    <touch:TouchToggleSlider Margin="30 0 0 0" BorderThickness="2" Height="38" Width="83" HorizontalAlignment="Left" UncheckedContent="One" CheckedContent="All" IsChecked="{Binding Job.IsAllSegmentsPerSpool}" />
                                                </DockPanel>-->
                                            </StackPanel>
                                        </Grid>
                                    </touch:TouchDropShadowBorder>

                                    <touch:TouchVirtualizedContentControl Margin="0 20 0 0">
                                        <touch:TouchDropShadowBorder Padding="0 0 0 50" Visibility="{Binding Job.EmbroideryFileData,Converter={StaticResource IsNullToVisibilityConverter}}">
                                            <StackPanel>
                                                <StackPanel Orientation="Horizontal" VerticalAlignment="Center"  Style="{StaticResource Level1Container}">
                                                    <Image Source="../Images/embroidery.png" RenderOptions.BitmapScalingMode="Fant" Width="39" />
                                                    <TextBlock FontWeight="Medium" Margin="20 0 0 0" VerticalAlignment="Center" FontSize="{StaticResource TangoExpanderHeaderFontSize}">Embroidery File</TextBlock>
                                                </StackPanel>

                                                <StackPanel Style="{StaticResource Level2ContainerExtraMargin}">
                                                    <DockPanel>
                                                        <Image Source="{Binding Job,Converter={StaticResource JobToEmbroideryImageConverter}}" Width="230" Stretch="Uniform" HorizontalAlignment="Left"></Image>

                                                        <StackPanel VerticalAlignment="Center" HorizontalAlignment="Right">
                                                            <TextBlock TextWrapping="Wrap" TextAlignment="Right">Export the attached embroidery file to storage.</TextBlock>
                                                            <touch:TouchButton Command="{Binding ExportEmbroideryCommand}" Style="{StaticResource TangoHollowButton}" Width="240" Height="60" Margin="0 30 0 0" HorizontalAlignment="Right">EXPORT FILE</touch:TouchButton>
                                                        </StackPanel>
                                                    </DockPanel>
                                                </StackPanel>
                                            </StackPanel>
                                        </touch:TouchDropShadowBorder>
                                    </touch:TouchVirtualizedContentControl>

                                    <touch:TouchVirtualizedContentControl Margin="0 20 0 0" >
                                        <touch:TouchDropShadowBorder Padding="0 0 0 50">
                                            <StackPanel>
                                                <StackPanel Orientation="Horizontal" VerticalAlignment="Center"  Style="{StaticResource Level1Container}">
                                                    <Image Source="../Images/JobView/job-summary.png" Width="39" />
                                                    <TextBlock FontWeight="Medium" Margin="20 0 0 0" VerticalAlignment="Center" FontSize="{StaticResource TangoExpanderHeaderFontSize}">Job Summary</TextBlock>
                                                </StackPanel>

                                                <StackPanel Style="{StaticResource Level2ContainerExtraMargin}">
                                                    <Grid>
                                                        <localControls:JobSummeryViewer DataContext="{Binding Job,IsAsync=True}" Height="40"/>
                                                    </Grid>

                                                    <DockPanel Margin="0 30 0 0" LastChildFill="False">

                                                        <StackPanel Orientation="Horizontal" DockPanel.Dock="Left" VerticalAlignment="Center">
                                                            <TextBlock>
                                                    <Run Text="Job length (m):"></Run>
                                                    <Run Text="{Binding Job.Length,Mode=OneWay}"></Run>
                                                            </TextBlock>
                                                            <TextBlock Foreground="{StaticResource TangoGrayTextBrush}">
                                                                <TextBlock.Style>
                                                                    <Style TargetType="TextBlock">
                                                                        <Setter Property="Visibility" Value="Collapsed"></Setter>
                                                                        <Style.Triggers>
                                                                            <DataTrigger Binding="{Binding Job.LengthPercentageFactor,Converter={StaticResource GreaterThanToBooleanConverter},ConverterParameter=0}" Value="True">
                                                                                <Setter Property="Visibility" Value="Visible"></Setter>
                                                                            </DataTrigger>
                                                                        </Style.Triggers>
                                                                    </Style>
                                                                </TextBlock.Style>
                                                    <Run>(</Run><Run Text="{Binding Job.Length,Mode=OneWay}"></Run><Run>+</Run><Run Text="{Binding Job.LengthPercentageFactor,Mode=OneWay}"></Run><Run>%</Run><Run>)</Run>
                                                            </TextBlock>
                                                        </StackPanel>

                                                        <StackPanel DockPanel.Dock="Right" Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0 -20 5 0">
                                                            <TextBlock Margin="0 3 0 0" Foreground="{StaticResource TangoGrayTextBrush}" VerticalAlignment="Bottom">
                                                    <Run Text="Factor: +"></Run>
                                                            </TextBlock>

                                                            <touch:TouchNumericTextBox Foreground="{StaticResource TangoGrayTextBrush}" Margin="5 0 0 0" Width="50" HorizontalContentAlignment="Center" Maximum="100" Minimum="0" Value="{Binding Job.LengthPercentageFactor}" KeyboardContainer="{Binding ElementName=Container}" StringFormat="0" FocusSelectionMode="SelectAll" />

                                                            <TextBlock VerticalAlignment="Bottom" Foreground="{StaticResource TangoGrayTextBrush}">%</TextBlock>

                                                            <Image Margin="10 0 0 0" Source="../Images/JobView/settings.png" VerticalAlignment="Bottom" />
                                                        </StackPanel>
                                                    </DockPanel>
                                                </StackPanel>
                                            </StackPanel>
                                        </touch:TouchDropShadowBorder>
                                    </touch:TouchVirtualizedContentControl>

                                    <StackPanel HorizontalAlignment="Center" Margin="20 40 0 40" Orientation="Horizontal" VerticalAlignment="Center" Style="{StaticResource Level1Container}">
                                        <TextBlock FontWeight="Medium" Margin="20 0 0 0" VerticalAlignment="Center" FontSize="{StaticResource TangoTitleFontSize}">Additional Tools</TextBlock>
                                    </StackPanel>

                                    <touch:TouchVirtualizedContentControl>
                                        <touch:TouchExpander x:Name="expander_sample_dye" Margin="0 0 0 0" Padding="20 15">
                                            <touch:TouchExpander.Header>
                                                <StackPanel Orientation="Horizontal" VerticalAlignment="Center" Margin="0 0 20 0">
                                                    <Image Source="../Images/JobView/sample-dye.png" Width="39" />
                                                    <TextBlock FontWeight="Medium" Margin="20 0 0 0" VerticalAlignment="Center" FontSize="{StaticResource TangoExpanderHeaderFontSize}">Sample Dye</TextBlock>
                                                </StackPanel>
                                            </touch:TouchExpander.Header>

                                            <StackPanel>
                                                <StackPanel Margin="60 20 0 0">
                                                    <ContentControl>
                                                        <ContentControl.Style>
                                                            <Style TargetType="ContentControl">
                                                                <Setter Property="Content">
                                                                    <Setter.Value>
                                                                        <StackPanel>
                                                                            <ContentControl Content="{Binding RelativeSource={RelativeSource AncestorType=UserControl},Path=DataContext}">
                                                                                <ContentControl.Style>
                                                                                    <Style TargetType="ContentControl">
                                                                                        <Setter Property="ContentTemplate">
                                                                                            <Setter.Value>
                                                                                                <DataTemplate>
                                                                                                    <StackPanel>
                                                                                                        <TextBlock>
                                                                    <Run>Dye 1 or more units in order to get approval.</Run>
                                                                    <LineBreak/>
                                                                    <Run>Once approved, you can dye the entire job.</Run>
                                                                                                        </TextBlock>

                                                                                                        <DockPanel Margin="0 50 0 0" LastChildFill="True" Width="450" HorizontalAlignment="Left">
                                                                                                            <TextBlock DockPanel.Dock="Left" VerticalAlignment="Center">How many sample units?</TextBlock>

                                                                                                            <DockPanel Margin="50 0 0 0">
                                                                                                                <touch:TouchIconButton Command="{Binding IncreaseDecreaseSamplesToDyeCommand}" CommandParameter="-" DockPanel.Dock="Left" Icon="Minus" Padding="15" Style="{StaticResource TangoHollowButton}" BorderThickness="2" Width="51" Height="51" />
                                                                                                                <touch:TouchIconButton Command="{Binding IncreaseDecreaseSamplesToDyeCommand}" CommandParameter="+" DockPanel.Dock="Right" Icon="Plus" Padding="15" Style="{StaticResource TangoHollowButton}" BorderThickness="2" Width="51" Height="51" />
                                                                                                                <touch:TouchNumericTextBox Value="{Binding Job.SampleUnitsOrMeters}" Minimum="1" Maximum="100" HorizontalContentAlignment="Center" VerticalAlignment="Center" Margin="10 0" Foreground="{StaticResource TangoPrimaryAccentBrush}" FontSize="{StaticResource TangoTitleFontSize}" DockPanel.Dock="Right" KeyboardContainer="{Binding ElementName=Container}" />
                                                                                                            </DockPanel>
                                                                                                        </DockPanel>
                                                                                                    </StackPanel>
                                                                                                </DataTemplate>
                                                                                            </Setter.Value>
                                                                                        </Setter>
                                                                                        <Style.Triggers>
                                                                                            <DataTrigger Binding="{Binding Job.JobType}" Value="{x:Static enumerations:JobTypes.Sewing}">
                                                                                                <Setter Property="ContentTemplate">
                                                                                                    <Setter.Value>
                                                                                                        <DataTemplate>
                                                                                                            <StackPanel>
                                                                                                                <TextBlock>
                                                                    <Run>Dye several meters per segment in order to get approval.</Run>
                                                                    <LineBreak/>
                                                                    <Run>Once approved, you can dye the entire job.</Run>
                                                                                                                </TextBlock>

                                                                                                                <DockPanel Margin="0 50 0 0" LastChildFill="True" Width="450" HorizontalAlignment="Left">
                                                                                                                    <TextBlock DockPanel.Dock="Left" VerticalAlignment="Center">Meters per segment</TextBlock>

                                                                                                                    <DockPanel Margin="50 0 0 0">
                                                                                                                        <touch:TouchIconButton Command="{Binding IncreaseDecreaseSamplesToDyeCommand}" CommandParameter="-" DockPanel.Dock="Left" Icon="Minus" Padding="15" Style="{StaticResource TangoHollowButton}" BorderThickness="2" Width="51" Height="51" />
                                                                                                                        <touch:TouchIconButton Command="{Binding IncreaseDecreaseSamplesToDyeCommand}" CommandParameter="+" DockPanel.Dock="Right" Icon="Plus" Padding="15" Style="{StaticResource TangoHollowButton}" BorderThickness="2" Width="51" Height="51" />
                                                                                                                        <touch:TouchNumericTextBox Value="{Binding Job.SampleUnitsOrMeters}" Minimum="1" Maximum="100" HorizontalContentAlignment="Center" VerticalAlignment="Center" Margin="10 0" Foreground="{StaticResource TangoPrimaryAccentBrush}" FontSize="{StaticResource TangoTitleFontSize}" DockPanel.Dock="Right" KeyboardContainer="{Binding ElementName=Container}" />
                                                                                                                    </DockPanel>
                                                                                                                </DockPanel>
                                                                                                            </StackPanel>
                                                                                                        </DataTemplate>
                                                                                                    </Setter.Value>
                                                                                                </Setter>
                                                                                            </DataTrigger>
                                                                                        </Style.Triggers>
                                                                                    </Style>
                                                                                </ContentControl.Style>
                                                                            </ContentControl>

                                                                            <touch:TouchButton Margin="0 50 0 15" DockPanel.Dock="Right" Height="54" Padding="0" Width="184" CornerRadius="30" BlurRadius="20" HorizontalAlignment="Right" Command="{Binding StartSampleDyeCommand}" IsEnabled="{Binding MachineProvider.MachineOperator.CanPrint}">
                                                                                START
                                                                            </touch:TouchButton>
                                                                        </StackPanel>
                                                                    </Setter.Value>
                                                                </Setter>

                                                                <Style.Triggers>
                                                                    <DataTrigger Binding="{Binding Job.JobSampleDyeStatus}" Value="{x:Static enumerations:SampleDyeStatuses.PendingApproval}">
                                                                        <Setter Property="Content">
                                                                            <Setter.Value>
                                                                                <StackPanel>
                                                                                    <TextBlock>How to continue?</TextBlock>

                                                                                    <UniformGrid Columns="2" Width="420" HorizontalAlignment="Left" Margin="0 40 0 20">
                                                                                        <StackPanel HorizontalAlignment="Left">
                                                                                            <touch:TouchButton Style="{StaticResource TangoHollowButton}" Width="180" Height="50" Command="{Binding ApproveSampleCommand}">
                                                                                                <StackPanel Orientation="Horizontal">
                                                                                                    <touch:TouchIcon Icon="Check"></touch:TouchIcon>
                                                                                                    <TextBlock Margin="10 0 0 0">DONE</TextBlock>
                                                                                                </StackPanel>
                                                                                            </touch:TouchButton>

                                                                                            <TextBlock Margin="0 15 0 0" TextAlignment="Center">The sample is approved</TextBlock>
                                                                                        </StackPanel>

                                                                                        <StackPanel HorizontalAlignment="Right">
                                                                                            <touch:TouchButton Style="{StaticResource TangoHollowButton}" Width="180" Height="50" Command="{Binding RepeatSampleDyeCommand}">
                                                                                                <StackPanel Orientation="Horizontal">
                                                                                                    <touch:TouchIcon Icon="Repeat"></touch:TouchIcon>
                                                                                                    <TextBlock Margin="10 0 0 0">REPEAT</TextBlock>
                                                                                                </StackPanel>
                                                                                            </touch:TouchButton>

                                                                                            <TextBlock Margin="0 15 0 0" TextAlignment="Center">Dye more samples</TextBlock>
                                                                                        </StackPanel>
                                                                                    </UniformGrid>

                                                                                </StackPanel>
                                                                            </Setter.Value>
                                                                        </Setter>
                                                                    </DataTrigger>

                                                                    <DataTrigger Binding="{Binding Job.JobSampleDyeStatus}" Value="{x:Static enumerations:SampleDyeStatuses.Approved}">
                                                                        <Setter Property="Content">
                                                                            <Setter.Value>
                                                                                <StackPanel Margin="0 40 80 40">
                                                                                    <DockPanel LastChildFill="False">
                                                                                        <TextBlock DockPanel.Dock="Left" VerticalAlignment="Center">
                                                                            <Run>Sample Approved:</Run>
                                                                            <Run Text="{Binding Job.SampleDyeApproveDate,Converter={StaticResource DateTimeUTCToShortDateConverter},TargetNullValue=''}"></Run>
                                                                                        </TextBlock>
                                                                                        <touch:TouchButton DockPanel.Dock="Right" HorizontalAlignment="Right" Style="{StaticResource TangoHollowButton}" Width="220" Height="50" Command="{Binding AnotherSampleCommand}">
                                                                                            <StackPanel Orientation="Horizontal">
                                                                                                <touch:TouchIcon Icon="Plus"></touch:TouchIcon>
                                                                                                <TextBlock Margin="10 0 0 0">ANOTHER SAMPLE</TextBlock>
                                                                                            </StackPanel>
                                                                                        </touch:TouchButton>
                                                                                    </DockPanel>
                                                                                </StackPanel>
                                                                            </Setter.Value>
                                                                        </Setter>
                                                                    </DataTrigger>
                                                                </Style.Triggers>
                                                            </Style>
                                                        </ContentControl.Style>
                                                    </ContentControl>
                                                </StackPanel>

                                                <StackPanel Margin="0 0 0 15">
                                                    <StackPanel.Style>
                                                        <Style TargetType="StackPanel">
                                                            <Setter Property="Visibility" Value="Collapsed"></Setter>
                                                            <Style.Triggers>
                                                                <DataTrigger Binding="{Binding Job.JobSampleDyeStatus}" Value="{x:Static enumerations:SampleDyeStatuses.PendingApproval}">
                                                                    <Setter Property="Visibility" Value="Visible"></Setter>
                                                                </DataTrigger>
                                                            </Style.Triggers>
                                                        </Style>
                                                    </StackPanel.Style>
                                                    <Rectangle HorizontalAlignment="Stretch" StrokeThickness="1" Stroke="{StaticResource TangoDividerBrush}" Margin="-20 30"></Rectangle>

                                                    <StackPanel Orientation="Horizontal" Margin="60 0 0 0">
                                                        <touch:TouchIcon Icon="AlertCircleOutline" Width="32" Height="32" StrokeThickness="0.1" Foreground="{StaticResource TangoGrayBrush}" />
                                                        <TextBlock Margin="10 0 0 0" VerticalAlignment="Center">
                                            You can use the color fine tuning tool to adjust the colors.
                                                        </TextBlock>
                                                    </StackPanel>
                                                </StackPanel>
                                            </StackPanel>
                                        </touch:TouchExpander>
                                    </touch:TouchVirtualizedContentControl>

                                    <touch:TouchVirtualizedContentControl>
                                        <touch:TouchExpander x:Name="expander_fine_tuning" Margin="0 20 0 120" Padding="20 15" IsExpanded="{Binding IsFineTuneExpanded,Mode=TwoWay}" Visibility="{Binding Job.ColorSpace,Converter={StaticResource ColorSpaceToVisibilityConverter}}">
                                            <touch:TouchExpander.Header>
                                                <StackPanel Orientation="Horizontal" VerticalAlignment="Center" Margin="0 0 20 0">
                                                    <Image Source="../Images/JobView/color-fine-tuning.png" Width="39" />
                                                    <TextBlock FontWeight="Medium" Margin="20 0 0 0" VerticalAlignment="Center" FontSize="{StaticResource TangoExpanderHeaderFontSize}">Color Fine Tuning</TextBlock>
                                                </StackPanel>
                                            </touch:TouchExpander.Header>

                                            <StackPanel Margin="60 20 0 0">

                                                <ContentControl>
                                                    <ContentControl.Style>
                                                        <Style TargetType="ContentControl">
                                                            <Setter Property="Content">
                                                                <Setter.Value>
                                                                    <StackPanel>
                                                                        <TextBlock>Select the colors you want to fine tune.</TextBlock>

                                                                        <StackPanel HorizontalAlignment="Center" Margin="0 40 0 0">
                                                                            <TextBlock Foreground="{StaticResource TangoGrayTextBrush}" HorizontalAlignment="Center" FontSize="{StaticResource TangoTitleFontSize}">Defined Colors</TextBlock>

                                                                            <ItemsControl Margin="0 40 0 0" ItemsSource="{Binding FineTuneItems}">
                                                                                <ItemsControl.ItemTemplate>
                                                                                    <DataTemplate>
                                                                                        <DockPanel>
                                                                                            <touch:TouchCheckBox DockPanel.Dock="Left" IsChecked="{Binding IsSelected}" Margin="0 0 20 0" />
                                                                                            <touch:TouchImageButton DockPanel.Dock="Right" Image="{StaticResource Image_Color_Picker}" Width="80" Height="80" Padding="15" CornerRadius="100" Command="{Binding RelativeSource={RelativeSource AncestorType=UserControl},Path=DataContext.InvokeFineTuningPaletteCommand}" CommandParameter="{Binding}"></touch:TouchImageButton>
                                                                                            <touch:TouchFlatListBox ItemsSource="{Binding Suggestions}" SelectedItem="{Binding SelectedSuggestion}" IsEnabled="False">
                                                                                                <touch:TouchFlatListBox.ItemsPanel>
                                                                                                    <ItemsPanelTemplate>
                                                                                                        <UniformGrid Columns="{Binding Suggestions.Count}" Margin="0 20"></UniformGrid>
                                                                                                    </ItemsPanelTemplate>
                                                                                                </touch:TouchFlatListBox.ItemsPanel>
                                                                                                <touch:TouchFlatListBox.ItemTemplate>
                                                                                                    <DataTemplate>
                                                                                                        <Ellipse Width="70" Height="70" Fill="{Binding Brush}" Margin="30 0">
                                                                                                            <Ellipse.Style>
                                                                                                                <Style TargetType="Ellipse">
                                                                                                                    <Setter Property="RenderTransformOrigin" Value="0.5,0.5"></Setter>
                                                                                                                    <Setter Property="RenderTransform">
                                                                                                                        <Setter.Value>
                                                                                                                            <ScaleTransform ScaleX="1" ScaleY="1" />
                                                                                                                        </Setter.Value>
                                                                                                                    </Setter>
                                                                                                                    <Setter Property="Effect">
                                                                                                                        <Setter.Value>
                                                                                                                            <DropShadowEffect Color="{StaticResource TangoDropShadowColor}" ShadowDepth="10" Direction="10" BlurRadius="15" Opacity="0" />
                                                                                                                        </Setter.Value>
                                                                                                                    </Setter>
                                                                                                                    <Style.Triggers>
                                                                                                                        <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=ListBoxItem},Path=IsSelected}" Value="True">
                                                                                                                            <DataTrigger.EnterActions>
                                                                                                                                <BeginStoryboard>
                                                                                                                                    <Storyboard>
                                                                                                                                        <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleX" To="1.2" Duration="00:00:0.2" />
                                                                                                                                        <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleY" To="1.2" Duration="00:00:0.2" />
                                                                                                                                        <DoubleAnimation Storyboard.TargetProperty="Effect.Opacity" To="1" Duration="00:00:0.2" />
                                                                                                                                    </Storyboard>
                                                                                                                                </BeginStoryboard>
                                                                                                                            </DataTrigger.EnterActions>
                                                                                                                            <DataTrigger.ExitActions>
                                                                                                                                <BeginStoryboard>
                                                                                                                                    <Storyboard>
                                                                                                                                        <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleX" To="1" Duration="00:00:0.2" />
                                                                                                                                        <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleY" To="1" Duration="00:00:0.2" />
                                                                                                                                        <DoubleAnimation Storyboard.TargetProperty="Effect.Opacity" To="0" Duration="00:00:0.2" />
                                                                                                                                    </Storyboard>
                                                                                                                                </BeginStoryboard>
                                                                                                                            </DataTrigger.ExitActions>
                                                                                                                        </DataTrigger>
                                                                                                                    </Style.Triggers>
                                                                                                                </Style>
                                                                                                            </Ellipse.Style>
                                                                                                        </Ellipse>
                                                                                                    </DataTemplate>
                                                                                                </touch:TouchFlatListBox.ItemTemplate>
                                                                                            </touch:TouchFlatListBox>
                                                                                        </DockPanel>
                                                                                    </DataTemplate>
                                                                                </ItemsControl.ItemTemplate>
                                                                            </ItemsControl>
                                                                        </StackPanel>

                                                                        <DockPanel LastChildFill="False" Margin="0 80 0 0">
                                                                            <touch:TouchButton Command="{Binding ResetFineTuningCommand}" DockPanel.Dock="Left" Padding="40 10" Margin="-30 0 0 0" Style="{StaticResource TangoFlatButton}" Foreground="{StaticResource TangoPrimaryAccentBrush}">Reset</touch:TouchButton>

                                                                            <touch:TouchButton Margin="0 0 0 15" DockPanel.Dock="Right" Height="54" Padding="0" Width="184" CornerRadius="30" BlurRadius="20" HorizontalAlignment="Right" Command="{Binding StartFineTuningCommand}" IsEnabled="{Binding MachineProvider.MachineOperator.CanPrint}">
                                                                                START
                                                                            </touch:TouchButton>
                                                                        </DockPanel>
                                                                    </StackPanel>
                                                                </Setter.Value>
                                                            </Setter>
                                                            <Style.Triggers>
                                                                <DataTrigger Binding="{Binding Job.JobFineTuningStatus}" Value="{x:Static enumerations:FineTuningStatuses.PendingApproval}">
                                                                    <Setter Property="Content">
                                                                        <Setter.Value>
                                                                            <StackPanel Margin="0 20 0 0">
                                                                                <StackPanel Orientation="Horizontal">
                                                                                    <Grid>
                                                                                        <Ellipse Stroke="{StaticResource TangoDarkForegroundBrush}" StrokeThickness="2" Width="42" Height="42"></Ellipse>
                                                                                        <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" FontWeight="Bold">1</TextBlock>
                                                                                    </Grid>
                                                                                    <TextBlock Margin="20 0 0 0" VerticalAlignment="Center">Select the best variation for each color:</TextBlock>
                                                                                </StackPanel>

                                                                                <ItemsControl Margin="65 40 120 0" ItemsSource="{Binding ApprovalFineTuneItems}" AlternationCount="1000">
                                                                                    <ItemsControl.ItemTemplate>
                                                                                        <DataTemplate>
                                                                                            <DockPanel>
                                                                                                <TextBlock Margin="0 0 20 0" VerticalAlignment="Center">
                                                                                        <Run>Color</Run>
                                                                                        <Run>#</Run><Run Text="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}, Path=(ItemsControl.AlternationIndex),Mode=OneWay,Converter={StaticResource MathOperatorConverter},ConverterParameter='+1'}"></Run>
                                                                                                </TextBlock>
                                                                                                <touch:TouchFlatListBox ItemsSource="{Binding Suggestions}" SelectedItem="{Binding SelectedSuggestion}">
                                                                                                    <touch:TouchFlatListBox.ItemsPanel>
                                                                                                        <ItemsPanelTemplate>
                                                                                                            <UniformGrid Columns="{Binding Suggestions.Count}" Margin="0 20"></UniformGrid>
                                                                                                        </ItemsPanelTemplate>
                                                                                                    </touch:TouchFlatListBox.ItemsPanel>
                                                                                                    <touch:TouchFlatListBox.ItemTemplate>
                                                                                                        <DataTemplate>
                                                                                                            <Ellipse Width="70" Height="70" Fill="{Binding Brush}" Margin="30 0">
                                                                                                                <Ellipse.Style>
                                                                                                                    <Style TargetType="Ellipse">
                                                                                                                        <Setter Property="RenderTransformOrigin" Value="0.5,0.5"></Setter>
                                                                                                                        <Setter Property="RenderTransform">
                                                                                                                            <Setter.Value>
                                                                                                                                <ScaleTransform ScaleX="1" ScaleY="1" />
                                                                                                                            </Setter.Value>
                                                                                                                        </Setter>
                                                                                                                        <Setter Property="Effect">
                                                                                                                            <Setter.Value>
                                                                                                                                <DropShadowEffect Color="{StaticResource TangoDropShadowColor}" ShadowDepth="10" Direction="10" BlurRadius="15" Opacity="0" />
                                                                                                                            </Setter.Value>
                                                                                                                        </Setter>
                                                                                                                        <Style.Triggers>
                                                                                                                            <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=ListBoxItem},Path=IsSelected}" Value="True">
                                                                                                                                <DataTrigger.EnterActions>
                                                                                                                                    <BeginStoryboard>
                                                                                                                                        <Storyboard>
                                                                                                                                            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleX" To="1.2" Duration="00:00:0.2" />
                                                                                                                                            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleY" To="1.2" Duration="00:00:0.2" />
                                                                                                                                            <DoubleAnimation Storyboard.TargetProperty="Effect.Opacity" To="1" Duration="00:00:0.2" />
                                                                                                                                        </Storyboard>
                                                                                                                                    </BeginStoryboard>
                                                                                                                                </DataTrigger.EnterActions>
                                                                                                                                <DataTrigger.ExitActions>
                                                                                                                                    <BeginStoryboard>
                                                                                                                                        <Storyboard>
                                                                                                                                            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleX" To="1" Duration="00:00:0.2" />
                                                                                                                                            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleY" To="1" Duration="00:00:0.2" />
                                                                                                                                            <DoubleAnimation Storyboard.TargetProperty="Effect.Opacity" To="0" Duration="00:00:0.2" />
                                                                                                                                        </Storyboard>
                                                                                                                                    </BeginStoryboard>
                                                                                                                                </DataTrigger.ExitActions>
                                                                                                                            </DataTrigger>
                                                                                                                        </Style.Triggers>
                                                                                                                    </Style>
                                                                                                                </Ellipse.Style>
                                                                                                            </Ellipse>
                                                                                                        </DataTemplate>
                                                                                                    </touch:TouchFlatListBox.ItemTemplate>
                                                                                                </touch:TouchFlatListBox>
                                                                                            </DockPanel>
                                                                                        </DataTemplate>
                                                                                    </ItemsControl.ItemTemplate>
                                                                                </ItemsControl>

                                                                                <StackPanel Orientation="Horizontal" Margin="0 40 0 0">
                                                                                    <Grid>
                                                                                        <Ellipse Stroke="{StaticResource TangoDarkForegroundBrush}" StrokeThickness="2" Width="42" Height="42"></Ellipse>
                                                                                        <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" FontWeight="Bold">2</TextBlock>
                                                                                    </Grid>
                                                                                    <TextBlock Margin="20 0 0 0" VerticalAlignment="Center">How to continue</TextBlock>
                                                                                </StackPanel>

                                                                                <UniformGrid Columns="2" Width="530" HorizontalAlignment="Left" Margin="0 40 0 20">
                                                                                    <StackPanel HorizontalAlignment="Left">
                                                                                        <touch:TouchButton Style="{StaticResource TangoHollowButton}" Width="180" Height="50" Command="{Binding ApproveFineTuningCommand}">
                                                                                            <StackPanel Orientation="Horizontal">
                                                                                                <touch:TouchIcon Icon="Check"></touch:TouchIcon>
                                                                                                <TextBlock Margin="10 0 0 0">DONE</TextBlock>
                                                                                            </StackPanel>
                                                                                        </touch:TouchButton>

                                                                                        <TextBlock Margin="0 15 0 0" TextAlignment="Center">All colors are approved</TextBlock>
                                                                                    </StackPanel>

                                                                                    <StackPanel HorizontalAlignment="Right">
                                                                                        <touch:TouchButton Style="{StaticResource TangoHollowButton}" Width="180" Height="50" Command="{Binding RepeatFineTuningCommand}">
                                                                                            <StackPanel Orientation="Horizontal">
                                                                                                <touch:TouchIcon Icon="Repeat"></touch:TouchIcon>
                                                                                                <TextBlock Margin="10 0 0 0">REPEAT</TextBlock>
                                                                                            </StackPanel>
                                                                                        </touch:TouchButton>

                                                                                        <TextBlock Margin="0 15 0 0" TextAlignment="Left" TextWrapping="Wrap" Width="170">Some color need more fine tuning</TextBlock>
                                                                                    </StackPanel>
                                                                                </UniformGrid>
                                                                            </StackPanel>
                                                                        </Setter.Value>
                                                                    </Setter>
                                                                </DataTrigger>

                                                                <DataTrigger Binding="{Binding Job.JobFineTuningStatus}" Value="{x:Static enumerations:FineTuningStatuses.Approved}">
                                                                    <Setter Property="Content">
                                                                        <Setter.Value>
                                                                            <StackPanel Margin="0 40 80 40">
                                                                                <DockPanel LastChildFill="False">
                                                                                    <TextBlock DockPanel.Dock="Left" VerticalAlignment="Center">
                                                                            <Run>Colors Approved:</Run>
                                                                            <Run Text="{Binding Job.FineTuningApproveDate,Converter={StaticResource DateTimeUTCToShortDateConverter},TargetNullValue=''}"></Run>
                                                                                    </TextBlock>
                                                                                    <touch:TouchButton DockPanel.Dock="Right" HorizontalAlignment="Right" Style="{StaticResource TangoHollowButton}" Width="220" Height="50" Command="{Binding RepeatFineTuningCommand}">
                                                                                        <StackPanel Orientation="Horizontal">
                                                                                            <touch:TouchIcon Icon="Plus"></touch:TouchIcon>
                                                                                            <TextBlock Margin="10 0 0 0">REPEAT FINE TUNING</TextBlock>
                                                                                        </StackPanel>
                                                                                    </touch:TouchButton>
                                                                                </DockPanel>
                                                                            </StackPanel>
                                                                        </Setter.Value>
                                                                    </Setter>
                                                                </DataTrigger>
                                                            </Style.Triggers>
                                                        </Style>
                                                    </ContentControl.Style>
                                                </ContentControl>
                                            </StackPanel>
                                        </touch:TouchExpander>
                                    </touch:TouchVirtualizedContentControl>
                                </StackPanel>
                            </StackPanel>
                        </touch:LightTouchScrollViewer>
                    </Grid>

                    <Border VerticalAlignment="Top" x:Name="borderEditDock" Background="{StaticResource TangoPrimaryBackgroundBrush}" BorderThickness="0 0 0 1" BorderBrush="{StaticResource TangoDividerBrush}" Padding="0 0 0 10">
                        <!--<Border.Effect>
                            <DropShadowEffect Color="{StaticResource TangoDropShadowColor}" BlurRadius="20" />
                        </Border.Effect>-->
                    </Border>
                </Grid>

                <Grid Grid.Row="1">
                    <Grid IsHitTestVisible="False">
                        <Grid.Background>
                            <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                                <GradientStop Offset="0" Color="#AEFFFFFF" />
                                <GradientStop Offset="1" Color="{StaticResource TangoPrimaryBackgroundColor}" />
                            </LinearGradientBrush>
                        </Grid.Background>
                        <Rectangle Stroke="{StaticResource TangoDividerBrush}" StrokeThickness="1" VerticalAlignment="Top" />
                    </Grid>
                    <!--<Border Padding="20 20">
                    <Grid>
                        <DockPanel>
                            <touch:TouchButton IsEnabled="{Binding MachineProvider.MachineOperator.CanPrint}" DockPanel.Dock="Right" Height="54" Padding="0" Width="184" CornerRadius="30" BlurRadius="20" HorizontalAlignment="Right" DelayCommand="{Binding DyeCommand}" DelayCommandDuration="00:00:0.3">
                                DYE
                            </touch:TouchButton>

                            -->
                    <!--Add this in case you want to display job summery on bottom panel-->
                    <!--<localControls:JobSummeryViewer DataContext="{Binding Job}" Height="35" Margin="0 -20 30 0" />-->
                    <!--
                        </DockPanel>
                    </Grid>
                </Border>-->
                </Grid>

                <dragAndDrop:DraggingSurface x:Name="DraggingSurface" />
            </Grid>
        </touch:TouchLoadingPanel>

        <Border Padding="20" Background="{StaticResource TangoPrimaryBackgroundBrush}" BorderThickness="0 0 0 1" BorderBrush="{StaticResource TangoDividerBrush}">
            <Border.Effect>
                <DropShadowEffect Color="Silver" ShadowDepth="0" BlurRadius="20" Opacity="1" />
            </Border.Effect>

            <Grid>
                <StackPanel Orientation="Horizontal" Width="450" HorizontalAlignment="Left">
                    <TextBlock MaxWidth="360" TextTrimming="CharacterEllipsis" VerticalAlignment="Center" FontSize="{StaticResource TangoHeaderFontSize}" FontWeight="SemiBold" Text="{Binding Job.Name,FallbackValue='Job Name'}"/>
                    <TextBlock Margin="20 0 0 5" VerticalAlignment="Bottom" Foreground="{StaticResource TangoGrayTextBrush}">
                        <Run>(</Run><Run Text="{Binding Job.JobType,FallbackValue=Embroidery}"></Run><Run>)</Run>
                    </TextBlock>
                </StackPanel>
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Bottom" Height="57" Margin="0 0 30 -45">
                    <touch:TouchIconButton Margin="0 0 30 0" Padding="17" Style="{StaticResource TangoRoundTouchIconButton}" Icon="EllipsisVSolid" />
                    <touch:TouchIconButton Command="{Binding RemoveJobCommand}" Margin="0 0 30 0" Padding="17" Style="{StaticResource TangoRoundTouchIconButton}" Icon="TrashAltRegular" />
                    <touch:TouchIconButton Command="{Binding SaveJobCommand}" Padding="18" Style="{StaticResource TangoRoundTouchIconButton}" Icon="SaveRegular" />
                </StackPanel>
            </Grid>
        </Border>
    </Grid>
</UserControl>