107 lines
3.2 KiB
TypeScript
107 lines
3.2 KiB
TypeScript
////////// Three and React Three Fiber Imports //////////
|
|
|
|
import * as THREE from "three";
|
|
import { useEffect, useRef } from "react";
|
|
import { useFrame, useThree } from "@react-three/fiber";
|
|
import { Geometry } from "@react-three/csg";
|
|
|
|
////////// Zustand State Imports //////////
|
|
|
|
import { useToggleView, useWallVisibility, useRoofVisibility, useShadows, useToolMode, useRenderDistance, useLimitDistance } from "../../store/builder/store";
|
|
|
|
////////// 3D Function Imports //////////
|
|
|
|
import * as Types from "../../types/world/worldTypes";
|
|
|
|
import Ground from "../scene/environment/ground";
|
|
import MeasurementTool from "../scene/tools/measurementTool";
|
|
import NavMesh from "../simulation/vehicle/navMesh/navMesh";
|
|
import LayoutImage from "./layout/layoutImage";
|
|
import AssetsGroup from "./asset/assetsGroup";
|
|
import DxfFile from "./dfx/LoadBlueprint";
|
|
import AislesGroup from "./aisle/aislesGroup";
|
|
import WallGroup from "./wall/wallGroup";
|
|
import WallAssetGroup from "./wallAsset/wallAssetGroup";
|
|
import FloorGroup from "./floor/floorGroup";
|
|
import ZoneGroup from "./zone/zoneGroup";
|
|
import Decal from "./Decal/decal";
|
|
|
|
import { useParams } from "react-router-dom";
|
|
import { useBuilderStore } from "../../store/builder/useBuilderStore";
|
|
import { findEnvironment } from "../../services/factoryBuilder/environment/findEnvironment";
|
|
|
|
export default function Builder() {
|
|
const state = useThree<Types.ThreeState>();
|
|
const plane = useRef<THREE.Mesh>(null);
|
|
const csgRef = useRef<any>(null);
|
|
|
|
const { toggleView } = useToggleView();
|
|
const { setToolMode } = useToolMode();
|
|
const { setRoofVisibility } = useRoofVisibility();
|
|
const { setWallVisibility } = useWallVisibility();
|
|
const { setShadows } = useShadows();
|
|
const { setRenderDistance } = useRenderDistance();
|
|
const { setLimitDistance } = useLimitDistance();
|
|
const { projectId } = useParams();
|
|
const { setHoveredPoint, setHoveredLine } = useBuilderStore();
|
|
|
|
useEffect(() => {
|
|
if (!toggleView) {
|
|
setHoveredLine(null);
|
|
setHoveredPoint(null);
|
|
state.gl.domElement.style.cursor = "default";
|
|
setToolMode("cursor");
|
|
}
|
|
}, [toggleView]);
|
|
|
|
useEffect(() => {
|
|
if (!projectId) return;
|
|
|
|
findEnvironment(projectId).then((data) => {
|
|
setRoofVisibility(data.roofVisibility);
|
|
setWallVisibility(data.wallVisibility);
|
|
setShadows(data.shadowVisibility);
|
|
setRenderDistance(data.renderDistance);
|
|
setLimitDistance(data.limitDistance);
|
|
});
|
|
}, [projectId]);
|
|
|
|
useFrame(() => {
|
|
if (csgRef.current) {
|
|
csgRef.current.update();
|
|
}
|
|
});
|
|
|
|
return (
|
|
<>
|
|
<Ground plane={plane} />
|
|
|
|
<AssetsGroup plane={plane} />
|
|
|
|
<mesh name="Walls-And-WallAssets-Group">
|
|
<Geometry ref={csgRef} useGroups>
|
|
<WallGroup />
|
|
|
|
<WallAssetGroup />
|
|
</Geometry>
|
|
</mesh>
|
|
|
|
<Decal />
|
|
|
|
<AislesGroup />
|
|
|
|
<FloorGroup />
|
|
|
|
<ZoneGroup />
|
|
|
|
<MeasurementTool />
|
|
|
|
<NavMesh />
|
|
|
|
<DxfFile />
|
|
|
|
<LayoutImage />
|
|
</>
|
|
);
|
|
}
|