<UserControl x:Class="PixiEditor.Views.UserControls.DiscordRPPreview"
             x:ClassModifier="internal"
             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:PixiEditor.Views.UserControls" 
             xmlns:converters="clr-namespace:PixiEditor.Helpers.Converters"
             xmlns:views="clr-namespace:PixiEditor.Views"
             mc:Ignorable="d" 
             d:DesignWidth="300"
             x:Name="uc"
             FlowDirection="LeftToRight">
    <Grid>
        <Border CornerRadius="5" Background="#292b2f" x:Name="OutsideBorder">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>

                <Grid>
                    <Border CornerRadius="5,5,0,0" Background="#e3042c" Height="60" VerticalAlignment="Top"/>
                    <StackPanel>
                        <Border HorizontalAlignment="Left" Width="85" Height="85" Margin="15" BorderThickness="6" BorderBrush="#292b2f" CornerRadius="90">
                            <Grid>
                                <Image Source="{Binding ElementName=uc, Path=UserSource}"/>
                                <Border Height="30" Width="30" Background="#FF43B581" CornerRadius="90" BorderThickness="6" BorderBrush="#292b2f">
                                    <Border.RenderTransform>
                                        <TransformGroup>
                                            <TranslateTransform X="27" Y="27"></TranslateTransform>
                                        </TransformGroup>
                                    </Border.RenderTransform>
                                </Border>
                            </Grid>
                        </Border>
                    </StackPanel>
                </Grid>
                <Border Grid.Row="1" Background="#18191C" Margin="10,10" CornerRadius="5" Padding="10">
                    <StackPanel>
                        <StackPanel Orientation="Horizontal" Margin="0,0">
                            <TextBlock Foreground="White" FontWeight="DemiBold" FontSize="22">PixiBot</TextBlock>
                            <TextBlock Foreground="White" FontWeight="DemiBold" FontSize="22">#8523</TextBlock>
                            <Border CornerRadius="3" BorderThickness="1" Background="#5865f2" Margin="5,0,0,0" VerticalAlignment="Center">
                                <TextBlock Foreground="White" FontSize="10" Margin="4,2,4,2" FontWeight="Medium">BOT</TextBlock>
                            </Border>
                        </StackPanel>
                        <Grid Margin="0,5">
                            <StackPanel Orientation="Vertical">
                                <Grid Margin="0,15" Background="#262729" Height="2"/>
                                <TextBlock FontWeight="Bold" FontSize="12" Foreground="White" Margin="0,0,0,10" Text="ABOUT ME"/>
                                <TextBlock Foreground="White" Text="Use me to display your .pixi files in Discord. &#10;Start by sending a file in any appropriate channel" />
                            </StackPanel>
                        </Grid>
                        <Grid Margin="0,5">
                            <StackPanel Orientation="Vertical">
                                <TextBlock FontWeight="Bold" Foreground="White" Margin="0,0,0,10" Text="DISCORD MEMBER SINCE"/>
                                <TextBlock Foreground="White" Text="Oct 29, 2020"></TextBlock>
                            </StackPanel>
                        </Grid>
                        <Grid Visibility="{Binding ElementName=uc, Path=IsPlaying, Converter={BoolToVisibilityConverter}}" Margin="0,5, 0, 0">
                            <StackPanel Orientation="Vertical">
                                <TextBlock FontWeight="Bold" FontSize="12" Foreground="White" Margin="0,0,0,10" Text="PLAYING A GAME"/>
                                <StackPanel Orientation="Horizontal">
                                    <Image Source="../../Images/PixiEditorLogo.png" Height="60"/>
                                    <StackPanel Margin="15,0,0,0" VerticalAlignment="Center">
                                        <TextBlock Foreground="White" FontSize="12" FontWeight="SemiBold">PixiEditor</TextBlock>
                                        <TextBlock Foreground="White" FontSize="12" Text="{Binding ElementName=uc, Path=Detail}" Visibility="{Binding ElementName=uc, 
                                        Path=Detail, Converter={converters:EmptyStringToVisibilityConverter}}"/>
                                        <TextBlock Foreground="White" FontSize="12" Text="{Binding ElementName=uc, Path=State}" Visibility="{Binding ElementName=uc,
                                        Path=State, Converter={converters:EmptyStringToVisibilityConverter}}"/>
                                        <TextBlock Foreground="White" FontSize="12" Text="00:00 elapsed"/>
                                    </StackPanel>
                                </StackPanel>
                            </StackPanel>
                        </Grid>
                    </StackPanel>
                </Border>
            </Grid>
        </Border>
    </Grid>
</UserControl>
