<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:views="clr-namespace:DesertPaintCodex.Views"
             xmlns:vm="clr-namespace:DesertPaintCodex.ViewModels"
             mc:Ignorable="d" d:DesignWidth="310" d:DesignHeight="450"
             x:Class="DesertPaintCodex.Views.ReactionTestView"
             IsVisible="{Binding Path=!ReactionTest.IsStub}"
             >

    <Design.DataContext>
        <vm:ReactionTestViewModel />
    </Design.DataContext>

    <UserControl.Styles>
        <Style Selector="StackPanel.ReagentRow">
            <Setter Property="Orientation" Value="Horizontal"/>
            <Setter Property="Spacing" Value="10"/>
            <Setter Property="Height" Value="30"/>
        </Style>
        
        <Style Selector="StackPanel.ReagentLabel">
            <Setter Property="Width" Value="80"/>
        </Style>
        
        <Style Selector="TextBlock.ReagentLabel">
            <Setter Property="VerticalAlignment" Value="Center"/>
            <Setter Property="TextAlignment" Value="Right"/>
            <Setter Property="Width" Value="80"/>
        </Style>
        
        <Style Selector="TextBlock.ReagentName">
            <Setter Property="VerticalAlignment" Value="Center"/>
            <Setter Property="Width" Value="120"/>
        </Style>
    </UserControl.Styles>

    <StackPanel Spacing="20" Margin="20 0 0 0">
        <StackPanel DockPanel.Dock="Top" Orientation="Vertical" Spacing="5">
            <TextBlock Classes="BlockHeader">REAGENTS</TextBlock>
            <Border Classes="ThinFrame">
                <StackPanel Orientation="Vertical" Spacing="10">
                    <StackPanel Classes="ReagentRow" IsVisible="{Binding ReactionTest.ShowFirstBuffer}">
                        <StackPanel Orientation="Horizontal" Classes="ReagentLabel" Spacing="10">
                            <Button Height="24" Width="24" Margin="8 0 0 0" Command="{Binding UseLastBuffer}">
                                <TextBlock VerticalAlignment="Center">▼</TextBlock>
                            </Button>
                            <TextBlock Classes="ReagentName">Buffer:</TextBlock>
                        </StackPanel>
                        <TextBlock Classes="ReagentName" Text="{Binding ReactionTest.BufferReagentFirst.Name, FallbackValue=[Unknown]}" IsVisible="{Binding !ReactionTest.CanPickBuffer}"/>
                        <ComboBox Items="{Binding FirstBufferList}"
                                  IsVisible="{Binding ReactionTest.CanPickBuffer}"
                                  SelectedItem="{Binding ReactionTest.BufferReagentFirst}"
                                  PlaceholderText="Choose" Width="120" Height="30">
                            <ComboBox.ItemTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding Name}" />
                                </DataTemplate>
                            </ComboBox.ItemTemplate>
                        </ComboBox>
                        <Border Classes="ReagentSwatch"
                            Background="{Binding ReactionTest.BufferReagentFirst.Color, Converter={StaticResource paintToBrush}, FallbackValue=#00000000}" />
                    </StackPanel>
                    <StackPanel Classes="ReagentRow">
                        <TextBlock Classes="ReagentLabel">Reagent #1:</TextBlock>
                        <TextBlock Classes="ReagentName" Text="{Binding ReactionTest.Reagent1.Name}" />
                        <Border Classes="ReagentSwatch"
                            Background="{Binding ReactionTest.Reagent1.Color, Converter={StaticResource paintToBrush}, FallbackValue=#00000000}" />
                    </StackPanel>
                    <StackPanel Classes="ReagentRow">
                        <TextBlock Classes="ReagentLabel">Reagent #2:</TextBlock>
                        <TextBlock Classes="ReagentName" Text="{Binding ReactionTest.Reagent2.Name}" />
                        <Border Classes="ReagentSwatch"
                            Background="{Binding ReactionTest.Reagent2.Color, Converter={StaticResource paintToBrush}, FallbackValue=#00000000}" />
                    </StackPanel>
                    <StackPanel Classes="ReagentRow" IsVisible="{Binding ReactionTest.ShowLastBuffer}">
                        <StackPanel Orientation="Horizontal" Classes="ReagentLabel" Spacing="10">
                            <Button Height="24" Width="24" Margin="8 0 0 0" Command="{Binding UseFirstBuffer}">
                                <TextBlock VerticalAlignment="Center">▲</TextBlock>
                            </Button>
                            <TextBlock Classes="ReagentName">Buffer:</TextBlock>
                        </StackPanel>
                        <TextBlock Classes="ReagentName" Text="{Binding ReactionTest.BufferReagentLast.Name, FallbackValue=[Unknown]}" IsVisible="{Binding !ReactionTest.CanPickBuffer}"/>
                        <ComboBox Items="{Binding LastBufferList}"
                                  IsVisible="{Binding ReactionTest.CanPickBuffer}"
                                  SelectedItem="{Binding ReactionTest.BufferReagentLast}"
                                  PlaceholderText="Choose" Width="120" Height="30">
                            <ComboBox.ItemTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding Name}" />
                                </DataTemplate>
                            </ComboBox.ItemTemplate>
                        </ComboBox>
                        <Border Classes="ReagentSwatch"
                                Background="{Binding ReactionTest.BufferReagentLast.Color, Converter={StaticResource paintToBrush}, FallbackValue=#00000000}" />
                    </StackPanel>                    
                </StackPanel>
            </Border>
        </StackPanel>

        <StackPanel DockPanel.Dock="Top" Orientation="Vertical" Spacing="5">
            <TextBlock Classes="BlockHeader">HYPOTHETICAL COLOR</TextBlock>
            <views:PaintSwatchView ShowName="False" Color="{Binding ReactionTest.HypotheticalColor}"/>
        </StackPanel>

         <Grid ColumnDefinitions="*,15,*" IsVisible="{Binding ReactionTest.CanScan}">
            <Button Grid.Column="0" Padding="11 5 11 5" Command="{Binding Analyze}">Analyze Mixture</Button>
            <Button Grid.Column="2" Padding="11 5 11 5" Command="{Binding MarkInert}">Mark Inert</Button>
        </Grid>

        <StackPanel Orientation="Vertical" Spacing="10" IsVisible="{Binding ReactionTest.IsScanning}">
            <ProgressBar DockPanel.Dock="Top" Value="{Binding ReactionTest.ScanProgress}" Height="20" />
            <Button Command="{Binding CancelScan}">Cancel Scan</Button>
        </StackPanel>

        <StackPanel DockPanel.Dock="Top" Orientation="Vertical" Spacing="5"
                    IsVisible="{Binding ReactionTest.HasResults}">
            <TextBlock Classes="BlockHeader">TEST RESULT</TextBlock>
            <views:PaintSwatchView ShowName="False" IsVisible="{Binding !ReactionTest.NoLab}" Color="{Binding ReactionTest.ObservedColor}"/>
            <views:EmbeddedWarningBox IsVisible="{Binding ReactionTest.NoLab}"
                Title="🛇 PIGMENT LAB NOT FOUND"
                Message="You may want to make sure your view of the Pigment Lab is clear, and that your screen settings are correct.">
                <Button Command="{Binding OpenScreenSettings}">
                    <TextBlock FontWeight="Bold" FontSize="15">SCREEN SETTINGS</TextBlock>
                </Button>
            </views:EmbeddedWarningBox>
        </StackPanel>

        <StackPanel DockPanel.Dock="Top" Orientation="Vertical" Spacing="5"
                    IsVisible="{Binding ReactionTest.HasReaction}">
            <TextBlock Classes="BlockHeader">REACTION OBSERVED</TextBlock>
            <StackPanel Orientation="Horizontal" Spacing="21" Margin="0 5">
                <views:ReactionUnitView Reaction="{Binding ReactionTest.Reaction}"/>
            </StackPanel>

            <views:EmbeddedWarningBox Title="🛇 REACTION CLIPPED"
                                      IsVisible="{Binding !!ReactionTest.Clipped}"
                                      Message="Your reaction fell outside of measurable values. We will need to use a buffer pigment to test it.">
                <StackPanel Orientation="Vertical" Spacing="10">
                    <Button Command="{Binding ShowClipInfo}">LEARN MORE</Button>
                </StackPanel>
            </views:EmbeddedWarningBox>
        </StackPanel>
        
        <Button IsVisible="{Binding ReactionTest.CanClear}"
                Command="{Binding ClearReaction}">Clear Reaction</Button>
        <Button IsVisible="{Binding ReactionTest.CanSave}"
                Command="{Binding SaveReaction}">Save Reaction</Button>
    </StackPanel>
</UserControl>