<?xml version="1.0" encoding="utf-8" ?>
<ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Name="this"
             x:Class="Linaris.FooterPage">

    <Grid Grid.ColumnSpan="2" Grid.Row="1" BackgroundColor="Gray" Style="{StaticResource FooterTrigger}">

        <HorizontalStackLayout Margin="10">
            <Image Source="album10.jpg" SemanticProperties.Description="Album 3" Aspect="AspectFit"/>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
                <Label Grid.Row="0" Style="{StaticResource LabelFooterTrigger}" Text="Morceau" VerticalOptions="Center" Margin="8,0,0,0" WidthRequest="200" LineBreakMode="TailTruncation"></Label>
                <Label Grid.Row="1" x:Name="artiste" Text="Artiste" VerticalOptions="Center" Margin="8,0,0,0"  WidthRequest="200" LineBreakMode="TailTruncation"></Label>
            </Grid>
        </HorizontalStackLayout>

        <StackLayout Grid.Column="1" Orientation="Horizontal" HorizontalOptions="CenterAndExpand" x:Name="ButtonStack">
            <ImageButton x:Name="Random" Source="rdm.png" Margin="0,10,8,10" WidthRequest="25" HeightRequest="25" Aspect="AspectFit" MinimumWidthRequest="1" MinimumHeightRequest="1" BackgroundColor="Transparent"/>
            <ImageButton x:Name="Back" Clicked="RewindButton_Clicked" Source="back.png" Margin="8,10,8,10" WidthRequest="20" HeightRequest="20" Aspect="AspectFit" MinimumWidthRequest="1" MinimumHeightRequest="1" BackgroundColor="Transparent"/>
            <ImageButton x:Name="Play" Clicked="PlayButton_Clicked" Source="play.png" Margin="8,0,8,0" WidthRequest="38" HeightRequest="38" Aspect="AspectFit" MinimumWidthRequest="5" MinimumHeightRequest="5" BackgroundColor="Transparent"/>
            <ImageButton x:Name="Next" Clicked="NextButton_Clicked" Source="next.png" Margin="8,10,8,10" WidthRequest="20" HeightRequest="20" Aspect="AspectFit" MinimumWidthRequest="1" MinimumHeightRequest="1" BackgroundColor="Transparent"/>
            <ImageButton x:Name="Loop" Source="loop.png" Margin="8,10,0,10" WidthRequest="25" HeightRequest="25" Aspect="AspectFit" MinimumWidthRequest="1" MinimumHeightRequest="1" BackgroundColor="Transparent"/>
        </StackLayout>

        <HorizontalStackLayout Grid.ColumnSpan="3" HorizontalOptions="Center" Spacing="10" MinimumWidthRequest="15" x:Name="TimeStack">
            <Label VerticalOptions="Center" Text="00:00:00" x:Name="currentTime"></Label>
            <Slider Value="0" ValueChanged="Bar_ValueChanged" WidthRequest="250" VerticalOptions="Center" x:Name="bar"/>
            <Label VerticalOptions="Center" Text="00:00:00" x:Name="endTime"></Label>
        </HorizontalStackLayout>

        <Grid Grid.Column="2" Style="{StaticResource VolumeTrigger}">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <HorizontalStackLayout Grid.Column="1" VerticalOptions="Center" Margin="0,0,15,0" HorizontalOptions="Fill">
                <Image Source="volume.png" VerticalOptions="Center" WidthRequest="30" HeightRequest="30" Margin="25,25,5,25"/>
                <Slider Grid.Column="1" x:Name="slider" WidthRequest="125" VerticalOptions="Center" Value="1" ValueChanged="Slider_ValueChanged"/>
            </HorizontalStackLayout>
        </Grid>

    </Grid>
</ContentView>