pierre/GeneIT
1
0
Fork 0
Code Issues Pull Requests 4 Packages Projects Releases Wiki Activity

Update simple tree appearance
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Pierre HUBERT 2023-08-26 15:05:53 +02:00
parent 966bae979b
commit d0013d41bb
2 changed files with 20 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
geneit_app/src/api/MemberApi.ts
View File

@ -107,6 +107,10 @@ export class Member implements MemberDataApi {
}); });
} }
get lastNameUpperCase(): string | undefined {
return this.last_name?.toUpperCase();
}
get fullName(): string { get fullName(): string {
const firstName = this.first_name ?? ""; const firstName = this.first_name ?? "";

21
geneit_app/src/widgets/simple_family_tree/SimpleFamilyTree.tsx
View File

@ -16,7 +16,7 @@ const FACE_TEXT_SPACING = 2;
/** /**
* Cards height * Cards height
*/ */
const CARD_HEIGHT = 103; const CARD_HEIGHT = 114;
/** /**
* Space between spouse cards * Space between spouse cards
@ -26,7 +26,7 @@ const SPOUSE_SPACING = 10;
/** /**
* Space between two siblings hierachy * Space between two siblings hierachy
*/ */
const SIBLINGS_SPACING = 10; const SIBLINGS_SPACING = 0;
/** /**
* Vertical space between two generations * Vertical space between two generations
@ -235,7 +235,7 @@ function NodeArea(p: {
} else { } else {
childrenLinkX = childrenLinkX =
parent_x_offset + Math.floor(memberCardWidth(p.node.member) / 2); parent_x_offset + Math.floor(memberCardWidth(p.node.member) / 2);
childrenLinkY = p.y + CARD_HEIGHT; childrenLinkY = p.y + CARD_HEIGHT + 2;
} }
return ( return (
@ -320,12 +320,23 @@ function MemberCard(p: {
{/* Member text */} {/* Member text */}
<text y={FACE_HEIGHT + FACE_TEXT_SPACING}> <text y={FACE_HEIGHT + FACE_TEXT_SPACING}>
<tspan <tspan
x={center(w, getTextWidth(p.member.fullName, NAME_FONT))} x={center(w, getTextWidth(p.member.first_name ?? "", NAME_FONT))}
dy="14" dy="14"
font-size="13" font-size="13"
fontFamily="Roboto" fontFamily="Roboto"
> >
{p.member.fullName} {p.member.first_name ?? ""}
</tspan>
<tspan
x={center(
w,
getTextWidth(p.member.lastNameUpperCase ?? "", NAME_FONT)
)}
dy="14"
font-size="13"
fontFamily="Roboto"
>
{p.member.lastNameUpperCase ?? ""}
</tspan> </tspan>
<tspan <tspan
x={center(w, getTextWidth(p.member.displayBirthDeath, BIRTH_FONT))} x={center(w, getTextWidth(p.member.displayBirthDeath, BIRTH_FONT))}