<Page x:Class="ForzaUI.Scenes.Anthem.A_FestivalSeriesHistoryScene"
      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" 
      Style="{StaticResource A_Style_Page_Generic}"
      DataContext="{Binding RelativeSource={RelativeSource Self}}">

    <Page.Resources>
        <Storyboard x:Key="A_Storyboard_SmoothScrollWithMotionBlur">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(local:BlendValue.Blend)"
                                           Storyboard.TargetName="{x:Null}"
                                           FillBehavior="Stop">
                <DiscreteDoubleKeyFrame KeyTime="0:0:0"
                                        Value="0" />
                <EasingDoubleKeyFrame KeyTime="0:0:0.267"
                                      Value="1"
                                      EasingFunction="{local:QuarticEasing EasingMode=EaseOut}" />
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>

        <Color x:Key="A_Color_FestivalPass_Complete_Text">#B3332A02</Color>

        <System:Double x:Key="A_Double_FestivalPass_MaxCarouselItemHeight">678</System:Double>
        <System:Double x:Key="A_Double_FestivalPass_MaxCarouselItemWidth">404</System:Double>
        <Thickness x:Key="A_Double_FestivalPass_CarouselItemMargin">3,3,3,3</Thickness>
        <System:Double x:Key="A_Double_FestivalPass_MaxCarouselItemHeightWithMargin">684</System:Double>

        <Style x:Key="A_Style_FrameworkElement_FestivalPass_ItemContainer"
               TargetType="{x:Type FrameworkElement}">
            <Setter Property="Height"
                    Value="{StaticResource A_Double_FestivalPass_MaxCarouselItemHeight}" />
            <Setter Property="Width"
                    Value="{StaticResource A_Double_FestivalPass_MaxCarouselItemWidth}" />
        </Style>

        <local:LinearTransformConverter x:Key="A_Converter_ScrollOffsetAdjustment"
                                        Scale="-1"
                                        Add="-628" />

        <local:FZMaterialPresetRoundtangle x:Key="A_FZMaterialPresetRoundtangle_FlatPanel_BackingImage"
                                           BasedOn="{StaticResource A_FZMaterialPreset_FlatPanel_Base}"
                                           CornerRadius="5,5,5,5" />

        <Style x:Key="A_Style_Control_FestivalPassEmptyItem"
               TargetType="{x:Type Control}"
               BasedOn="{StaticResource A_Style_FrameworkElement_FestivalPass_ItemContainer}">
            <Setter Property="Focusable"
                    Value="False" />
            <Setter Property="Template"
                    Value="{StaticResource A_Template_Control_Carousel_EmptyItemStyle}" />
        </Style>

        <Style x:Key="A_Style_Control_FestivalPassEmptyItem_OutOfCarousel"
               TargetType="{x:Type Control}"
               BasedOn="{StaticResource A_Style_Control_FestivalPassEmptyItem}">
            <Setter Property="Margin"
                    Value="{StaticResource A_Double_FestivalPass_CarouselItemMargin}" />
        </Style>

        <ControlTemplate x:Key="A_ControlTemplate_CommonListBox_Carousel_FestivalPass"
                         TargetType="{x:Type local:CommonListBox}">
            <DockPanel>
                <Control DockPanel.Dock="Left"
                         Style="{StaticResource A_Style_Control_FestivalPassEmptyItem_OutOfCarousel}" />
                <Control DockPanel.Dock="Left"
                         Style="{StaticResource A_Style_Control_FestivalPassEmptyItem_OutOfCarousel}" />
                <Control DockPanel.Dock="Right"
                         Style="{StaticResource A_Style_Control_FestivalPassEmptyItem_OutOfCarousel}" />
                <Control DockPanel.Dock="Right"
                         Style="{StaticResource A_Style_Control_FestivalPassEmptyItem_OutOfCarousel}" />
                <Control DockPanel.Dock="Right"
                         Style="{StaticResource A_Style_Control_FestivalPassEmptyItem_OutOfCarousel}" />
                <Control DockPanel.Dock="Right"
                         Style="{StaticResource A_Style_Control_FestivalPassEmptyItem_OutOfCarousel}" />
                <StackPanel IsItemsHost="True"
                           KeyboardNavigation.DirectionalNavigation="Contained"
                           Orientation="Horizontal" />
            </DockPanel>
        </ControlTemplate>

        <ControlTemplate x:Key="A_ControlTemplate_ContentControl_Infographic_Radial_FestivalPassHistory"
                         TargetType="{x:Type Control}">
            <Grid Margin="0,0,0,-0.5">
                <local:FZMaterial x:Name="RadialImage"
                                  Stretch="Uniform"
                                  Width="168"
                                  Height="168"
                                  ImageSource="Game:\Media\UI\Textures\Data_Bound\Infographics\Series_Progress.png">
                    <local:FZMaterial x:Name="RadialBar"
                                      Width="275"
                                      Height="275"
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center"
                                      local:BlendValue.Output="0.87"
                                      local:BlendValue.Input="{Binding CompletionRatio, FallbackValue=0}"
                                      local:BlendValue.InputChangedStoryboard="{StaticResource A_Storyboard_Infographic_BlendValueInputChanged}">
                        <local:FZMaterial.Preset>
                            <local:FZMaterialPresetRadialBar TargetRatio="1.0"
                                                             ShadowIntensity="0"
                                                             TipGlowFade="0.0"
                                                             AngleAmount="0"
                                                             BarWidth="0.140"
                                                             BackgroundColor="#00FFFFFF"
                                                             Ratio="{Binding Path=(local:BlendValue.Output), RelativeSource={RelativeSource FindAncestor, AncestorType=local:FZMaterial}}" />
                        </local:FZMaterial.Preset>
                    </local:FZMaterial>
                </local:FZMaterial>
            </Grid>
        </ControlTemplate>

        <DataTemplate x:Key="A_DataTemplate_PastSeriesItem">
            <Grid Width="{StaticResource A_Double_FestivalPass_MaxCarouselItemWidth}"
                  Height="{StaticResource A_Double_FestivalPass_MaxCarouselItemHeight}">
                <local:FZMaterial ImageSource="{Binding ImagePath}"
                                  Preset="{StaticResource A_FZMaterialPresetRoundtangle_FlatPanel_BackingImage}"
                                  Width="398"
                                  Height="590"
                                  x:Name="BackingImage"
                                  Margin="3"
                                  VerticalAlignment="Top">
                    <Grid>
                        <Viewbox Width="154" Height="154" HorizontalAlignment="Center" VerticalAlignment="Bottom" Margin="0,0,2,70.5">
                            <Control x:Name="ProgressInfoGraphic" Template="{StaticResource A_ControlTemplate_ContentControl_Infographic_Radial_FestivalPassHistory}" VerticalAlignment="Center"/>
                        </Viewbox>
                        <Grid VerticalAlignment="Bottom"
                              Margin="12,20">
                            <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_HorizonA}"
                                               CapHeight="24"
                                               Margin="6,0,0,0"
                                               HorizontalAlignment="Center"
                                               TextAlignment="Center"
                                               Color="#fff"
                                               x:Name="CompletionProgressText"
                                               Text="{Binding Path=(local:MultiStringFormatter.Output), RelativeSource={RelativeSource Self}}"
                                               local:MultiStringFormatter.Format="{local:Loc Festival.IDS_FestivalSeriesHistory_Completion}"
                                               local:MultiStringFormatter.Param0="{Binding CompletionProgress}" />
                        </Grid>
                    </Grid>
                </local:FZMaterial>
                <Grid VerticalAlignment="Bottom"
                      Height="86">
                    <StackPanel Orientation="Vertical"
                                VerticalAlignment="Center">
                        <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_HorizonA}"
                                           Color="{StaticResource A_Color_Tile_Title}"
                                           Text="{Binding Title}"
                                           CapHeight="22"
                                           HorizontalAlignment="Center" />
                        <Decorator Height="8" />
                        <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_HorizonA}"
                                           Color="{StaticResource A_Color_Tile_Text}"
                                           Text="{Binding Description}"
                                           CapHeight="16"
                                           HorizontalAlignment="Center" />
                    </StackPanel>
                </Grid>
            </Grid>
            <DataTemplate.Triggers>
                <!--100 percent or higher is a complete state-->
                <DataTrigger Binding="{Binding CompletionProgress, Converter={StaticResource A_CompareConverter}, ConverterParameter=99}"  Value="1">
                    <Setter TargetName="BackingImage" Property="ImageSource" Value="{Binding GoldImagePath}" />
                    <Setter TargetName="CompletionProgressText" Property="Color" Value="{StaticResource A_Color_FestivalPass_Complete_Text}" />
                    <Setter TargetName="ProgressInfoGraphic" Property="Visibility" Value="Collapsed" />
                </DataTrigger>
            </DataTemplate.Triggers>
        </DataTemplate>

        <Style x:Key="A_Style_HistoryTile_Container_Style" TargetType="{x:Type ListBoxItem}" BasedOn="{StaticResource A_Style_ContentControl_Carousel_ContainerStyle}">
            <Style.Resources>
                <Style x:Key="A_Style_FrameworkElement_CarouselSelectionScale_Dynamic"
           TargetType="FrameworkElement">
                    <Setter Property="RenderTransform">
                        <Setter.Value>
                            <ScaleTransform />
                        </Setter.Value>
                    </Setter>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding (Selector.IsSelected), RelativeSource={RelativeSource AncestorType=ListBoxItem}}"
                         Value="True">
                            <DataTrigger.EnterActions>
                                <BeginStoryboard HandoffBehavior="SnapshotAndReplace">
                                    <BeginStoryboard.Storyboard>
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.RenderTransform).(ScaleTransform.ScaleX)">
                                                <DiscreteDoubleKeyFrame KeyTime="0:0:0.0"
                                                            Value="1.03" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.RenderTransform).(ScaleTransform.ScaleY)">
                                                <DiscreteDoubleKeyFrame KeyTime="0:0:0.0"
                                                            Value="1.03" />
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </BeginStoryboard.Storyboard>
                                </BeginStoryboard>
                            </DataTrigger.EnterActions>
                            <DataTrigger.ExitActions>
                                <BeginStoryboard HandoffBehavior="SnapshotAndReplace">
                                    <BeginStoryboard.Storyboard>
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.RenderTransform).(ScaleTransform.ScaleX)">
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.3"
                                                      Value="1.0"
                                                      EasingFunction="{local:CircleEasing}" />
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.RenderTransform).(ScaleTransform.ScaleY)">
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.3"
                                                          Value="1.0"
                                                          EasingFunction="{local:CircleEasing}" />
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </BeginStoryboard.Storyboard>
                                </BeginStoryboard>
                            </DataTrigger.ExitActions>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>

                <Style x:Key="A_Style_FZMaterial_ShadowBase_Dynamic"
                       TargetType="local:FZMaterial"
                       BasedOn="{StaticResource A_Style_FZMaterial_ShadowBase_Dynamic}">
                    <Setter Property="Margin"
                            Value="-5" />
                </Style>
            </Style.Resources>
        </Style>

    </Page.Resources>
    <local:UIPageTransitionManager.TransitionManager>
        <local:UIPageTransitionManager Preset="{StaticResource A_UIPageTransitionManagerPreset_Menu}"/>
    </local:UIPageTransitionManager.TransitionManager>
    <Grid>
        <ContentControl x:Name="BottomBar" Style="{StaticResource A_Style_ButtonBar}">
            <ContentControl x:Name="DefaultHelpPanel"
                    local:ControllerButtonPanel.ADescription="{local:Loc HelpButtons.IDS_Select}"
                    local:ControllerButtonPanel.BDescription="{local:Loc HelpButtons.IDS_Back}"
                    Style="{StaticResource A_Style_ContentControl_DefaultButtonBar}" />
        </ContentControl>

        <Grid x:Name="LayoutRoot">
            <Border Style="{StaticResource A_Style_Border_ScenePadding}" UseLayoutRounding="True">
                <Grid Style="{StaticResource A_Style_FrameworkElement_DefaultTransition_0}">
                    <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center" Margin="16,0,0,0">
                        <ContentControl Content="{local:Loc ScreenTitles.IDS_FestivalPassHistory}" 
                                        Style="{StaticResource A_Style_ContentControl_ScreenTitleBlock}"
                                        HorizontalAlignment="Left"
                                        local:BindingProxy.A="/ForzaUI;component/Textures/Data_Bound/Series6/FestivalPass/FestivalPass_Title.png"/>

                        <Grid>
                            <StackPanel Orientation="Horizontal"
                                        local:BlendValue.SkipInitialInputChanges="1"
                                        local:BlendValue.Input="{Binding (local:FindVisualOffset.VisualOffset).X, ElementName=PART_ItemListBox}"
                                        local:BlendValue.InputChangedStoryboard="{StaticResource A_Storyboard_SmoothScrollWithMotionBlur}"
                                        Margin="-78,0">
                                <StackPanel.RenderTransform>
                                    <TranslateTransform X="{Binding (local:BlendValue.Output), RelativeSource={RelativeSource AncestorType=StackPanel}, Converter={StaticResource A_Converter_ScrollOffsetAdjustment}}" />
                                </StackPanel.RenderTransform>
                                <local:CommonListBox x:Name="PART_ItemListBox"
                                                     local:FindVisualOffset.SelectedItem="{Binding SelectedItem, RelativeSource={RelativeSource Self}}"
                                                     ItemContainerStyle="{StaticResource A_Style_HistoryTile_Container_Style}"
                                                     Template="{StaticResource A_ControlTemplate_CommonListBox_Carousel_FestivalPass}"
                                                     ScrollViewer.CanContentScroll="False"
                                                     ItemsSource="{Binding SeriesHistory}"
                                                     ItemTemplate="{StaticResource A_DataTemplate_PastSeriesItem}"
                                                     SelectedItem="{Binding SelectedItem}"
                                                     local:FocusOnPageFocusGained.SelectorSelectedItem="True"
                                                     PageSize="1" />
                            </StackPanel>
                            <local:NavigationArrows Style="{StaticResource A_Style_Control_NavigationArrows}"
                                                    Margin="-40,0,-20,0"
                                                    CanSelectPrev="{Binding CanSelectPrev, ElementName=PART_ItemListBox}"
                                                    CanSelectNext="{Binding CanSelectNext, ElementName=PART_ItemListBox}"
                                                    ScrollPagePrevCommand="{Binding ScrollPagePrevCommand, ElementName=PART_ItemListBox}"
                                                    ScrollPageNextCommand="{Binding ScrollPageNextCommand, ElementName=PART_ItemListBox}"/>
                        </Grid>
                    </StackPanel>
                </Grid>
            </Border>
        </Grid>
    </Grid>
</Page>
