ZenMode.xaml

<phone:PhoneApplicationPage
    x:Class="Cloudsdale.ZenMode"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:my="clr-namespace:Cloudsdale.Controls"
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    mc:Ignorable="d"
    shell:SystemTray.IsVisible="True">
    
    <phone:PhoneApplicationPage.Resources>
        <DataTemplate x:Key="SlashMeTemplate">
            <Grid Margin="0,3,0,5" DataContext="{Binding}">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <TextBlock FontSize="16" Foreground="#ff6f8f8f"
                               HorizontalAlignment="Center" 
                               Text="{Binding Path=CorrectedTimestamp}" />
                <TextBlock FontSize="16" Foreground="#ff6f8f8f"
                               HorizontalAlignment="Right" 
                               Text="{Binding Path=DeviceStub}" />
                <RichTextBox Grid.Row="1" HorizontalAlignment="Center" TextWrapping="Wrap" 
                                 FontSize="18" Style="{StaticResource RichChatStyle}" Foreground="Black">
                    <Paragraph>
                        <Run Text="{Binding Path=SlashMeForm}" />
                    </Paragraph>
                </RichTextBox>
            </Grid>
        </DataTemplate>
        <DataTemplate x:Key="StandardChatTemplate">
            <Grid Margin="0,3,0,5" DataContext="{Binding}">
                <StackPanel Width="50" HorizontalAlignment="Left" VerticalAlignment="Top">
                    <Border BorderBrush="#FF444444" Height="50" BorderThickness="1" Margin="0,0,0,2">
                        <Image Source="{Binding Path=user.avatar.Preview}"
                               HorizontalAlignment="Center" VerticalAlignment="Center" Width="48" Height="48"
                               Stretch="UniformToFill" ImageFailed="AvatarImageFailed"/>
                    </Border>
                    <Border DataContext="{Binding Path=user}" Width="50" Height="15" 
                                BorderBrush="Gray" BorderThickness="1" Background="{Binding Path=RoleBrush}"
                                Visibility="{Binding Path=ShowTag}" CornerRadius="1">
                        <TextBlock Text="{Binding Path=RoleTag}" HorizontalAlignment="Center"
                                       Foreground="White" FontSize="10" Name="Username" />
                    </Border>
                </StackPanel>
                <StackPanel Margin="60,0,0,0" VerticalAlignment="Top">
                    <RichTextBox DataContext="{Binding Path=user}" FontFamily="Segoe WP Bold"
                                   FontSize="18" Foreground="{Binding Path=CloudColor}" Margin="-10,0">
                        <Paragraph>
                            <Run Text="●" Foreground="{Binding Path=Status, Converter={StaticResource SCC}}" />
                            <Bold>
                                <Run Text="{Binding Path=name}" />
                            </Bold>
                        </Paragraph>
                    </RichTextBox>
                </StackPanel>
                <TextBlock DataContext="{Binding}"
                               HorizontalAlignment="Right"
                               VerticalAlignment="Top" FontSize="16" Foreground="#ff6f8f8f">
                        <Run Text="{Binding Path=CorrectedTimestamp}" />
                        <Run Text="{Binding Path=DeviceStub}" FontSize="16" />
                </TextBlock>
                <Grid Margin="60,24,0,0">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <ItemsControl Grid.Row="1" DataContext="{Binding}" ItemsSource="{Binding Path=Split}" Margin="-10,0,-10,0">
                        <ItemsControl.ItemTemplate>
                            <DataTemplate>
                                <my:LinkDetectingTextBlock DataContext="{Binding}" LinkedText="{Binding Path=Text}" 
                                                               Foreground="{Binding Path=Color}" FontSize="18" 
                                                               Style="{StaticResource ChatStyle}"/>
                            </DataTemplate>
                        </ItemsControl.ItemTemplate>
                    </ItemsControl>
                </Grid>
            </Grid>
        </DataTemplate>
        <DataTemplate x:Name="ChatsTemplate">
            <my:AlternatableContent Content="{Binding}" 
                                        PrimaryTemplate="{StaticResource StandardChatTemplate}" 
                                        SecondaryTemplate="{StaticResource SlashMeTemplate}"
                                        UseAlternate="{Binding Path=IsSlashMe}" />
        </DataTemplate>
    </phone:PhoneApplicationPage.Resources>

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="#F0F0F0">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!--TitlePanel contains the name of the application and page title-->
        <StackPanel Grid.Row="0" Margin="12,17,0,28">
            <TextBlock Text="{Binding Path=name}" />
        </StackPanel>

        <!--ContentPanel - place additional content here-->
        <ScrollViewer Name="ChatScroller" Grid.Row="1">
            <ItemsControl ItemTemplate="{StaticResource ChatsTemplate}" ItemsSource="{Binding Path=Controller.Messages}" />
        </ScrollViewer>
    </Grid>

</phone:PhoneApplicationPage>