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

Use different aspect ratio for single member and couple

Browse Source
This commit is contained in:
Pierre HUBERT 2023-08-16 12:18:47 +02:00
parent 328eada9ec
commit ac2004a51d
4 changed files with 6 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
geneit_app/src/dialogs/ImageCropperDialog.tsx
View File

@ -15,6 +15,7 @@ export function ImageCropperDialog(p: {
onCancel: () => void; onCancel: () => void;
onSubmit: (croppedArea: Area | undefined) => void; onSubmit: (croppedArea: Area | undefined) => void;
processing: boolean; processing: boolean;
aspect?: number;
}): React.ReactElement { }): React.ReactElement {
const [crop, setCrop] = React.useState({ x: 0, y: 0 }); const [crop, setCrop] = React.useState({ x: 0, y: 0 });
const [zoom, setZoom] = React.useState(1); const [zoom, setZoom] = React.useState(1);
@ -34,7 +35,7 @@ export function ImageCropperDialog(p: {
image={p.src} image={p.src}
crop={crop} crop={crop}
zoom={zoom} zoom={zoom}
aspect={4 / 5} aspect={p.aspect}
onCropChange={setCrop} onCropChange={setCrop}
onCropComplete={(_a, b) => setCroppedArea(b)} onCropComplete={(_a, b) => setCroppedArea(b)}
onZoomChange={setZoom} onZoomChange={setZoom}

1
geneit_app/src/routes/family/FamilyCoupleRoute.tsx
View File

@ -376,6 +376,7 @@ export function CouplePage(p: {
<UploadPhotoButton <UploadPhotoButton
label={couple.hasPhoto ? "Remplacer" : "Ajouter"} label={couple.hasPhoto ? "Remplacer" : "Ajouter"}
onPhotoSelected={uploadNewPhoto} onPhotoSelected={uploadNewPhoto}
aspect={5 / 4}
/>{" "} />{" "}
{couple.hasPhoto && ( {couple.hasPhoto && (
<RouterLink to={couple.photoURL!} target="_blank"> <RouterLink to={couple.photoURL!} target="_blank">

1
geneit_app/src/routes/family/FamilyMemberRoute.tsx
View File

@ -476,6 +476,7 @@ export function MemberPage(p: {
<UploadPhotoButton <UploadPhotoButton
label={member.hasPhoto ? "Remplacer" : "Ajouter"} label={member.hasPhoto ? "Remplacer" : "Ajouter"}
onPhotoSelected={uploadNewPhoto} onPhotoSelected={uploadNewPhoto}
aspect={4 / 5}
/>{" "} />{" "}
{member.hasPhoto && ( {member.hasPhoto && (
<RouterLink to={member.photoURL!} target="_blank"> <RouterLink to={member.photoURL!} target="_blank">

2
geneit_app/src/widgets/forms/UploadPhotoButton.tsx
View File

@ -13,6 +13,7 @@ import { isDebug } from "../../utils/debug_utils";
export function UploadPhotoButton(p: { export function UploadPhotoButton(p: {
label: string; label: string;
onPhotoSelected: (b: Blob) => Promise<void>; onPhotoSelected: (b: Blob) => Promise<void>;
aspect?: number;
}): React.ReactElement { }): React.ReactElement {
const [processing, setProcessing] = React.useState(false); const [processing, setProcessing] = React.useState(false);
const [imageBlob, setImageBlob] = React.useState<Blob>(); const [imageBlob, setImageBlob] = React.useState<Blob>();
@ -115,6 +116,7 @@ export function UploadPhotoButton(p: {
src={imageURL!} src={imageURL!}
onCancel={cancelCrop} onCancel={cancelCrop}
onSubmit={submitCrop} onSubmit={submitCrop}
aspect={p.aspect}
/> />
)} )}
</> </>