<local:MusicContentPage
    x:Class="was.touchcopy.features.music.MusicContentSongsPage"
    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:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:commonconverters="using:was.touchcopy.features.converters"
    xmlns:converters="using:was.touchcopy.features.music.converters"
    xmlns:data="using:was.touchcopy.features.music.data"
    mc:Ignorable="d"  d:DataContext="{d:DesignInstance Type=local:MusicContentSongsPage}"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    ActualThemeChanged="MusicContentPage_ActualThemeChanged"
    NavigationCacheMode="Enabled">
    <Page.Resources>
        <ResourceDictionary>
            <commonconverters:DurationToStringConverter x:Key="DurationToStringConverter" />
            <commonconverters:ValueToVisibilityConverter x:Key="ValueToVisibilityConverter" />
            <converters:TrackNumberFormatConverter x:Key="TrackNumberFormatConverter" />
            <converters:BoolToOpacitiyForMediaConverter x:Key="BoolToOpacitiyForMediaConverter" />
        </ResourceDictionary>
    </Page.Resources>

    <Grid>
        <ListView  x:Name="listViewSongs" SelectionMode="Extended"  ItemsSource="{Binding TrackData.View, Mode=OneWay}" ContainerContentChanging="ListViewSongs_ContainerContentChanging"
                   IsDoubleTapEnabled="True" DoubleTapped="ListViewSongs_DoubleTapped">
            <ListView.GroupStyle>
                <GroupStyle HidesIfEmpty="True">
                    <GroupStyle.HeaderTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding Key}" Foreground="{ThemeResource SystemAccentColor}" />
                        </DataTemplate>
                    </GroupStyle.HeaderTemplate>
                </GroupStyle>
            </ListView.GroupStyle>
            <ListView.ItemContainerStyle>
                <Style TargetType="ListViewItem" BasedOn="{StaticResource DefaultListViewItemStyle}">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                    <Setter Property="VerticalContentAlignment" Value="Stretch" />
                    <Setter Property="Padding" Value="0" />
                    <Setter Property="Margin" Value="0" />
                </Style>
            </ListView.ItemContainerStyle>
            <ListView.ItemTemplate>
                <DataTemplate x:DataType="data:TrackDetail" >
                    <Border Margin="4,2,4,2" Padding="10,0,10,0" CornerRadius="4"  PointerEntered="Border_PointerEntered" PointerExited="Border_PointerExited" DataContext="{x:Bind}">
                        <Grid ColumnSpacing="10" VerticalAlignment="Center" Opacity="{x:Bind IsICloudStream, Converter={StaticResource BoolToOpacitiyForMediaConverter}}">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="20" />
                                <ColumnDefinition Width="20" />
                                <ColumnDefinition Width="7*" />
                                <ColumnDefinition Width="4*" />
                                <ColumnDefinition Width="4*" />
                                <ColumnDefinition Width="1*" />
                                <ColumnDefinition Width="2*" />
                                <ColumnDefinition Width="2*" />
                            </Grid.ColumnDefinitions>
                            <Grid.Resources>
                                <Style TargetType="TextBlock">
                                    <Setter Property="TextTrimming" Value="CharacterEllipsis" />
                                </Style>
                            </Grid.Resources>
                            <FontIcon x:Name="playbackStatusIcon" Foreground="{ThemeResource SystemAccentColor}" Tapped="PlaybackStatusIcon_Tapped" />

                            <FontIcon x:Name="copyStatusIcon" Grid.Column="1" />
                            <StackPanel Grid.Column="2" Orientation="Horizontal">
                                <TextBlock x:Name="trackNumberTextBlock" MinWidth="20" Margin="0,0,10,0" Grid.Column="2" Text="{x:Bind TrackNumber, TargetNullValue='', Converter={StaticResource TrackNumberFormatConverter}}"/>
                                <TextBlock Text="{x:Bind TrackName, TargetNullValue=''}"/>
                            </StackPanel>
                            <TextBlock Grid.Column="3" Text="{x:Bind Artist, TargetNullValue=''}"/>
                            <TextBlock Grid.Column="4" Text="{x:Bind Album, TargetNullValue=''}"/>
                            <TextBlock Grid.Column="5" Text="{x:Bind Year}" Visibility="{x:Bind Year, Converter={StaticResource ValueToVisibilityConverter}}" TextAlignment="Center"/>
                            <TextBlock Grid.Column="6" Text="{x:Bind Genre, TargetNullValue=''}"/>
                            <TextBlock Grid.Column="7" Text="{x:Bind Duration, Converter={StaticResource DurationToStringConverter}, ConverterParameter='milliseconds|returndashifzero'}" TextAlignment="Center"/>
                        </Grid>
                        <Border.ContextFlyout>
                            <MenuFlyout Opening="ListViewItemMenuFlyout_Opening">
                                <MenuFlyoutItem Name="MenuFlyoutItemPlay" x:Uid="MenuFlyoutItemPlay" Text="Play" Click="ListViewMenuPlay_Click">
                                    <MenuFlyoutItem.Icon>
                                        <FontIcon Glyph="&#xE768;" />
                                    </MenuFlyoutItem.Icon>
                                </MenuFlyoutItem>
                                <MenuFlyoutSeparator />
                                <MenuFlyoutItem x:Uid="MenuFlyoutItemCopy" Text="Copy" Click="ListViewMenuCopyToPC_Click">
                                    <MenuFlyoutItem.Icon>
                                        <FontIcon Glyph="&#xE8C8;" />
                                    </MenuFlyoutItem.Icon>
                                </MenuFlyoutItem>
                                <MenuFlyoutItem Name="MenuFlyoutItemITunes" x:Uid="MenuFlyoutItemITunes" Text="iTunes" Click="ListViewMenuCopyToITunes_Click">
                                    <MenuFlyoutItem.Icon>
                                        <FontIcon Glyph="&#xE90B;" />
                                    </MenuFlyoutItem.Icon>
                                </MenuFlyoutItem>
                                <MenuFlyoutItem Name="MenuFlyoutItemAppleMusic" x:Uid="MenuFlyoutItemAppleMusic" Text="AppleMusic" Click="ListViewMenuCopyToAppleMusic_Click">
                                    <MenuFlyoutItem.Icon>
                                        <FontIcon Glyph="&#xE90B;" />
                                    </MenuFlyoutItem.Icon>
                                </MenuFlyoutItem>
                            </MenuFlyout>
                        </Border.ContextFlyout>
                    </Border>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
        <Grid x:Name="gridNoResults" Visibility="Collapsed">
            <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
                <TextBlock x:Name="textBlockNoResults" x:Uid="TextBlockNoResultsTracks" Text="No tracks found." FontSize="18" FontStyle="Italic" FontWeight="SemiLight" Opacity=".7"/>
            </StackPanel>
        </Grid>
        <ContentDialog x:Name="contentDialogInvalidOperation" x:Uid="ContentDialogInvalidOperation" CloseButtonText="Dismiss" DefaultButton="Close">
            <TextBlock x:Name="textBlockInvalidOperation" TextWrapping="Wrap" />
        </ContentDialog>
    </Grid>
</local:MusicContentPage>
