<UserControl
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
	xmlns:Custom="http://schemas.microsoft.com/surface/2008"
	mc:Ignorable="d"
	x:Class="FingersDance.Views.TimelineAnnotationView"
    xmlns:vw="clr-namespace:FingersDance.Views"
	x:Name="UserControl"
	d:DesignWidth="640" d:DesignHeight="480" Width="850" Height="40">
    <UserControl.Resources>
        <vw:ThicknessSingleValueConverter x:Name="myThicknessSingleValueConverter" x:Key="myThicknessSingleValueConverter"/>
        <vw:VisibilityConverter x:Name="myVisibilityConverter" x:Key="myVisibilityConverter"/>
        <vw:ColorConverter x:Name="myColorConverter" x:Key="myColorConverter"/>
    </UserControl.Resources>
    <Custom:SurfaceUserControl x:Name="LayoutRoot" Margin="{Binding Path=MarginLeft, Converter={StaticResource myThicknessSingleValueConverter}}"
                               >
        <Grid>
            <Rectangle Fill="Black" HorizontalAlignment="Left" VerticalAlignment="Top" Width="{Binding Path=Dur}" Height="40" Opacity="0.0"/>
            <TextBox HorizontalAlignment="Left" Text="{Binding Path=GestureType}" Width="40" Margin="0,20,0,0" Visibility="{Binding Path=Dur, Converter={StaticResource myVisibilityConverter}}"/>
            <Ellipse Stroke="{Binding Path=Color, Converter={StaticResource myColorConverter}}" Fill="{x:Null}" Margin="-3,16,0,0" Height="8" VerticalAlignment="Top" HorizontalAlignment="Left" Width="8"/>
            <Ellipse Fill="{Binding Path=Color, Converter={StaticResource myColorConverter}}" Margin="-2,17,0,0" Height="6" VerticalAlignment="Top" HorizontalAlignment="Left" Width="6" Visibility="{Binding Path=Dur, Converter={StaticResource myVisibilityConverter}}" />
            <Rectangle Fill="{Binding Path=Color, Converter={StaticResource myColorConverter}}" HorizontalAlignment="Left" VerticalAlignment="Top" Width="2" Height="17"/>
            <Rectangle Fill="{Binding Path=Color, Converter={StaticResource myColorConverter}}" HorizontalAlignment="Left" VerticalAlignment="Top" Width="{Binding Path=Dur}" Height="2"/>
        </Grid>
    </Custom:SurfaceUserControl>
</UserControl>