<?xml version="1.0" encoding="utf-8" ?>
<toolkit:Popup
    x:Class="SeriesTracker.Controls.SearchImageResult"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:service="clr-namespace:SeriesTracker.Services.Converters"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
    x:Name="this"
    Opened="this_Opened"
    Color="Transparent">

    <VerticalStackLayout>
        <Border
            Margin="15,25,15,25"
            BackgroundColor="{AppThemeBinding Light=#f5f5f5,
                                              Dark=#151515}"
            Stroke="Transparent">
            <Border.StrokeShape>
                <RoundRectangle CornerRadius="10" />
            </Border.StrokeShape>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="50" />
                    <RowDefinition Height="140" />
                    <RowDefinition Height="15" />
                    <RowDefinition Height="50" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Label
                    Grid.Row="0"
                    Grid.ColumnSpan="2"
                    Margin="10,5,10,5"
                    FontSize="16"
                    HorizontalOptions="Start"
                    Text="Выберите одно из изображений"
                    VerticalOptions="Center"
                    WidthRequest="270" />
                <StackLayout
                    Grid.Row="0"
                    Grid.Column="2"
                    Margin="10,5,10,5"
                    HorizontalOptions="End"
                    Orientation="Vertical"
                    VerticalOptions="Center">
                    <Image
                        HeightRequest="12"
                        Rotation="180"
                        Source="backarrow.png"
                        WidthRequest="12">
                        <Image.Behaviors>
                            <toolkit:IconTintColorBehavior TintColor="{AppThemeBinding Light={StaticResource Black}, Dark={StaticResource White}}" />
                        </Image.Behaviors>
                    </Image>
                    <Label
                        FontAttributes="Italic"
                        FontSize="9"
                        IsEnabled="False"
                        Text="искать дальше" />
                    <StackLayout.GestureRecognizers>
                        <TapGestureRecognizer NumberOfTapsRequired="1" Tapped="NextSearch_Tapped" />
                    </StackLayout.GestureRecognizers>
                </StackLayout>
                <Border
                    Grid.Row="1"
                    Grid.Column="0"
                    Margin="5"
                    BackgroundColor="Transparent"
                    HeightRequest="140"
                    HorizontalOptions="Center"
                    Stroke="Transparent"
                    StrokeThickness="2"
                    WidthRequest="100">
                    <Border.StrokeShape>
                        <RoundRectangle CornerRadius="10" />
                    </Border.StrokeShape>
                    <Image Aspect="AspectFill" Source="{Binding Source={x:Reference this}, Path=FirstImageSource}" />
                    <Border.GestureRecognizers>
                        <TapGestureRecognizer NumberOfTapsRequired="1" Tapped="TapGestureRecognizer_Tapped_1" />
                    </Border.GestureRecognizers>
                    <Border.Triggers>
                        <DataTrigger
                            Binding="{Binding Source={x:Reference this}, Path=ActiveImage}"
                            TargetType="Border"
                            Value="0">
                            <Setter Property="Stroke" Value="{AppThemeBinding Light={StaticResource Primary}, Dark={StaticResource PrimaryDark}}" />
                        </DataTrigger>
                    </Border.Triggers>
                </Border>

                <Border
                    Grid.Row="1"
                    Grid.Column="1"
                    Margin="5"
                    BackgroundColor="Transparent"
                    HeightRequest="140"
                    HorizontalOptions="Center"
                    Stroke="Transparent"
                    StrokeThickness="2"
                    WidthRequest="100">
                    <Border.StrokeShape>
                        <RoundRectangle CornerRadius="10" />
                    </Border.StrokeShape>
                    <Image Aspect="AspectFill" Source="{Binding Source={x:Reference this}, Path=SecondImageSource}" />
                    <Border.GestureRecognizers>
                        <TapGestureRecognizer NumberOfTapsRequired="1" Tapped="TapGestureRecognizer_Tapped_2" />
                    </Border.GestureRecognizers>
                    <Border.Triggers>
                        <DataTrigger
                            Binding="{Binding Source={x:Reference this}, Path=ActiveImage}"
                            TargetType="Border"
                            Value="1">
                            <Setter Property="Stroke" Value="{AppThemeBinding Light={StaticResource Primary}, Dark={StaticResource PrimaryDark}}" />
                        </DataTrigger>
                    </Border.Triggers>
                </Border>
                <Border
                    Grid.Row="1"
                    Grid.Column="2"
                    Margin="5"
                    BackgroundColor="Transparent"
                    HeightRequest="140"
                    HorizontalOptions="Center"
                    Stroke="Transparent"
                    StrokeThickness="2"
                    WidthRequest="100">
                    <Border.StrokeShape>
                        <RoundRectangle CornerRadius="10" />
                    </Border.StrokeShape>
                    <Image Aspect="AspectFill" Source="{Binding Source={x:Reference this}, Path=ThirdImageSource}" />
                    <Border.GestureRecognizers>
                        <TapGestureRecognizer NumberOfTapsRequired="1" Tapped="TapGestureRecognizer_Tapped_3" />
                    </Border.GestureRecognizers>
                    <Border.Triggers>
                        <DataTrigger
                            Binding="{Binding Source={x:Reference this}, Path=ActiveImage}"
                            TargetType="Border"
                            Value="2">
                            <Setter Property="Stroke" Value="{AppThemeBinding Light={StaticResource Primary}, Dark={StaticResource PrimaryDark}}" />
                        </DataTrigger>
                    </Border.Triggers>
                </Border>
                <ActivityIndicator
                    Grid.Row="1"
                    Grid.Column="0"
                    Margin="5"
                    HeightRequest="40"
                    HorizontalOptions="Center"
                    IsRunning="{Binding Source={x:Reference this}, Path=FirstImageSource, Converter={service:StringToBoolConverter}}"
                    VerticalOptions="Center"
                    WidthRequest="40" />
                <ActivityIndicator
                    Grid.Row="1"
                    Grid.Column="1"
                    Margin="5"
                    HeightRequest="40"
                    HorizontalOptions="Center"
                    IsRunning="{Binding Source={x:Reference this}, Path=SecondImageSource, Converter={service:StringToBoolConverter}}"
                    VerticalOptions="Center"
                    WidthRequest="40" />
                <ActivityIndicator
                    Grid.Row="1"
                    Grid.Column="2"
                    Margin="5"
                    HeightRequest="40"
                    HorizontalOptions="Center"
                    IsRunning="{Binding Source={x:Reference this}, Path=ThirdImageSource, Converter={service:StringToBoolConverter}}"
                    VerticalOptions="Center"
                    WidthRequest="40" />
                <Label
                    Grid.Row="2"
                    Grid.Column="0"
                    FontFamily="NunitoItalic"
                    FontSize="11"
                    HorizontalOptions="Center"
                    HorizontalTextAlignment="Center"
                    IsEnabled="False"
                    Text="Изображение 1"
                    VerticalOptions="Start"
                    VerticalTextAlignment="Start">
                    <Label.Triggers>
                        <DataTrigger
                            Binding="{Binding Source={x:Reference this}, Path=ActiveImage}"
                            TargetType="Label"
                            Value="0">
                            <Setter Property="TextColor" Value="{AppThemeBinding Light={StaticResource Primary}, Dark={StaticResource PrimaryDark}}" />
                            <Setter Property="FontSize" Value="12" />
                        </DataTrigger>
                    </Label.Triggers>
                </Label>
                <Label
                    Grid.Row="2"
                    Grid.Column="1"
                    FontFamily="NunitoItalic"
                    FontSize="11"
                    HorizontalOptions="Center"
                    HorizontalTextAlignment="Center"
                    IsEnabled="False"
                    Text="Изображение 2"
                    VerticalOptions="Start"
                    VerticalTextAlignment="Start">
                    <Label.Triggers>
                        <DataTrigger
                            Binding="{Binding Source={x:Reference this}, Path=ActiveImage}"
                            TargetType="Label"
                            Value="1">
                            <Setter Property="TextColor" Value="{AppThemeBinding Light={StaticResource Primary}, Dark={StaticResource PrimaryDark}}" />
                            <Setter Property="FontSize" Value="12" />
                        </DataTrigger>
                    </Label.Triggers>
                </Label>
                <Label
                    Grid.Row="2"
                    Grid.Column="2"
                    FontFamily="NunitoItalic"
                    FontSize="11"
                    HorizontalOptions="Center"
                    HorizontalTextAlignment="Center"
                    IsEnabled="False"
                    Text="Изображение 3"
                    VerticalOptions="Start"
                    VerticalTextAlignment="Start">
                    <Label.Triggers>
                        <DataTrigger
                            Binding="{Binding Source={x:Reference this}, Path=ActiveImage}"
                            TargetType="Label"
                            Value="2">
                            <Setter Property="TextColor" Value="{AppThemeBinding Light={StaticResource Primary}, Dark={StaticResource PrimaryDark}}" />
                            <Setter Property="FontSize" Value="12" />
                        </DataTrigger>
                    </Label.Triggers>
                </Label>
                <HorizontalStackLayout
                    Grid.Row="4"
                    Grid.ColumnSpan="3"
                    HorizontalOptions="End">
                    <Button
                        x:Name="confirm"
                        BackgroundColor="Transparent"
                        Clicked="ConfirmBtn_Clicked"
                        FontSize="14"
                        Text="Выбрать"
                        TextColor="{AppThemeBinding Light={StaticResource Primary},
                                                    Dark={StaticResource PrimaryDark}}" />
                    <Button
                        x:Name="deny"
                        BackgroundColor="Transparent"
                        Clicked="DenyBtn_Clicked"
                        FontSize="14"
                        Text="Отмена"
                        TextColor="{StaticResource Gray500}" />

                </HorizontalStackLayout>
            </Grid>
        </Border>
    </VerticalStackLayout>
</toolkit:Popup>