<Page 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:local="clr-namespace:ForzaUI"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      mc:Ignorable="d"
      x:Class="ForzaUI.Scenes.Anthem.ExpansionUpsell"
      Style="{StaticResource A_Style_Page_Generic}"
      DataContext="{Binding RelativeSource={RelativeSource Self}}">
    <Page.Resources>
        <Style x:Key="A_Style_FZMaterial_UpsellBackground"
           TargetType="local:FZMaterial">
            <Style.Setters>
                <Setter Property="Stretch"
                Value="UniformToFill" />
                <Setter Property="MinWidth"
                Value="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType=Page}}" />
                <Setter Property="MinHeight"
                Value="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType=Page}}" />
                <Setter Property="VerticalAlignment"
                Value="Center" />
                <Setter Property="HorizontalAlignment"
                Value="Center" />
            </Style.Setters>
            <Style.Triggers>
                <DataTrigger Binding="{Binding BackgroundImageCount}" Value="{StaticResource A_Int32_One}">
                    <Setter Property="Stretch"
                            Value="Uniform"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
        <local:UIStoryboard x:Key="A_Storyboard_ExpansionUpsell_BlendValueInputChanged">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="CurrentImage"
                                     FillBehavior="Stop"
                                     Storyboard.TargetProperty="Tag">
                <DiscreteDoubleKeyFrame KeyTime="0:0:0"
                                Value="1" />
                <EasingDoubleKeyFrame KeyTime="0:0:1.8"
                              Value="0">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <QuarticEase EasingMode="EaseInOut" />
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="LastImage"
                                     FillBehavior="Stop"
                                     Storyboard.TargetProperty="Tag">
                <DiscreteDoubleKeyFrame KeyTime="0:0:0"
                                Value="0" />
                <EasingDoubleKeyFrame KeyTime="0:0:1.8"
                              Value="1">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <QuarticEase EasingMode="EaseInOut" />
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
        </local:UIStoryboard>

        <Style x:Key="A_Style_FZRun_BOLD" TargetType="local:FZRun">
            <Setter Property="FontFamily" Value="Horizon_C" />
            <Setter Property="Color" Value="{StaticResource H_Color_Primary_Green}" />
        </Style>

        <MappingConverter x:Key="A_MappingConverter_BoldText">
            <MappingConverterEntry Key="{NoCase BOLD}" Value="{StaticResource A_Style_FZRun_BOLD}" />
        </MappingConverter>

        <MappingConverter x:Key="A_BackgroundImageCountToAnimatedImageVisibility" Default="{Static Visibility.Visible}">
            <MappingConverterEntry Key="{StaticResource A_Int32_One}" Value="{Static Visibility.Collapsed}"/>
        </MappingConverter>

    </Page.Resources>

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

    <Grid>
        <local:FZMaterial Color="#000" Visibility="{Binding ShowBlackBackground, Converter={StaticResource A_FZBooleanToVisibilityConverter}}" />
        <Control Style="{StaticResource A_Style_Control_ScreenBackground}"
                 Visibility="{Binding ShowBlackBackground, Converter={StaticResource A_FZBooleanToVisibilityConverter_Inverse}}" />

        <Grid x:Name="PART_LayoutRoot"
        Style="{StaticResource A_Style_FrameworkElement_FadeOnlyTransition_0}"
        local:BlendValue.InputChangedStoryboard="{StaticResource A_Storyboard_ExpansionUpsell_BlendValueInputChanged}"
        local:BlendValue.ShouldSkipInitialInputChange="True"
        local:BlendValue.Input="{Binding CurrentImage}">

            <!-- Static current image prevents AA gaps from appearing around the edges during animation -->
            <local:FZMaterial Style="{StaticResource A_Style_FZMaterial_UpsellBackground}"
                      ImageSource="{Binding CurrentImage}" />

            <ContentControl Style="{StaticResource A_Style_ContentControl_AnimatedTagSlideFromLeft}"
                    local:UIPageTransitionManager.TransitionIndex="0"
                    x:Name="LastImage"
                    Visibility="{Binding BackgroundImageCount, Converter={StaticResource A_BackgroundImageCountToAnimatedImageVisibility}}">
                <local:FZMaterial Style="{StaticResource A_Style_FZMaterial_UpsellBackground}"
                        ImageSource="{Binding LastImage}"
                        ClipToBounds="True" />
            </ContentControl>

            <ContentControl Style="{StaticResource A_Style_ContentControl_AnimatedTagSlideFromRight}"
                    local:UIPageTransitionManager.TransitionIndex="0"
                    x:Name="CurrentImage"
                    Visibility="{Binding BackgroundImageCount, Converter={StaticResource A_BackgroundImageCountToAnimatedImageVisibility}}">
                <local:FZMaterial Style="{StaticResource A_Style_FZMaterial_UpsellBackground}"
                        ImageSource="{Binding CurrentImage}"
                        ClipToBounds="True" />
            </ContentControl>

            <local:FZMaterialGlassCapture />

            <ContentControl x:Name="BottomBar"
                    Style="{StaticResource A_Style_ButtonBar}">
                <ContentControl x:Name="PART_DefaultHelpPanel"
                      local:ControllerButtonPanel.BDescription="{local:Loc HelpButtons.IDS_Back}"
                      Style="{StaticResource A_Style_ContentControl_DefaultButtonBar}" />
            </ContentControl>

            <Grid Style="{StaticResource A_Style_FrameworkElement_LayoutRoot}">
                <StackPanel Orientation="Vertical"
                  HorizontalAlignment="Left"
                  Margin="72">
                    <local:FZMaterial Width="500"
                          Height="200"
                          ImageSource="{Binding LogoImage}"
                          Visibility="{Binding LogoImage, Converter={StaticResource A_FZBooleanToVisibilityConverter_UseHidden}}"
                          Style="{StaticResource A_Style_FrameworkElement_DefaultTransition_1}" />
                    <DockPanel LastChildFill="True"
                            Height="668"
                            Style="{StaticResource A_Style_FrameworkElement_DefaultTransition_2}">
                        <Decorator DockPanel.Dock="Bottom" Height="5" />

                        <ContentControl Template="{StaticResource A_ControlTemplate_SidePanel}"
                          Tag="{Binding Title}"
                          Width="500">
                            <FZTextBlock Style="{StaticResource A_Style_FZTextBlock_DescriptionBlockBody}"
                                Text="{Binding Description}"
                                Margin="30,20"
                                MarkupConverter="{StaticResource A_MappingConverter_BoldText}"
                                TextWrapping="Wrap" 
                                AutoScroll="{StaticResource H_AutoScrollSettings_Descriptions}"
                                AutoScroll.AllowScrolling="True"
                                />
                        </ContentControl>
                    </DockPanel>
                </StackPanel>
            </Grid>
        </Grid>
    </Grid>
</Page>
