<Page x:Class="ModernFlyouts.Navigation.LayoutPage"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:local="clr-namespace:ModernFlyouts" xmlns:ui="http://schemas.modernwpf.com/2019"
      xmlns:toolkitControls="http://schemas.modernwpf.com/toolkit/controls"
      xmlns:toolkit="http://schemas.modernwpf.com/toolkit"
      xmlns:controls="clr-namespace:ModernFlyouts.Controls"
      xmlns:media="clr-namespace:ModernFlyouts.UI.Media"
      xmlns:utils="clr-namespace:ModernFlyouts.Utilities"
      xmlns:resx="clr-namespace:ModernFlyouts.Properties"
      xmlns:coreui="clr-namespace:ModernFlyouts.Core.UI;assembly=ModernFlyouts.Core"
      mc:Ignorable="d"
      d:DesignWidth="800" DataContext="{x:Static local:FlyoutHandler.Instance}">
    <controls:ScrollViewerEx VerticalScrollBarVisibility="Auto">
        <StackPanel Margin="20,10">
            <GroupBox Header="{x:Static resx:Strings.Settings_Display}">
                <ui:SimpleStackPanel Spacing="5">
                    <TextBlock Text="{x:Static resx:Strings.Settings_DisplayDescription}"/>
                    <controls:DisplayMonitorPicker
                        PreferredDisplayMonitor="{Binding OnScreenFlyoutPreferredMonitor, Mode=TwoWay}" />
                </ui:SimpleStackPanel>
            </GroupBox>

            <GroupBox Header="{x:Static resx:Strings.Settings_FlyoutPlacement}">
                <ui:SimpleStackPanel Spacing="10">
                    <ui:RadioButtons x:Name="PlacementModeSelector"
                        Header="{x:Static resx:Strings.Settings_FlyoutPlacementMode}"
                        ItemTemplate="{StaticResource LocalizedEnumItemTemplate}"
                        ItemsSource="{toolkit:EnumValues Type=coreui:FlyoutWindowPlacementMode}"
                        SelectedItem="{Binding UIManager.OnScreenFlyoutWindowPlacementMode}" />
                    <ui:SimpleStackPanel
                        Spacing="10"
                        Visibility="{Binding ElementName=PlacementModeSelector, Path=SelectedIndex,
                            Converter={StaticResource IndexToVisibilityConverter}, ConverterParameter=0}">
                        <controls:FlyoutAlignmentPicker Alignment="{Binding UIManager.OnScreenFlyoutWindowAlignment}" />
                        <!--<TextBox ui:ControlHelper.Header="Margin" />-->
                    </ui:SimpleStackPanel>
                    <ui:SimpleStackPanel
                        Spacing="10"
                        Visibility="{Binding ElementName=PlacementModeSelector, Path=SelectedIndex,
                            Converter={StaticResource IndexToVisibilityConverter}, ConverterParameter=1}">
                        <ui:SimpleStackPanel Spacing="5">
                            <TextBlock Text="{x:Static resx:Strings.Settings_FlyoutDefaultPosition}" />
                            <toolkitControls:SimpleWrapPanel
                                Orientation="Horizontal"
                                HorizontalSpacing="10"
                                VerticalSpacing="10">
                                <ui:SimpleStackPanel Orientation="Horizontal" Spacing="5">
                                    <TextBlock Text="X:" VerticalAlignment="Center" />
                                    <ui:NumberBox
                                        Width="240"
                                        SpinButtonPlacementMode="Inline"
                                        Maximum="{x:Static media:BindablePoint.MaxXValue}"
                                        Value="{Binding DefaultFlyoutPosition.X}" />
                                </ui:SimpleStackPanel>
                                <ui:SimpleStackPanel Orientation="Horizontal" Spacing="5">
                                    <TextBlock Text="Y:" VerticalAlignment="Center" />
                                    <ui:NumberBox
                                        Width="240"
                                        SpinButtonPlacementMode="Inline"
                                        Maximum="{x:Static media:BindablePoint.MaxYValue}"
                                        Value="{Binding DefaultFlyoutPosition.Y}" />
                                </ui:SimpleStackPanel>
                            </toolkitControls:SimpleWrapPanel>
                        </ui:SimpleStackPanel>
                        <Button Style="{DynamicResource ButtonRevealStyle}"
                                Content="{x:Static resx:Strings.Settings_AlignFlyout}"
                                Command="{x:Static utils:CommonCommands.AlignOnScreenFlyoutToDefaultPosition}" />
                    </ui:SimpleStackPanel>
                </ui:SimpleStackPanel>
            </GroupBox>

            <GroupBox Header="{x:Static resx:Strings.Settings_Appearance}">
                <ui:SimpleStackPanel Spacing="10">
                    <ComboBox
                        ui:ControlHelper.Header="{x:Static resx:Strings.Settings_FlyoutExpandDirection}"
                        Width="240"
                        ItemTemplate="{StaticResource LocalizedEnumItemTemplate}"
                        ItemsSource="{toolkit:EnumValues Type=coreui:FlyoutWindowExpandDirection}"
                        SelectedItem="{Binding UIManager.OnScreenFlyoutWindowExpandDirection}"/>
                    <ui:RadioButtons
                        ui:ControlHelper.Header="{x:Static resx:Strings.Settings_FlyoutContentStackingDirection}"
                        ItemTemplate="{StaticResource LocalizedEnumItemTemplate}"
                        ItemsSource="{toolkit:EnumValues Type=controls:StackingDirection}"
                        SelectedItem="{Binding UIManager.OnScreenFlyoutContentStackingDirection}"/>
                </ui:SimpleStackPanel>
            </GroupBox>
        </StackPanel>
    </controls:ScrollViewerEx>
</Page>
