<Page xmlns:local="clr-namespace:ForzaUI;assembly="
      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"
      xmlns:System="clr-namespace:System;assembly=mscorlib"
      xmlns:ed="http://schemas.microsoft.com/expression/2010/drawing"
      mc:Ignorable="d"
      Style="{StaticResource A_Style_Page_Generic}"
      x:Class="ForzaUI.A_MarketplaceAddOnSelect"
      DataContext="{Binding RelativeSource={RelativeSource Self}}">

    <Page.Resources>
        <ResourceDictionary>
            <System:Double x:Key="A_Double_MarketplacePackSelect_ContentHeight">517</System:Double>
            <GridLength x:Key="A_GridLength_MarketplacePackSelect_ContentGaps">6</GridLength>
            <GridLength x:Key="A_GridLength_MarketplacePackSelect_LargeImageWidth">1340</GridLength>
            <System:Double x:Key="A_Double_MarketplacePackSelect_LargeImageWidth">1340</System:Double>

            <!-- ControlTemplates -->
            <DataTemplate x:Key="A_DataTemplate_Carousel_ThumbPathThumbnailItemContent">
                <Grid>
                    <local:FZMaterial x:Name="Icon" ImageSource="{Binding ThumbPath}"/>
                    <ContentControl Style="{StaticResource A_Style_MarketplaceBlammo}" Tag="{Binding BlammoType}" HorizontalAlignment="Left" VerticalAlignment="Bottom" Margin="10,-5">
                        <ContentControl.RenderTransform>
                            <TransformGroup>
                                <ScaleTransform ScaleX="0.65" ScaleY="0.65"/>
                                <SkewTransform/>
                                <RotateTransform/>
                            </TransformGroup>
                        </ContentControl.RenderTransform>
                    </ContentControl>
                </Grid>
            </DataTemplate>
        </ResourceDictionary>
    </Page.Resources>

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

    <Grid x:Name="LayoutRoot">
		<!-- Background Blur -->
		<Control Style="{StaticResource A_Style_Control_ScreenBackground}" />

        <!-- Bars -->
        <local:PlayerBarControl x:Name="TopBar" Style="{StaticResource A_Style_PlayerBarControl_WithTokens}" />
        <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>

        <Border x:Name="Frame" Style="{StaticResource A_Style_Border_ScenePadding_Opus}">
            <Grid Style="{StaticResource A_Style_FrameworkElement_ScreenTilt}">
                <Grid Style="{StaticResource A_Style_FrameworkElement_DefaultTransition_0}">
                    <StackPanel>
                        <Grid VerticalAlignment="Top">
                            <ContentControl x:Name="TitleBlock" Style="{StaticResource A_Style_ContentControl_ScreenTitleBlock}" Content="{Binding SceneTitle}" Tag="{local:Loc ScreenTitles.IDS_Marketplace}" HorizontalAlignment="Left" />
                        </Grid>


                        <Grid x:Name="CenterContent" Margin="0, 6, 0, 0"  DataContext="{Binding SelectedItem, ElementName=List}" Height="{StaticResource A_Double_MarketplacePackSelect_ContentHeight}">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="{StaticResource A_GridLength_MarketplacePackSelect_LargeImageWidth}" />
                                <ColumnDefinition Width="{StaticResource A_GridLength_MarketplacePackSelect_ContentGaps}" />
                                <ColumnDefinition />
                            </Grid.ColumnDefinitions>

                            <!--Center panel-->
                            <Grid x:Name="CenterPanel" Style="{StaticResource A_Style_Grid_CarSelect_LargeImageBlock}" Grid.Column="0">
                                <local:FZMaterial Style="{StaticResource A_Style_FZMaterial_LargePanel_Background}" />
                                <local:FZMaterial ImageSource="{Binding SelectedItem.ImagePath, ElementName=PART_PackList}" Width="{StaticResource A_Double_MarketplacePackSelect_LargeImageWidth}" HorizontalAlignment="Center"/>
                                <StackPanel  Margin="30,15">
                                    <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_Title_LargeActive}" Text="{Binding SelectedItem.DisplayName, ElementName=PART_PackList}" />
                                    <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_SubTitle_LargeActive}" Margin="0,-23,0,0" Text="{Binding SelectedItem.DisplaySubtitle, ElementName=PART_PackList}" />
                                    <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_Heading_SmallActive}" Margin="5" Text="{Binding SelectedItem.DataTitle, ElementName=PART_PackList}" />
                                    <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_Title_HugeActive}" Margin="0,-25,0,0" Text="{Binding SelectedItem.DataValue, ElementName=PART_PackList}" />
                                </StackPanel>

                                <ContentControl Style="{StaticResource A_Style_MarketplaceBlammo}" Tag="{Binding SelectedItem.BlammoType, ElementName=PART_PackList}" HorizontalAlignment="Left" VerticalAlignment="Bottom" Margin="20,0,0,20"/>
                            </Grid>

                            <Grid x:Name="RightPanel"
                                  Style="{StaticResource A_Style_Grid_CarSelect_DescriptionBlock}"
                                  Grid.Column="4">
                                <local:FZMaterial Style="{StaticResource A_Style_FZMaterial_GlassPanel_Background}" />
                                <Grid>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="85" />
                                        <RowDefinition />
                                    </Grid.RowDefinitions>

                                    <Grid Grid.Row="0">
                                        <local:FZMaterial Color="{StaticResource A_Color_Header_Background}" />
                                        <local:FZTextBlock Style="{StaticResource A_Style_FZTextBlock_Heading_Tight}" Color="{StaticResource A_Color_Header_Text}" Text="{local:Loc InGameMarketplace.IDS_Description}" Margin="30,0" HorizontalAlignment="Left" VerticalAlignment="Center"/>
                                    </Grid>

                                    <Grid Grid.Row="1">
                                        <local:FZTextBlock Text="{Binding SelectedItem.Description, ElementName=List}"
                                       Style="{StaticResource A_Style_FZTextBlock_Body_Tight}"
                                       Color="{StaticResource A_Color_Header_Text}"
                                       TextWrapping="Wrap" />
                                        <local:ScrollingTextBlock Text="{Binding SelectedItem.Description, ElementName=PART_PackList}" Margin="30" HorizontalAlignment="Left" 
                                                            VerticalAlignment="Top" Style="{StaticResource A_Style_ScrollingTextBlock}" />
                                    </Grid>
                                </Grid>
                            </Grid>
                        </Grid>

                        <Grid KeyboardNavigation.DirectionalNavigation="Contained">
                            <local:ItemsSelector x:Name="PART_PackList"
                                                 Style="{StaticResource A_Style_Carousel6ItemList}"
                                                 ItemsSource="{Binding Collection}"
                                                 ItemTemplate="{StaticResource A_DataTemplate_Carousel_ThumbPathThumbnailItemContent}"
                                                 VerticalAlignment="Bottom"
                                                 Margin="0, -12, 0, 0"
                                                 Height="271" />
                        </Grid>
                    </StackPanel>
                </Grid>
            </Grid>
        </Border>
    </Grid>
</Page>
