Files
Dwinzo_Demo/app/src/modules/scene/camera/switchView.tsx

70 lines
3.1 KiB
TypeScript

import { useEffect } from "react";
import { useThree } from "@react-three/fiber";
import * as THREE from "three";
import { PerspectiveCamera, OrthographicCamera, CameraControls } from "@react-three/drei";
import { useParams } from "react-router-dom";
import * as CONSTANTS from "../../../types/world/worldConstants";
import { getCameraApi } from "../../../services/factoryBuilder/camera/getCameraApi";
import { useToggleView } from "../../../store/builder/store";
import { useThreeDStore } from "../../../store/ui/useModuleStore";
export default function SwitchView() {
const { toggleView } = useToggleView();
const { controls } = useThree();
const { projectId } = useParams();
const { toggleThreeD } = useThreeDStore();
useEffect(() => {
if (toggleView && controls) {
(controls as any).mouseButtons.left = CONSTANTS.twoDimension.leftMouse;
(controls as any).mouseButtons.right = CONSTANTS.twoDimension.rightMouse;
} else {
if (!projectId) return;
getCameraApi(projectId)
.then((data) => {
if (data?.position && data?.target) {
(controls as CameraControls)?.setPosition(data.position.x, data.position.y, data.position.z);
(controls as CameraControls)?.setTarget(data.target.x, data.target.y, data.target.z);
} else {
(controls as CameraControls)?.setPosition(...CONSTANTS.threeDimension.defaultPosition);
(controls as CameraControls)?.setTarget(...CONSTANTS.threeDimension.defaultTarget);
}
})
.catch(() => {
echo.error("Failed to retrieve camera position or target");
(controls as CameraControls)?.setPosition(...CONSTANTS.threeDimension.defaultPosition);
(controls as CameraControls)?.setTarget(...CONSTANTS.threeDimension.defaultTarget);
});
if (controls) {
(controls as any).mouseButtons.left = CONSTANTS.threeDimension.leftMouse;
(controls as any).mouseButtons.right = CONSTANTS.threeDimension.rightMouse;
}
}
}, [toggleView, controls, projectId]);
return (
<>
{(toggleView || !toggleThreeD) ? (
<OrthographicCamera
makeDefault
position={CONSTANTS.twoDimension.defaultPosition}
zoom={10}
near={0.01}
far={1000}
onUpdate={(self) => self.lookAt(new THREE.Vector3(...CONSTANTS.twoDimension.defaultTarget))}
/>
) : (
<PerspectiveCamera
makeDefault
fov={75}
position={CONSTANTS.threeDimension.defaultPosition}
near={0.01}
far={1000}
onUpdate={(self) => self.lookAt(new THREE.Vector3(...CONSTANTS.threeDimension.defaultTarget))}
/>
)}
</>
);
}