<Page x:Class="ForzaUI.Scenes.Anthem.A_StarCardCategoryScene"
      xmlns:local="clr-namespace:ForzaUI;assembly="
      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>

        <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>

        <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}" />
                <StackPanel IsItemsHost="True"
                           KeyboardNavigation.DirectionalNavigation="Contained"
                           Orientation="Horizontal" />
            </DockPanel>
        </ControlTemplate>

        <Style x:Key="A_Style_ListBoxItem_FestivalPass"
               TargetType="{x:Type ListBoxItem}"
               BasedOn="{StaticResource A_Style_ContentControl_Carousel_ContainerStyle}">
            <Style.Resources>
                <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>
            <Setter Property="Margin"
                    Value="{StaticResource A_Double_FestivalPass_CarouselItemMargin}" />
            <Setter Property="IsEnabled"
                    Value="{Binding Enabled}" />
        </Style>

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

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

        <Color x:Key="A_Color_FestivalPass_Complete_Text">#D4332A02</Color>
        
        <local:MappingConverter x:Key="A_Converter_BackingImage_Type" Default="Active">
            <local:MappingConverterEntry Key="{StaticResource A_Boolean_True}"
                                         Value="Gold" />
        </local:MappingConverter>
        <local:MappingConverter x:Key="A_Converter_ObjectiveColour" Default="#ffffff">
            <local:MappingConverterEntry Key="{StaticResource A_Boolean_True}"
                                         Value="{StaticResource A_Color_FestivalPass_Complete_Text}" />
        </local:MappingConverter>

        <System:String x:Key="A_String_XofX_Format">{0}/{1}</System:String>

        <!--Racing, Create, Explore, Stories, OA, PRStunt-->
        <local:MappingConverter x:Key="A_Converter_DetailColour_TopLine">
            <local:MappingConverterEntry Key="Racing"
                                         Value="{StaticResource A_Color_Starcard_Racing}" />
            <local:MappingConverterEntry Key="Create"
                                         Value="{StaticResource A_Color_Starcard_Create}" />
            <local:MappingConverterEntry Key="Explore"
                                         Value="{StaticResource A_Color_Starcard_Explore}" />
            <local:MappingConverterEntry Key="Stories"
                                         Value="{StaticResource A_Color_Starcard_Stories}" />
            <local:MappingConverterEntry Key="OA"
                                         Value="{StaticResource A_Color_Starcard_OA}" />
            <local:MappingConverterEntry Key="PRStunt"
                                         Value="{StaticResource A_Color_Starcard_PRStunt}" />
        </local:MappingConverter>
        
        <Color x:Key="A_Colour_CategoryColour_Racing">#0970ff</Color>
        <Color x:Key="A_Colour_CategoryColour_Explore">#0970ff</Color>
        
        <Style TargetType="local:FZRun"
               x:Key="A_Style_FZRun_TileDetail_TopLine">
            <Setter Property="Color"
                    Value="{Binding Identifier, Converter={StaticResource A_Converter_DetailColour_TopLine}}" />
            <Style.Triggers>
                <DataTrigger Binding="{Binding Superstar}"
                             Value="{StaticResource A_Boolean_True}">
                    <Setter Property="Color"
                            Value="#fff" />
                    <Setter Property="FontFamily"
                            Value="Horizon_B" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
        
        <DataTemplate x:Key="A_DataTemplate_StarCardCategory">
            <Grid Width="{StaticResource A_Double_FestivalPass_MaxCarouselItemWidth}"
                  Height="{StaticResource A_Double_FestivalPass_MaxCarouselItemHeight}">
                <local:FZMaterial ImageSource="{Binding Path=(local:MultiStringFormatter.Output), RelativeSource={RelativeSource Self}}"
                                  local:MultiStringFormatter.Format="game:\media\ui\textures\data_bound\Series10\starcard\starcard_backgrounds\{0}_{1}.png"
                                  local:MultiStringFormatter.Param0="{Binding Identifier}"
                                  local:MultiStringFormatter.Param1="{Binding Superstar, Converter={StaticResource A_Converter_BackingImage_Type}}"
                                  Preset="{StaticResource A_FZMaterialPresetRoundtangle_FlatPanel_BackingImage}"
                                  Width="398"
                                  Height="590"
                                  x:Name="BackingImage"
                                  Margin="3"
                                  VerticalAlignment="Top">
                    <Grid>
                        <local:FZMaterial  Color="#66000000" 
                                           HorizontalAlignment="Stretch" VerticalAlignment="Bottom" Height="32"
                                           Preset="{StaticResource A_FZMaterialPresetRoundtangle_FlatPanel_InnerBottomOnly}"
                                           Visibility="{StaticResource A_Visibility_ShowForHighContrastOnly}"/>

                        <Grid VerticalAlignment="Bottom"
                              Margin="12,52">
                            <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_HorizonA}"
                                               CapHeight="18"
                                               Color="#fff"
                                               x:Name="DetailText"
                                               TextAlignment="Center"
                                               local:TextBlockInlineMarkup.ResourceBaseName="A_Style_FZRun_TileDetail_"
                                               local:TextBlockInlineMarkup.Markup="{Binding Path=(local:MultiStringFormatter.Output), RelativeSource={RelativeSource Self}}"
                                               local:MultiStringFormatter.Format="{local:Loc StarCard.IDS_NearestChallenge_Format}"
                                               local:MultiStringFormatter.Param0="{Binding NearestChallengeTitle}" />
                        </Grid>
                        <Grid VerticalAlignment="Bottom"
                              Margin="12,9">
                            <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_HorizonA}"
                                               CapHeight="15"
                                               HorizontalAlignment="Left"
                                               Color="{Binding Superstar, Converter={StaticResource A_Converter_ObjectiveColour}}"
                                               Text="{local:Loc StarCard.IDS_ObjectivesComplete}" />
                            <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_HorizonA}"
                                               CapHeight="15"
                                               HorizontalAlignment="Right"
                                               Color="{Binding Superstar, Converter={StaticResource A_Converter_ObjectiveColour}}"
                                               local:MultiStringFormatter.Format="{StaticResource A_String_XofX_Format}"
                                               local:MultiStringFormatter.Param0="{Binding ChallengesComplete}"
                                               local:MultiStringFormatter.Param1="{Binding ChallengesTotal}"
                                               Text="{Binding Path=(local:MultiStringFormatter.Output), RelativeSource={RelativeSource Self}, Converter={StaticResource A_StringToUpper}}" />
                        </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, Converter={StaticResource A_StringToUpper}}"
                                           CapHeight="22"
                                           HorizontalAlignment="Center" />
                        <Decorator Height="8" />
                        <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_HorizonA}"
                                           Color="{StaticResource A_Color_Tile_Text}"
                                           Text="{Binding Subtitle}"
                                           CapHeight="16"
                                           HorizontalAlignment="Center" />
                    </StackPanel>
                </Grid>
            </Grid>
            <DataTemplate.Triggers>
                <DataTrigger Binding="{Binding Superstar}"
                             Value="{StaticResource A_Boolean_True}">
                    <Setter TargetName="BackingImage"
                            Property="local:MultiStringFormatter.Param1"
                            Value="Gold" />
                    <Setter TargetName="DetailText"
                            Property="local:TextBlockInlineMarkup.Markup"
                            Value="{Binding SuperstarLabel}" />
                </DataTrigger>
            </DataTemplate.Triggers>
        </DataTemplate>
    </Page.Resources>
    <local:UIPageTransitionManager.TransitionManager>
        <local:UIPageTransitionManager Preset="{StaticResource A_UIPageTransitionManagerPreset_Menu}" />
    </local:UIPageTransitionManager.TransitionManager>
    <Grid>
        <Control Style="{StaticResource A_Style_Control_ScreenBackground}" />

        <!-- Bars -->
        <local:PlayerBarControl Style="{StaticResource A_Style_PlayerBarControl_WithTokens}"
                                x:Name="TopBar" />
                                
        <ContentControl Style="{StaticResource A_Style_ButtonBar}"
                        x:Name="BottomBar">
            <ContentControl x:Name="DefaultHelpPanel"
                            Style="{StaticResource A_Style_ContentControl_DefaultButtonBar}"
                            local:ControllerButtonPanel.ADescription="{local:Loc HelpButtons.IDS_Select}"
                            local:ControllerButtonPanel.BDescription="{local:Loc HelpButtons.IDS_Back}"/>
        </ContentControl>

        <Border Style="{StaticResource A_Style_Border_ScenePadding_Opus}">
            <Grid Style="{StaticResource A_Style_FrameworkElement_DefaultTransition_0}">
                <StackPanel Margin="0,8,0,0">
                    <ContentControl Content="{local:Loc StarCard.IDS_ScreenTitle}"
                                    Style="{StaticResource A_Style_ContentControl_ScreenTitleBlock}"
                                    local:BindingProxy.A="/ForzaUI;component/Textures/Data_Bound/Series10/StarCard/ChallengeGrid_Carousel/StarCard_Header.png"
                                    HorizontalAlignment="Left" />
                    <Grid>
                        <StackPanel Orientation="Horizontal"
                                    local:BlendValue.SkipInitialInputChanges="2"
                                    local:BlendValue.Input="{Binding (local:FindVisualOffset.VisualOffset).X, ElementName=Carousel}"
                                    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>
                            <Grid>
                                <local:CommonListBox x:Name="Carousel"
                                                     local:FindVisualOffset.SelectedItem="{Binding SelectedItem, RelativeSource={RelativeSource Self}}"
                                                     Template="{StaticResource A_ControlTemplate_CommonListBox_Carousel_FestivalPass}"
                                                     ItemContainerStyle="{StaticResource A_Style_ListBoxItem_FestivalPass}"
                                                     SelectedItem="{Binding SelectedItem}"
                                                     ItemTemplate="{StaticResource A_DataTemplate_StarCardCategory}"
                                                     ItemsSource="{Binding Categories}"
                                                     local:FocusOnPageFocusGained.SelectorSelectedItem="True"
                                                     Height="{StaticResource A_Double_FestivalPass_MaxCarouselItemHeightWithMargin}"
                                                     AllowSelectionOfDisabledItems="False"
                                                     MaxSkipOverDisabledItemsCount="2"
                                                     PageSize="1" />
                            </Grid>

                        </StackPanel>
                        <Grid Width="388"
                                  Height="699"
                                  HorizontalAlignment="Left"
                                  Visibility="{Binding StarCardMastery, Converter={StaticResource A_FZBooleanToVisibilityConverter}}"
                                  DataContext="{Binding StarCardMastery}">
                            <local:FZMaterialGlassCapture />
                            <ContentControl DockPanel.Dock="Left"
                                                Tag="{Binding Title}"
                                                Template="{StaticResource A_ControlTemplate_SidePanel}">
                                <DockPanel VerticalAlignment="Stretch">
                                    <local:FZMaterial Preset="{StaticResource A_FZMaterialPresetRoundtangle_FlatPanel_OuterBottomOnly}"
                                                          DockPanel.Dock="Bottom"
                                                          Height="72">
                                        <FrameworkElement.Style>
                                            <Style TargetType="local:FZMaterial">
                                                <Setter Property="Color"
                                                            Value="#969696" />
                                                <Style.Triggers>
                                                    <DataTrigger Binding="{Binding Superstar}"
                                                                     Value="{StaticResource A_Boolean_True}">
                                                        <Setter Property="Color"
                                                                    Value="#ffff" />
                                                        <Setter Property="ImageSource"
                                                                    Value="/ForzaUI;component/Textures/Data_Bound/Series10/StarCard/ChallengeGrid_Carousel/Description_Panel/Description_GoldFooter.png" />
                                                    </DataTrigger>
                                                </Style.Triggers>
                                            </Style>
                                        </FrameworkElement.Style>
                                        <local:FZTextBlock VerticalAlignment="Center"
                                                               HorizontalAlignment="Center"
                                                               CapHeight="21"
                                                               Margin="22,7"
                                                               x:Name="FooterText">
                                            <FrameworkElement.Style>
                                                <Style TargetType="local:FZTextBlock" 
                                                       BasedOn="{StaticResource A_Style_FZTextBlock_HorizonA}">
                                                    <Setter Property="Text"
                                                                Value="{local:Loc StarCard.IDS_SuperstarNotEarned}" />
                                                    <Setter Property="Color"
                                                                Value="#cbcbcb" />
                                                    <Style.Triggers>
                                                        <DataTrigger Binding="{Binding Superstar}"
                                                                         Value="{StaticResource A_Boolean_True}">
                                                            <Setter Property="Text"
                                                                        Value="{Binding SuperstarLabelOneLine}" />
                                                            <Setter Property="Color"
                                                                        Value="{StaticResource A_Color_StarCardChallenges_Complete_Text}" />
                                                        </DataTrigger>
                                                    </Style.Triggers>
                                                </Style>
                                            </FrameworkElement.Style>
                                        </local:FZTextBlock>
                                    </local:FZMaterial>
                                    <Grid>
                                        <!-- Superstar state -->
                                        <StackPanel Visibility="{Binding Superstar, Converter={StaticResource A_FZBooleanToVisibilityConverter_UseHidden}}"
                                                        VerticalAlignment="Center"
                                                        HorizontalAlignment="Center">

                                            <local:FZMaterial Height="236"
                                                              Width="236"
                                                              ImageSource="game:/media/ui/textures/data_bound/Series12/Superstar_Infographic_Complete.png" />

                                            <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_HorizonA}"
                                                                   TextAlignment="Center"
                                                                   Color="#fff"
                                                                   Text="{Binding SuperstarDescription}"
                                                                   TextWrapping="Wrap"
                                                                   CapHeight="21"
                                                                   Margin="22,7" />
                                        </StackPanel>

                                        <!-- Progress state -->
                                        <DockPanel Visibility="{Binding Superstar, Converter={StaticResource A_FZBooleanToVisibilityConverter_UseHidden_Inverse}}">
                                            <DockPanel Height="222"
                                                           DockPanel.Dock="Bottom"
                                                           Margin="15,0">
                                                <Decorator Height="60"
                                                               DockPanel.Dock="Top">
                                                    <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_HorizonD}"
                                                                           TextAlignment="Center"
                                                                           VerticalAlignment="Center"
                                                                           Margin="0,5"
                                                                           Color="#fff"
                                                                           Text="{Binding RewardsDescription}"
                                                                           TextWrapping="NoWrap"
                                                                           CapHeight="14" />
                                                </Decorator>
                                                <Decorator Height="15"
                                                               DockPanel.Dock="Bottom" />
                                                <Grid DockPanel.Dock="Bottom" ClipToBounds="True" Margin="0,0,0,-2">
                                                    <ItemsControl ItemsSource="{Binding Rewards}"
                                                                  ItemTemplate="{StaticResource A_DataTemplate_SmallReward}"
                                                                  Focusable="False"
                                                                  Margin="0,0,2,0"
                                                                  VerticalAlignment="Center" 
                                                                  HorizontalAlignment="Center" />
                                                </Grid>
                                            </DockPanel>
                                            <local:FZMaterial Style="{StaticResource A_Style_FZMaterial_GlassPanel_HorizontalDivider}"
                                                                  Height="1.5"
                                                                  DockPanel.Dock="Bottom" />
                                            <DockPanel>
                                                <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_HorizonA}"
                                                                        TextAlignment="Center"
                                                                        DockPanel.Dock="Bottom"
                                                                        VerticalAlignment="Center"
                                                                        Margin="15,0,15,25"
                                                                        Color="#fff"
                                                                        local:MultiStringFormatter.Format="{local:Loc StarCard.IDS_ChallengesComplete_Format}"
                                                                        local:MultiStringFormatter.Param0="{Binding ChallengesComplete}"
                                                                        local:MultiStringFormatter.Param1="{Binding ChallengesTotal}"
                                                                        Text="{Binding Path=(local:MultiStringFormatter.Output), RelativeSource={RelativeSource Self}}"
                                                                        TextWrapping="NoWrap"
                                                                        CapHeight="21" />
                                                <Grid Margin="0,0,0,-0.5">
                                                    <local:FZMaterial Stretch="Uniform"
                                                                          Width="250"
                                                                          Height="250"
                                                                          ImageSource="game:/media/ui/textures/data_bound/Series12/Superstar_Infographic_Active.png">

                                                        <local:FZMaterial x:Name="RadialBar"
                                                                              Width="275"
                                                                              Height="275"
                                                                              HorizontalAlignment="Center"
                                                                              VerticalAlignment="Center"
                                                                              local:BlendValue.Output="0.87"
                                                                              local:BlendValue.Input="{Binding CompletionRatio}"
                                                                              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>
                                            </DockPanel>
                                        </DockPanel>
                                    </Grid>
                                </DockPanel>
                            </ContentControl>
                        </Grid>

                        <local:NavigationArrows Style="{StaticResource A_Style_Control_NavigationArrows}"
                                                Margin="-40,0,-20,0"
                                                CanSelectPrev="{Binding CanSelectPrev, ElementName=Carousel}"
                                                CanSelectNext="{Binding CanSelectNext, ElementName=Carousel}"
                                                ScrollPagePrevCommand="{Binding ScrollPagePrevCommand, ElementName=Carousel}"
                                                ScrollPageNextCommand="{Binding ScrollPageNextCommand, ElementName=Carousel}" />
                    </Grid>
                </StackPanel>
            </Grid>
        </Border>
    </Grid>
</Page>
