73 lines
3.7 KiB
TypeScript
73 lines
3.7 KiB
TypeScript
import * as THREE from "three";
|
|
import { useEffect, useRef } from "react";
|
|
import { useToggleView } from "../../../store/builder/store";
|
|
import { useThree } from "@react-three/fiber";
|
|
import { getCamera } from "../../../services/factoryBuilder/camera/getCameraApi";
|
|
import * as CONSTANTS from '../../../types/world/worldConstants';
|
|
import { useParams } from "react-router-dom";
|
|
|
|
export default function SwitchView() {
|
|
const { toggleView } = useToggleView();
|
|
const state: any = useThree();
|
|
const { set } = useThree();
|
|
const perspectiveCamera = useRef<THREE.PerspectiveCamera | null>(null);
|
|
const orthoCamera = useRef<THREE.OrthographicCamera | null>(null);
|
|
orthoCamera.current = new THREE.OrthographicCamera(-window.innerWidth / 2, window.innerWidth / 2, window.innerHeight / 2, -window.innerHeight / 2, 0.01, 1000);
|
|
perspectiveCamera.current = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.01, 1000);
|
|
const { projectId } = useParams();
|
|
|
|
useEffect(() => {
|
|
if (!perspectiveCamera.current || !orthoCamera.current) return;
|
|
if (toggleView) {
|
|
orthoCamera.current.zoom = 10;
|
|
orthoCamera.current.position.set(...CONSTANTS.twoDimension.defaultPosition);
|
|
orthoCamera.current.lookAt(new THREE.Vector3(...CONSTANTS.twoDimension.defaultTarget));
|
|
orthoCamera.current.updateProjectionMatrix();
|
|
set({ camera: orthoCamera.current });
|
|
orthoCamera.current.updateProjectionMatrix();
|
|
} else if (!toggleView) {
|
|
perspectiveCamera.current.position.set(...CONSTANTS.threeDimension.defaultPosition);
|
|
perspectiveCamera.current.lookAt(new THREE.Vector3(...CONSTANTS.threeDimension.defaultTarget));
|
|
set({ camera: perspectiveCamera.current });
|
|
}
|
|
}, [toggleView, set]);
|
|
|
|
useEffect(() => {
|
|
if (toggleView && state.controls) {
|
|
state.controls.mouseButtons.left = CONSTANTS.twoDimension.leftMouse;
|
|
state.controls.mouseButtons.right = CONSTANTS.twoDimension.rightMouse;
|
|
} else {
|
|
try {
|
|
const email = localStorage.getItem('email');
|
|
const organization = (email!.split("@")[1]).split(".")[0];
|
|
getCamera(organization, localStorage.getItem('userId')!,projectId).then((data) => {
|
|
if (data && data.position && data.target) {
|
|
state.controls?.setPosition(data.position.x, data.position.y, data.position.z);
|
|
state.controls?.setTarget(data.target.x, data.target.y, data.target.z);
|
|
localStorage.setItem("cameraPosition", JSON.stringify(data.position));
|
|
localStorage.setItem("controlTarget", JSON.stringify(data.target));
|
|
} else {
|
|
state.controls?.setPosition(...CONSTANTS.threeDimension.defaultPosition);
|
|
state.controls?.setTarget(...CONSTANTS.threeDimension.defaultTarget);
|
|
localStorage.setItem("cameraPosition", JSON.stringify(new THREE.Vector3(...CONSTANTS.threeDimension.defaultPosition)));
|
|
localStorage.setItem("controlTarget", JSON.stringify(new THREE.Vector3(...CONSTANTS.threeDimension.defaultTarget)));
|
|
}
|
|
});
|
|
} catch (error) {
|
|
echo.error("Failed to retrieve camera position or target");
|
|
console.error("Failed to retrieve camera position or target:", error);
|
|
state.controls?.setPosition(...CONSTANTS.threeDimension.defaultPosition);
|
|
state.controls?.setTarget(...CONSTANTS.threeDimension.defaultTarget);
|
|
}
|
|
|
|
if (state.controls) {
|
|
state.controls.mouseButtons.left = CONSTANTS.threeDimension.leftMouse;
|
|
state.controls.mouseButtons.right = CONSTANTS.threeDimension.rightMouse;
|
|
}
|
|
}
|
|
}, [toggleView, state.controls]);
|
|
|
|
return (
|
|
<></>
|
|
);
|
|
} |