<UserControl
    x:Class="AmbientSounds.Controls.SoundSuggestionControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:animations="using:Microsoft.Toolkit.Uwp.UI.Animations"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="using:AmbientSounds.Controls"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    d:DesignHeight="300"
    d:DesignWidth="400"
    mc:Ignorable="d">

    <StackPanel>
        <TextBlock
            x:Name="SuggestionHeader"
            x:Uid="SuggestionHeader"
            HorizontalAlignment="Center"
            HorizontalTextAlignment="Center"
            TextWrapping="WrapWholeWords" />
        <TextBox
            x:Uid="SuggestionTextBox"
            Width="160"
            Margin="0,12,0,0"
            HorizontalAlignment="Center"
            AutomationProperties.LabeledBy="{x:Bind SuggestionHeader}"
            KeyDown="{x:Bind SuggestionBox_KeyDown}"
            MaxLength="20"
            Text="{x:Bind ViewModel.Suggestion, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
        <Grid Height="40" Margin="0,12,0,0">
            <Button
                x:Uid="SuggestionSendButton"
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                Command="{x:Bind ViewModel.SendSuggestionCommand}"
                CommandParameter="{x:Bind ViewModel.Suggestion, Mode=OneWay}"
                Style="{StaticResource RoundButtonStyle}"
                Visibility="{x:Bind ViewModel.IsSendVisible, Mode=OneWay}">
                <FontIcon FontFamily="{StaticResource FluentUIGlyphs}" Glyph="&#xEB57;" />

                <animations:Implicit.ShowAnimations>
                    <animations:TranslationAnimation
                        From="-20, 0, 0"
                        To="0"
                        Duration="0:0:0.3" />
                    <animations:OpacityAnimation
                        From="0"
                        To="1.0"
                        Duration="0:0:0.3" />
                </animations:Implicit.ShowAnimations>
                <animations:Implicit.HideAnimations>
                    <animations:TranslationAnimation
                        From="0"
                        To="20, 0, 0"
                        Duration="0:0:0.3" />
                    <animations:OpacityAnimation
                        From="1.0"
                        To="0"
                        Duration="0:0:0.3" />
                </animations:Implicit.HideAnimations>

            </Button>

            <TextBlock
                x:Uid="ThankYouTextBlock"
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                Visibility="{x:Bind ViewModel.IsThankYouVisible, Mode=OneWay}">
                <animations:Implicit.ShowAnimations>
                    <animations:TranslationAnimation
                        From="-20, 0, 0"
                        To="0"
                        Duration="0:0:0.3" />
                    <animations:OpacityAnimation
                        From="0"
                        To="1.0"
                        Duration="0:0:0.3" />
                </animations:Implicit.ShowAnimations>
                <animations:Implicit.HideAnimations>
                    <animations:TranslationAnimation
                        From="0"
                        To="20, 0, 0"
                        Duration="0:0:0.3" />
                    <animations:OpacityAnimation
                        From="1.0"
                        To="0"
                        Duration="0:0:0.3" />
                </animations:Implicit.HideAnimations>
            </TextBlock>
        </Grid>
    </StackPanel>
</UserControl>
