<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:Linaris"
             xmlns:model="clr-namespace:Model;assembly=Model"
             xmlns:converters="clr-namespace:Linaris.Converters"
             x:Class="Linaris.PlaylistsPage"
             Title="PlaylistsPage"
             Style="{StaticResource PageFlyoutTrigger}">

    <ContentPage.Resources>
        <converters:InverseBooleanConverter x:Key="InverseBooleanConverter" />
    </ContentPage.Resources>

    <Grid Style="{StaticResource GridFlyoutTrigger}" RowDefinitions="8*,*">
        <local:Layout Grid.Column="0"/>
        <ScrollView Grid.Column="1" Grid.Row="0" BackgroundColor="#404040">
            <VerticalStackLayout>
                <SearchBar Style="{StaticResource SearchBar}"/>
                <FlexLayout Direction="Row" AlignItems="Start" BindableLayout.ItemsSource="{Binding Playlists}" JustifyContent="SpaceAround" Wrap="Wrap">
                    <BindableLayout.ItemTemplate>
                        <DataTemplate>
                            <Grid ColumnDefinitions="2*,*">
                                <VerticalStackLayout Margin="10" Grid.ColumnSpan="2">
                                    <Image Source="{Binding ImageURL}" Aspect="Fill" HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="150" WidthRequest="150" IsAnimationPlaying="True" InputTransparent="False">
                                        <Image.GestureRecognizers>
                                            <TapGestureRecognizer Tapped="ShowSubMenu"/>
                                        </Image.GestureRecognizers>
                                    </Image>
                                    <Label Text="{Binding Name}" Style="{StaticResource Titre}" HorizontalTextAlignment="Center" WidthRequest="250" LineBreakMode="TailTruncation"/>
                                </VerticalStackLayout>

                                <Grid Grid.ColumnSpan="2" BackgroundColor="Grey" HeightRequest="125" WidthRequest="155" RowDefinitions="*,*,*" IsVisible="{Binding IsSubMenuVisible}">
                                    <Button Grid.Row="0" Text="Accéder à la playlist" Clicked="GoToPlaylist"/>
                                    <Button Grid.Row="1" Text="Supprimer" Clicked="RemovePlaylist"/>
                                    <Button Grid.Row="3" Text="Changer l'image" Clicked="ChangeImage"/>
                                </Grid>

                                <Grid.GestureRecognizers>
                                    <TapGestureRecognizer />
                                </Grid.GestureRecognizers>
                            </Grid>
                        </DataTemplate>
                    </BindableLayout.ItemTemplate>
                </FlexLayout>
                <Button WidthRequest="300" HeightRequest="50" Margin="0,20,0,20" BackgroundColor="{StaticResource Primary}" Text="Ajouter d'autres playlists" Clicked="AddPlaylist" TextColor="White"/>
            </VerticalStackLayout>
        </ScrollView>
        <local:FooterPage Grid.Row="1" Grid.ColumnSpan="2"/>
        <Grid.GestureRecognizers>
            <TapGestureRecognizer Tapped="ResetAll"/>
        </Grid.GestureRecognizers>
    </Grid>
</ContentPage>
