<Page x:Class="ForzaUI.Scenes.Anthem.A_StarCardChallengesScene"
      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>
        <local:MappingConverter x:Key="A_Converter_ChallengeState_IconColour"
                                Default="{StaticResource A_Color_StarCardChallenges_Complete_Text}">
            <local:MappingConverterEntry Key="{x:Static local:StarCardChallengeState.None}"
                                         Value="#fff" />
        </local:MappingConverter>

        <local:MappingConverter x:Key="A_Converter_ChallengeState_HighContrastModeColor"
                                Default="#80FFFFFF">
            <local:MappingConverterEntry Key="{x:Static local:StarCardChallengeState.None}"
                                         Value="#80000000" />
        </local:MappingConverter>

        <local:MappingConverter x:Key="A_Converter_ChallengeState_IconBacking">
            <local:MappingConverterEntry Key="{x:Static local:StarCardChallengeState.Bronze}"
                                         Value="game:/media/ui/textures/data_bound/Series10/starcard/challengegrid_carousel/tile_frames/IconBack_Bronze.png" />
            <local:MappingConverterEntry Key="{x:Static local:StarCardChallengeState.Silver}"
                                         Value="game:/media/ui/textures/data_bound/Series10/starcard/challengegrid_carousel/tile_frames/IconBack_Silver.png" />
            <local:MappingConverterEntry Key="{x:Static local:StarCardChallengeState.Gold}"
                                         Value="game:/media/ui/textures/data_bound/Series10/starcard/challengegrid_carousel/tile_frames/IconBack_Gold.png" />
        </local:MappingConverter>

        <local:MappingConverter x:Key="A_Converter_ChallengeState_HeaderBacking">
            <local:MappingConverterEntry Key="{x:Static local:StarCardChallengeState.Bronze}"
                                         Value="game:/media/ui/textures/data_bound/Series10/starcard/challengegrid_carousel/tile_frames/Bronze_Header.png" />
            <local:MappingConverterEntry Key="{x:Static local:StarCardChallengeState.Silver}"
                                         Value="game:/media/ui/textures/data_bound/Series10/starcard/challengegrid_carousel/tile_frames/Silver_Header.png" />
            <local:MappingConverterEntry Key="{x:Static local:StarCardChallengeState.Gold}"
                                         Value="game:/media/ui/textures/data_bound/Series10/starcard/challengegrid_carousel/tile_frames/Gold_Header.png" />
        </local:MappingConverter>

        <DataTemplate x:Key="A_DataTemplate_ChallengeItem">
            <Grid Width="342"
                  Height="213">
                <Grid Margin="8">
                    <DockPanel>
                        <Grid Height="70"
                              Width="326"
                              DockPanel.Dock="Top">
                            <local:FZMaterial x:Name="HeaderBacking"
                                              local:MultiStringFormatter.Format="game:/media/ui/textures/data_bound/Series10/starcard/challengegrid_carousel/tile_frames/{0}_Header.png"
                                              local:MultiStringFormatter.Param0="{Binding Category.Identifier, RelativeSource={RelativeSource AncestorType=Page}}"
                                              ImageSource="{Binding State, Converter={StaticResource A_Converter_ChallengeState_HeaderBacking}}" />
                            <local:FZMaterial  Color="{Binding State, Converter={StaticResource A_Converter_ChallengeState_HighContrastModeColor}}" 
                                               HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
                                               Preset="{StaticResource A_FZMaterialPresetRoundtangle_FlatPanel_InnerTopOnly}"
                                               Visibility="{StaticResource A_Visibility_ShowForHighContrastOnly}"/>
                            <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_HorizonA}"
                                               HorizontalAlignment="Center"
                                               CapHeight="16"
                                               Margin="12"
                                               VerticalAlignment="Top"
                                               Text="{Binding Subtitle}"
                                               Color="{Binding State, Converter={StaticResource A_Converter_ChallengeState_IconColour}}" />
                            <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_HorizonB}"
                                               HorizontalAlignment="Center"
                                               CapHeight="22"
                                               Margin="12"
                                               VerticalAlignment="Bottom"
                                               Text="{Binding Title}"
                                               Color="{Binding State, Converter={StaticResource A_Converter_ChallengeState_IconColour}}" />
                        </Grid>
                        <local:FZMaterial Color="#f2f2f2"
                                          Preset="{StaticResource A_FZMaterialPresetRoundtangle_FlatPanel_InnerBottomOnly}">
                            <DockPanel Margin="8">
                                <Grid Width="110"
                                      Height="110"
                                      DockPanel.Dock="Left">
                                    <local:FZMaterial x:Name="IconBacking"
                                                      local:MultiStringFormatter.Format="game:/media/ui/textures/data_bound/Series10/starcard/challengegrid_carousel/tile_frames/IconBack_{0}.png"
                                                      local:MultiStringFormatter.Param0="{Binding Category.Identifier, RelativeSource={RelativeSource AncestorType=Page}}"
                                                      ImageSource="{Binding State, Converter={StaticResource A_Converter_ChallengeState_IconBacking}}" />
                                    <local:FZMaterial  Color="{Binding State, Converter={StaticResource A_Converter_ChallengeState_HighContrastModeColor}}"
                                                       HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
                                                       Preset="{StaticResource A_FZMaterialPresetRoundtangle_FlatPanel_InnerAll}"
                                                       Visibility="{StaticResource A_Visibility_ShowForHighContrastOnly}"/>
                                    <local:FZMaterial local:MultiStringFormatter.Format="game:/media/ui/textures/data_bound/Series10/starcard/challengegrid_carousel/{0}_Shadow.png"
                                                      local:MultiStringFormatter.Param0="{Binding Identifier}"
                                                      ImageSource="{Binding Path=(local:MultiStringFormatter.Output), RelativeSource={RelativeSource Self}}" />
                                    <local:FZMaterial Color="{Binding State, Converter={StaticResource A_Converter_ChallengeState_IconColour}}"
                                                      local:MultiStringFormatter.Format="game:/media/ui/textures/data_bound/Series10/starcard/challengegrid_carousel/{0}_Icon.png"
                                                      local:MultiStringFormatter.Param0="{Binding Identifier}"
                                                      ImageSource="{Binding Path=(local:MultiStringFormatter.Output), RelativeSource={RelativeSource Self}}" />
                                </Grid>
                                <DockPanel Margin="8,0,0,0">
                                    <local:FZMaterial Height="28"
                                                      x:Name="FooterBacking"
                                                      DockPanel.Dock="Bottom"
                                                      Color="{StaticResource A_Color_HighContrast_TextureTint}"
                                                      ImageSource="game:/media/ui/textures/data_bound/Series10/starcard/challengegrid_carousel/tile_frames/progress.png">
                                            <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_HorizonA}"
                                                           x:Name="FooterText"
                                                           VerticalAlignment="Center"
                                                           CapHeight="14"
                                                           Margin="8,7"
                                                           Text="{Binding Progress}"
                                                           Color="#fff" />
                                    </local:FZMaterial>
                                    <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_HorizonA}"
                                                       VerticalAlignment="Center"
                                                       TextWrapping="Wrap"
                                                       CapHeight="15"
                                                       Margin="8,7"
                                                       Text="{Binding Description}"
                                                       Color="{StaticResource A_Color_TextMenu_Text_Default}" />
                                </DockPanel>
                            </DockPanel>
                        </local:FZMaterial>
                    </DockPanel>
                </Grid>
            </Grid>
            <DataTemplate.Triggers>
                <DataTrigger Binding="{Binding State}"
                             Value="{x:Static local:StarCardChallengeState.None}">
                    <Setter TargetName="IconBacking"
                            Property="ImageSource"
                            Value="{Binding Path=(local:MultiStringFormatter.Output), RelativeSource={RelativeSource Self}}" />
                    <Setter TargetName="HeaderBacking"
                            Property="ImageSource"
                            Value="{Binding Path=(local:MultiStringFormatter.Output), RelativeSource={RelativeSource Self}}" />
                </DataTrigger>
                <DataTrigger Binding="{Binding ProgressComplete}"
                             Value="{StaticResource A_Boolean_True}">
                    <Setter TargetName="FooterText"
                            Property="Text"
                            Value="{local:Loc StarCard.IDS_ChallengeComplete}" />
                    <Setter TargetName="FooterBacking"
                            Property="ImageSource"
                            Value="game:/media/ui/textures/data_bound/Series10/starcard/challengegrid_carousel/tile_frames/progress_gold.png" />
                    <Setter TargetName="FooterText"
                            Property="Color"
                            Value="{StaticResource A_Color_StarCardChallenges_Complete_Text}" />
                </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">
            <local:ControllerButtonPanel x:Name="HelpPanel"
                                         Style="{StaticResource A_Style_ControllerButtonPanel_Default}">
                <local:ControllerButtonControl Button="B"
                                               Description="{local:Loc HelpButtons.IDS_Back}" />
            </local:ControllerButtonPanel>
        </ContentControl>

        <Border Style="{StaticResource A_Style_Border_ScenePadding_Opus}"
                x:Name="Frame">
            <Grid Style="{StaticResource A_Style_FrameworkElement_ScreenTilt}">
                <Grid Style="{StaticResource A_Style_FrameworkElement_DefaultTransition_0}">
                    <StackPanel Margin="0,11,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" />
                        <Decorator Height="0" />
                        <Grid>
                            <Decorator Margin="46,0,0,0">
                                <local:CommonListBox ItemTemplate="{StaticResource A_DataTemplate_ChallengeItem}"
                                                     Style="{StaticResource A_Style_CommonListBox_FullScreenCarousel}"
                                                     SelectedItem="{Binding SelectedItem}"
                                                     ItemsSource="{Binding Category.Challenges}"
                                                     x:Name="List"
                                                     local:FocusOnPageFocusGained.SelectorSelectedItem="True" />
                            </Decorator>
                            <Grid Width="388"
                                  Height="699"
                                  HorizontalAlignment="Left"
                                  DataContext="{Binding Category}">
                                <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 Style="{StaticResource A_Style_FZTextBlock_HorizonA}"
                                                               VerticalAlignment="Center"
                                                               HorizontalAlignment="Center"
                                                               CapHeight="21"
                                                               Margin="22,7"
                                                               x:Name="FooterText">
                                                <FrameworkElement.Style>
                                                    <Style TargetType="local:FZTextBlock">
                                                        <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"
                                                              local:MultiStringFormatter.Format="game:/media/ui/textures/data_bound/Series10/starcard/challengegrid_carousel/description_panel/{0}_Infographic_complete.png"
                                                              local:MultiStringFormatter.Param0="{Binding Identifier}"
                                                              ImageSource="{Binding Path=(local:MultiStringFormatter.Output), RelativeSource={RelativeSource Self}}" />

                                                <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"
                                                                          local:MultiStringFormatter.Format="game:/media/ui/textures/data_bound/Series10/starcard/challengegrid_carousel/description_panel/{0}_Infographic_Active.png"
                                                                          local:MultiStringFormatter.Param0="{Binding Identifier}"
                                                                          ImageSource="{Binding Path=(local:MultiStringFormatter.Output), RelativeSource={RelativeSource Self}}">

                                                            <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>
                        </Grid>
                    </StackPanel>
                </Grid>
            </Grid>
        </Border>
    </Grid>
</Page>
