<?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"
            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>

                    <!--  Music gallery  -->
                    <Button Click="MusicGalleryButton_Click" Style="{StaticResource TitleBarButtonStyle}">
                        <FontIcon
                            FontFamily="{StaticResource IconFontFamily}"
                            FontSize="{x:Bind ViewModel.TitleBarFontSize}"
                            Glyph="&#xE8A9;" />
                    </Button>
                    <!--  Immersive mode  -->
                    <ToggleButton
                        x:Name="ImmersiveButton"
                        Command="{x:Bind ViewModel.ImmersiveToggleButtonEnabledChangedCommand}"
                        IsChecked="{x:Bind ViewModel.IsImmersiveMode, Mode=TwoWay}"
                        Style="{StaticResource TitleBarToggleButtonStyle}">
                        <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>

                    <!--  Look  -->
                    <Button
                        x:Name="ClickThroughButton"
                        Click="ClickThroughButton_Click"
                        Style="{StaticResource TitleBarButtonStyle}">
                        <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" />
                                        <TextBlock
                                            Margin="6,0"
                                            VerticalAlignment="Center"
                                            Opacity="0.7"
                                            Text="Ctrl + Alt + " />
                                        <TextBlock
                                            VerticalAlignment="Center"
                                            Opacity="0.7"
                                            Text="{x:Bind ViewModel.LockHotKey, Mode=OneWay}" />
                                    </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" />
                                <ToggleMenuFlyoutItem
                                    x:Name="FullScreenFlyoutItem"
                                    x:Uid="BaseWindowFullScreenFlyoutItem"
                                    Click="FullScreenFlyoutItem_Click" />
                                <ToggleMenuFlyoutItem
                                    x:Name="DockFlyoutItem"
                                    x:Uid="HostWindowDockFlyoutItem"
                                    Click="DockFlyoutItem_Click"
                                    IsChecked="{x:Bind ViewModel.IsDockMode, Mode=OneWay}" />
                                <ToggleMenuFlyoutItem
                                    x:Name="DesktopFlyoutItem"
                                    x:Uid="HostWindowDesktopFlyoutItem"
                                    Click="DesktopFlyoutItem_Click"
                                    IsChecked="{x:Bind ViewModel.IsDesktopMode, Mode=OneWay}" />
                                <ToggleMenuFlyoutItem
                                    x:Name="MiniFlyoutItem"
                                    x:Uid="BaseWindowMiniFlyoutItem"
                                    Click="MiniFlyoutItem_Click" />
                                <MenuFlyoutItem
                                    x:Name="SettingsFlyoutItem"
                                    x:Uid="HostWindowSettingsFlyoutItem"
                                    Click="SettingsMenuFlyoutItem_Click" />
                            </MenuFlyout>
                        </Button.Flyout>
                    </Button>

                    <!--  Window Minimise  -->
                    <Button
                        x:Name="MinimiseButton"
                        Click="MinimiseButton_Click"
                        Style="{StaticResource TitleBarButtonStyle}">
                        <FontIcon
                            FontFamily="{StaticResource IconFontFamily}"
                            FontSize="{x:Bind ViewModel.TitleBarFontSize, Mode=OneWay}"
                            Glyph="&#xE654;" />
                    </Button>
                    <!--  Window Maximise  -->
                    <Button
                        x:Name="MaximiseButton"
                        Click="MaximiseButton_Click"
                        Style="{StaticResource TitleBarButtonStyle}">
                        <FontIcon
                            FontFamily="{StaticResource IconFontFamily}"
                            FontSize="{x:Bind ViewModel.TitleBarFontSize, Mode=OneWay}"
                            Glyph="&#xE655;" />
                    </Button>
                    <!--  Window Restore  -->
                    <Button
                        x:Name="RestoreButton"
                        Click="RestoreButton_Click"
                        Style="{StaticResource TitleBarButtonStyle}"
                        Visibility="Collapsed">
                        <FontIcon
                            FontFamily="{StaticResource IconFontFamily}"
                            FontSize="{x:Bind ViewModel.TitleBarFontSize, Mode=OneWay}"
                            Glyph="&#xE656;" />
                    </Button>
                    <!--  Window Close  -->
                    <Button
                        x:Name="CloseButton"
                        Click="CloseButton_Click"
                        Style="{StaticResource TitleBarButtonStyle}">
                        <FontIcon
                            FontFamily="{StaticResource IconFontFamily}"
                            FontSize="{x:Bind ViewModel.TitleBarFontSize, Mode=OneWay}"
                            Glyph="&#xE653;" />
                    </Button>
                </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>
