<!-- Copyright © Northwoods Software Corporation, 2008-2026. All Rights Reserved. -->

<UserControl x:Class="FamilyTree.FamilyTree"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:go="http://schemas.nwoods.com/GoXam"
    xmlns:local="clr-namespace:FamilyTree">

  <UserControl.Resources>
    <local:GenderBrushConverter x:Key="theGenderBrushConverter"
                                TrueBrush="#90ee90" FalseBrush="#ffc0cb" NullBrush="#f4a460" />
    <go:CountVisibilityConverter x:Key="theCountVisibilityConverter" />

    <DataTemplate x:Key="NodeTemplate">
      <Border BorderBrush="Black" BorderThickness="1" CornerRadius="3"
              Background="{Binding Path=Data.Gender,
                           Converter={StaticResource theGenderBrushConverter}}"
              go:Part.SelectionAdorned="True">
        <TextBlock Text="{Binding Path=Data.Name}" TextAlignment="Center"
                   FontWeight="Bold" TextWrapping="Wrap" Margin="4 4 4 2" />
        <ToolTipService.ToolTip>
          <TextBlock Text="{Binding Path=Data.Details}"
                   Visibility="{Binding Path=Data.Details.Length,
                                Converter={StaticResource theCountVisibilityConverter}}" />
        </ToolTipService.ToolTip>
      </Border>
    </DataTemplate>

    <!-- This DataTemplateDictionary contains 2 templates.
         Depending on the value of a certain property in each individual
         Link data type, one of these two templates will be used.
         The exact property is set in the code by:
            Model.LinkCategoryPath = "Category"; -->
    <go:DataTemplateDictionary x:Key="LinkTemplateDictionary">
      <DataTemplate x:Key="Child">
        <go:LinkPanel>
          <go:Link.Route>
            <go:Route Routing="Orthogonal" FromSpot="BottomCenter" ToSpot="TopCenter" />
          </go:Link.Route>
          <go:LinkShape Stroke="Black" StrokeThickness="1" />
          <Path Fill="Black" go:LinkPanel.ToArrow="Triangle" />
        </go:LinkPanel>
      </DataTemplate>
      <DataTemplate x:Key="Marriage">
        <go:LinkPanel>
          <go:Link.Route>
            <go:Route Routing="Orthogonal" FromSpot="MiddleRight" ToSpot="MiddleLeft" />
          </go:Link.Route>
          <go:LinkShape Stroke="Red" StrokeThickness="2" />
        </go:LinkPanel>
      </DataTemplate>
    </go:DataTemplateDictionary>

  </UserControl.Resources>

  <Grid>
    <go:Diagram x:Name="myDiagram" Padding="10"
                HorizontalContentAlignment="Center"
                VerticalContentAlignment="Center"
                NodeTemplate="{StaticResource NodeTemplate}"
                LinkTemplateDictionary="{StaticResource LinkTemplateDictionary}">
      <go:Diagram.Layout>
        <!-- although the graph is not strictly a tree,
             it's close enough to a tree to use a TreeLayout -->
        <go:TreeLayout Angle="90" LayerSpacing="50" NodeSpacing="20"
                       SetsChildPortSpot="False" SetsPortSpot="False" />
      </go:Diagram.Layout>
    </go:Diagram>
    <!--This will be the legend to help explain the diagram -->
    <Border BorderBrush="Black" BorderThickness="1" Background="White"
            CornerRadius="5" Padding="3" Margin="20"
            HorizontalAlignment="Right" VerticalAlignment="Bottom">
      <StackPanel>
        <TextBlock Text="Key" FontWeight="Bold" HorizontalAlignment="Center" />
        <StackPanel Orientation="Horizontal">
          <Border BorderBrush="Black" BorderThickness="1" Margin="3">
            <Rectangle Width="23" Height="21" Fill="Pink" />
          </Border>
          <TextBlock Text="Males" Margin="3" />
        </StackPanel>
        <StackPanel Orientation="Horizontal">
          <Border BorderBrush="Black" BorderThickness="1" Margin="3">
            <Rectangle Width="23" Height="21" Fill="LightGreen" />
          </Border>
          <TextBlock Text="Females" Margin="3" />
        </StackPanel>
        <StackPanel Orientation="Horizontal">
          <Border BorderBrush="Black" BorderThickness="1" Margin="3">
            <Grid>
              <Polyline Points="2 0 2 10 20 10 20 20" Stroke="Black" />
              <Polygon Points="20 18 22 16 20 20 18 16 20 18" Fill="Black" />
            </Grid>
          </Border>
          <TextBlock Text="Parent-Child" Margin="3" />
        </StackPanel>
        <StackPanel Orientation="Horizontal">
          <Border BorderBrush="Black" BorderThickness="1" Margin="3">
            <Polyline Points="1 1 1 11 21 11 21 21" Stroke="Red" StrokeThickness="2" />
          </Border>
          <TextBlock Text="Marriage" Margin="3" />
        </StackPanel>
      </StackPanel>
    </Border>
  </Grid>
</UserControl>