<?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"
             x:Class="Northwind.Maui.Blazor.Client.Views.CategoriesPage"
             xmlns:local="clr-namespace:Northwind.Maui.Blazor.Client"
             xmlns:categories=
               "clr-namespace:Northwind.Maui.Blazor.Client.Views.Categories"
             xmlns:toolkit=
               "http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
             Title="Kategorie produktów"
             BackgroundColor="{StaticResource PageBackgroundColor}">

  <ContentPage.BindingContext>
    <categories:CategoriesViewModel />
  </ContentPage.BindingContext>

  <VerticalStackLayout>

    <HorizontalStackLayout Spacing="20" Padding="20">
      <Label Text="{Binding InfoMessage}" />
      <Label Text="{Binding ErrorMessage}" TextColor="Red"
             IsVisible="{Binding ErrorMessageVisible}" />
    </HorizontalStackLayout>

    <CarouselView x:Name="carouselView" 
                  ItemsSource="{Binding .}" 
                  IndicatorView="indicatorView"
                  PeekAreaInsets="10"
                  Loop="False">

      <CarouselView.EmptyView>
        <ContentView>
          <VerticalStackLayout HorizontalOptions="Center"
                               VerticalOptions="Center">
            <Label Text="Brak wyników spełniających kryteria."
                   Margin="10,25,10,10"
                   FontAttributes="Bold"
                   FontSize="18"
                   HorizontalOptions="Fill"
                   HorizontalTextAlignment="Center" />
            <Label Text="{Binding ErrorMessage}"
                   FontAttributes="Italic"
                   FontSize="12"
                   HorizontalOptions="Fill"
                   HorizontalTextAlignment="Center" />
          </VerticalStackLayout>
        </ContentView>
      </CarouselView.EmptyView>

      <CarouselView.ItemTemplate>
        <DataTemplate>
          <VerticalStackLayout>
            <Frame HasShadow="True"
                   BorderColor="{StaticResource PrimaryTextColor}"
                   CornerRadius="10"
                   Margin="20"
                   HeightRequest="450"
                   HorizontalOptions="Center"
                   VerticalOptions="Center">

              <VerticalStackLayout>
                <Label Text="{Binding CategoryName}"
                       FontAttributes="Bold"
                       FontSize="18"
                       HorizontalOptions="Center"
                       VerticalOptions="Center" />
                <Image Source="{Binding PicturePath}"
                       Aspect="AspectFill"
                       HeightRequest="250"
                       WidthRequest="375"
                       HorizontalOptions="Center" />
                <Label Text="{Binding Description}"
                       FontAttributes="Italic"
                       HorizontalOptions="Center"
                       MaxLines="5"
                       LineBreakMode="TailTruncation" />
              </VerticalStackLayout>

            </Frame>
          </VerticalStackLayout>
        </DataTemplate>
      </CarouselView.ItemTemplate>
    </CarouselView>

    <Frame BackgroundColor="{StaticResource PrimaryTextColor}" 
           CornerRadius="5" HorizontalOptions="Center">
      <IndicatorView x:Name="indicatorView"
                     IndicatorColor="{StaticResource PageBackgroundColor}"
                     SelectedIndicatorColor="DeepSkyBlue"
                     HorizontalOptions="Center" />
    </Frame>

  </VerticalStackLayout>
</ContentPage>