﻿<local:AppTileBase
    x:Class="WinStore.UX.Controls.Tiles.SongItemViewer"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="using:WinStore.UX.Controls"
    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="300"
    d:DesignWidth="400"
    mc:Ignorable="d">

    <Grid x:ConnectionId='1' x:Name="_tileGrid" Height="48">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:ConnectionId='2' x:Name="ReflowStates">
                <VisualState x:ConnectionId='3' x:Name="Wide">
                </VisualState>
                <VisualState x:ConnectionId='4' x:Name="MediumWide">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_releaseDateColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="0" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_releaseYear" Storyboard.TargetProperty="Visibility">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
                <VisualState x:ConnectionId='5' x:Name="Medium">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_releaseDateColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="0" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_durationColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="0" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_releaseYear" Storyboard.TargetProperty="Visibility">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_duration" Storyboard.TargetProperty="Visibility">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
                <VisualState x:ConnectionId='6' x:Name="Narrow">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_releaseDateColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="0" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_durationColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="0" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_albumNameColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="0" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_artistColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="0" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_songTitleColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="Auto" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_narrowAlbumNameColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="*" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_releaseYear" Storyboard.TargetProperty="Visibility">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_duration" Storyboard.TargetProperty="Visibility">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_album" Storyboard.TargetProperty="(Grid.Row)">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="2" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_artist" Storyboard.TargetProperty="(Grid.Row)">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="2" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_album" Storyboard.TargetProperty="(Grid.Column)">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="2" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_artist" Storyboard.TargetProperty="(Grid.Column)">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="0" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_songTitle" Storyboard.TargetProperty="(Grid.ColumnSpan)">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="3" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_artist" Storyboard.TargetProperty="Margin">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="32,0,0,0" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_songTitle" Storyboard.TargetProperty="Margin">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="32,0,0,0" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_album" Storyboard.TargetProperty="Margin">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="0,0,0,0" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_dot" Storyboard.TargetProperty="Visibility">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_tileGrid" Storyboard.TargetProperty="Height">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="60" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_artist" Storyboard.TargetProperty="Foreground">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SecondaryForegroundBrush}" />
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <Grid.ColumnDefinitions>
            <ColumnDefinition x:ConnectionId='7' x:Name="_songTitleColumn" Width="55*" />
            <ColumnDefinition x:ConnectionId='8' x:Name="_dotColumn" Width="Auto" />
            <ColumnDefinition x:ConnectionId='9' x:Name="_narrowAlbumNameColumn" Width="Auto" />
            <ColumnDefinition x:ConnectionId='10' x:Name="_artistColumn" Width="45*" />
            <ColumnDefinition x:ConnectionId='11' x:Name="_albumNameColumn" Width="156" />
            <ColumnDefinition x:ConnectionId='12' x:Name="_durationColumn" Width="60" />
            <ColumnDefinition x:ConnectionId='13' x:Name="_releaseDateColumn" Width="48" />
            <ColumnDefinition Width="104" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <TextBlock x:ConnectionId='14' x:Name="_songTitle"
                    MaxLines="1"
                    Grid.Row="1"
                    Margin="32,0,12,0"
                    Style="{StaticResource BodyTextBlockStyle}"
                    TextTrimming="CharacterEllipsis"/>
        <TextBlock x:ConnectionId='15' x:Name="_artist"
                    Grid.Column="3"
                    MaxLines="1"
                    Margin="0,0,12,0"
                    Grid.Row="1"
                    Style="{StaticResource CaptionTextBlockStyle}"
                    TextTrimming="CharacterEllipsis"/>
        <Ellipse x:ConnectionId='16' x:Name="_dot"
                    Grid.Column="1"
                    Grid.Row="2"
                    Height="3"
                    Width="3"
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    Margin="10,2,10,0"
                    Fill="{ThemeResource SecondaryForegroundBrush}"
                    Visibility="Collapsed"/>
        <TextBlock x:ConnectionId='17' x:Name="_album"
                    Foreground="{ThemeResource SecondaryForegroundBrush}"
                    Grid.Column="4"
                    MaxLines="1"
                    Margin="0,0,12,0"
                    Grid.Row="1"
                    Style="{StaticResource CaptionTextBlockStyle}"
                    TextTrimming="CharacterEllipsis"/>
        <TextBlock x:ConnectionId='18' x:Name="_duration"
                    Foreground="{ThemeResource SecondaryForegroundBrush}"
                    Grid.Column="5"
                    MaxLines="1"
                    Margin="0,0,12,0"
                    Grid.Row="1"
                    Style="{StaticResource CaptionTextBlockStyle}"
                    TextTrimming="CharacterEllipsis"/>
        <TextBlock x:ConnectionId='19' x:Name="_releaseYear"
                    Foreground="{ThemeResource SecondaryForegroundBrush}"
                    Grid.Column="6"
                    MaxLines="1"
                    Margin="0,0,12,0"
                    Grid.Row="1"
                    Style="{StaticResource CaptionTextBlockStyle}"
                    TextTrimming="CharacterEllipsis"/>
        <!-- Button needs hooking up to downloads control -->
        <Button x:ConnectionId='20' x:Name="_price"
                    Style="{StaticResource StandardThemedButtonStyle}"
                    Grid.Column="7"
                    Content="Price"
                    Grid.RowSpan="4"
                    Height="32"
                    Margin="0,0,12,0"
                    HorizontalAlignment="Right"
                    VerticalAlignment="Center"/>
    </Grid>
</local:AppTileBase>

