<Page xmlns:local="clr-namespace:ForzaUI"
      xmlns:System="clr-namespace:System;assembly=mscorlib"
      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"  
      x:Class="ForzaUI.Scenes.Anthem.A_InWorldCarSelect"
      mc:Ignorable="d"
      Style="{StaticResource A_Style_Page_Generic}"
      >

    <local:UIPageTransitionManager.TransitionManager>
        <local:UIPageTransitionManager Preset="{StaticResource A_UIPageTransitionManagerPreset_NoAudio}"/>
    </local:UIPageTransitionManager.TransitionManager>

    <Page.Resources>
        <ResourceDictionary>
            <local:StringVisConverter x:Key="A_StringVisConverter"/>
            <local:LinearTransformConverter x:Key="A_LinearTransformConverter_InvertNormalValue" Scale="-1" Add="1" />

            <local:FZMaterialPresetScreenShadow x:Key="A_FZMaterialPresetScreenShadow_CarSelect_ARUI" BlurAmount="High" Intensity="1.0" />
            
            <Style x:Key="A_Style_ListBoxItem_CarListItem" TargetType="ListBoxItem">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ListBoxItem">
                            <local:FZMaterial Width="100" Height="100" Color="{StaticResource A_Color_Tile_Text}">
                                <local:FZMaterial x:Name="ItemBackground"  Margin="1"  Color="{StaticResource A_Color_Tile_Background}">
                                    <local:FZTextBlock Text="{Binding PlayerName}" 
                                                       Style="{StaticResource A_Style_FZTextBlock_Heading_Minimum}"
                                                       FontSize="20"
                                                       Color="{StaticResource A_Color_Tile_Text}"
                                                       TextWrapping="Wrap" />
                                </local:FZMaterial>
                            </local:FZMaterial>
                            <ControlTemplate.Triggers>
                                <Trigger Property="Focusable" Value="False">
                                    <Setter TargetName="ItemBackground" Property="Color" Value="{StaticResource A_Color_Tile_BodyText}"/>
                                </Trigger>
                                <Trigger Property="IsKeyboardFocusWithin" Value="True">
                                    <Setter TargetName="ItemBackground" Property="Color" Value="{StaticResource A_Color_TileSelected_Background}"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            
            <Style x:Key="A_Style_ListBox_CarList" TargetType="ListBox">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ListBox">
                            <StackPanel Orientation="Horizontal" IsItemsHost="True" />
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
                <Setter Property="ItemContainerStyle" Value="{StaticResource A_Style_ListBoxItem_CarListItem}" />
            </Style>

            <Style x:Key="A_Style_FZTextblock_TimerDescriptionText" TargetType="local:FZTextBlock" BasedOn="{StaticResource A_Style_FZTextBlock_HorizonD}">
                <Setter Property="Color" Value="{StaticResource A_Color_White}"/>
                <Setter Property="TrackingAdjust" Value="0.20"/>
                <Setter Property="CapHeight" Value="18"/>
            </Style>
            <Style x:Key="A_Style_FZTextblock_Timer_Text" TargetType="local:FZTextBlock" BasedOn="{StaticResource A_Style_FZTextBlock_HorizonC}">
                <Setter Property="Color" Value="{StaticResource A_Color_White}"/>
                <Setter Property="CapHeight" Value="28"/>
            </Style>


            <!--Done as a control template so our storyboards can reference elements in the control. Without the storyboard having to be a visual state -->
            <ControlTemplate x:Key="A_ControlTemplate_Countdown_Timer" TargetType="Control">
                <ControlTemplate.Resources>
                    <local:UIStoryboard x:Key="A_Storyboard_Timer_FadeIn" DurationOverride="0:0:1.0">
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="TimerDecorator">
                            <DiscreteDoubleKeyFrame KeyTime="0:0:0.0" Value="0" />
                            <EasingDoubleKeyFrame KeyTime="0:0:1.0" Value="1" EasingFunction="{local:ExponentialEasing EasingMode=EaseInOut}"/>
                        </DoubleAnimationUsingKeyFrames>
                    </local:UIStoryboard>
                </ControlTemplate.Resources>

                <Decorator x:Name="TimerDecorator" Opacity="0">
                    <StackPanel Orientation="Vertical">
                        <Decorator LayoutTransform="{StaticResource A_Transform_Italic}" HorizontalAlignment="Right">
                            <local:FZTextBlock Text="{Binding SelectTimeoutMessage}" Style="{StaticResource A_Style_FZTextblock_TimerDescriptionText}"/>
                        </Decorator>
                        <Decorator LayoutTransform="{StaticResource A_Transform_Italic}" HorizontalAlignment="Right" Margin="0,10,2,0">
                            <local:FZTextBlock Text="{Binding TimeRemainingString}" HorizontalAlignment="Right" Style="{StaticResource A_Style_FZTextblock_Timer_Text}"/>
                        </Decorator>
                    </StackPanel>
                </Decorator>

                <ControlTemplate.Triggers>
                    <DataTrigger Binding="{Binding ShowTimeoutMessage}" Value="True">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard Storyboard="{StaticResource A_Storyboard_Timer_FadeIn}"/>
                        </DataTrigger.EnterActions>
                    </DataTrigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
                       
        </ResourceDictionary>
    </Page.Resources>

    <Grid x:Name="LayoutRoot">
        <local:FZMaterial Preset="{StaticResource A_FZMaterialPresetScreenShadow_CarSelect_ARUI}"/>

        <!-- Help Panel -->
        <ContentControl Style="{StaticResource A_Style_ButtonBar}"
                x:Name="BottomBar">
            <local:ControllerButtonPanel x:Name="HelpPanel"
                                         Style="{StaticResource A_Style_ControllerButtonPanel_Default}">
                <local:ControllerButtonControl Button="A"
                                               Description="{local:Loc HelpButtons.IDS_Select}" />
                <local:ControllerButtonControl Button="LThumb_LeftRight"
                                               Description="{local:Loc HelpButtons.IDS_ChangeCar}"
                                               Visibility="{Binding IsControllerActiveInput, Converter={StaticResource A_FZBooleanToVisibilityConverter}, RelativeSource={RelativeSource AncestorType=Page}}" />
            </local:ControllerButtonPanel>
        </ContentControl>

        <Border Style="{StaticResource A_Style_Border_ScenePadding}">
            <Grid Style="{StaticResource A_Style_FrameworkElement_FadeOnlyTransition_0}">

                <!-- Car List - this is not actually visible to the user, but controls the focused car item -->
                <local:CommonListBox x:Name="PART_CarList" VerticalAlignment="Bottom" ItemsSource="{Binding CarItems}"
                                     Style="{StaticResource A_Style_ListBox_CarList}"
                                     HorizontalAlignment="Left" Opacity="0"
                                     Margin="0,0,0,40"
                                     PageSize="1" />

                <Control Style="{StaticResource A_Style_FrameworkElement_FadeOnlyTransition_0}" 
                     Template="{StaticResource A_ControlTemplate_Countdown_Timer}" HorizontalAlignment="Right" VerticalAlignment="Bottom" Margin="0,0,-8,-26"/>

                <Control x:Name="CarControlWidget"
                         Template="{StaticResource A_ControlTemplate_InWorldScrollWidget}"
                         DataContext="{Binding ElementName=PART_CarList}"
                         HorizontalAlignment="Right"
                         VerticalAlignment="Bottom"
                         Margin="0,0,0,82"
                         Visibility="{Binding IsE3Sled, RelativeSource={RelativeSource AncestorType=Page}, Converter={StaticResource A_FZBooleanToVisibilityConverter_Inverse}}"/>
            </Grid>
        </Border>
    </Grid>
</Page>
