<UserControl x:Class="Tango.PPC.Jobs.Views.JobsView"
             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:local="clr-namespace:Tango.PPC.Jobs.Views"
             xmlns:dragAndDrop="clr-namespace:Tango.DragAndDrop;assembly=Tango.DragAndDrop"
			 xmlns:keyboard="clr-namespace:Tango.Touch.Keyboard;assembly=Tango.Touch"
             xmlns:converters="clr-namespace:Tango.PPC.Jobs.Converters"
             xmlns:touch="clr-namespace:Tango.Touch.Controls;assembly=Tango.Touch"
             xmlns:touchComponents="clr-namespace:Tango.Touch.Components;assembly=Tango.Touch"
             xmlns:fa="http://schemas.fontawesome.io/icons/"
			 xmlns:entities="clr-namespace:Tango.BL.Entities;assembly=Tango.BL"
             xmlns:sys="clr-namespace:System;assembly=mscorlib"
             xmlns:sharedConverters="clr-namespace:Tango.SharedUI.Converters;assembly=Tango.SharedUI"
             xmlns:enumerations="clr-namespace:Tango.BL.Enumerations;assembly=Tango.BL"
             xmlns:views="clr-namespace:Tango.PPC.Jobs.Views"
             xmlns:vm="clr-namespace:Tango.PPC.Jobs.ViewModels"
             xmlns:global="clr-namespace:Tango.PPC.Jobs"
             mc:Ignorable="d" 
             d:DesignHeight="1280" d:DesignWidth="800" d:DataContext="{d:DesignInstance Type=vm:JobsViewVM, IsDesignTimeCreatable=False}" DataContext="{x:Static global:ViewModelLocator.JobsViewVM}">

    <UserControl.Resources>

        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="../Resources/Styles.xaml" />
            </ResourceDictionary.MergedDictionaries>

            <converters:JobToPieImageConverter x:Key="JobToPieImageConverter" />
            <sharedConverters:DateTimeUTCToShortDateConverter x:Key="DateTimeUTCToShortDateConverter" />
            <sharedConverters:EnumToDescriptionConverter x:Key="EnumToDescriptionConverter" />
            <sharedConverters:EnumToItemsSourceConverter x:Key="EnumToItemsSourceConverter" />
            <converters:JobsCategoryToVisibilityConverter x:Key="JobsCategoryToVisibilityConverter" />
        </ResourceDictionary>
    </UserControl.Resources>

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

        <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>
            <TextBlock VerticalAlignment="Center" FontSize="{StaticResource TangoHeaderFontSize}" FontWeight="SemiBold">Jobs</TextBlock>
        </Border>

        <Grid Grid.Row="1">
            <Grid.RowDefinitions>
                <RowDefinition Height="100"/>
                <RowDefinition Height="1*"/>
            </Grid.RowDefinitions>

            <Grid HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0 -28 30 0">
                <StackPanel Orientation="Horizontal" Height="58" RenderTransformOrigin="0.5,0.5">
                    <StackPanel.Style>
                        <Style TargetType="StackPanel">
                            <Setter Property="Opacity" Value="0"></Setter>
                            <Setter Property="IsHitTestVisible" Value="False"></Setter>
                            <Setter Property="RenderTransform">
                                <Setter.Value>
                                    <TranslateTransform X="100" />
                                </Setter.Value>
                            </Setter>
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding IsMultiSelecting}" Value="True">
                                    <Setter Property="IsHitTestVisible" Value="True"></Setter>
                                    <DataTrigger.EnterActions>
                                        <BeginStoryboard>
                                            <Storyboard>
                                                <DoubleAnimation Storyboard.TargetProperty="Opacity" To="1" Duration="00:00:0.2"></DoubleAnimation>
                                                <DoubleAnimation Storyboard.TargetProperty="RenderTransform.X" To="0" Duration="00:00:0.2"></DoubleAnimation>
                                            </Storyboard>
                                        </BeginStoryboard>
                                    </DataTrigger.EnterActions>
                                    <DataTrigger.ExitActions>
                                        <BeginStoryboard>
                                            <Storyboard>
                                                <DoubleAnimation Storyboard.TargetProperty="Opacity" To="0" Duration="00:00:0.2"></DoubleAnimation>
                                                <DoubleAnimation Storyboard.TargetProperty="RenderTransform.X" To="100" Duration="00:00:0.2"></DoubleAnimation>
                                            </Storyboard>
                                        </BeginStoryboard>
                                    </DataTrigger.ExitActions>
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </StackPanel.Style>
                    <touch:TouchIconButton Command="{Binding ClearSelectionCommand}" Visibility="{Binding IsMultiSelecting,Converter={StaticResource BooleanToVisibilityConverter}}" Margin="0 0 30 0" Padding="20" Icon="Undo">
                        <touch:TouchIconButton.Style>
                            <Style TargetType="touch:TouchIconButton" BasedOn="{StaticResource TangoRoundTouchIconButton}">
                                <Setter Property="IconAngle" Value="0"></Setter>
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding IsMultiSelecting}" Value="True">
                                        <DataTrigger.EnterActions>
                                            <BeginStoryboard>
                                                <Storyboard>
                                                    <DoubleAnimation Storyboard.TargetProperty="IconAngle" To="360" Duration="00:00:0.2"></DoubleAnimation>
                                                </Storyboard>
                                            </BeginStoryboard>
                                        </DataTrigger.EnterActions>
                                        <DataTrigger.ExitActions>
                                            <BeginStoryboard>
                                                <Storyboard>
                                                    <DoubleAnimation Storyboard.TargetProperty="IconAngle" To="0" Duration="00:00:00"></DoubleAnimation>
                                                </Storyboard>
                                            </BeginStoryboard>
                                        </DataTrigger.ExitActions>
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </touch:TouchIconButton.Style>
                    </touch:TouchIconButton>
                    <touch:TouchIconButton Command="{Binding ExportJobCommand}" Margin="0 0 30 0" Padding="20" Icon="HddRegular" Style="{StaticResource TangoRoundTouchIconButton}"></touch:TouchIconButton>
                    <touch:TouchIconButton Command="{Binding CloneJobsCommand}" Margin="0 0 30 0" Padding="20" Icon="CopyRegular" Style="{StaticResource TangoRoundTouchIconButton}"></touch:TouchIconButton>
                    <touch:TouchIconButton Command="{Binding DeleteJobsCommand}" Padding="20" Icon="TrashAltRegular" Style="{StaticResource TangoRoundTouchIconButton}"></touch:TouchIconButton>
                </StackPanel>
                <touch:TouchIconButton Command="{Binding AddJobCommand}" RenderTransformOrigin="0.5,0.5" Margin="0 -15 0 0" Padding="20" Height="80" Icon="Plus" HorizontalAlignment="Right">
                    <touch:TouchIconButton.Style>
                        <Style TargetType="touch:TouchIconButton" BasedOn="{StaticResource TangoRoundTouchIconButton}">
                            <Setter Property="Opacity" Value="1"></Setter>
                            <Setter Property="IsHitTestVisible" Value="True"></Setter>
                            <Setter Property="RenderTransform">
                                <Setter.Value>
                                    <ScaleTransform ScaleX="1" ScaleY="1" />
                                </Setter.Value>
                            </Setter>
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding IsMultiSelecting}" Value="True">
                                    <Setter Property="IsHitTestVisible" Value="False"></Setter>
                                    <DataTrigger.EnterActions>
                                        <BeginStoryboard>
                                            <Storyboard>
                                                <DoubleAnimation Storyboard.TargetProperty="Opacity" To="0" Duration="00:00:0.2"></DoubleAnimation>
                                                <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleX" To="0.5" Duration="00:00:0.2"></DoubleAnimation>
                                                <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleY" To="0.5" Duration="00:00:0.2"></DoubleAnimation>
                                            </Storyboard>
                                        </BeginStoryboard>
                                    </DataTrigger.EnterActions>
                                    <DataTrigger.ExitActions>
                                        <BeginStoryboard>
                                            <Storyboard>
                                                <DoubleAnimation Storyboard.TargetProperty="Opacity" To="1" Duration="00:00:0.2"></DoubleAnimation>
                                                <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleX" To="1" Duration="00:00:0.2"></DoubleAnimation>
                                                <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleY" To="1" Duration="00:00:0.2"></DoubleAnimation>
                                            </Storyboard>
                                        </BeginStoryboard>
                                    </DataTrigger.ExitActions>
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </touch:TouchIconButton.Style>
                </touch:TouchIconButton>
            </Grid>

            <DockPanel>
                <touch:TouchNavigationLinks DockPanel.Dock="Left" x:Name="navigationLinks" SelectionChanged="TouchNavigationLinks_SelectionChanged" SelectedIndex="{Binding SelectedCategoryIndex,Mode=TwoWay}" IsEnabled="{Binding IsMultiSelecting,Converter={StaticResource BooleanInverseConverter}}" VerticalAlignment="Bottom" Margin="20" FontSize="{StaticResource TangoNavigationLinksFontSize}">
                    <TextBlock>DRAFT</TextBlock>
                    <TextBlock>HISTORY</TextBlock>
                </touch:TouchNavigationLinks>

                <Grid VerticalAlignment="Center" HorizontalAlignment="Left" Margin="0 5 0 0">
                    <DockPanel>
                        <Rectangle Margin="0 0 20 0" HorizontalAlignment="Center" VerticalAlignment="Bottom" Stroke="{StaticResource TangoGrayBrush}" StrokeThickness="1" Height="25"></Rectangle>
                        <touch:TouchIcon DockPanel.Dock="Left" Foreground="{StaticResource TangoGrayBrush}" Width="20" Height="20" VerticalAlignment="Bottom" Icon="Magnify" />
                        <touch:TouchTextBox Margin="5 0 0 0" Width="300" Text="{Binding Filter,Mode=TwoWay}" Watermark="find name, customer..."></touch:TouchTextBox>
                    </DockPanel>
                </Grid>
            </DockPanel>

            <Grid Grid.Row="1" x:Name="moveGrid">
                <touch:TouchLoadingPanel IsLoading="{Binding IsLoadingJobs}" Visibility="{Binding SelectedCategory,Converter={StaticResource JobsCategoryToVisibilityConverter},ConverterParameter='Draft'}">
                    <touch:LightTouchDataGrid AnimateSorting="False" RenderOptions.EdgeMode="Unspecified" Style="{StaticResource TangoJobsGrid}" x:Name="dataGridJobs" SelectedItems="{Binding SelectedJobs}" IsMultiSelecting="{Binding IsMultiSelecting,Mode=TwoWay}" OnDragAndDropCommand="{Binding JobDragedDroppedCommand}" ItemsSource="{Binding DraftJobsCollectionView}" ItemSelectedCommand="{Binding JobSelectedCommand}" Margin="10">
                        <touch:LightTouchDataGrid.Columns>
                            <touch:LightTouchDataGridColumn Width="90">
                                <touch:LightTouchDataGridColumn.Header>
                                    <Image Source="../Images/warning.png" Width="24" />
                                </touch:LightTouchDataGridColumn.Header>
                                <touch:LightTouchDataGridColumn.CellTemplate>
                                    <DataTemplate>
                                        <Grid Margin="5 0 0 0" Width="40" Height="40">
                                            <Image HorizontalAlignment="Left" VerticalAlignment="Top" Width="20">
                                                <Image.Style>
                                                    <Style TargetType="Image">
                                                        <Setter Property="Source" Value="../Images/sample_approved_small_gray.png"></Setter>
                                                        <Style.Triggers>
                                                            <DataTrigger Binding="{Binding JobSampleDyeStatus}" Value="Approved">
                                                                <Setter Property="Source" Value="../Images/sample_approved_small.png"></Setter>
                                                            </DataTrigger>
                                                        </Style.Triggers>
                                                    </Style>
                                                </Image.Style>
                                            </Image>
                                            <Image HorizontalAlignment="Right" VerticalAlignment="Bottom" Width="20">
                                                <Image.Style>
                                                    <Style TargetType="Image">
                                                        <Setter Property="Source" Value="../Images/color_approved_small_gray.png"></Setter>
                                                        <Style.Triggers>
                                                            <DataTrigger Binding="{Binding JobFineTuningStatus}" Value="Approved">
                                                                <Setter Property="Source" Value="../Images/color_approved_small.png"></Setter>
                                                            </DataTrigger>
                                                        </Style.Triggers>
                                                    </Style>
                                                </Image.Style>
                                            </Image>
                                        </Grid>
                                    </DataTemplate>
                                </touch:LightTouchDataGridColumn.CellTemplate>
                            </touch:LightTouchDataGridColumn>
                            <touch:LightTouchDataGridColumn Width="1*" Header="Name" SortMember="Name" HorizontalContentAlignment="Left">
                                <touch:LightTouchDataGridColumn.CellTemplate>
                                    <DataTemplate>
                                        <TextBlock IsHitTestVisible="False" Text="{Binding Name}"></TextBlock>
                                    </DataTemplate>
                                </touch:LightTouchDataGridColumn.CellTemplate>
                            </touch:LightTouchDataGridColumn>
                            <touch:LightTouchDataGridColumn Width="117" Header="Length (m)" SortMember="Length">
                                <touch:LightTouchDataGridColumn.CellTemplate>
                                    <DataTemplate>
                                        <TextBlock IsHitTestVisible="False" Text="{Binding Length,StringFormat=0.0}"></TextBlock>
                                    </DataTemplate>
                                </touch:LightTouchDataGridColumn.CellTemplate>
                            </touch:LightTouchDataGridColumn>
                            <touch:LightTouchDataGridColumn Header="Colors" SortMember="Segments.Count" Width="85">
                                <touch:LightTouchDataGridColumn.CellTemplate>
                                    <DataTemplate>
                                        <Image Stretch="Fill" IsHitTestVisible="False" Source="{Binding Converter={StaticResource JobToPieImageConverter},ConverterParameter='25,25'}" Width="25" Height="25" HorizontalAlignment="Left"></Image>
                                    </DataTemplate>
                                </touch:LightTouchDataGridColumn.CellTemplate>
                            </touch:LightTouchDataGridColumn>
                            <touch:LightTouchDataGridColumn Width="100" Header="Updated" SortMember="LastUpdated">
                                <touch:LightTouchDataGridColumn.CellTemplate>
                                    <DataTemplate>
                                        <TextBlock IsHitTestVisible="False" Text="{Binding LastUpdated,Converter={StaticResource DateTimeUTCToShortDateConverter}}"></TextBlock>
                                    </DataTemplate>
                                </touch:LightTouchDataGridColumn.CellTemplate>
                            </touch:LightTouchDataGridColumn>
                            <touch:LightTouchDataGridColumn SortMember="JobIndex" SortDirection="{x:Null}" Width="78" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" DisplayChevron="False" ForcedSortDirection="Ascending">
                                <touch:LightTouchDataGridColumn.HeaderTemplate>
                                    <DataTemplate>
                                        <Border CornerRadius="0 5 5 0">
                                            <Border.Style>
                                                <Style TargetType="Border">
                                                    <Setter Property="Background" Value="{StaticResource TangoMidAccentBrush}"></Setter>
                                                    <Style.Triggers>
                                                        <DataTrigger Binding="{Binding SortDirection}" Value="Ascending">
                                                            <Setter Property="Background" Value="{StaticResource TangoLowAccentBrush}"></Setter>
                                                        </DataTrigger>
                                                    </Style.Triggers>
                                                </Style>
                                            </Border.Style>
                                            <Grid>
                                                <Rectangle HorizontalAlignment="Left" StrokeThickness="2" Stroke="{StaticResource TangoColumnDividerBrush}" />
                                                <Image Source="/Images/arrows.png" Width="28" />
                                            </Grid>
                                        </Border>
                                    </DataTemplate>
                                </touch:LightTouchDataGridColumn.HeaderTemplate>
                                <touch:LightTouchDataGridColumn.CellTemplate>
                                    <DataTemplate>
                                        <dragAndDrop:DragThumb IsEnabled="{Binding RelativeSource={RelativeSource AncestorType=UserControl},Path=DataContext.IsMultiSelecting,Converter={StaticResource BooleanInverseConverter}}" Background="Transparent" touchComponents:Ripple.PreventRipple="True" touchComponents:TransformationHelper.PreventTransform="True">
                                            <dragAndDrop:DragThumb.Style>
                                                <Style TargetType="dragAndDrop:DragThumb">
                                                    <Setter Property="Visibility" Value="Collapsed"></Setter>
                                                    <Style.Triggers>
                                                        <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=touch:LightTouchDataGridCell},Path=Column.SortDirection}" Value="Ascending">
                                                            <Setter Property="Visibility" Value="Visible"></Setter>
                                                        </DataTrigger>
                                                    </Style.Triggers>
                                                </Style>
                                            </dragAndDrop:DragThumb.Style>
                                            <StackPanel Width="30" IsHitTestVisible="False" VerticalAlignment="Center">
                                                <Rectangle StrokeThickness="2" Stroke="{StaticResource TangoDarkForegroundBrush}" />
                                                <Rectangle StrokeThickness="2" Stroke="{StaticResource TangoDarkForegroundBrush}" Margin="0 5 0 0" />
                                            </StackPanel>
                                        </dragAndDrop:DragThumb>
                                    </DataTemplate>
                                </touch:LightTouchDataGridColumn.CellTemplate>
                            </touch:LightTouchDataGridColumn>
                        </touch:LightTouchDataGrid.Columns>
                    </touch:LightTouchDataGrid>
                </touch:TouchLoadingPanel>

                <touch:TouchLoadingPanel IsLoading="{Binding IsLoadingJobs}" Visibility="{Binding SelectedCategory,Converter={StaticResource JobsCategoryToVisibilityConverter},ConverterParameter='History'}">
                    <touch:LightTouchDataGrid AnimateSorting="False" EnableDragAndDrop="False" RenderOptions.EdgeMode="Unspecified" x:Name="dataGridJobsHistory" Style="{StaticResource TangoJobsGrid}" SelectedItems="{Binding SelectedJobs}" IsMultiSelecting="{Binding IsMultiSelecting,Mode=TwoWay}" ItemsSource="{Binding HistoryJobsCollectionView}" ItemSelectedCommand="{Binding JobSelectedCommand}" Margin="10">
                        <touch:LightTouchDataGrid.Columns>
                            <touch:LightTouchDataGridColumn Width="50">
                                <touch:LightTouchDataGridColumn.Header>
                                    <Image Source="../Images/warning.png" Width="24" />
                                </touch:LightTouchDataGridColumn.Header>
                                <touch:LightTouchDataGridColumn.CellTemplate>
                                    <DataTemplate>
                                        <touch:TouchIcon Width="26">
                                            <touch:TouchIcon.Style>
                                                <Style TargetType="touch:TouchIcon">
                                                    <Setter Property="Icon" Value="Check"></Setter>
                                                    <Setter Property="Foreground" Value="{StaticResource TangoSuccessBrush}"></Setter>
                                                    <Style.Triggers>
                                                        <DataTrigger Binding="{Binding JobStatus}" Value="Disrupted">
                                                            <Setter Property="Icon" Value="AlertCircleOutline"></Setter>
                                                            <Setter Property="Foreground" Value="{StaticResource TangoWarningBrush}"></Setter>
                                                        </DataTrigger>
                                                    </Style.Triggers>
                                                </Style>
                                            </touch:TouchIcon.Style>
                                        </touch:TouchIcon>
                                    </DataTemplate>
                                </touch:LightTouchDataGridColumn.CellTemplate>
                            </touch:LightTouchDataGridColumn>
                            <touch:LightTouchDataGridColumn Width="100" Header="Status" SortMember="JobStatus">
                                <touch:LightTouchDataGridColumn.CellTemplate>
                                    <DataTemplate>
                                        <TextBlock IsHitTestVisible="False" Text="{Binding JobStatus,Converter={StaticResource EnumToDescriptionConverter}}"></TextBlock>
                                    </DataTemplate>
                                </touch:LightTouchDataGridColumn.CellTemplate>
                            </touch:LightTouchDataGridColumn>
                            <touch:LightTouchDataGridColumn Width="1*" Header="Name" SortMember="Name" HorizontalContentAlignment="Left">
                                <touch:LightTouchDataGridColumn.CellTemplate>
                                    <DataTemplate>
                                        <TextBlock IsHitTestVisible="False" Text="{Binding Name}"></TextBlock>
                                    </DataTemplate>
                                </touch:LightTouchDataGridColumn.CellTemplate>
                            </touch:LightTouchDataGridColumn>
                            <touch:LightTouchDataGridColumn Width="117" Header="Length (m)" SortMember="Length">
                                <touch:LightTouchDataGridColumn.CellTemplate>
                                    <DataTemplate>
                                        <TextBlock IsHitTestVisible="False" Text="{Binding Length,StringFormat=0.0}"></TextBlock>
                                    </DataTemplate>
                                </touch:LightTouchDataGridColumn.CellTemplate>
                            </touch:LightTouchDataGridColumn>
                            <touch:LightTouchDataGridColumn Header="Colors" SortMember="Segments.Count" Width="85">
                                <touch:LightTouchDataGridColumn.CellTemplate>
                                    <DataTemplate>
                                        <Image Stretch="Fill" IsHitTestVisible="False" Source="{Binding Converter={StaticResource JobToPieImageConverter},ConverterParameter='25,25'}" Width="25" Height="25" HorizontalAlignment="Left"></Image>
                                    </DataTemplate>
                                </touch:LightTouchDataGridColumn.CellTemplate>
                            </touch:LightTouchDataGridColumn>
                            <touch:LightTouchDataGridColumn Width="100" Header="Updated" SortMember="LastUpdated">
                                <touch:LightTouchDataGridColumn.CellTemplate>
                                    <DataTemplate>
                                        <TextBlock IsHitTestVisible="False" Text="{Binding LastUpdated,Converter={StaticResource DateTimeUTCToShortDateConverter}}"></TextBlock>
                                    </DataTemplate>
                                </touch:LightTouchDataGridColumn.CellTemplate>
                            </touch:LightTouchDataGridColumn>
                        </touch:LightTouchDataGrid.Columns>
                    </touch:LightTouchDataGrid>
                </touch:TouchLoadingPanel>
            </Grid>
        </Grid>
    </Grid>
</UserControl>