﻿<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:controls="using:WinStore.UX.Controls"
    xmlns:tiles="using:WinStore.UX.Controls.Tiles"
	xmlns:pdpControls="using:WinStore.UX.Controls.PDP"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <!--  TODO: granthi: Need to remove uses of data binding  -->

    <!-- This is the default template for ProductItemViewer, which is to be used with the default LayoutType of Vertical -->
    <Style TargetType="tiles:ProductItemViewer">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="tiles:ProductItemViewer">
                    <StackPanel x:Name="_tilePanel" Width="140" MinHeight="218">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="ReflowStates">
                                <VisualState x:Name="Wide">
                                    <VisualState.StateTriggers>
                                        <AdaptiveTrigger MinWindowWidth="{StaticResource WideMinWidth}" />
                                    </VisualState.StateTriggers>
                                </VisualState>
                                <VisualState x:Name="MediumNarrow">
                                    <VisualState.StateTriggers>
                                        <AdaptiveTrigger MinWindowWidth="{StaticResource MediumNarrowMinWidth}" />
                                    </VisualState.StateTriggers>
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="_title">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="0,4,0,0" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="MinHeight" Storyboard.TargetName="_tilePanel">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="215" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Narrow">
                                    <VisualState.StateTriggers>
                                        <AdaptiveTrigger MinWindowWidth="{StaticResource NarrowMinWidth}" />
                                    </VisualState.StateTriggers>
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Width" Storyboard.TargetName="_tilePanel">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="92" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="MinHeight" Storyboard.TargetName="_tilePanel">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="162" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Height" Storyboard.TargetName="_imageContainer">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="92" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Style" Storyboard.TargetName="_title">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource CaptionTextBlockStyle}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="_title">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="0,4,0,0" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>

                        <Border BorderBrush="{StaticResource TileImageOverlayBorderBrush_Opaque}" BorderThickness="1" x:Name="_imageContainer" Height="140">
                            <Image x:Name="_image" AutomationProperties.AccessibilityView="Raw" />
                        </Border>

                        <TextBlock
                            x:Name="_title"
                            Margin="0,8,0,0"
                            Foreground="{ThemeResource PrimaryForegroundBrush}"
                            MaxLines="2"
                            Style="{StaticResource BodyTextBlockStyle}"
                            TextTrimming="CharacterEllipsis"
                            TextWrapping="Wrap" />

                        <!-- Only one of the following two elements will be Visible depending on ProductType -->
                        
                        <!--If used, this is either release year (Movie) or number of seasons (TV) -->
                        <TextBlock
                            x:Name="_extraMetaDataText"
                            x:DeferLoadStrategy="Lazy"
                            Foreground="{ThemeResource PrimaryForegroundBrush}"
                            Style="{StaticResource BodyTextBlockStyle}"
                            TextTrimming="CharacterEllipsis"
                            TextWrapping="NoWrap"
                            Visibility="Collapsed" />
                        
                        <controls:StarRating 
                            x:Name="_rating" 
                            x:DeferLoadStrategy="Lazy"
                            Margin="-1,-2,0,0"
                            Visibility="Collapsed" />
                        
                        <!-- Not visible for TV products -->
                        <controls:PromoPrice 
                            x:Name="_pricing"
                            x:DeferLoadStrategy="Lazy"
                            Margin="0,-1,0,0"
                            Visibility="Collapsed" />
                        
                    </StackPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style TargetType="controls:PromoPrice">
        <Setter Property="Foreground" Value="{ThemeResource SecondaryForegroundBrush}" />
        <Setter Property="PromoForeground" Value="{ThemeResource PromoPriceBrush}" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="controls:PromoPrice">
                    <Grid AutomationProperties.AutomationId="_priceGrid">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>
                        
                        <TextBlock
                            x:Name="_displayPrice"
                            AutomationProperties.AutomationId="_price"
                            Foreground="{TemplateBinding Foreground}"
                            Style="{StaticResource CaptionTextBlockStyle}"
                            TextWrapping="NoWrap" />
                        
                        <Line
                            x:Name="_strikeThrough"
                            x:DeferLoadStrategy="Lazy"
                            HorizontalAlignment="Stretch"
                            VerticalAlignment="Center"
                            AutomationProperties.AutomationId="_discountAvailable"
                            Stretch="Fill"
                            Visibility="Collapsed"
                            StrokeThickness="1"
                            Stroke="{TemplateBinding Foreground}"
                            Margin="0,1,0,0"
                            X1="0"
                            X2="1" />

                        <TextBlock
                            x:Name="_displayPromoPrice"
                            x:DeferLoadStrategy="Lazy"
                            Grid.Column="1"
                            AutomationProperties.AutomationId="_discountedPrice"
                            Foreground="{TemplateBinding PromoForeground}"
                            Style="{StaticResource CaptionTextBlockStyle}"
                            Margin="3,0,0,0"
                            TextWrapping="NoWrap"
                            Visibility="Collapsed" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style TargetType="controls:StarRating">
        <Setter Property="HorizontalAlignment" Value="Left" />
        <Setter Property="Foreground" Value="{ThemeResource RatingCommunityBrush}" />
        <Setter Property="StarFontSize" Value="{StaticResource StandardStarSize}" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="controls:StarRating">
                    <Grid HorizontalAlignment="Left" VerticalAlignment="Top">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="ThemeStates">
                                <VisualState x:Name="Light" />
                                <VisualState x:Name="Dark" />
                                <VisualState x:Name="HighContrast">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="_starsBackground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="1" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>

                        <TextBlock
                            x:Name="_starsBackground"
                            AutomationProperties.AutomationId="RatingEmptyStars"
                            AutomationProperties.AccessibilityView="Raw"
                            FontSize="{TemplateBinding StarFontSize}"
                            Foreground="{TemplateBinding Foreground}"
                            Opacity="0.4" />

                        <TextBlock
                            x:Name="_starsForeground"
                            AutomationProperties.AutomationId="RatingFilledStars"
                            AutomationProperties.AccessibilityView="Raw"
                            Text="&#x2605;&#x2605;&#x2605;&#x2605;&#x2605;"
                            FontSize="{TemplateBinding StarFontSize}"
                            Foreground="{TemplateBinding Foreground}">
                            <TextBlock.Clip>
                                <RectangleGeometry x:Name="_starsForegroundGeometry" Rect="0,0,23,14" />
                            </TextBlock.Clip>
                        </TextBlock>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style TargetType="controls:StarRatingItem">
        <Setter Property="Foreground" Value="{ThemeResource SecondaryForegroundBrush}" />
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="ProgressForeground" Value="{ThemeResource AppThemePrimaryBrush}" />
        <Setter Property="ProgressBackground" Value="{ThemeResource RatingNoneBrush}" />
        <Setter Property="FontSize" Value="12" />
        <Setter Property="Maximum" Value="100" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="controls:StarRatingItem">
                    <Grid
                        x:Name="ControlRoot"
                        Margin="0,0,0,1"
                        Background="{TemplateBinding Background}"
                        d:DesignWidth="328">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="HighlightStates">
                                <VisualState x:Name="Normal">
                                    <Storyboard>
                                        <DoubleAnimation
                                            Duration="0"
                                            Storyboard.TargetName="progressBar"
                                            Storyboard.TargetProperty="(UIElement.Opacity)"
                                            To="0.5" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Highlighted">
                                    <Storyboard>
                                        <DoubleAnimation
                                            Duration="0"
                                            Storyboard.TargetName="progressBar"
                                            Storyboard.TargetProperty="(UIElement.Opacity)"
                                            To="1" />
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="auto" />
                            <ColumnDefinition Width="5" />
                            <ColumnDefinition MaxWidth="162" />
                            <ColumnDefinition Width="5" />
                            <ColumnDefinition Width="auto" />
                        </Grid.ColumnDefinitions>
                        <TextBlock
                            x:Name="_filter"
                            Style="{StaticResource CaptionTextBlockStyle}"
                            VerticalAlignment="Center"
                            AutomationProperties.AccessibilityView="Raw"
                            Foreground="{ThemeResource PrimaryForegroundBrush}"
                            Text="{TemplateBinding Label}" />
                        <ProgressBar
                            x:Name="_progressBar"
                            Grid.Column="2"
                            Height="8"
                            VerticalAlignment="Center"
                            Background="{TemplateBinding ProgressBackground}"
                            FontFamily="Global User Interface"
                            Foreground="{TemplateBinding ProgressForeground}"
                            Maximum="{TemplateBinding Maximum}"
                            Minimum="{TemplateBinding Minimum}"
                            Opacity="1"
                            Value="{TemplateBinding ProgressValue}" />
                        <TextBlock
                            Style="{StaticResource CaptionTextBlockStyle}"
                            Grid.Column="4"
                            VerticalAlignment="Center"
                            AutomationProperties.AccessibilityView="Raw"
                            Foreground="{ThemeResource PrimaryForegroundBrush}"
                            Text="{TemplateBinding Caption}"
                            TextWrapping="Wrap" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="FontFamily" Value="Global User Interface" />
    </Style>

	<Style TargetType="pdpControls:ScreenshotFilterControl">
		<Setter Property="Template">
			<Setter.Value>
				<ControlTemplate TargetType="pdpControls:ScreenshotFilterControl">
					<StackPanel Orientation="Horizontal">
						<TextBlock x:Name="_screenshotLink"
                            AutomationProperties.AutomationId="SectionLink"
                            Margin="0,0,10,0"
							Style="{StaticResource CaptionTextBlockStyle}"/>
						<TextBlock
							x:Name="_separator"
							Style="{StaticResource CaptionTextBlockStyle}"
							Foreground="{ThemeResource PrimaryForegroundBrush}"
							FontFamily="Segoe UI Symbol"
                            Margin="0,0,11,0"
							Visibility="Collapsed"
							Text="&#xE230;" />
					</StackPanel>
				</ControlTemplate>
			</Setter.Value>
		</Setter>
	</Style>
</ResourceDictionary>

