<UserControl x:Class="Translumo.Controls.ProxySettingCard"
             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:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
             xmlns:s="clr-namespace:System;assembly=mscorlib"
             xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
             xmlns:system="clr-namespace:System;assembly=System.Runtime"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800">
    <UserControl.Resources>
        <Duration x:Key="ButtonAnimationDuration">0:0:0.210</Duration>
        <system:Double x:Key="ButtonAnimationFrom">-10</system:Double>
        <system:Double x:Key="ButtonAnimationTo">2</system:Double>
    </UserControl.Resources>

    <Border BorderBrush="{StaticResource SecondaryHueMidBrush}" BorderThickness="1" CornerRadius="5">
        <Grid Margin="7,7,7,7">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"></ColumnDefinition>
                <ColumnDefinition Width="Auto"></ColumnDefinition>
                <ColumnDefinition Width="*"></ColumnDefinition>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition></RowDefinition>
                <RowDefinition></RowDefinition>
                <RowDefinition Height="7"></RowDefinition>
                <RowDefinition></RowDefinition>
                <RowDefinition></RowDefinition>
            </Grid.RowDefinitions>

            <DockPanel LastChildFill="True" Grid.Column="0" Grid.ColumnSpan="3">
                <Label Style="{StaticResource SecondaryLabel}" Content="{StaticResource Str.ProxySettings.IpAddress}"/>
                <Label Style="{StaticResource SecondaryLabel}" Content=":" Margin="-5,0,-5,0"/>
                <Label Style="{StaticResource SecondaryLabel}" Content="{StaticResource Str.ProxySettings.Port}"/>
            </DockPanel>
            
            <xctk:MaskedTextBox Name="TbIpAddress"  Grid.Column="0" Grid.Row="1" Style="{DynamicResource MaterialDesignTextBox}" Mask="099\.099\.099\.099\" ValueDataType="s:String" InsertKeyMode="Overwrite" TextChanged="TbIpAddress_TextChanged"></xctk:MaskedTextBox>
            <Label Grid.Column="1" Grid.Row="1" Style="{StaticResource SecondaryLabel}">:</Label>
            <xctk:MaskedTextBox Name="TbPort" Grid.Column="2" Grid.Row="1" Style="{DynamicResource MaterialDesignTextBox}" Mask="09999" ValueDataType="s:String" TextChanged="TbPort_TextChanged"></xctk:MaskedTextBox>
            <Label Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="3" Content=""></Label>
            <DockPanel LastChildFill="True" Grid.Column="0" Grid.Row="3" Grid.ColumnSpan="3">
                <Label Style="{StaticResource SecondaryLabel}" Content="{StaticResource Str.Login}"/>
                <Label Style="{StaticResource SecondaryLabel}" Content=":" Margin="-5,0,-5,0"/>
                <Label Style="{StaticResource SecondaryLabel}" Content="{StaticResource Str.Password}"/>
            </DockPanel>
            <TextBox Name="TbLogin" Grid.Column="0" Grid.Row="4" Style="{DynamicResource MaterialDesignTextBox}" TextChanged="TbLogin_TextChanged"/>
            <Label Grid.Column="1" Grid.Row="4" Content=":" Style="{StaticResource SecondaryLabel}"></Label>
            <TextBox Name="TbPassword" Grid.Column="2" Grid.Row="4" Style="{DynamicResource MaterialDesignTextBox}" TextChanged="TbPassword_TextChanged"></TextBox>
            <Canvas Grid.Column="2" Grid.Row="0" HorizontalAlignment="Right" >
                <Button Name="BtnRemove" Content="{materialDesign:PackIcon DeleteOutline}" Visibility="Hidden" Command="{Binding DeleteCommand, RelativeSource={RelativeSource AncestorType=UserControl}}" CommandParameter="{Binding}">
                    <Button.Style>
                        <Style TargetType="Button" BasedOn="{StaticResource RoundSecondaryButton}">
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=UserControl}, Path=IsMouseOver}" Value="True">
                                    <DataTrigger.EnterActions>
                                        <BeginStoryboard>
                                            <Storyboard>
                                                <DoubleAnimation From="{StaticResource ButtonAnimationFrom}" To="{StaticResource ButtonAnimationTo}" Duration="{StaticResource ButtonAnimationDuration}"  Storyboard.TargetProperty="(Canvas.Right)" AutoReverse="False"></DoubleAnimation>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility">
                                                    <DiscreteObjectKeyFrame KeyTime="0:0:0.050" Value="{x:Static Visibility.Visible}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </BeginStoryboard>
                                    </DataTrigger.EnterActions>
                                    <DataTrigger.ExitActions>
                                        <BeginStoryboard>
                                            <Storyboard>
                                                <DoubleAnimation From="{StaticResource ButtonAnimationTo}" To="{StaticResource ButtonAnimationFrom}" Duration="{StaticResource ButtonAnimationDuration}" Storyboard.TargetProperty="(Canvas.Right)" AutoReverse="False"></DoubleAnimation>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility">
                                                    <DiscreteObjectKeyFrame KeyTime="0:0:0.160" Value="{x:Static Visibility.Hidden}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </BeginStoryboard>
                                    </DataTrigger.ExitActions>
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </Button.Style>
                </Button>
            </Canvas>
        </Grid>
    </Border>
</UserControl>
