<UserControl
    x:Class="Bili.App.Controls.Danmaku.DanmakuBox"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:icons="using:Richasy.FluentIcon.Uwp"
    xmlns:loc="using:Bili.App.Resources.Extension"
    xmlns:local="using:Bili.App.Controls.Danmaku"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    d:DesignHeight="300"
    d:DesignWidth="400"
    mc:Ignorable="d">

    <Grid ColumnSpacing="12">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <StackPanel Orientation="Horizontal">
            <ToggleSwitch
                x:Name="DanmakuVisibilityToggleSwitch"
                AutomationProperties.Name="{loc:Locale Name=DanmakuSwitch}"
                Style="{StaticResource DanmakuToggleSwitchStyle}"
                IsOn="{x:Bind ViewModel.IsShowDanmaku, Mode=TwoWay}"
                ToolTipService.ToolTip="{loc:Locale Name=DanmakuSwitch}" />
        </StackPanel>
        <AutoSuggestBox
            x:Name="DanmakuInputBox"
            Grid.Column="1"
            Height="32"
            Padding="8,0"
            HorizontalAlignment="Stretch"
            GotFocus="OnDanmakuInputBoxGotFocus"
            LostFocus="OnDanmakuInputBoxLostFocus"
            PlaceholderText="{loc:Locale Name=DanmakuPlaceholder}"
            QuerySubmitted="OnDanmakuInputBoxSubmittedAsync" />
        <StackPanel
            Grid.Column="2"
            Orientation="Horizontal"
            Spacing="8">
            <Button
                x:Name="DanmakuSendSettingsButton"
                AutomationProperties.Name="{loc:Locale Name=DanmakuSendSettings}"
                Height="32"
                Background="Transparent"
                BorderThickness="0"
                ToolTipService.ToolTip="{loc:Locale Name=DanmakuSendSettings}">
                <icons:RegularFluentIcon Symbol="Options16" />
                <Button.Flyout>
                    <Flyout FlyoutPresenterStyle="{StaticResource ThinPaddingFlyoutPresenterStyle}">
                        <local:DanmakuSendOptions x:Name="SendOptions" ViewModel="{x:Bind ViewModel, Mode=OneWay}" />
                    </Flyout>
                </Button.Flyout>
            </Button>
            <Button
                x:Name="DanmakuOptionButton"
                AutomationProperties.Name="{loc:Locale Name=DanmakuDisplaySettings}"
                Height="32"
                Background="Transparent"
                BorderThickness="0"
                ToolTipService.ToolTip="{loc:Locale Name=DanmakuDisplaySettings}">
                <icons:RegularFluentIcon Symbol="ContentSettings16" />
                <Button.Flyout>
                    <Flyout FlyoutPresenterStyle="{StaticResource ThinPaddingFlyoutPresenterStyle}">
                        <local:DanmakuDisplayOptions ViewModel="{x:Bind ViewModel, Mode=OneWay}" />
                    </Flyout>
                </Button.Flyout>
            </Button>
        </StackPanel>
    </Grid>
</UserControl>
