pat-family-tree

[emmanuelkaufmann]

The framework that we use is Family Chart.

Proposed properties:

Done	Option	Default	Values	Description
[x]	search		CSS Selector
[x]	initial-centre/initial-center		Card ID	Centres that card.
[ ]	centre	auto	auto / manual	When ‘auto’, the card that is expanded by the user will be centred, together with its expansion.
[x]	initial-zoom		Number	Initial zoom level.
[x]	zoom	auto	auto / manual	When ‘auto’, the pattern will zoom in on the centred card. When a user expands a part of the tree, the expansion will be fitted.
[x]	zoom-in		CSS Selector
[x]	zoom-out		CSS Selector
[x]	fit		CSS Selector
[ ]	layout	vertical	horizontal / vertical
[x]	siblings	show	show / hide
[ ]	popup-template		CSS Selector
[ ]	mini-tree	hide	show / hide
[x]	transition-duration	200ms	Duration (s or ms)	Duration in milliseconds.
[ ]	card-width	300	Number (pixels)	Card width in pixels.
[ ]	card-height	auto	auto / Number (pixels)

Main concerns:

• Siblings. We do not want to hide the sibling, when expanding part of the tree. The property 'siblings' is intended to steer this.
• Initial zoom.
• Initial centre.
• Card width and height.
• Expand buttons. If the framework supports this: We would like to have a separate element on each card (button) for expanding the parents. Similarly another button for expanding the children, but this button should probably be on the centre joint of the lines. If not supported out of the box, let's discuss alternatives. This instead of having the entire card clickable.
• Search
• Zoom

Available aspects of the library that we can manipulate

Options (some of many):

• Big Tree is what we have right now: https://donatso.github.io/family-chart-doc/examples/v2/10-big-tree
• Zoom to Card behaves explorative (tree stays same and expands when border is approached) https://donatso.github.io/family-chart-doc/examples/v2/9-zoom-to-card
• Trim Tree only shows parents and children: https://donatso.github.io/family-chart-doc/examples/v2/15-trim-tree

Questions:

• Mark or Highlight where I have clicked or when linked from outside?

The chart library allows us to change the following aspects:

• search (property to specify search field)
• set person as main (centers that person and blends out siblings, functionality already available)(Filter on main line and zoom)
• zoom (functionality already available via scrolling by mouse/touchpad)
• zoom to specific card (conflicts with set person as main)
• fit tree (button with circle)
• animation transition time (property)
• horizontal/vertical spacing is already implemented. (property)
• toggle visibility of siblings (
• popup for more details (link to profile)
• show a mini tree

Optional

• dim cards
• horizontal layout

What we want:

• Click on card: Center

Which Template Attributes?

Already existing are:

• avatar_label
• avatar_url
• first_name
• last_name
• description (Could be used to generically combine other properties)
• gender
• children

New to add?

Which properties should the pattern fill in the card template?

• Birth date
• Link to more info?
• title
• displayname
• nationality
• nickname
• death date?
• address
• phone
• email
• job (job title)