﻿<local:SpotlightTileBase
    x:Class="WinStore.UX.Controls.Tiles.SpotlightItemSmallCurated"
    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:local="using:WinStore.UX.Controls.Tiles"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    d:DesignHeight="140"
    d:DesignWidth="400"
    mc:Ignorable="d">

  <UserControl.Resources>
    <local:EmptyStringVisibilityConverter x:Key="StringVisibiltyConverter" />
  </UserControl.Resources>

  <Border x:ConnectionId='1' x:Name="_root" VerticalAlignment="Top" Height="{StaticResource SpotlightItemHeight}">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup>
                <VisualState x:ConnectionId='2' x:Name="Wide" />
                <VisualState x:ConnectionId='3' x:Name="MediumWide" />
                <VisualState x:ConnectionId='4' x:Name="Medium">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="{StaticResource MediumMinWidth}" />
                    </VisualState.StateTriggers>
                </VisualState>
                <VisualState x:ConnectionId='5' x:Name="MediumNarrow">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="{StaticResource MediumNarrowMinWidth}" />
                    </VisualState.StateTriggers>
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Height" Storyboard.TargetName="_root">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SpotlightGridMediumNarrowHeight}" />
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
                <VisualState x:ConnectionId='6' x:Name="Narrow">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="{StaticResource NarrowMinWidth}" />
                    </VisualState.StateTriggers>
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Height" Storyboard.TargetName="_root">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SpotlightGridNarrowHeight}" />
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

        <Grid x:ConnectionId='7' x:Name="_tileGrid">
            <Border Background="{ThemeResource FallbackImageBrush}">
                <Image Source="{Binding SmallSpotlightImageUrl}"
                       AutomationProperties.AccessibilityView="Raw"
                       Stretch="UniformToFill"/>
            </Border>
            <StackPanel VerticalAlignment="Bottom">
                <TextBlock
                    Style="{StaticResource SubtitleTextBlockStyle}"
                    Margin="24,0,0,0"
                    Visibility="{Binding SpotlightTitleWithFallback, Converter={StaticResource StringVisibiltyConverter}}"
                    Foreground="{ThemeResource PrimaryForegroundLightBrush}"
                    Text="{Binding SpotlightTitleWithFallback}"
                    TextTrimming="CharacterEllipsis" />
                <TextBlock
                    Style="{StaticResource CaptionTextBlockStyle}"
                    Margin="23,0,0,21"
                    Visibility="{Binding SpotlightDescription, Converter={StaticResource StringVisibiltyConverter}}"
                    Foreground="{ThemeResource PrimaryForegroundLightBrush}"
                    Text="{Binding SpotlightDescription}"
                    TextTrimming="CharacterEllipsis" />
            </StackPanel>
        </Grid>
    </Border>
</local:SpotlightTileBase>

