<local:MusicContentPage
    x:Class="was.touchcopy.features.music.MusicContentArtistDetailPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:was.touchcopy.features.music"
    xmlns:converters="using:was.touchcopy.features.music.converters"
    xmlns:data="using:was.touchcopy.features.music.data"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d" x:DefaultBindMode="OneWay"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    NavigationCacheMode="Enabled">
    <Page.Resources>
        <ResourceDictionary>
            <converters:ArtistToPlaybackInfoConverter x:Key="ArtistToPlaybackInfoConverter" />
            <Style x:Name="SpotifyButtonStyle" TargetType="Button">
                <Setter Property="Foreground" Value="White"/>
                <Setter Property="Background" Value="#1DB954"/>
                <Setter Property="CornerRadius" Value="4"/>
            </Style>
        </ResourceDictionary>
    </Page.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <Border Background="{ThemeResource CardBackgroundFillColorDefault}" CornerRadius="5" BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}" BorderThickness="0.5" Margin="4,10,4,10" Padding="20">
            <Grid ColumnSpacing="20">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="auto" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Border x:Name="artistBorder" Width="150" Height="150" CornerRadius="75" Background="{ThemeResource TextFillColorInverse}" PointerEntered="Border_PointerEntered" PointerExited="Border_PointerExited">
                    <Grid ColumnSpacing="20">
                        <FontIcon x:Name="placeholderFontIcon" Glyph="&#xE77B;" FontSize="28" Opacity=".8" Foreground="{ThemeResource TextFillColorPrimary}" />
                        <Image x:Name="artistImage" Width="150" Height="150" Stretch="UniformToFill" VerticalAlignment="Center" HorizontalAlignment="Center" />
                        <Border x:Name="artistPlayButton" HorizontalAlignment="Center" VerticalAlignment="Center" Padding="10" CornerRadius="64" Background="{ThemeResource TextFillColorInverse}" Visibility="Collapsed" Tapped="ArtistPlayButton_Tapped" DataContext="{x:Bind}">
                            <FontIcon Glyph="&#xE768;" Foreground="{ThemeResource TextFillColorPrimary}" />
                        </Border>
                    </Grid>
                </Border>
                <StackPanel Grid.Column="1" VerticalAlignment="Center">
                    <TextBlock Text="{x:Bind Artist, Converter={StaticResource ArtistToPlaybackInfoConverter}, ConverterParameter='[name]'}" FontWeight="Bold" FontSize="26" TextTrimming="CharacterEllipsis" />
                    <TextBlock Text="{x:Bind Artist, Converter={StaticResource ArtistToPlaybackInfoConverter}, ConverterParameter='[genre] • [albumcount] • [trackcount]'}" Margin="0,8,0,0" Opacity=".7" TextTrimming="CharacterEllipsis" />
                    <StackPanel Orientation="Horizontal" VerticalAlignment="Center">
                        <Button x:Name="buttonPlayArtist" Style="{StaticResource AccentButtonStyle}" Margin="0,24,0,0"  Click="PlayArtistButton_Click">
                            <StackPanel Orientation="Horizontal" Spacing="5">
                                <FontIcon x:Name="buttonPlayArtistFontIcon" Glyph="&#xE768;"  Height="22" Foreground="{Binding Foreground, ElementName=buttonPlayArtistTextBlock}" />
                                <TextBlock x:Name="buttonPlayArtistTextBlock" x:Uid="ButtonPlayArtistLabel" Text="Play" />
                            </StackPanel>
                        </Button>
                        <Button x:Name="buttonStreamSpotify" Margin="20,24,0,0" Style="{StaticResource SpotifyButtonStyle}" Click="ButtonStreamSpotify_Click">
                            <Button.Resources>
                                <ResourceDictionary>
                                    <ResourceDictionary.ThemeDictionaries>
                                        <ResourceDictionary x:Key="Dark">
                                            <SolidColorBrush x:Key="ButtonBackgroundPointerOver" Color="#21D25F"/>
                                        </ResourceDictionary>
                                        <ResourceDictionary x:Key="Light">
                                            <SolidColorBrush x:Key="ButtonBackgroundPointerOver" Color="#21D25F"/>
                                        </ResourceDictionary>
                                    </ResourceDictionary.ThemeDictionaries>
                                </ResourceDictionary>
                            </Button.Resources>
                            <StackPanel Orientation="Horizontal" Spacing="5">
                                <Image x:Name="imageSpotifyButtonIcon" Source="resources/Spotify_Icon_22.png" Stretch="Uniform"  Height="22" />
                                <TextBlock x:Name="buttonStreamSpotifyTextBlock" x:Uid="ButtonStreamOnSpotifyLabel" Text="Stream on Spotify" Foreground="White" />
                            </StackPanel>
                        </Button>
                    </StackPanel>
                </StackPanel>
            </Grid>
        </Border>
        <local:MusicContentAlbumsPage x:Name="albumsPage" Grid.Row="1" />
    </Grid>
</local:MusicContentPage>
