<UserControl x:Class="Tango.MachineStudio.HardwareDesigner.Views.ComparisonWizardView"
             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:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
             xmlns:mahapps="http://metro.mahapps.com/winfx/xaml/controls"
             xmlns:converters="clr-namespace:Tango.SharedUI.Converters;assembly=Tango.SharedUI"
             xmlns:local="clr-namespace:Tango.MachineStudio.HardwareDesigner.ViewModels"
             mc:Ignorable="d" 
             d:DesignHeight="800" d:DesignWidth="800" Height="700" Width="1100" Foreground="{StaticResource Dialog.Foreground}" Background="{StaticResource Dialog.Background}">
    <UserControl.Resources>
        <converters:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
        <converters:BooleanToVisibilityInverseConverter x:Key="BooleanToVisibilityInverseConverter" />
        <Style TargetType="TextBlock" x:Key="DifferenceTextBoxStyle">
            <Style.Triggers>
                <DataTrigger Binding="{Binding HasDifferences}" Value="True" >
                    <Setter Property="Foreground" Value="{StaticResource RedBrush100}"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
        <Style TargetType="TextBlock" x:Key="CollectionHasDifferenceTextBox">
            <Style.Triggers>
                <DataTrigger Binding="{Binding HasDifferences}" Value="True" >
                    <Setter Property="Foreground" Value="{StaticResource RedBrush100}"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
        <Style TargetType="ItemsControl" >
            <Setter Property="FontSize" Value="14"></Setter>
            <Setter Property="FontWeight" Value="Normal"></Setter>
        </Style>
    </UserControl.Resources>
    <Grid>
        <Grid Margin="10">
            <Grid.RowDefinitions>
                <RowDefinition Height="40"></RowDefinition>
                <RowDefinition Height="40"></RowDefinition>
                <RowDefinition Height="*" MinHeight="200"></RowDefinition>
                <RowDefinition Height="Auto"></RowDefinition>
            </Grid.RowDefinitions>
            <UniformGrid Columns="3" Grid.Row="0" >
                <ComboBox Margin="10 0 0 0" HorizontalAlignment="Left" IsEnabled="{Binding IsFree}" ItemsSource="{Binding HardwareVersions}" SelectedItem="{Binding SelectedVersion1}" Width="300" FontSize="16" FontWeight="Bold" materialDesign:HintAssist.Hint="Hardware Version 1">
                    <ComboBox.ItemTemplate>
                        <DataTemplate>
                            <TextBlock><Run Text="{Binding Name}"></Run> <Run></Run> <Run Foreground="{StaticResource Dialog.Foreground}" FontSize="14">v</Run><Run Foreground="{StaticResource Dialog.Foreground}" FontSize="14" Text="{Binding Version}"></Run></TextBlock>
                        </DataTemplate>
                    </ComboBox.ItemTemplate>
                </ComboBox>

                <TextBlock Text="Comparison Wizard" Foreground="{StaticResource LightGrayBrush}" FontStyle="Italic" FontWeight="Bold" FontSize="28" HorizontalAlignment="Center" VerticalAlignment="Center" ></TextBlock>

                <ComboBox IsEnabled="{Binding IsFree}" ItemsSource="{Binding HardwareVersions}" SelectedItem="{Binding SelectedVersion2}" Width="300" FontSize="16" FontWeight="Bold" materialDesign:HintAssist.Hint="Hardware Version 2">
                    <ComboBox.ItemTemplate>
                        <DataTemplate>
                            <TextBlock><Run Text="{Binding Name}"></Run> <Run></Run> <Run Foreground="{StaticResource Dialog.Foreground}" FontSize="14">v</Run><Run Foreground="{StaticResource Dialog.Foreground}" FontSize="14" Text="{Binding Version}"></Run></TextBlock>
                        </DataTemplate>
                    </ComboBox.ItemTemplate>
                </ComboBox>
            </UniformGrid>
            <StackPanel Orientation="Horizontal" Grid.Row="1" VerticalAlignment="Center" Margin="10 0 0 0" HorizontalAlignment="Left">
                <CheckBox Name="cbShowOnlyDifference" IsChecked="{Binding IsShowDifference}" VerticalAlignment="Center"></CheckBox>
                <TextBlock Margin="10 0 0 0" VerticalAlignment="Center" Text="Show Only Differences" FontSize="16" FontWeight="Normal"></TextBlock>
            </StackPanel>
            <Grid Grid.Row="2">
                <ScrollViewer  VerticalScrollBarVisibility="Auto" Margin="0 0 0 0" >
                    <Grid >
                        <ItemsControl   Margin="0, 0, 0, 0" Name="lvDataBinding" ItemsSource="{Binding Result.Collections}"  HorizontalContentAlignment="Stretch"
                          VerticalContentAlignment="Top" >
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <StackPanel Orientation="Vertical">
                                        <TextBlock Margin="0,10,0,5" Text="{Binding CollectionName}" FontSize="22" FontWeight="SemiBold" HorizontalAlignment="Center" VerticalAlignment="Center" Style="{StaticResource CollectionHasDifferenceTextBox}"/>
                                        <Grid>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="500*"/>
                                                <ColumnDefinition Width="500*"/>
                                            </Grid.ColumnDefinitions>
                                            <Border Name="LeftB" Grid.Column="0" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                                                <materialDesign:Card Margin="5,10,5,0" Padding="20 10">
                                                    <StackPanel Orientation="Vertical">
                                                        <ItemsControl  Margin="10,0,0,0" Name="ComponentListLeft" ItemsSource="{Binding Components}"  HorizontalContentAlignment="Stretch">
                                                            <ItemsControl.ItemTemplate>
                                                                <DataTemplate>
                                                                    <StackPanel Orientation="Vertical">
                                                                        <TextBlock  Margin="0,5,0,5" Text="{Binding ComponentName}" FontWeight="SemiBold" FontSize="18" Style="{StaticResource CollectionHasDifferenceTextBox}"/>
                                                                        <Grid>
                                                                            <ItemsControl Grid.Row="1" Margin="10"  Name="PropertyListL" ItemsSource="{Binding Properties}" HorizontalContentAlignment="Stretch">
                                                                                <ItemsControl.ItemTemplate>
                                                                                    <DataTemplate>
                                                                                        <Grid>
                                                                                            <Grid.ColumnDefinitions>
                                                                                                <ColumnDefinition Width="8*" />
                                                                                                <ColumnDefinition Width="2*"/>
                                                                                            </Grid.ColumnDefinitions>
                                                                                            <TextBlock Text="{Binding PropertyName}" FontWeight="Normal"  Grid.Column="0" Style="{StaticResource DifferenceTextBoxStyle}"/>
                                                                                            <TextBlock Text="{Binding Value1}" Grid.Column="1" Style="{StaticResource DifferenceTextBoxStyle}"/>
                                                                                        </Grid>
                                                                                        <DataTemplate.Triggers>
                                                                                            <MultiDataTrigger>
                                                                                                <MultiDataTrigger.Conditions>
                                                                                                    <Condition Binding="{Binding ElementName=cbShowOnlyDifference, Path=IsChecked}" Value="True" />
                                                                                                    <Condition Binding="{Binding HasDifferences}" Value="False" />
                                                                                                </MultiDataTrigger.Conditions>
                                                                                                <MultiDataTrigger.Setters>
                                                                                                    <Setter Property="Visibility" Value="Collapsed" />
                                                                                                </MultiDataTrigger.Setters>
                                                                                            </MultiDataTrigger>
                                                                                        </DataTemplate.Triggers>
                                                                                    </DataTemplate>
                                                                                </ItemsControl.ItemTemplate>
                                                                                <ItemsControl.Style>
                                                                                    <Style TargetType="ItemsControl">
                                                                                        <Setter Property="Visibility" Value="Visible" />
                                                                                        <Style.Triggers>
                                                                                            <MultiDataTrigger>
                                                                                                <MultiDataTrigger.Conditions>
                                                                                                    <Condition Binding="{Binding HasComponent1}" Value="False" />
                                                                                                    <Condition Binding="{Binding HasComponent2}" Value="True" />
                                                                                                </MultiDataTrigger.Conditions>
                                                                                                <MultiDataTrigger.Setters>
                                                                                                    <Setter Property="Visibility" Value="Hidden" />
                                                                                                </MultiDataTrigger.Setters>
                                                                                            </MultiDataTrigger>
                                                                                        </Style.Triggers>
                                                                                    </Style>
                                                                                </ItemsControl.Style>
                                                                            </ItemsControl>
                                                                            <Border  HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Transparent" Height="{Binding ActualHeight, ElementName=PropertyListL}">
                                                                                <Border.Style>
                                                                                    <Style TargetType="Border">
                                                                                        <Setter Property="Visibility" Value="Collapsed" />
                                                                                        <Style.Triggers>
                                                                                            <MultiDataTrigger>
                                                                                                <MultiDataTrigger.Conditions>
                                                                                                    <Condition Binding="{Binding HasComponent1}" Value="False" />
                                                                                                    <Condition Binding="{Binding HasComponent2}" Value="True" />
                                                                                                </MultiDataTrigger.Conditions>
                                                                                                <MultiDataTrigger.Setters>
                                                                                                    <Setter Property="Visibility" Value="Visible" />
                                                                                                </MultiDataTrigger.Setters>
                                                                                            </MultiDataTrigger>
                                                                                        </Style.Triggers>
                                                                                    </Style>
                                                                                </Border.Style>
                                                                                <TextBlock Text="None" Foreground="{StaticResource RedBrush100}" FontWeight="SemiBold" HorizontalAlignment="Center" FontSize="16" VerticalAlignment="Center"/>
                                                                            </Border>
                                                                        </Grid>
                                                                    </StackPanel>
                                                                    <DataTemplate.Triggers>
                                                                        <MultiDataTrigger>
                                                                            <MultiDataTrigger.Conditions>
                                                                                <Condition Binding="{Binding HasComponent1}" Value="False" />
                                                                                <Condition Binding="{Binding HasComponent2}" Value="False" />
                                                                            </MultiDataTrigger.Conditions>
                                                                            <MultiDataTrigger.Setters>
                                                                                <Setter Property="Visibility" Value="Collapsed" />
                                                                            </MultiDataTrigger.Setters>
                                                                        </MultiDataTrigger>
                                                                        <MultiDataTrigger>
                                                                            <MultiDataTrigger.Conditions>
                                                                                <Condition Binding="{Binding ElementName=cbShowOnlyDifference, Path=IsChecked}" Value="True" />
                                                                                <Condition Binding="{Binding HasDifferences}" Value="False" />
                                                                            </MultiDataTrigger.Conditions>
                                                                            <MultiDataTrigger.Setters>
                                                                                <Setter Property="Visibility" Value="Collapsed" />
                                                                            </MultiDataTrigger.Setters>
                                                                        </MultiDataTrigger>
                                                                    </DataTemplate.Triggers>
                                                                </DataTemplate>
                                                            </ItemsControl.ItemTemplate>
                                                        </ItemsControl>
                                                    </StackPanel>
                                                </materialDesign:Card>
                                            </Border>
                                            <Border Name="RightB" Grid.Column="1" Margin="10,0,0,0">
                                                <materialDesign:Card Margin="5,10,5,0"  Padding="20 10">
                                                    <StackPanel Orientation="Vertical">
                                                        <ItemsControl  Margin="10,0,0,0" Name="ComponentListRight" ItemsSource="{Binding Components}"  HorizontalContentAlignment="Stretch">
                                                            <ItemsControl.ItemTemplate>
                                                                <DataTemplate>
                                                                    <StackPanel Orientation="Vertical">
                                                                        <TextBlock  Margin="0,5,0,5" FontSize="18" Text="{Binding ComponentName}" FontWeight="SemiBold" Style="{StaticResource CollectionHasDifferenceTextBox}"/>
                                                                        <Grid>
                                                                            <ItemsControl Grid.Row="1" Margin="10" Name="PropertyListR" ItemsSource="{Binding Properties}" HorizontalContentAlignment="Stretch">
                                                                                <ItemsControl.ItemTemplate>
                                                                                    <DataTemplate>
                                                                                        <Grid>
                                                                                            <Grid.ColumnDefinitions>
                                                                                                <ColumnDefinition Width="8*" />
                                                                                                <ColumnDefinition Width="2*"/>
                                                                                            </Grid.ColumnDefinitions>
                                                                                            <TextBlock Text="{Binding PropertyName}" FontWeight="Normal"  Grid.Column="0" Style="{StaticResource DifferenceTextBoxStyle}"/>
                                                                                            <TextBlock Text="{Binding Value2}" Grid.Column="1" Style="{StaticResource DifferenceTextBoxStyle}"/>
                                                                                        </Grid>
                                                                                        <DataTemplate.Triggers>
                                                                                            <MultiDataTrigger>
                                                                                                <MultiDataTrigger.Conditions>
                                                                                                    <Condition Binding="{Binding ElementName=cbShowOnlyDifference, Path=IsChecked}" Value="True" />
                                                                                                    <Condition Binding="{Binding HasDifferences}" Value="False" />
                                                                                                </MultiDataTrigger.Conditions>
                                                                                                <MultiDataTrigger.Setters>
                                                                                                    <Setter Property="Visibility" Value="Collapsed" />
                                                                                                </MultiDataTrigger.Setters>
                                                                                            </MultiDataTrigger>
                                                                                        </DataTemplate.Triggers>
                                                                                    </DataTemplate>
                                                                                </ItemsControl.ItemTemplate>
                                                                                <ItemsControl.Style>
                                                                                    <Style TargetType="ItemsControl">
                                                                                        <Setter Property="Visibility" Value="Visible" />
                                                                                        <Style.Triggers>
                                                                                            <MultiDataTrigger>
                                                                                                <MultiDataTrigger.Conditions>
                                                                                                    <Condition Binding="{Binding HasComponent2}" Value="False" />
                                                                                                    <Condition Binding="{Binding HasComponent1}" Value="True" />
                                                                                                </MultiDataTrigger.Conditions>
                                                                                                <MultiDataTrigger.Setters>
                                                                                                    <Setter Property="Visibility" Value="Hidden" />
                                                                                                </MultiDataTrigger.Setters>
                                                                                            </MultiDataTrigger>
                                                                                        </Style.Triggers>
                                                                                    </Style>
                                                                                </ItemsControl.Style>
                                                                            </ItemsControl>
                                                                            <Border  HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Transparent" Height="{Binding ActualHeight, ElementName=PropertyListR}">
                                                                                <Border.Style>
                                                                                    <Style TargetType="Border">
                                                                                        <Setter Property="Visibility" Value="Collapsed" />
                                                                                        <Style.Triggers>
                                                                                            <MultiDataTrigger>
                                                                                                <MultiDataTrigger.Conditions>
                                                                                                    <Condition Binding="{Binding HasComponent2}" Value="False" />
                                                                                                    <Condition Binding="{Binding HasComponent1}" Value="True" />
                                                                                                </MultiDataTrigger.Conditions>
                                                                                                <MultiDataTrigger.Setters>
                                                                                                    <Setter Property="Visibility" Value="Visible" />
                                                                                                </MultiDataTrigger.Setters>
                                                                                            </MultiDataTrigger>
                                                                                        </Style.Triggers>
                                                                                    </Style>
                                                                                </Border.Style>
                                                                                <TextBlock Text="None" FontWeight="SemiBold" HorizontalAlignment="Center" FontSize="16" VerticalAlignment="Center" Foreground="{StaticResource RedBrush100}"/>
                                                                            </Border>
                                                                        </Grid>
                                                                    </StackPanel>
                                                                    <DataTemplate.Triggers>
                                                                        <MultiDataTrigger>
                                                                            <MultiDataTrigger.Conditions>
                                                                                <Condition Binding="{Binding HasComponent1}" Value="False" />
                                                                                <Condition Binding="{Binding HasComponent2}" Value="False" />
                                                                            </MultiDataTrigger.Conditions>
                                                                            <MultiDataTrigger.Setters>
                                                                                <Setter Property="Visibility" Value="Collapsed" />
                                                                            </MultiDataTrigger.Setters>
                                                                        </MultiDataTrigger>
                                                                        <MultiDataTrigger>
                                                                            <MultiDataTrigger.Conditions>
                                                                                <Condition Binding="{Binding ElementName=cbShowOnlyDifference, Path=IsChecked}" Value="True" />
                                                                                <Condition Binding="{Binding HasDifferences}" Value="False" />
                                                                            </MultiDataTrigger.Conditions>
                                                                            <MultiDataTrigger.Setters>
                                                                                <Setter Property="Visibility" Value="Collapsed" />
                                                                            </MultiDataTrigger.Setters>
                                                                        </MultiDataTrigger>
                                                                    </DataTemplate.Triggers>
                                                                </DataTemplate>
                                                            </ItemsControl.ItemTemplate>
                                                        </ItemsControl>
                                                    </StackPanel>
                                                </materialDesign:Card>
                                            </Border>
                                        </Grid>
                                    </StackPanel>
                                    <DataTemplate.Triggers>
                                        <MultiDataTrigger>
                                            <MultiDataTrigger.Conditions>
                                                <Condition Binding="{Binding ElementName=cbShowOnlyDifference, Path=IsChecked}" Value="True" />
                                                <Condition Binding="{Binding HasDifferences}" Value="False" />
                                            </MultiDataTrigger.Conditions>
                                            <MultiDataTrigger.Setters>
                                                <Setter Property="Visibility" Value="Collapsed" />
                                            </MultiDataTrigger.Setters>
                                        </MultiDataTrigger>
                                    </DataTemplate.Triggers>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </Grid>
                </ScrollViewer>

            </Grid>
            <Grid Grid.Row="3" Margin="0,30,0,0">
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Right">

                    <Button Height="40" Command="{Binding GenerateReportCommand}" Margin="0,0,20,0">
                        <StackPanel Orientation="Horizontal">
                            <materialDesign:PackIcon Kind="FileExcel" Width="24" Height="24" />
                            <TextBlock Margin="10 0 0 0" VerticalAlignment="Center">GENERATE REPORT</TextBlock>
                        </StackPanel>
                    </Button>

                    <Button  Width="140" Height="40" Command="{Binding OKCommand}">CLOSE</Button>
                </StackPanel>
            </Grid>
            
        </Grid>
        <Border CornerRadius="5" HorizontalAlignment="Center" VerticalAlignment="Center" Background="{StaticResource Transparent200}" Width="700" Height="350">
            <Border.Style>
                <Style TargetType="Border">
                    <Setter Property="Visibility" Value="Hidden"></Setter>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding Result}" Value="{x:Null}">
                            <Setter Property="Visibility" Value="Visible"></Setter>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Border.Style>

            <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="16" Foreground="Gray">Select two hardware versions to display a comparison report</TextBlock>
        </Border>
        <Grid HorizontalAlignment="Stretch" Margin="10" VerticalAlignment="Stretch" Visibility="{Binding IsRunning,Converter={StaticResource BooleanToVisibilityConverter}}" 
              Background="{StaticResource TransparentBackgroundBrush500}">
                <StackPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <mahapps:ProgressRing Foreground="#007ACC" Width="80" Height="80"></mahapps:ProgressRing>
                <TextBlock Text="Loading..." FontStyle="Italic" Margin="10 0 0 0" FontSize="30" VerticalAlignment="Center" Foreground="{StaticResource HomePageForeground}"></TextBlock>
                </StackPanel>
        </Grid>
    </Grid>
</UserControl>