zack3d/big-agi
1
0
Fork 0
mirror of https://github.com/enricoros/big-AGI.git synced 2026-05-10 21:50:14 -07:00
Code Issues Packages Projects Releases Wiki Activity

Camera: flip better

Browse Source
This commit is contained in:
Enrico Ros
2024-09-22 15:27:04 -07:00
parent 00093e42be
commit 0fa3ea0ff6
1 changed files with 22 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/apps/chat/components/composer/CameraCaptureModal.tsx
+22 -5
View File
@@ -4,6 +4,8 @@ import type { SxProps } from '@mui/joy/styles/types';
import { Box, Button, ButtonGroup, IconButton, Modal, ModalClose, Option, Select, Sheet, Tooltip, Typography } from '@mui/joy';
import AddRoundedIcon from '@mui/icons-material/AddRounded';
import CameraEnhanceIcon from '@mui/icons-material/CameraEnhance';
import CameraFrontIcon from '@mui/icons-material/CameraFront';
import CameraRearIcon from '@mui/icons-material/CameraRear';
import DownloadIcon from '@mui/icons-material/Download';
import FlipCameraAndroidOutlinedIcon from '@mui/icons-material/FlipCameraAndroidOutlined';
import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
@@ -141,8 +143,22 @@ export function CameraCaptureModal(props: {
return cameras;
}, [cameras]);
const canSwitchCameras = React.useMemo(() => {
if (displayCameras.length <= 1) return false;
const { canSwitchCameras, isFrontCamera, isBackCamera } = React.useMemo(() => {
// determine if the current device is a front or back camera
let isFrontCamera = false;
let isBackCamera = false;
if (cameraIdx !== -1) {
const currentDevice = displayCameras[cameraIdx];
if (currentDevice) {
isFrontCamera = currentDevice.label.includes('Front Camera') || currentDevice.label.toLowerCase().includes('front');
isBackCamera = currentDevice.label.includes('Back Camera') || currentDevice.label.toLowerCase().includes('back');
}
}
// quick out if we only have 1 or 0 cameras
if (displayCameras.length <= 1)
return { canSwitchCameras: false, isFrontCamera, isBackCamera };
// use a reduction to find both the front and back cameras
const foundCameras = displayCameras.reduce((acc, device) => {
@@ -154,8 +170,8 @@ export function CameraCaptureModal(props: {
return acc;
}, { front: false, back: false });
return (foundCameras.front && foundCameras.back) || displayCameras.length === 2;
}, [displayCameras]);
return { canSwitchCameras: (foundCameras.front && foundCameras.back) || displayCameras.length === 2, isFrontCamera, isBackCamera };
}, [cameraIdx, displayCameras]);
const handleCameraSwitch = React.useCallback(() => {
@@ -188,6 +204,7 @@ export function CameraCaptureModal(props: {
setCameraIdx(nextIdx);
}, [cameraIdx, displayCameras, setCameraIdx]);
return (
<Modal
open
@@ -250,7 +267,7 @@ export function CameraCaptureModal(props: {
{canSwitchCameras && (
<IconButton onClick={handleCameraSwitch}>
<FlipCameraAndroidOutlinedIcon />
{isFrontCamera ? <CameraRearIcon /> : isBackCamera ? <CameraFrontIcon /> : <FlipCameraAndroidOutlinedIcon />}
</IconButton>
)}
</Box>