BetterLyrics/BetterLyrics.WinUI3/BetterLyrics.WinUI3/Views/SettingsPage.xaml

<?xml version="1.0" encoding="utf-8" ?>
<Page
    x:Class="BetterLyrics.WinUI3.Views.SettingsPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:const="using:BetterLyrics.WinUI3.Constants"
    xmlns:controls="using:CommunityToolkit.WinUI.Controls"
    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:models="using:BetterLyrics.WinUI3.Models"
    xmlns:scontrols="using:ShadowViewer.Controls"
    xmlns:uc="using:BetterLyrics.WinUI3.Controls"
    xmlns:ui="using:CommunityToolkit.WinUI"
    xmlns:vm="using:BetterLyrics.WinUI3.ViewModels"
    mc:Ignorable="d">

    <Grid x:Name="RootGrid">

        <NavigationView
            x:Name="NavView"
            IsBackButtonVisible="Collapsed"
            IsSettingsVisible="False"
            SelectionChanged="NavView_SelectionChanged">
            <NavigationView.MenuItems>

                <NavigationViewItem
                    x:Uid="SettingsPageApp"
                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                       Glyph=&#xECAA;}"
                    IsSelected="True"
                    Tag="App" />

                <NavigationViewItem
                    x:Uid="SettingsPageAlbumStyle"
                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                       Glyph=&#xE93C;}"
                    Tag="AlbumArtStyle" />

                <NavigationViewItem
                    x:Uid="SettingsPageMediaLib"
                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                       Glyph=&#xE8B7;}"
                    Tag="MediaLib" />

                <NavigationViewItem
                    x:Uid="SettingsPagePlaybackLib"
                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                       Glyph=&#xEA69;}"
                    Tag="PlaybackLib" />

                <NavigationViewItem
                    x:Uid="SettingsPageBackgroundOverlay"
                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                       Glyph=&#xF5EF;}"
                    Tag="Background" />

                <NavigationViewItem
                    x:Uid="SettingsPageLyrics"
                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                       Glyph=&#xEDC6;}"
                    Tag="Lyrics" />

                <NavigationViewItem
                    x:Uid="SettingsPageAbout"
                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                       Glyph=&#xE946;}"
                    Tag="About" />

                <NavigationViewItem
                    x:Uid="SettingsPageDev"
                    Icon="{ui:FontIcon FontFamily={StaticResource IconFontFamily},
                                       Glyph=&#xEC7A;}"
                    Tag="Dev" />

            </NavigationView.MenuItems>

            <controls:SwitchPresenter Value="{x:Bind ViewModel.NavViewSelectedItemTag, Mode=OneWay}">
                <controls:SwitchPresenter.ContentTransitions>
                    <TransitionCollection>
                        <PopupThemeTransition />
                    </TransitionCollection>
                </controls:SwitchPresenter.ContentTransitions>

                <!--  App appearance and behavior  -->
                <controls:Case Value="App">
                    <uc:AppSettingsControl />
                </controls:Case>

                <!--  Lyrics background  -->
                <controls:Case Value="Background">
                    <uc:LyricsBackgroundSettingsControl />
                </controls:Case>

                <!--  Album art area style  -->
                <controls:Case Value="AlbumArtStyle">
                    <uc:AlbumArtLayoutSettingsControl />
                </controls:Case>

                <!--  Playback sources  -->
                <controls:Case Value="PlaybackLib">
                    <uc:PlaybackSettingsControl />
                </controls:Case>

                <!--  Media lib  -->
                <controls:Case Value="MediaLib">
                    <uc:MediaSettingsControl />
                </controls:Case>

                <!--  Lyrics style and effect  -->
                <controls:Case Value="Lyrics">
                    <uc:AllLyricsSettingsControl />
                </controls:Case>

                <!--  About  -->
                <controls:Case Value="About">
                    <ScrollViewer Style="{StaticResource SettingsScrollViewerStyle}">
                        <Grid Style="{StaticResource SettingsGridStyle}">
                            <StackPanel Spacing="{StaticResource SettingsCardSpacing}">

                                <TextBlock Style="{StaticResource SettingsSectionHeaderTextBlockStyle}" />

                                <controls:SettingsExpander
                                    Header="BetterLyrics"
                                    HeaderIcon="{ui:BitmapIcon Source=ms-appx:///Assets/Logo.png}"
                                    IsExpanded="True">
                                    <controls:SettingsExpander.Description>
                                        <HyperlinkButton Content="by Zhe Fang" NavigateUri="https://github.com/jayfunc" />
                                    </controls:SettingsExpander.Description>
                                    <RichTextBlock Foreground="{ThemeResource TextFillColorSecondaryBrush}">
                                        <Paragraph>
                                            <Run x:Uid="SettingsPageVersion" />
                                            <Run Text="{x:Bind ViewModel.Version, Mode=OneWay}" />
                                        </Paragraph>
                                    </RichTextBlock>
                                    <controls:SettingsExpander.Items>

                                        <controls:SettingsCard HorizontalContentAlignment="Left" ContentAlignment="Left">
                                            <StackPanel Margin="-12,0,0,0" Orientation="Horizontal">
                                                <HyperlinkButton Content="GitHub" NavigateUri="{x:Bind const:Link.GitHubUrl}" />
                                                <HyperlinkButton x:Uid="SettingsPageFAQ" NavigateUri="{x:Bind const:Link.FAQUrl}" />
                                            </StackPanel>
                                        </controls:SettingsCard>

                                        <controls:SettingsCard HorizontalContentAlignment="Left" ContentAlignment="Left">
                                            <StackPanel Spacing="6">
                                                <TextBlock x:Uid="SetingsPageFeedback" />
                                                <StackPanel Margin="-12,0,0,0" Orientation="Horizontal">
                                                    <HyperlinkButton x:Uid="SettingsPageQQGroup" NavigateUri="{x:Bind const:Link.QQGroupUrl}" />
                                                    <HyperlinkButton x:Uid="SettingsPageDiscord" NavigateUri="{x:Bind const:Link.DiscordUrl}" />
                                                    <HyperlinkButton x:Uid="SettingsPageTelegram" NavigateUri="{x:Bind const:Link.TelegramUrl}" />
                                                </StackPanel>
                                            </StackPanel>
                                        </controls:SettingsCard>

                                        <controls:SettingsCard HorizontalContentAlignment="Left" ContentAlignment="Left">
                                            <StackPanel Spacing="6">
                                                <TextBlock x:Uid="SetingsPageDonation" />
                                                <StackPanel Margin="-12,0,0,0" Orientation="Horizontal">
                                                    <HyperlinkButton Content="Buy Me a Coffee" NavigateUri="https://buymeacoffee.com/founchoo" />
                                                    <HyperlinkButton Content="PayPal" NavigateUri="https://paypal.me/zhefangpay" />
                                                    <Button
                                                        Content="支付宝"
                                                        Foreground="{ThemeResource AccentTextFillColorPrimaryBrush}"
                                                        Style="{StaticResource GhostButtonStyle}">
                                                        <Button.Flyout>
                                                            <Flyout>
                                                                <Flyout.FlyoutPresenterStyle>
                                                                    <Style TargetType="FlyoutPresenter">
                                                                        <Setter Property="CornerRadius" Value="12" />
                                                                        <Setter Property="Padding" Value="0" />
                                                                    </Style>
                                                                </Flyout.FlyoutPresenterStyle>
                                                                <Image Height="300" Source="/Assets/Alipay.jpg" />
                                                            </Flyout>
                                                        </Button.Flyout>
                                                    </Button>
                                                    <Button
                                                        Content="微信"
                                                        Foreground="{ThemeResource AccentTextFillColorPrimaryBrush}"
                                                        Style="{StaticResource GhostButtonStyle}">
                                                        <Button.Flyout>
                                                            <Flyout>
                                                                <Flyout.FlyoutPresenterStyle>
                                                                    <Style TargetType="FlyoutPresenter">
                                                                        <Setter Property="CornerRadius" Value="12" />
                                                                        <Setter Property="Padding" Value="0" />
                                                                    </Style>
                                                                </Flyout.FlyoutPresenterStyle>
                                                                <Image Height="300" Source="/Assets/WeChatReward.png" />
                                                            </Flyout>
                                                        </Button.Flyout>
                                                    </Button>
                                                </StackPanel>
                                                <StackPanel Orientation="Horizontal" Spacing="6">
                                                    <TextBlock Foreground="{ThemeResource TextFillColorSecondaryBrush}" Text="*" />
                                                    <TextBlock
                                                        x:Uid="SetingsPageThanks"
                                                        Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                                        TextWrapping="Wrap" />
                                                </StackPanel>
                                            </StackPanel>
                                        </controls:SettingsCard>

                                    </controls:SettingsExpander.Items>
                                    <controls:SettingsExpander.ItemsHeader>
                                        <InfoBar
                                            BorderThickness="0"
                                            CornerRadius="0"
                                            IsClosable="False"
                                            IsOpen="True"
                                            Severity="Warning">
                                            <TextBlock
                                                x:Uid="SettingsPageDisclaimer"
                                                Margin="12"
                                                Foreground="{ThemeResource SystemFillColorCautionBrush}"
                                                TextWrapping="Wrap" />
                                        </InfoBar>
                                    </controls:SettingsExpander.ItemsHeader>
                                </controls:SettingsExpander>

                                <TextBlock x:Uid="SetingsPageRef" Style="{StaticResource SettingsSectionHeaderTextBlockStyle}" />

                                <ListView
                                    Padding="0,6"
                                    Background="{ThemeResource CardBackgroundFillColorDefault}"
                                    CornerRadius="4"
                                    ItemsSource="{x:Bind ViewModel.Libs, Mode=OneWay}"
                                    SelectionMode="None">
                                    <ListView.ItemTemplate>
                                        <DataTemplate>
                                            <RelativePanel Padding="42,0">
                                                <HyperlinkButton
                                                    Margin="-12,0,0,0"
                                                    Content="{Binding Name}"
                                                    NavigateUri="{Binding Url}"
                                                    RelativePanel.AlignLeftWithPanel="True"
                                                    RelativePanel.AlignVerticalCenterWithPanel="True" />
                                                <TextBlock
                                                    RelativePanel.AlignRightWithPanel="True"
                                                    RelativePanel.AlignVerticalCenterWithPanel="True"
                                                    Text="{Binding Version}" />
                                            </RelativePanel>
                                        </DataTemplate>
                                    </ListView.ItemTemplate>
                                </ListView>

                            </StackPanel>
                        </Grid>
                    </ScrollViewer>
                </controls:Case>

                <!--  Dev  -->
                <controls:Case Value="Dev">
                    <ScrollViewer Style="{StaticResource SettingsScrollViewerStyle}">
                        <Grid Style="{StaticResource SettingsGridStyle}">
                            <StackPanel Spacing="{StaticResource SettingsCardSpacing}">

                                <TextBlock Style="{StaticResource SettingsSectionHeaderTextBlockStyle}" />

                                <controls:SettingsCard x:Uid="SettingsPageMockMusicPlaying">
                                    <HyperlinkButton x:Uid="SettingsPagePlayingMockMusicButton" NavigateUri="https://soundcloud.com/carlyraejepsen/cut-to-the-feeling" />
                                </controls:SettingsCard>

                                <controls:SettingsCard x:Uid="SettingsPageCache">
                                    <Button x:Uid="SettingsPageOpenLogFolderButton" Command="{x:Bind ViewModel.OpenCacheFolderCommand}" />
                                </controls:SettingsCard>

                                <controls:SettingsExpander x:Uid="SettingsPageSettingsManager" IsExpanded="True">
                                    <StackPanel Orientation="Horizontal" Spacing="6">
                                        <Button x:Uid="SettingsPageImportSettingsButton" Command="{x:Bind ViewModel.ImportSettingsCommand}" />
                                        <Button x:Uid="SettingsPageExportSettingsButton" Command="{x:Bind ViewModel.ExportSettingsCommand}" />
                                    </StackPanel>
                                    <controls:SettingsExpander.ItemsHeader>
                                        <InfoBar
                                            x:Uid="SettingsPageImportSettingsInfo"
                                            BorderThickness="0"
                                            CornerRadius="0"
                                            IsClosable="False"
                                            IsOpen="True"
                                            Severity="Warning" />
                                    </controls:SettingsExpander.ItemsHeader>
                                </controls:SettingsExpander>

                                <controls:SettingsCard x:Uid="SettingsPageDebugOverlay">
                                    <ToggleSwitch IsOn="{x:Bind ViewModel.IsDebugOverlayEnabled, Mode=TwoWay}" />
                                </controls:SettingsCard>

                                <controls:SettingsCard x:Uid="SettingsPageFixedTimeStep" Visibility="Collapsed">
                                    <ToggleSwitch IsOn="{x:Bind ViewModel.AppSettings.AdvancedSettings.IsFixedTimeStep, Mode=TwoWay}" />
                                </controls:SettingsCard>

                                <controls:SettingsCard x:Uid="SettingsPageFPS" Visibility="Collapsed">
                                    <uc:ExtendedSlider
                                        Default="60"
                                        Frequency="10"
                                        Maximum="240"
                                        Minimum="30"
                                        Value="{x:Bind ViewModel.AppSettings.AdvancedSettings.FPS, Mode=TwoWay}" />
                                </controls:SettingsCard>

                            </StackPanel>
                        </Grid>
                    </ScrollViewer>
                </controls:Case>

            </controls:SwitchPresenter>
        </NavigationView>

    </Grid>
</Page>