<?xml version="1.0" encoding="utf-8" ?>
<Window
    x:Class="BetterLyrics.WinUI3.Views.LyricsWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:behaviors="using:CommunityToolkit.WinUI.Behaviors"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
    xmlns:local="using:BetterLyrics.WinUI3.Views"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:media="using:CommunityToolkit.WinUI.Media"
    xmlns:scontrols="using:ShadowViewer.Controls"
    xmlns:ui="using:CommunityToolkit.WinUI"
    mc:Ignorable="d">

    <Grid
        x:Name="RootGrid"
        PointerEntered="RootGrid_PointerEntered"
        PointerExited="RootGrid_PointerExited"
        RequestedTheme="{x:Bind ViewModel.ThemeType, Mode=OneWay}"
        SizeChanged="RootGrid_SizeChanged">

        <local:LyricsPage />

        <!--  Top command  -->
        <Grid
            x:Name="TopCommandGrid"
            Margin="6"
            VerticalAlignment="Top"
            Background="Transparent"
            Opacity="{x:Bind ViewModel.TopCommandGridOpacity, Mode=OneWay}"
            PointerEntered="TopCommandGrid_PointerEntered"
            PointerExited="TopCommandGrid_PointerExited">
            <Grid.OpacityTransition>
                <ScalarTransition />
            </Grid.OpacityTransition>

            <Grid Padding="3" HorizontalAlignment="Left">
                <StackPanel
                    x:Name="TopLeftCommandStackPanel"
                    HorizontalAlignment="Left"
                    Orientation="Horizontal"
                    Spacing="3">
                    <StackPanel.OpacityTransition>
                        <ScalarTransition />
                    </StackPanel.OpacityTransition>

                    <!--  Look  -->
                    <Button
                        x:Name="ClickThroughButton"
                        Click="ClickThroughButton_Click"
                        Style="{StaticResource TitleBarButtonStyle}"
                        Visibility="{x:Bind ViewModel.LockButtonVisibility, Mode=OneWay}">
                        <FontIcon
                            FontFamily="{StaticResource IconFontFamily}"
                            FontSize="{x:Bind ViewModel.TitleBarFontSize, Mode=OneWay}"
                            Glyph="&#xE72E;" />
                        <ToolTipService.ToolTip>
                            <ToolTip x:Name="LockToolTip">
                                <ToolTip.Content>
                                    <StackPanel Orientation="Horizontal">
                                        <TextBlock x:Uid="HostWindowLockToolTip" />
                                    </StackPanel>
                                </ToolTip.Content>
                            </ToolTip>
                        </ToolTipService.ToolTip>
                    </Button>
                    <!--  More  -->
                    <Button x:Name="MoreButton" Style="{StaticResource TitleBarButtonStyle}">
                        <FontIcon
                            FontFamily="{StaticResource IconFontFamily}"
                            FontSize="{x:Bind ViewModel.TitleBarFontSize, Mode=OneWay}"
                            Glyph="&#xE700;" />
                        <ToolTipService.ToolTip>
                            <ToolTip x:Name="MoreButtonToolTip" x:Uid="HostWindowMoreButtonToolTip" />
                        </ToolTipService.ToolTip>
                        <Button.Flyout>
                            <MenuFlyout>
                                <ToggleMenuFlyoutItem
                                    x:Name="AOTFlyoutItem"
                                    x:Uid="BaseWindowAOTFlyoutItem"
                                    Click="AOTFlyoutItem_Click"
                                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                                       Glyph=&#xE718;}"
                                    IsChecked="{x:Bind ViewModel.IsAOTFlyoutItemChecked, Mode=OneWay}"
                                    Visibility="{x:Bind ViewModel.AOTFlyoutItemVisibility, Mode=OneWay}" />
                                <ToggleMenuFlyoutItem
                                    x:Name="FullScreenFlyoutItem"
                                    x:Uid="BaseWindowFullScreenFlyoutItem"
                                    Click="FullScreenFlyoutItem_Click"
                                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                                       Glyph=&#xE740;}"
                                    IsChecked="{x:Bind ViewModel.IsFullScreenFlyoutItemChecked, Mode=OneWay}"
                                    Visibility="{x:Bind ViewModel.FullScreenFlyoutItemVisibility, Mode=OneWay}" />
                                <MenuFlyoutSeparator />
                                <ToggleMenuFlyoutItem
                                    x:Name="DockFlyoutItem"
                                    x:Uid="HostWindowDockFlyoutItem"
                                    Click="DockFlyoutItem_Click"
                                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                                       Glyph=&#xE7B5;}"
                                    IsChecked="{x:Bind ViewModel.IsDockFlyoutItemChecked, Mode=OneWay}"
                                    Visibility="{x:Bind ViewModel.DockFlyoutItemVisibility, Mode=OneWay}" />
                                <ToggleMenuFlyoutItem
                                    x:Name="DesktopFlyoutItem"
                                    x:Uid="HostWindowDesktopFlyoutItem"
                                    Click="DesktopFlyoutItem_Click"
                                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                                       Glyph=&#xE75A;}"
                                    IsChecked="{x:Bind ViewModel.IsDesktopFlyoutItemChecked, Mode=OneWay}"
                                    Visibility="{x:Bind ViewModel.DesktopFlyoutItemVisibility, Mode=OneWay}" />
                                <ToggleMenuFlyoutItem
                                    x:Name="PIPFlyoutItem"
                                    x:Uid="BaseWindowMiniFlyoutItem"
                                    Click="PIPFlyoutItem_Click"
                                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                                       Glyph=&#xEE49;}"
                                    IsChecked="{x:Bind ViewModel.IsPIPFlyoutItemChecked, Mode=OneWay}"
                                    Visibility="{x:Bind ViewModel.PIPFlyoutItemVisibility, Mode=OneWay}" />
                                <MenuFlyoutSeparator />
                                <MenuFlyoutItem
                                    x:Name="MusicGalleryFlyoutItem"
                                    x:Uid="SystemTrayMusicGallery"
                                    Click="MusicGalleryMenuFlyoutItem_Click"
                                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                                       Glyph=&#xEA69;}" />
                                <MenuFlyoutItem
                                    x:Name="SettingsFlyoutItem"
                                    x:Uid="SystemTraySettings"
                                    Click="SettingsMenuFlyoutItem_Click"
                                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                                       Glyph=&#xE713;}" />
                                <MenuFlyoutSeparator />
                                <MenuFlyoutItem
                                    x:Uid="SystemTrayExit"
                                    Click="ExitAppMenuFlyoutItem_Click"
                                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                                       Glyph=&#xE7E8;}" />
                            </MenuFlyout>
                        </Button.Flyout>
                    </Button>
                    <!--  Immersive mode  -->
                    <ToggleButton
                        x:Name="ImmersiveButton"
                        Command="{x:Bind ViewModel.ImmersiveToggleButtonEnabledChangedCommand}"
                        IsChecked="{x:Bind ViewModel.IsImmersiveMode, Mode=TwoWay}"
                        Style="{StaticResource TitleBarToggleButtonStyle}">
                        <ToolTipService.ToolTip>
                            <ToolTip x:Uid="LyricsWindowImmersiveButtonToolTip" />
                        </ToolTipService.ToolTip>
                        <FontIcon
                            FontFamily="{StaticResource IconFontFamily}"
                            FontSize="{x:Bind ViewModel.TitleBarFontSize}"
                            Glyph="&#xED1A;" />
                    </ToggleButton>
                </StackPanel>
            </Grid>

            <Grid Padding="3" HorizontalAlignment="Right">
                <StackPanel
                    x:Name="TopRightCommandStackPanel"
                    Orientation="Horizontal"
                    Spacing="3">
                    <StackPanel.OpacityTransition>
                        <ScalarTransition />
                    </StackPanel.OpacityTransition>
                </StackPanel>
            </Grid>

        </Grid>

        <scontrols:NotificationPanel
            x:Name="TipContainerCenter"
            Margin="0,0,0,52"
            HorizontalAlignment="Center"
            VerticalAlignment="Bottom"
            Canvas.ZIndex="1"
            FlowDirection="RightToLeft"
            Loaded="TipContainerCenter_Loaded"
            Orientation="Vertical"
            Visibility="Collapsed" />

    </Grid>
</Window>
