<Grid
    x:Class="Pixeval.Controls.IllustrationItem"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="using:CommunityToolkit.WinUI.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:fluent="using:FluentIcons.WinUI"
    xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
    xmlns:labs="using:CommunityToolkit.Labs.WinUI"
    xmlns:local="using:Pixeval.Controls"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    x:Name="IllustrationThumbnailCard"
    Padding="0"
    CornerRadius="{ThemeResource ControlCornerRadius}"
    RenderTransformOrigin="0.5,0.5"
    mc:Ignorable="d">
    <ToolTipService.ToolTip>
        <ToolTip Content="{x:Bind ViewModel.Tooltip, Mode=OneWay}" Placement="Right" />
    </ToolTipService.ToolTip>
    <Grid.Resources>
        <ExponentialEase
            x:Key="EasingFunction"
            EasingMode="EaseOut"
            Exponent="12" />
        <!--  ReSharper disable once Xaml.RedundantResource  -->
        <Storyboard x:Key="ThumbnailStoryboard">
            <DoubleAnimation
                EasingFunction="{StaticResource EasingFunction}"
                Storyboard.TargetName="IllustrationThumbnailCard"
                Storyboard.TargetProperty="Opacity"
                From="0"
                To="1"
                Duration="0:0:2" />
        </Storyboard>
    </Grid.Resources>
    <Grid.RenderTransform>
        <ScaleTransform />
    </Grid.RenderTransform>
    <Grid.ContextFlyout>
        <MenuFlyout>
            <MenuFlyoutItem Command="{x:Bind ViewModel.BookmarkCommand, Mode=OneWay}" CommandParameter="{x:Bind}" />
            <MenuFlyoutItem Click="AddToBookmark_OnClicked" Command="{x:Bind ViewModel.AddToBookmarkCommand, Mode=OneWay}" />
            <MenuFlyoutItem Click="OpenUserInfoPage_OnClicked" Command="{x:Bind ViewModel.OpenUserInfoPage, Mode=OneWay}" />
            <MenuFlyoutSeparator />
            <MenuFlyoutItem Command="{x:Bind ViewModel.SaveCommand, Mode=OneWay}" CommandParameter="{x:Bind}" />
            <MenuFlyoutSeparator />
            <MenuFlyoutItem Command="{x:Bind ViewModel.OpenInWebBrowserCommand, Mode=OneWay}" />
            <MenuFlyoutItem Command="{x:Bind ViewModel.GenerateWebLinkCommand, Mode=OneWay}" CommandParameter="{x:Bind}" />
            <MenuFlyoutItem Command="{x:Bind ViewModel.GenerateLinkCommand, Mode=OneWay}" CommandParameter="{x:Bind}" />
            <MenuFlyoutSeparator />
            <MenuFlyoutItem Command="{x:Bind ViewModel.ShowQrCodeCommand, Mode=OneWay}" CommandParameter="{x:Bind QrCodeTeachingTip}" />
            <MenuFlyoutItem Command="{x:Bind ViewModel.ShowPixEzQrCodeCommand, Mode=OneWay}" CommandParameter="{x:Bind QrCodeTeachingTip}" />
        </MenuFlyout>
    </Grid.ContextFlyout>
    <!--  PlaceHolderGrid  -->
    <Grid Width="{x:Bind GetDesiredWidth(ViewModel), Mode=OneWay}" Height="{x:Bind DesiredHeight}" />
    <Grid HorizontalAlignment="Stretch" CornerRadius="{ThemeResource ControlCornerRadius}">
        <Image
            HorizontalAlignment="Center"
            VerticalAlignment="Center"
            Source="{x:Bind ViewModel.ThumbnailSource, Mode=OneWay}"
            Stretch="UniformToFill" />
        <labs:Shimmer Visibility="{x:Bind local:C.IsNullToVisibility(ViewModel.ThumbnailSource), Mode=OneWay}" />
        <local:HeartButton
            HorizontalAlignment="Left"
            VerticalAlignment="Top"
            Command="{x:Bind ViewModel.BookmarkCommand, Mode=OneWay}"
            CommandParameter="{x:Bind}"
            State="{x:Bind ViewModel.IsBookmarkedDisplay, Mode=OneWay}" />
        <controls:DockPanel
            Margin="10"
            VerticalAlignment="Bottom"
            HorizontalSpacing="3"
            LastChildFill="False">
            <local:PixevalBadge
                controls:DockPanel.Dock="Left"
                Mode="Ai"
                Visibility="{x:Bind local:C.ToVisibility(ViewModel.IsAiGenerated), Mode=OneWay}" />
            <local:PixevalBadge
                controls:DockPanel.Dock="Left"
                Mode="{x:Bind ViewModel.XRestrictionCaption, Mode=OneWay}"
                Visibility="{x:Bind local:C.ToVisibility(ViewModel.IsXRestricted), Mode=OneWay}" />
            <local:PixevalBadge
                controls:DockPanel.Dock="Left"
                Mode="Gif"
                Visibility="{x:Bind local:C.ToVisibility(ViewModel.IsUgoira), Mode=OneWay}" />
            <Grid controls:DockPanel.Dock="Right">
                <fluent:SymbolIcon
                    Foreground="{ThemeResource LayerFillColorDefaultBrush}"
                    IconVariant="Filled"
                    Symbol="SquareMultiple"
                    Visibility="{x:Bind local:C.ToVisibility(ViewModel.IsManga), Mode=OneWay}" />
                <fluent:SymbolIcon Symbol="SquareMultiple" Visibility="{x:Bind local:C.ToVisibility(ViewModel.IsManga), Mode=OneWay}" />
            </Grid>
        </controls:DockPanel>
    </Grid>
</Grid>
