<base:VideoPlayerPageBase
    x:Class="Bili.App.Pages.Desktop.Overlay.VideoPlayerPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:account="using:Bili.ViewModels.Interfaces.Account"
    xmlns:base="using:Bili.App.Pages.Base"
    xmlns:behaviors="using:Bili.App.Behaviors"
    xmlns:community="using:Bili.Models.Data.Community"
    xmlns:controls="using:Bili.App.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:icons="using:Richasy.FluentIcon.Uwp"
    xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
    xmlns:loc="using:Bili.App.Resources.Extension"
    xmlns:local="using:Bili.App.Pages.Desktop.Overlay"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
    xmlns:player="using:Bili.App.Controls.Player"
    xmlns:video="using:Bili.ViewModels.Interfaces.Video"
    mc:Ignorable="d">

    <base:VideoPlayerPageBase.Resources>
        <Style TargetType="controls:IconTextBlock">
            <Setter Property="IconFontSize" Value="20" />
            <Setter Property="Foreground" Value="{ThemeResource TextFillColorSecondaryBrush}" />
        </Style>

        <Flyout x:Name="CoinFlyout">
            <Grid RowSpacing="16">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <TextBlock
                    Style="{StaticResource CaptionTextBlockStyle}"
                    Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                    Text="{loc:Locale Name=ChooseCoinNumber}" />
                <StackPanel
                    Grid.Row="1"
                    Orientation="Horizontal"
                    Spacing="12">
                    <Button
                        Width="40"
                        Height="40"
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Click="OnGiveCoinButtonClick"
                        Content="1"
                        FontWeight="Bold"
                        Tag="1" />
                    <Button
                        Width="40"
                        Height="40"
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Click="OnGiveCoinButtonClick"
                        Content="2"
                        FontWeight="Bold"
                        IsEnabled="{x:Bind ViewModel.View.Information.IsOriginal, Mode=OneWay}"
                        Tag="2" />
                </StackPanel>
                <TextBlock
                    Style="{StaticResource CaptionTextBlockStyle}"
                    Grid.Row="2"
                    FontSize="10"
                    Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                    Text="{loc:Locale Name=CoinNumberTip}" />
                <CheckBox
                    x:Name="AlsoLikeCheckBox"
                    Grid.Row="3"
                    MinWidth="0"
                    Content="{loc:Locale Name=AlsoLike}"
                    IsChecked="{x:Bind ViewModel.IsCoinWithLiked, Mode=TwoWay}" />
            </Grid>
        </Flyout>

        <Flyout x:Name="FavoriteFlyout">
            <Grid>
                <Grid Visibility="{x:Bind ViewModel.IsFavoriteFoldersError, Mode=OneWay, Converter={StaticResource BoolToVisibilityReverseConverter}}">
                    <StackPanel Spacing="8" Visibility="{x:Bind ViewModel.IsFavoriteFolderRequesting, Mode=OneWay, Converter={StaticResource BoolToVisibilityReverseConverter}}">
                        <TextBlock
                            Style="{StaticResource CaptionTextBlockStyle}"
                            Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                            Text="{loc:Locale Name=ChooseFavorite}" />
                        <ScrollViewer
                            MaxHeight="320"
                            HorizontalScrollMode="Disabled"
                            VerticalScrollBarVisibility="Hidden">
                            <muxc:ItemsRepeater ItemsSource="{x:Bind ViewModel.FavoriteFolders}">
                                <muxc:ItemsRepeater.Layout>
                                    <muxc:StackLayout Spacing="4" />
                                </muxc:ItemsRepeater.Layout>
                                <muxc:ItemsRepeater.ItemTemplate>
                                    <DataTemplate x:DataType="video:IVideoFavoriteFolderSelectableViewModel">
                                        <controls:CardPanel
                                            IsChecked="{x:Bind IsSelected, Mode=TwoWay}"
                                            IsEnableCheck="True"
                                            IsEnableHoverAnimation="False">
                                            <Grid
                                                Width="240"
                                                Height="40"
                                                Padding="12,8">
                                                <TextBlock
                                                    Style="{StaticResource CaptionTextBlockStyle}"
                                                    VerticalAlignment="Center"
                                                    FontWeight="Bold"
                                                    Text="{x:Bind Data.Title}"
                                                    TextTrimming="CharacterEllipsis" />
                                            </Grid>
                                        </controls:CardPanel>
                                    </DataTemplate>
                                </muxc:ItemsRepeater.ItemTemplate>
                            </muxc:ItemsRepeater>
                        </ScrollViewer>
                        <Button
                            x:Name="RequestFavoriteButton"
                            Style="{StaticResource AccentButtonStyle}"
                            HorizontalAlignment="Stretch"
                            Command="{x:Bind ViewModel.FavoriteVideoCommand}"
                            Content="{loc:Locale Name=Confirm}" />
                    </StackPanel>
                    <muxc:ProgressRing
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        IsActive="{x:Bind ViewModel.IsFavoriteFolderRequesting, Mode=OneWay}" />
                </Grid>
                <controls:ErrorPanel
                    ActionButtonClick="OnRefreshFavoriteButtonClick"
                    ActionContent="{loc:Locale Name=Refresh}"
                    Text="{loc:Locale Name=RequestFavoriteError}"
                    Visibility="{x:Bind ViewModel.IsFavoriteFoldersError}" />
            </Grid>
        </Flyout>
    </base:VideoPlayerPageBase.Resources>

    <Grid x:Name="RootGrid">
        <player:PlayerPagePanel
            IsEnabled="{x:Bind ViewModel.IsError, Mode=OneWay, Converter={StaticResource ObjectToBoolReverseConverter}}"
            IsTabStop="{x:Bind ViewModel.IsError, Mode=OneWay, Converter={StaticResource ObjectToBoolReverseConverter}}"
            Opacity="{x:Bind ViewModel.IsError, Mode=OneWay, Converter={StaticResource ErrorOpacityConverter}}"
            SectionHeaderItemInvoked="OnSectionHeaderItemInvoked"
            SectionHeaderItemsSource="{x:Bind ViewModel.Sections}"
            SectionHeaderSelectedItem="{x:Bind ViewModel.CurrentSection, Mode=OneWay}"
            ViewModel="{x:Bind ViewModel}"
            Visibility="{x:Bind ViewModel.IsReloading, Mode=OneWay, Converter={StaticResource BoolToVisibilityReverseConverter}}">
            <player:BiliMediaPlayer ViewModel="{x:Bind ViewModel.MediaPlayerViewModel, Mode=OneWay}" />
            <player:PlayerPagePanel.Descriptor>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>

                    <Grid>
                        <StackPanel
                            x:Name="SinglePublisherContainer"
                            Margin="0,0,0,12"
                            HorizontalAlignment="Left"
                            Orientation="Horizontal"
                            Spacing="12"
                            Visibility="{x:Bind ViewModel.IsCooperationVideo, Mode=OneWay, Converter={StaticResource BoolToVisibilityReverseConverter}}">
                            <controls:UserAvatar
                                Width="36"
                                Height="36"
                                Avatar="{x:Bind ViewModel.Author.User.Avatar.Uri, Mode=OneWay}"
                                Command="{x:Bind ViewModel.Author.ShowDetailCommand, Mode=OneWay}"
                                UserName="{x:Bind ViewModel.Author.User.Name, Mode=OneWay}" />
                            <StackPanel Spacing="4">
                                <TextBlock
                                    VerticalAlignment="Center"
                                    IsTextSelectionEnabled="True"
                                    Text="{x:Bind ViewModel.Author.User.Name, Mode=OneWay}" />
                                <Button
                                    Style="{x:Bind ViewModel.Author.Relation, Converter={StaticResource RelationButtonStyleConverter}, Mode=OneWay}"
                                    Padding="8,2"
                                    HorizontalAlignment="Left"
                                    Command="{x:Bind ViewModel.Author.ToggleRelationCommand, Mode=OneWay}"
                                    Content="{x:Bind ViewModel.Author.Relation, Converter={StaticResource RelationTextConverter}, Mode=OneWay}"
                                    FontSize="10"
                                    Visibility="{x:Bind ViewModel.Author.IsRelationButtonShown, Mode=OneWay}" />
                            </StackPanel>
                        </StackPanel>
                        <StackPanel
                            x:Name="StaffContainer"
                            Margin="0,0,0,8"
                            Orientation="Horizontal"
                            Visibility="{x:Bind ViewModel.IsCooperationVideo, Mode=OneWay}">
                            <muxc:ItemsRepeater ItemsSource="{x:Bind ViewModel.Collaborators}">
                                <muxc:ItemsRepeater.ItemTemplate>
                                    <DataTemplate x:DataType="account:IUserItemViewModel">
                                        <Grid>
                                            <StackPanel Spacing="4">
                                                <controls:UserAvatar
                                                    Width="36"
                                                    Height="36"
                                                    Avatar="{x:Bind User.Avatar.Uri}"
                                                    Command="{x:Bind ShowDetailCommand}"
                                                    DataContext="{x:Bind}"
                                                    UserName="{x:Bind User.Name}" />
                                                <TextBlock
                                                    MaxWidth="52"
                                                    HorizontalAlignment="Center"
                                                    FontSize="12"
                                                    Text="{x:Bind User.Name}"
                                                    TextAlignment="Center"
                                                    TextTrimming="CharacterEllipsis"
                                                    ToolTipService.ToolTip="{x:Bind User.Name}" />
                                            </StackPanel>
                                            <Border
                                                Margin="0,-8,-8,0"
                                                Padding="4"
                                                HorizontalAlignment="Right"
                                                VerticalAlignment="Top"
                                                Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                                                BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
                                                BorderThickness="1"
                                                CornerRadius="{StaticResource ControlCornerRadius}">
                                                <TextBlock FontSize="10" Text="{x:Bind Role, Mode=OneWay}" />
                                            </Border>
                                        </Grid>

                                    </DataTemplate>
                                </muxc:ItemsRepeater.ItemTemplate>
                                <muxc:ItemsRepeater.Layout>
                                    <muxc:StackLayout Orientation="Horizontal" Spacing="8" />
                                </muxc:ItemsRepeater.Layout>
                            </muxc:ItemsRepeater>
                        </StackPanel>
                    </Grid>

                    <StackPanel
                        Grid.Row="1"
                        HorizontalAlignment="Left"
                        Spacing="8">
                        <TextBlock
                            Style="{StaticResource CaptionTextBlockStyle}"
                            Foreground="{ThemeResource TextFillColorTertiaryBrush}"
                            IsTextSelectionEnabled="True"
                            Text="{x:Bind ViewModel.PublishTime, Mode=OneWay}"
                            ToolTipService.ToolTip="{x:Bind ViewModel.View.Information.PublishTime}" />
                        <TextBlock
                            x:Name="TitleBlock"
                            Style="{StaticResource SubtitleTextBlockStyle}"
                            HorizontalAlignment="Left"
                            IsTextSelectionEnabled="True"
                            MaxLines="2"
                            Text="{x:Bind ViewModel.View.Information.Identifier.Title, Mode=OneWay}"
                            TextWrapping="Wrap">
                            <ToolTipService.ToolTip>
                                <ToolTip Content="{x:Bind ViewModel.View.Information.Identifier.Title, Mode=OneWay}" IsEnabled="{Binding ElementName=TitleBlock, Mode=OneWay, Path=IsTextTrimmed}" />
                            </ToolTipService.ToolTip>
                        </TextBlock>
                        <StackPanel Margin="0,4,0,8" Orientation="Horizontal">
                            <controls:IconTextBlock
                                Margin="0,0,12,0"
                                Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                Symbol="EyeShow16"
                                Text="{x:Bind ViewModel.PlayCountText, Mode=OneWay}"
                                ToolTipService.ToolTip="{loc:Locale Name=View}"
                                Visibility="{x:Bind ViewModel.PlayCountText, Mode=OneWay, Converter={StaticResource ObjectToVisibilityConverter}}" />
                            <controls:IconTextBlock
                                Margin="0,0,12,0"
                                Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                Symbol="SlideText16"
                                Text="{x:Bind ViewModel.DanmakuCountText, Mode=OneWay}"
                                ToolTipService.ToolTip="{loc:Locale Name=Danmaku}"
                                Visibility="{x:Bind ViewModel.DanmakuCountText, Mode=OneWay, Converter={StaticResource ObjectToVisibilityConverter}}" />
                            <controls:IconTextBlock
                                Margin="0,0,12,0"
                                Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                Symbol="Chat16"
                                Text="{x:Bind ViewModel.CommentCountText, Mode=OneWay}"
                                ToolTipService.ToolTip="{loc:Locale Name=Reply}"
                                Visibility="{x:Bind ViewModel.CommentCountText, Mode=OneWay, Converter={StaticResource ObjectToVisibilityConverter}}" />
                            <controls:IconTextBlock
                                Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                Symbol="EyeShow16"
                                Text="{x:Bind ViewModel.WatchingCountText, Mode=OneWay}"
                                ToolTipService.ToolTip="{loc:Locale Name=Viewer}"
                                Visibility="{x:Bind ViewModel.WatchingCountText, Mode=OneWay, Converter={StaticResource ObjectToVisibilityConverter}}" />
                        </StackPanel>
                        <muxc:ItemsRepeater ItemsSource="{x:Bind ViewModel.Tags}" Visibility="{x:Bind ViewModel.IsShowTags, Mode=OneWay}">
                            <muxc:ItemsRepeater.Layout>
                                <muxc:FlowLayout
                                    LineAlignment="Start"
                                    MinColumnSpacing="8"
                                    MinRowSpacing="8"
                                    Orientation="Horizontal" />
                            </muxc:ItemsRepeater.Layout>
                            <muxc:ItemsRepeater.ItemTemplate>
                                <DataTemplate x:DataType="community:Tag">
                                    <Button
                                        AutomationProperties.Name="{x:Bind Name}"
                                        Padding="6,4"
                                        Background="Transparent"
                                        Click="OnTagButtonClickAsync"
                                        Content="{x:Bind Name}"
                                        DataContext="{x:Bind}"
                                        FontSize="11" />
                                </DataTemplate>
                            </muxc:ItemsRepeater.ItemTemplate>
                        </muxc:ItemsRepeater>
                        <controls:TrimTextBlock
                            x:Name="DescriptionBlock"
                            MaxWidth="600"
                            HorizontalAlignment="Left"
                            FontSize="13"
                            Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                            MaxLines="3"
                            Text="{x:Bind ViewModel.View.Information.Description, Mode=OneWay}" />
                    </StackPanel>
                </Grid>
            </player:PlayerPagePanel.Descriptor>
            <player:PlayerPagePanel.Dashboard>
                <Grid RowSpacing="20">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>
                    <StackPanel Orientation="Horizontal" Spacing="12">
                        <controls:ProgressButton
                            x:Name="LikeButton"
                            Click="OnLikeButtonClick"
                            Description="{x:Bind ViewModel.LikeCountText, Mode=OneWay}"
                            HoldingCompleted="OnLikeButtonHoldingCompleted"
                            HoldingSuspend="OnLikeButtonHoldingSuspend"
                            IsChecked="{x:Bind ViewModel.IsLiked, Mode=OneWay}"
                            IsEnabled="{x:Bind ViewModel.IsSignedIn, Mode=OneWay}"
                            IsHoldingEnabled="{x:Bind ViewModel.IsSignedIn, Mode=OneWay}"
                            ToolTipService.ToolTip="{loc:Locale Name=Like}">
                            <icons:RegularFluentIcon Symbol="ThumbLike16" />
                        </controls:ProgressButton>
                        <controls:ProgressButton
                            x:Name="CoinButton"
                            Click="OnCoinButtonClick"
                            Description="{x:Bind ViewModel.CoinCountText, Mode=OneWay}"
                            IsChecked="{x:Bind ViewModel.IsCoined, Mode=OneWay}"
                            IsEnabled="{x:Bind ViewModel.IsSignedIn, Mode=OneWay}"
                            IsHoldingEnabled="False"
                            ToolTipService.ToolTip="{loc:Locale Name=Coin}">
                            <icons:RegularFluentIcon Symbol="Blur16" />
                        </controls:ProgressButton>
                        <controls:ProgressButton
                            x:Name="FavoriteButton"
                            Click="OnFavoriteButtonClick"
                            Description="{x:Bind ViewModel.FavoriteCountText, Mode=OneWay}"
                            IsChecked="{x:Bind ViewModel.IsFavorited, Mode=OneWay}"
                            IsEnabled="{x:Bind ViewModel.IsSignedIn, Mode=OneWay}"
                            IsHoldingEnabled="False"
                            ToolTipService.ToolTip="{loc:Locale Name=Favorite}">
                            <icons:RegularFluentIcon Symbol="Star16" />
                        </controls:ProgressButton>
                    </StackPanel>
                    <StackPanel Grid.Row="1">
                        <RelativePanel Margin="0,0,0,8">
                            <TextBlock
                                Style="{StaticResource CaptionTextBlockStyle}"
                                RelativePanel.AlignLeftWithPanel="True"
                                RelativePanel.AlignVerticalCenterWithPanel="True"
                                VerticalAlignment="Center"
                                Text="{loc:Locale Name=InfinityLoop}" />
                            <ToggleSwitch
                                RelativePanel.AlignRightWithPanel="True"
                                RelativePanel.AlignVerticalCenterWithPanel="True"
                                MinWidth="0"
                                MinHeight="0"
                                FontSize="12"
                                IsOn="{x:Bind ViewModel.MediaPlayerViewModel.IsLoop, Mode=TwoWay}" />
                        </RelativePanel>

                        <Grid Margin="0,0,0,8" ColumnSpacing="8">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition />
                                <ColumnDefinition />
                            </Grid.ColumnDefinitions>
                            <Button
                                x:Name="ShareButton"
                                HorizontalAlignment="Stretch"
                                Command="{x:Bind ViewModel.ShareCommand}">
                                <controls:IconTextBlock
                                    Foreground="{ThemeResource TextFillColorPrimaryBrush}"
                                    Symbol="Share16"
                                    Text="{loc:Locale Name=Share}" />
                            </Button>
                            <Button
                                Grid.Column="1"
                                Padding="8"
                                HorizontalAlignment="Stretch"
                                Command="{x:Bind ViewModel.FixedCommand}"
                                Content="{x:Bind ViewModel.IsVideoFixed, Mode=OneWay, Converter={StaticResource FixedContentConverter}}" />
                        </Grid>

                        <Button
                            x:Name="CreateDownloadCommandButton"
                            MinWidth="120"
                            Margin="0,0,0,8"
                            HorizontalAlignment="Stretch">
                            <controls:IconTextBlock
                                Foreground="{ThemeResource TextFillColorPrimaryBrush}"
                                Symbol="ArrowDownload16"
                                Text="{loc:Locale Name=Download}" />
                            <Button.Flyout>
                                <Flyout>
                                    <player:DownloadOptionsPanel ViewModel="{x:Bind ViewModel.DownloadViewModel}" />
                                </Flyout>
                            </Button.Flyout>
                        </Button>

                        <StackPanel Orientation="Horizontal" Spacing="8">
                            <TextBlock
                                Style="{StaticResource CaptionTextBlockStyle}"
                                Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                Text="AV" />
                            <TextBlock
                                Style="{StaticResource CaptionTextBlockStyle}"
                                IsTextSelectionEnabled="True"
                                Text="{x:Bind ViewModel.View.Information.Identifier.Id, Mode=OneWay}" />
                        </StackPanel>
                        <StackPanel Orientation="Horizontal" Spacing="8">
                            <TextBlock
                                Style="{StaticResource CaptionTextBlockStyle}"
                                Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                Text="BV" />
                            <TextBlock
                                Style="{StaticResource CaptionTextBlockStyle}"
                                IsTextSelectionEnabled="True"
                                Text="{x:Bind ViewModel.View.Information.AlternateId, Mode=OneWay}" />
                        </StackPanel>
                    </StackPanel>
                </Grid>
            </player:PlayerPagePanel.Dashboard>
            <player:PlayerPagePanel.SectionContent>
                <Grid>
                    <player:VideoPartView
                        x:Name="VideoPartView"
                        ViewModel="{x:Bind ViewModel, Mode=OneWay}"
                        Visibility="{x:Bind ViewModel.IsShowParts, Mode=OneWay}" />
                    <player:VideoPlaylistView
                        x:Name="VideoPlaylistView"
                        ViewModel="{x:Bind ViewModel, Mode=OneWay}"
                        Visibility="{x:Bind ViewModel.IsShowVideoPlaylist, Mode=OneWay}" />
                    <player:UgcSeasonView
                        x:Name="UgcEpisodeView"
                        ViewModel="{x:Bind ViewModel, Mode=OneWay}"
                        Visibility="{x:Bind ViewModel.IsShowUgcSeason, Mode=OneWay}" />
                    <player:RelatedVideoView
                        x:Name="RelatedVideoView"
                        ViewModel="{x:Bind ViewModel, Mode=OneWay}"
                        Visibility="{x:Bind ViewModel.IsShowRelatedVideos, Mode=OneWay}" />
                    <player:PlayerCommentView x:Name="CommentView" Visibility="{x:Bind ViewModel.IsShowComments, Mode=OneWay}" />
                </Grid>
            </player:PlayerPagePanel.SectionContent>
        </player:PlayerPagePanel>

        <controls:ErrorPanel
            x:Name="ErrorPanel"
            ActionContent="{loc:Locale Name=Refresh}"
            Text="{x:Bind ViewModel.ErrorText, Mode=OneWay}"
            Visibility="{x:Bind ViewModel.IsError, Mode=OneWay}">
            <interactivity:Interaction.Behaviors>
                <behaviors:ReloadBehavior />
            </interactivity:Interaction.Behaviors>
        </controls:ErrorPanel>
        <controls:OverlayLoadingPanel IsBarActive="False" IsRingActive="{x:Bind ViewModel.IsReloading, Mode=OneWay}" />
    </Grid>
</base:VideoPlayerPageBase>
