<UserControl x:Class="ChatController.ChatMainControl"
             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:converter="clr-namespace:ChatController.Converter"
             xmlns:chatKlassen="clr-namespace:ChatController.ChatKlassen"
             xmlns:core="clr-namespace:ChatController.Core"
             xmlns:chatController="clr-namespace:ChatController"
             mc:Ignorable="d" x:Name="ChatControlling"
             d:DesignHeight="300" d:DesignWidth="600" 
             Loaded="ChatMainControl_OnLoaded"
             SnapsToDevicePixels="True" d:DataContext="{d:DesignData ChatMainControl}">
    <UserControl.Resources>
        <converter:BoolToVisibilityConverter x:Key="BoolToVisibilityConverter" />
        <converter:StringEmptyToVisibilityConverter x:Key="StringEmptyToVisibilityConverter" />
        <converter:StringToBoolConverter x:Key="StringToBoolConverter" />
        <converter:UserProfilePictureVisibilityConverter x:Key="UserProfilePictureVisibilityConverter" />

        <SolidColorBrush x:Key="DarkBackColor" Color="#FFA9B8C2" />
        <SolidColorBrush x:Key="LightBackColor" Color="#E8EFF4" />

        <Style x:Key="MainNavigationScrollViewer" TargetType="{x:Type ScrollViewer}">
            <Setter Property="OverridesDefaultStyle" Value="True"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ScrollViewer}">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition/>
                                <RowDefinition Height="Auto"/>
                            </Grid.RowDefinitions>

                            <ScrollContentPresenter Grid.Column="0"/>

                            <ScrollBar Name="PART_VerticalScrollBar"
                                     Value="{TemplateBinding VerticalOffset}"
                                     Maximum="{TemplateBinding ScrollableHeight}"
                                     ViewportSize="{TemplateBinding ViewportHeight}"
                                     Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
                                     Grid.Row="0" Grid.Column="1"/>
                            <ScrollBar Name="PART_HorizontalScrollBar"
                                     Orientation="Horizontal"
                                     Grid.Row="1"
                                     Grid.Column="0"
                                     Value="{TemplateBinding HorizontalOffset}"
                                     Maximum="{TemplateBinding ScrollableWidth}"
                                     ViewportSize="{TemplateBinding ViewportWidth}"
                                     Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"/>

                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <ControlTemplate x:Key="ContactListBoxTemplate" TargetType="{x:Type ListBox}">
            <Border x:Name="Bd" SnapsToDevicePixels="True" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}">
                <ScrollViewer Focusable="False" Padding="{TemplateBinding Padding}" Style="{StaticResource MainNavigationScrollViewer}" HorizontalScrollBarVisibility="Disabled">
                    <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                </ScrollViewer>
            </Border>
        </ControlTemplate>
        <Style x:Key="ContactListStyle" TargetType="{x:Type ListBox}">
            <Setter Property="Template" Value="{StaticResource ContactListBoxTemplate}" />
        </Style>

        <!-- region Styling Kontaktliste -->
        <Style x:Key="ContactListBoxItemStyle" TargetType="{x:Type ListBoxItem}">
            <Setter Property="HorizontalContentAlignment" Value="{Binding Path=HorizontalContentAlignment, RelativeSource={RelativeSource AncestorLevel=1, AncestorType={x:Type ItemsControl}, Mode=FindAncestor}}" />
            <Setter Property="VerticalContentAlignment" Value="{Binding Path=VerticalContentAlignment, RelativeSource={RelativeSource AncestorLevel=1, AncestorType={x:Type ItemsControl}, Mode=FindAncestor}}" />
            <Setter Property="Margin" Value="0,0,0,0" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        <Grid>
                            <Border x:Name="ItemBorder" MinHeight="20" Background="White" BorderThickness="0,0,0,1" BorderBrush="{StaticResource LightBackColor}">
                            </Border>
                            <Border x:Name="ItemContent"  MinHeight="20">
                                <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="5,3,5,3" OpacityMask="{x:Null}" SnapsToDevicePixels="True">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="7"/>
                                        <ColumnDefinition Width="35"/>
                                        <ColumnDefinition Width="7"/>
                                        <ColumnDefinition Width="Auto"/>
                                        <ColumnDefinition Width="7"/>
                                        <ColumnDefinition Width="*"/>
                                    </Grid.ColumnDefinitions>
                                    <Ellipse Grid.Column="1" Width='32' Height='32' RenderOptions.BitmapScalingMode="HighQuality">
                                        <Ellipse.Fill>
                                            <ImageBrush ImageSource='{Binding Image, UpdateSourceTrigger=PropertyChanged}' Stretch='UniformToFill' RenderOptions.BitmapScalingMode="HighQuality" />
                                        </Ellipse.Fill>
                                    </Ellipse>
                                    <Grid Grid.Column="3"  >
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="*" />
                                            <RowDefinition Height="*"/>
                                        </Grid.RowDefinitions>
                                        <TextBlock Text="{Binding Path=Name, FallbackValue=FirstName}" Foreground="{Binding Path=AccentColorBrush}" FontSize="16" Margin="1" />
                                        <TextBlock Text="{Binding Path=ReceivedMessage.Text}" Grid.Row="1" FontSize="14"  Foreground="{Binding Path=Color}" Margin="1" />
                                    </Grid>
                                </Grid>
                            </Border>
                        </Grid>

                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" TargetName="ItemBorder" Value="{StaticResource DarkBackColor}" />
                            </Trigger>

                            <Trigger Property="ListBoxItem.IsSelected" Value="True">
                                <Setter Property="Background" TargetName="ItemBorder" Value="{StaticResource DarkBackColor}" />
                            </Trigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="ListBoxItem.IsSelected" Value="True" />
                                    <Condition Property="Selector.IsSelectionActive" Value="False" />
                                </MultiTrigger.Conditions>
                                <Setter Property="Background" TargetName="ItemBorder" Value="{StaticResource DarkBackColor}" />
                            </MultiTrigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <!-- endregion Styling Kontaktliste -->

        <!-- region Styling Gruppensuchtemplate -->
        <ControlTemplate x:Key="SearchTextBoxTemplate" TargetType="{x:Type TextBox}">
            <Border x:Name="Bd" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="2,2,2,2">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition />
                    </Grid.ColumnDefinitions>
                    <ScrollViewer Grid.Column="1" x:Name="PART_ContentHost" Margin="0,2,0,0" />
                    <Canvas Grid.Column="0" Width="14" Margin="3,4,2,2">
                        <Ellipse Stroke="#FFA0A0A0" Height="10" Width="10" StrokeThickness="2" Fill="{x:Null}" />
                        <Line Fill="#FFFFFFFF" Stretch="Fill" Stroke="#FFA0A0A0" Canvas.Left="6" Canvas.Top="7.4" Y1="0" Y2="5" StrokeThickness="3" X2="4" />
                    </Canvas>
                </Grid>
            </Border>
            <ControlTemplate.Triggers>
                <Trigger Property="IsEnabled" Value="False">
                    <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" />
                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
        <!-- endregion Styling Gruppensuchtemplate -->

        <Style TargetType="{x:Type Rectangle}">
            <Setter Property="Fill" Value="{Binding Path=Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type UserControl}}}" />
            <Setter Property="Width" Value="12" />
            <Setter Property="Height" Value="40" />
        </Style>
    </UserControl.Resources>
    <Grid x:Name="RootGrid">
        <Border x:Name="rootBorder" Background="{StaticResource DarkBackColor}" Padding="0" Margin="0" BorderThickness="0">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="250" />
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>

                <Grid Grid.Column="0" Grid.Row="0" >
                    <Grid.RowDefinitions>
                        <RowDefinition  Height="50"/>
                        <RowDefinition  Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>

                    <!-- region Gruppensuche und Gruppenliste aktualisieren -->
                    <Grid Grid.Column="0" Grid.Row="0" >
                        <Grid.RowDefinitions>
                            <RowDefinition  Height="*"/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="Auto"/>
                        </Grid.ColumnDefinitions>

                        <StackPanel x:Name="ReloadGruppen" Grid.Row="0" Grid.Column="1" Height="25" Width="25" HorizontalAlignment="Right" Orientation="Horizontal" VerticalAlignment="Center"  Visibility="Visible" Margin="0,0,3,0">
                            <Button Background="Transparent" HorizontalAlignment="Right"  BorderThickness="0" VerticalAlignment="Center" VerticalContentAlignment="Center"  Width="25" Height="25" Click="ButtonReloadGruppen_OnClick" >
                                <Image ToolTip="Gruppen Aktualisieren" Margin="0,0,0,0" Width="20" Height="20" Source="pack://application:,,,/ChatController;component/Ressourcen/SymbolRefresh32.png" RenderOptions.BitmapScalingMode="HighQuality" HorizontalAlignment="Center" />
                            </Button>
                        </StackPanel>

                        <TextBox Grid.Column="0" x:Name="Suche" Height="22" HorizontalAlignment="Stretch" Margin="5" TabIndex="0" Template="{DynamicResource SearchTextBoxTemplate}" BorderThickness="0,0,0,0" TextChanged="Suche_OnTextChanged" />
                    </Grid>
                    <!-- endregion Gruppensuche und Gruppenliste aktualisieren -->

                    <!-- region Kontaktliste -->
                    <Grid Grid.Column="0" Grid.Row="1"  >
                        <Grid.RowDefinitions>
                            <RowDefinition  Height="*"/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <ListView x:Name="Clientlist" HorizontalAlignment="Stretch" Grid.Row="0" Grid.Column="0"   VerticalAlignment="Stretch" BorderThickness="0" Background="White"
                                  ItemsSource="{Binding ContactList, UpdateSourceTrigger=PropertyChanged}"
                                  ItemContainerStyle="{StaticResource ContactListBoxItemStyle}" SelectionChanged="Clientlist_OnSelectionChanged" Style="{StaticResource ContactListStyle}">
                        </ListView>
                    </Grid>
                    <!-- endregion Kontaktliste -->
                </Grid>

                <Grid Grid.Column="1" Grid.Row="0" x:Name="GridRechts">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="50"/>
                        <RowDefinition Height="*" />
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>

                    <Grid Grid.Row="0" HorizontalAlignment="Left" Background="Transparent" VerticalAlignment="Center" Height="50" PreviewMouseDown="CurrentContactImage_OnMouseDoubleClick">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="50" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>

                        <Ellipse Width='40' Height='40' VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality">
                            <Ellipse.Fill >
                                <ImageBrush ImageSource='{Binding Path=ThreadExceptionImageSource, UpdateSourceTrigger=PropertyChanged}' Stretch="UniformToFill"/>
                            </Ellipse.Fill>
                        </Ellipse>
                        
                        <TextBlock Grid.Column="1" VerticalAlignment="Center" Margin="8" TextWrapping="Wrap" Text="{Binding CurrentContactInformationString}" FontSize="16" Foreground="{Binding CurrencContactInfoForeground}" />
                    </Grid>

                    <ListBox x:Name="ChatListBox" 
                             ItemsSource="{Binding ChatMessages, UpdateSourceTrigger=PropertyChanged}"
                             HorizontalAlignment="Stretch" 
                             ScrollViewer.CanContentScroll="False" 
                             VerticalAlignment="Stretch" 
                             Grid.Row="1" 
                             VirtualizingStackPanel.IsVirtualizing="True" 
                             BorderThickness="0" 
                             VirtualizingStackPanel.VirtualizationMode="Recycling" 
                             SelectionMode="Extended" 
                             MouseDoubleClick="Chat_OnMouseDoubleClick" 
                             ScrollViewer.ScrollChanged="Chat_OnScrollChanged" 
                             Background="{StaticResource LightBackColor}" 
                             ContextMenuOpening="Chat_OnContextMenuOpening" 
                             Padding="20" 
                             d:DataContext="{d:DesignData ChatMessage}">
                        <ListBox.ItemContainerStyle>
                            <Style TargetType="ListBoxItem">
                                <Setter Property="HorizontalAlignment" Value="{Binding HorizontalAlignmentValue}" />
                                <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                                <Setter Property="Background" Value="Transparent"></Setter>
                                <Setter Property="Template">
                                    <Setter.Value>
                                        <ControlTemplate TargetType="{x:Type ListBoxItem}">
                                            <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1,1,1,1"  
                                                    Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true" CornerRadius="8" Background="{Binding BorderBrush}" >
                                                <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
                                                                  VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                                            </Border>
                                            <ControlTemplate.Triggers>
                                                <Trigger Property="IsMouseOver" Value="True">
                                                    <Setter Property="Background" TargetName="Bd" Value="{Binding HighlightedBorderBrush}"></Setter>
                                                </Trigger>
                                                <Trigger Property="IsSelected" Value="true">
                                                    <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
                                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
                                                </Trigger>
                                                <MultiTrigger>
                                                    <MultiTrigger.Conditions>
                                                        <Condition Property="IsSelected" Value="true"/>
                                                        <Condition Property="Selector.IsSelectionActive" Value="false"/>
                                                    </MultiTrigger.Conditions>
                                                    <Setter Property="Background" TargetName="Bd" Value="{Binding BorderBrush}"/>
                                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.InactiveSelectionHighlightTextBrushKey}}"/>
                                                    <Setter TargetName="Bd" Property="CornerRadius" Value="8" />
                                                    <Setter TargetName="Bd" Property="BorderThickness" Value="1,1,1,1" />
                                                </MultiTrigger>
                                                <MultiTrigger>
                                                    <MultiTrigger.Conditions>
                                                        <Condition Property="IsSelected" Value="true" />
                                                        <Condition Property="Selector.IsSelectionActive" Value="true" />
                                                    </MultiTrigger.Conditions>
                                                    <Setter Property="Background" TargetName="Bd" Value="{Binding HighlightedBorderBrush}"/>
                                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.InactiveSelectionHighlightTextBrushKey}}"/>
                                                    <Setter TargetName="Bd" Property="CornerRadius" Value="8" />
                                                    <Setter TargetName="Bd" Property="BorderThickness" Value="1" />
                                                </MultiTrigger>
                                            </ControlTemplate.Triggers>
                                        </ControlTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style>
                        </ListBox.ItemContainerStyle>
                        <ListBox.ItemTemplate>
                            <DataTemplate DataType="chatKlassen:ChatMessage">
                                <StackPanel>
                                    <Border>
                                        <Grid HorizontalAlignment="Stretch" Background="Transparent" MaxWidth="500">
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="Auto" />
                                                <ColumnDefinition Width="*" />
                                                <ColumnDefinition Width="Auto" />
                                                <ColumnDefinition Width="*" />
                                                <ColumnDefinition Width="Auto" />
                                            </Grid.ColumnDefinitions>

                                            <Ellipse Grid.Column="0" 
                                                     Margin="2,5,2,2" VerticalAlignment="Top" Width="32" Height="32" RenderOptions.BitmapScalingMode="HighQuality">
                                                <Ellipse.Fill>
                                                    <ImageBrush ImageSource="{Binding Path=ProfilePicture, UpdateSourceTrigger=PropertyChanged}" Stretch="UniformToFill" RenderOptions.BitmapScalingMode="HighQuality" />
                                                </Ellipse.Fill>
                                                <Ellipse.Visibility>
                                                    <MultiBinding Converter="{StaticResource UserProfilePictureVisibilityConverter}">
                                                        <Binding Path="IsMyMessage" UpdateSourceTrigger="PropertyChanged" />
                                                        <Binding Path="CurrentContact.IsGroupChat" RelativeSource="{RelativeSource FindAncestor, AncestorType={x:Type chatController:ChatMainControl}}" UpdateSourceTrigger="PropertyChanged" />
                                                    </MultiBinding>
                                                </Ellipse.Visibility>
                                            </Ellipse>

                                            <Separator Grid.Column="0" Grid.ColumnSpan="2" Visibility="{Binding IsSeparator, Converter={StaticResource BoolToVisibilityConverter}, ConverterParameter=reverse}" VerticalContentAlignment="Center" />
                                            <Label Content="{Binding SeparatorTimeString}" HorizontalAlignment="Center" Grid.Column="2" Visibility="{Binding IsSeparator, Converter={StaticResource BoolToVisibilityConverter}, ConverterParameter=reverse}" />
                                            <Separator Grid.Column="3" Grid.ColumnSpan="2" Visibility="{Binding IsSeparator, Converter={StaticResource BoolToVisibilityConverter}, ConverterParameter=reverse}" />

                                            <DockPanel Grid.Column="1" Grid.ColumnSpan="3" MinHeight="15" Margin="5" LastChildFill="True" Visibility="{Binding IsSeparator, Converter={StaticResource BoolToVisibilityConverter}}">
                                                <StackPanel DockPanel.Dock="Bottom" Orientation="Vertical">
                                                    <Image ToolTip="Dokument öffnen" Height="{Binding ThumbnailPlaceholderHeight, UpdateSourceTrigger=PropertyChanged}" Width="150" Source="{Binding Path=Thumbnail, UpdateSourceTrigger=PropertyChanged}" Stretch="Uniform" VerticalAlignment="Center" HorizontalAlignment="Center" />
                                                    <Image MaxWidth="300" Height="{Binding PicturePlaceholderHeight, UpdateSourceTrigger=PropertyChanged}" Source="{Binding Path=PictureSource, UpdateSourceTrigger=PropertyChanged}" x:Name="imgChatMessage" Stretch="UniformToFill" />
                                                    <core:OwnChatRichTextBox VerticalAlignment="Center" InlineList="{Binding MessageInlines, UpdateSourceTrigger=PropertyChanged}" 
                                                                             MinWidth="0" MaxWidth="{Binding MessageMaxWidth}" FontSize="14" IsReadOnly="True"
                                                                             HorizontalAlignment="{Binding HorizontalAlignmentValue}"
                                                                             BorderThickness="0" Background="Transparent" IsDocumentEnabled="True" Margin="-5,0,0,0" />
                                                </StackPanel>
                                                <StackPanel DockPanel.Dock="Left" Margin="0,0,0,0">
                                                    <TextBlock Text="{Binding UserTimeStringLeft}" MaxWidth="{Binding TimeStringMaxWidth}" FontSize="11"  HorizontalAlignment="Left" TextAlignment="Left" VerticalAlignment="Center" Foreground="{Binding Foreground}" />
                                                </StackPanel>
                                                <StackPanel DockPanel.Dock="Right" Margin="5,0,0,5">
                                                    <TextBlock Text="{Binding UserTimeStringRight}" MaxWidth="{Binding TimeStringMaxWidth}" FontSize="11"  HorizontalAlignment="Right" TextAlignment="Right" VerticalAlignment="Center" Foreground="{Binding Foreground}" />
                                                </StackPanel>
                                            </DockPanel>

                                            <Ellipse Grid.Column="4" 
                                                     Margin="2,5,2,2" VerticalAlignment="Top" Width="32" Height="32" RenderOptions.BitmapScalingMode="HighQuality">
                                                <Ellipse.Fill>
                                                    <ImageBrush ImageSource="{Binding Path=ProfilePicture, UpdateSourceTrigger=PropertyChanged}" Stretch="UniformToFill" RenderOptions.BitmapScalingMode="HighQuality" />
                                                </Ellipse.Fill>
                                                <Ellipse.Visibility>
                                                    <MultiBinding Converter="{StaticResource UserProfilePictureVisibilityConverter}" ConverterParameter="reverse">
                                                        <Binding Path="IsMyMessage" UpdateSourceTrigger="PropertyChanged" />
                                                        <Binding Path="CurrentContact.IsGroupChat" RelativeSource="{RelativeSource FindAncestor, AncestorType={x:Type chatController:ChatMainControl}}" UpdateSourceTrigger="PropertyChanged" />
                                                    </MultiBinding>
                                                </Ellipse.Visibility>
                                            </Ellipse>
                                        </Grid>
                                    </Border>
                                </StackPanel>
                            </DataTemplate>
                        </ListBox.ItemTemplate>
                    </ListBox>

                    <Grid Grid.Row="2" Visibility="{Binding ChatMessageInputGridVisibility}" VerticalAlignment="Stretch" MinHeight="25" MaxHeight="200">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>
                        <TextBox x:Name="Chatbox" 
                                 Grid.Column="0"
                                 HorizontalAlignment="Stretch" 
                                 TextWrapping="Wrap" 
                                 VerticalScrollBarVisibility="Auto" 
                                 Visibility="Visible" 
                                 BorderThickness="0" 
                                 VerticalContentAlignment="Top" 
                                 MinHeight="69" MaxHeight="200"
                                 FontSize="15"
                                 Padding="2" 
                                 ToolTip="Schreiben Sie hier eine Nachricht hinein" 
                                 Margin="2"
                                 VerticalAlignment="Stretch" 
                                 GotFocus="Chatbox_OnGotFocus" 
                                 AcceptsReturn="True"
                                 KeyDown="Chatbox_OnKeyDownHandler"
                                 TextChanged="Chatbox_OnTextChanged">
                            <TextBox.Resources>
                                <Style TargetType="{x:Type Border}">
                                    <Setter Property="CornerRadius" Value="2"/>
                                </Style>
                            </TextBox.Resources>
                        </TextBox>
                        <TextBlock Padding="4,2,2,2" 
                                   Margin="2"
                                   Grid.Column="0"
                                   Text="Nachricht schreiben..." 
                                   Foreground="DimGray" 
                                   IsHitTestVisible="False" 
                                   VerticalAlignment="Stretch" 
                                   MinHeight="25" MaxHeight="200"
                                   FontSize="15"
                                   Height="{Binding ElementName=Chatbox, Path=ActualHeight}"
                                   HorizontalAlignment="Stretch"
                                   Visibility="{Binding ElementName=Chatbox, Path=Text, Converter={StaticResource StringEmptyToVisibilityConverter}}">
                            <TextBlock.Resources>
                                <Style TargetType="{x:Type Border}">
                                    <Setter Property="CornerRadius" Value="2"/>
                                </Style>
                            </TextBlock.Resources>
                        </TextBlock>
                        <Button Grid.Column="1"
                                Margin="2" 
                                x:Name="MediaButton" 
                                Background="Transparent" 
                                Width="28" 
                                Height="28"
                                BorderThickness="0" 
                                Padding="2"
                                VerticalAlignment="Bottom" 
                                ToolTip="Datei einfügen" 
                                Click="MediaButton_OnClick" >
                            <Image Width="22" Height="22" Source='pack://application:,,,/ChatController;component/Ressourcen/paperclip2.png' RenderOptions.BitmapScalingMode="HighQuality" HorizontalAlignment="Center"/>
                        </Button>
                        <Button Grid.Column="2" 
                                Width="28"
                                Height="28"
                                BorderThickness="0" 
                                Background="Transparent" 
                                x:Name="EmojiButton" 
                                Margin="2" 
                                Padding="0" 
                                VerticalAlignment="Bottom" 
                                ToolTip="Emoji einfügen" 
                                Click="EmojiButton_OnClick">
                            <Image Width="24" Height="24" Source='pack://application:,,,/ChatController;component/Ressourcen/glucklicher.png'  RenderOptions.BitmapScalingMode="HighQuality" HorizontalAlignment="Center" />
                        </Button>
                        <Button x:Name="SendButton" Height="25" Content="Senden" Margin="3" Grid.Column="3" VerticalAlignment="Bottom" 
                                Click="SendButton_OnClick" IsEnabled="{Binding ElementName=Chatbox, Path=Text, Converter={StaticResource StringToBoolConverter}}">
                            <Button.Style>
                                <Style TargetType="{x:Type Button}">
                                    <Setter Property="BorderBrush" Value="#ff5e00" />
                                    <Setter Property="Background" Value="#ff5e00" />
                                    <Setter Property="Foreground" Value="White"></Setter>
                                    <Setter Property="Template">
                                        <Setter.Value>
                                            <ControlTemplate TargetType="{x:Type Button}">
                                                <Border x:Name="Border" Background="#ff5300" CornerRadius="5" Padding="5,2">
                                                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                                                </Border>
                                                <ControlTemplate.Triggers>
                                                    <Trigger Property="IsMouseOver" Value="True">
                                                        <Setter Property="Background" Value="#ff9999" TargetName="Border" />
                                                    </Trigger>
                                                    <Trigger Property="IsPressed" Value="True">
                                                        <Setter Property="Background" Value="#ff3a00" TargetName="Border" />
                                                    </Trigger>
                                                    <Trigger Property="IsEnabled" Value="False">
                                                        <Setter Property="Background" Value="LightGray" TargetName="Border" />
                                                    </Trigger>
                                                </ControlTemplate.Triggers>
                                            </ControlTemplate>
                                        </Setter.Value>
                                    </Setter>
                                </Style>
                            </Button.Style>
                        </Button>
                    </Grid>
                </Grid>
            </Grid>
        </Border>
    </Grid>
</UserControl>
