Dwinzo-Beta/Dwinzo_Demo
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added wall asset visiblity toggle and code optimization

Browse Source
This commit is contained in:
Jerald-Golden-B
2025-08-23 12:26:45 +05:30
parent 8b01372d08
commit 21cd12b518
15 changed files with 172 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
app/src/modules/scene/controls/contextControls/contextControls.tsx
View File

@@ -1,4 +1,4 @@
import { useEffect, useState } from 'react';
import { useEffect, useRef, useState } from 'react';
import { useThree } from '@react-three/fiber';
import { CameraControls, Html, ScreenSpace } from '@react-three/drei';
import { useContextActionStore, useRenameModeStore, useSelectedAssets } from '../../../../store/builder/store';
@@ -12,6 +12,8 @@ function ContextControls() {
const { selectedAssets } = useSelectedAssets();
const { setContextAction } = useContextActionStore();
const { setIsRenameMode } = useRenameModeStore();
const rightDrag = useRef(false);
const isRightMouseDown = useRef(false);
useEffect(() => {
if (selectedAssets.length === 1) {
@@ -68,8 +70,28 @@ function ContextControls() {
useEffect(() => {
const canvasElement = gl.domElement;
const onPointerDown = (evt: any) => {
if (evt.button === 2) {
isRightMouseDown.current = true;
rightDrag.current = false;
}
};
const onPointerMove = () => {
if (isRightMouseDown.current) {
rightDrag.current = true;
}
};
const onPointerUp = (evt: any) => {
if (evt.button === 2) {
isRightMouseDown.current = false;
}
};
const handleContextClick = (event: MouseEvent) => {
event.preventDefault();
if (rightDrag.current) return;
if (selectedAssets.length > 0) {
setMenuPosition({ x: event.clientX - gl.domElement.width / 2, y: event.clientY - gl.domElement.height / 2 });
setCanRender(true);
@@ -85,6 +107,9 @@ function ContextControls() {
};
if (selectedAssets.length > 0) {
canvasElement.addEventListener('pointerdown', onPointerDown);
canvasElement.addEventListener('pointermove', onPointerMove);
canvasElement.addEventListener('pointerup', onPointerUp);
canvasElement.addEventListener('contextmenu', handleContextClick)
} else {
setCanRender(false);
@@ -95,6 +120,9 @@ function ContextControls() {
}
return () => {
canvasElement.removeEventListener('pointerdown', onPointerDown);
canvasElement.removeEventListener('pointermove', onPointerMove);
canvasElement.removeEventListener('pointerup', onPointerUp);
canvasElement.removeEventListener('contextmenu', handleContextClick);
};
}, [gl, selectedAssets]);

4
app/src/modules/scene/controls/selectionControls/selection2D/moveControls2D.tsx
View File

@@ -19,7 +19,7 @@ function MoveControls2D({
movedObjects,
setMovedObjects,
pastedObjects,
setpastedObjects,
setPastedObjects,
duplicatedObjects,
setDuplicatedObjects,
rotatedObjects,
@@ -525,7 +525,7 @@ function MoveControls2D({
};
const clearSelection = () => {
setpastedObjects([]);
setPastedObjects([]);
setDuplicatedObjects([]);
setMovedObjects([]);
setRotatedObjects([]);

6
app/src/modules/scene/controls/selectionControls/selection2D/selectionControls2D.tsx
View File

@@ -28,7 +28,7 @@ const SelectionControls2D: React.FC = () => {
const [movedObjects, setMovedObjects] = useState<THREE.Object3D[]>([]);
const [rotatedObjects, setRotatedObjects] = useState<THREE.Object3D[]>([]);
const [copiedObjects, setCopiedObjects] = useState<THREE.Object3D[]>([]);
const [pastedObjects, setpastedObjects] = useState<THREE.Object3D[]>([]);
const [pastedObjects, setPastedObjects] = useState<THREE.Object3D[]>([]);
const [duplicatedObjects, setDuplicatedObjects] = useState<THREE.Object3D[]>([]);
const { activeModule } = useModuleStore();
const { socket } = useSocketStore();
@@ -216,7 +216,7 @@ const SelectionControls2D: React.FC = () => {
}, [selectionBox, pointer, controls, selectedPoints, setSelectedPoints]);
const clearSelection = () => {
setpastedObjects([]);
setPastedObjects([]);
setDuplicatedObjects([]);
clearSelectedPoints();
};
@@ -594,7 +594,7 @@ const SelectionControls2D: React.FC = () => {
return (
<>
<MoveControls2D movedObjects={movedObjects} setMovedObjects={setMovedObjects} pastedObjects={pastedObjects} setpastedObjects={setpastedObjects} duplicatedObjects={duplicatedObjects} setDuplicatedObjects={setDuplicatedObjects} rotatedObjects={rotatedObjects} setRotatedObjects={setRotatedObjects} />
<MoveControls2D movedObjects={movedObjects} setMovedObjects={setMovedObjects} pastedObjects={pastedObjects} setPastedObjects={setPastedObjects} duplicatedObjects={duplicatedObjects} setDuplicatedObjects={setDuplicatedObjects} rotatedObjects={rotatedObjects} setRotatedObjects={setRotatedObjects} />
</>
);

23
app/src/modules/scene/controls/selectionControls/selection3D/copyPasteControls3D.tsx
View File

@@ -12,17 +12,7 @@ import { useVersionContext } from "../../../../builder/version/versionContext";
// import { setAssetsApi } from "../../../../../services/factoryBuilder/asset/floorAsset/setAssetsApi";
const CopyPasteControls3D = ({
copiedObjects,
setCopiedObjects,
pastedObjects,
setpastedObjects,
setDuplicatedObjects,
movedObjects,
setMovedObjects,
rotatedObjects,
setRotatedObjects,
}: any) => {
const CopyPasteControls3D = () => {
const { camera, controls, gl, scene, pointer, raycaster } = useThree();
const { toggleView } = useToggleView();
const { selectedAssets, setSelectedAssets } = useSelectedAssets();
@@ -32,7 +22,7 @@ const CopyPasteControls3D = ({
const { push3D } = undoRedo3DStore();
const { addEvent } = eventStore();
const { projectId } = useParams();
const { assets, addAsset, updateAsset, removeAsset, getAssetById } = assetStore();
const { assets, addAsset, updateAsset, removeAsset, getAssetById, copiedObjects, setCopiedObjects, pastedObjects, setPastedObjects, setDuplicatedObjects, movedObjects, setMovedObjects, rotatedObjects, setRotatedObjects } = assetStore();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const { userId, organization } = getUserData();
@@ -177,7 +167,7 @@ const CopyPasteControls3D = ({
return clone;
});
setpastedObjects(newPastedObjects);
setPastedObjects(newPastedObjects);
raycaster.setFromCamera(pointer, camera);
const intersectionPoint = new THREE.Vector3();
@@ -430,6 +420,11 @@ const CopyPasteControls3D = ({
actionName: "Action 1",
actionType: "worker",
loadCapacity: 1,
assemblyCount: 1,
assemblyCondition: {
conditionType: 'material',
materialType: "Default material"
},
manufactureCount: 1,
loadCount: 1,
processTime: 10,
@@ -593,7 +588,7 @@ const CopyPasteControls3D = ({
const clearSelection = () => {
setMovedObjects([]);
setpastedObjects([]);
setPastedObjects([]);
setDuplicatedObjects([]);
setRotatedObjects([]);
setSelectedAssets([]);

19
app/src/modules/scene/controls/selectionControls/selection3D/duplicationControls3D.tsx
View File

@@ -13,15 +13,7 @@ import { handleAssetPositionSnap } from "./functions/handleAssetPositionSnap";
// import { setAssetsApi } from "../../../../../services/factoryBuilder/asset/floorAsset/setAssetsApi";
const DuplicationControls3D = ({
duplicatedObjects,
setDuplicatedObjects,
setpastedObjects,
movedObjects,
setMovedObjects,
rotatedObjects,
setRotatedObjects,
}: any) => {
const DuplicationControls3D = () => {
const { camera, controls, gl, scene, pointer, raycaster } = useThree();
const { toggleView } = useToggleView();
const { selectedAssets, setSelectedAssets } = useSelectedAssets();
@@ -31,7 +23,7 @@ const DuplicationControls3D = ({
const { push3D } = undoRedo3DStore();
const { addEvent } = eventStore();
const { projectId } = useParams();
const { assets, addAsset, updateAsset, removeAsset, getAssetById } = assetStore();
const { assets, addAsset, updateAsset, removeAsset, getAssetById, duplicatedObjects, setDuplicatedObjects, setPastedObjects, movedObjects, setMovedObjects, rotatedObjects, setRotatedObjects } = assetStore();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const { userId, organization } = getUserData();
@@ -497,6 +489,11 @@ const DuplicationControls3D = ({
actionName: "Action 1",
actionType: "worker",
loadCapacity: 1,
assemblyCount: 1,
assemblyCondition: {
conditionType: 'material',
materialType: "Default material"
},
manufactureCount: 1,
loadCount: 1,
processTime: 10,
@@ -660,7 +657,7 @@ const DuplicationControls3D = ({
const clearSelection = () => {
setMovedObjects([]);
setpastedObjects([]);
setPastedObjects([]);
setDuplicatedObjects([]);
setRotatedObjects([]);
setSelectedAssets([]);

20
app/src/modules/scene/controls/selectionControls/selection3D/moveControls3D.tsx
View File

@@ -15,17 +15,7 @@ import { useVersionContext } from "../../../../builder/version/versionContext";
// import { setAssetsApi } from '../../../../../services/factoryBuilder/asset/floorAsset/setAssetsApi';
function MoveControls3D({
movedObjects,
setMovedObjects,
pastedObjects,
setpastedObjects,
duplicatedObjects,
setDuplicatedObjects,
rotatedObjects,
setRotatedObjects,
boundingBoxRef,
}: any) {
function MoveControls3D({ boundingBoxRef }: any) {
const { camera, controls, gl, scene, pointer, raycaster } = useThree();
const plane = useMemo(() => new THREE.Plane(new THREE.Vector3(0, 1, 0), 0), []);
@@ -38,7 +28,7 @@ function MoveControls3D({
const { projectId } = useParams();
const { assetStore, eventStore, productStore, undoRedo3DStore } = useSceneContext();
const { push3D } = undoRedo3DStore();
const { updateAsset, getAssetById } = assetStore();
const { updateAsset, getAssetById, movedObjects, setMovedObjects, pastedObjects, setPastedObjects, duplicatedObjects, setDuplicatedObjects, rotatedObjects, setRotatedObjects } = assetStore();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
@@ -186,7 +176,7 @@ function MoveControls3D({
canvasElement.removeEventListener("keydown", onKeyDown);
canvasElement?.removeEventListener("keyup", onKeyUp);
};
}, [camera, controls, scene, toggleView, selectedAssets, socket, pastedObjects, duplicatedObjects, movedObjects, rotatedObjects, keyEvent]);
}, [camera, controls, scene, toggleView, selectedAssets, socket, pastedObjects, duplicatedObjects, movedObjects, rotatedObjects, keyEvent, initialStates]);
const calculateDragOffset = useCallback((point: THREE.Object3D, hitPoint: THREE.Vector3) => {
const pointPosition = new THREE.Vector3().copy(point.position);
@@ -220,7 +210,7 @@ function MoveControls3D({
}
});
setAxisConstraint(null);
}, 100)
}, 50)
}, [movedObjects, initialStates, updateAsset]);
useEffect(() => {
@@ -462,7 +452,7 @@ function MoveControls3D({
};
const clearSelection = () => {
setpastedObjects([]);
setPastedObjects([]);
setDuplicatedObjects([]);
setMovedObjects([]);
setRotatedObjects([]);

19
app/src/modules/scene/controls/selectionControls/selection3D/rotateControls3D.tsx
View File

@@ -14,16 +14,7 @@ import { handleAssetRotationSnap } from "./functions/handleAssetRotationSnap";
// import { setAssetsApi } from '../../../../../services/factoryBuilder/asset/floorAsset/setAssetsApi';
function RotateControls3D({
rotatedObjects,
setRotatedObjects,
movedObjects,
setMovedObjects,
pastedObjects,
setpastedObjects,
duplicatedObjects,
setDuplicatedObjects
}: any) {
function RotateControls3D() {
const { camera, gl, scene, pointer, raycaster } = useThree();
const { toggleView } = useToggleView();
@@ -35,7 +26,7 @@ function RotateControls3D({
const { projectId } = useParams();
const { assetStore, eventStore, productStore, undoRedo3DStore } = useSceneContext();
const { push3D } = undoRedo3DStore();
const { updateAsset } = assetStore();
const { updateAsset, rotatedObjects, setRotatedObjects, movedObjects, setMovedObjects, pastedObjects, setPastedObjects, duplicatedObjects, setDuplicatedObjects } = assetStore();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
@@ -161,7 +152,7 @@ function RotateControls3D({
canvasElement.removeEventListener("keydown", onKeyDown);
canvasElement?.removeEventListener("keyup", onKeyUp);
};
}, [camera, scene, toggleView, selectedAssets, rotatedObjects, pastedObjects, duplicatedObjects, movedObjects, keyEvent]);
}, [camera, scene, toggleView, selectedAssets, rotatedObjects, pastedObjects, duplicatedObjects, movedObjects, keyEvent, initialPositions, initialRotations]);
const resetToInitialRotations = useCallback(() => {
setTimeout(() => {
@@ -185,7 +176,7 @@ function RotateControls3D({
}
}
});
}, 100)
}, 50)
}, [rotatedObjects, initialRotations, initialPositions, updateAsset]);
useFrame(() => {
@@ -397,7 +388,7 @@ function RotateControls3D({
}, [rotatedObjects, eventStore, productStore, selectedProduct, updateBackend, projectId, updateAsset, organization, socket, selectedVersion, userId]);
const clearSelection = () => {
setpastedObjects([]);
setPastedObjects([]);
setDuplicatedObjects([]);
setMovedObjects([]);
setRotatedObjects([]);

26
app/src/modules/scene/controls/selectionControls/selection3D/selectionControls3D.tsx
View File

@@ -1,4 +1,4 @@
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { useCallback, useEffect, useMemo, useRef } from "react";
import * as THREE from "three";
import { useThree } from "@react-three/fiber";
import { SelectionHelper } from "../selectionHelper";
@@ -23,18 +23,13 @@ const SelectionControls3D: React.FC = () => {
const { camera, controls, gl, scene, raycaster, pointer } = useThree();
const { toggleView } = useToggleView();
const { selectedAssets, setSelectedAssets } = useSelectedAssets();
const [movedObjects, setMovedObjects] = useState<THREE.Object3D[]>([]);
const [rotatedObjects, setRotatedObjects] = useState<THREE.Object3D[]>([]);
const [copiedObjects, setCopiedObjects] = useState<THREE.Object3D[]>([]);
const [pastedObjects, setpastedObjects] = useState<THREE.Object3D[]>([]);
const [duplicatedObjects, setDuplicatedObjects] = useState<THREE.Object3D[]>([]);
const boundingBoxRef = useRef<THREE.Mesh>();
const { activeModule } = useModuleStore();
const { socket } = useSocketStore();
const { contextAction, setContextAction } = useContextActionStore()
const { assetStore, eventStore, productStore, undoRedo3DStore } = useSceneContext();
const { push3D } = undoRedo3DStore();
const { removeAsset, getAssetById } = assetStore();
const { removeAsset, getAssetById, movedObjects, rotatedObjects, copiedObjects, pastedObjects, duplicatedObjects, setPastedObjects, setDuplicatedObjects } = assetStore();
const selectionBox = useMemo(() => new SelectionBox(camera, scene), [camera, scene]);
const { toolMode } = useToolMode();
const { selectedVersionStore } = useVersionContext();
@@ -267,13 +262,13 @@ const SelectionControls3D: React.FC = () => {
}, [selectionBox, pointer, controls, selectedAssets, setSelectedAssets]);
const clearSelection = () => {
setpastedObjects([]);
setPastedObjects([]);
setDuplicatedObjects([]);
setSelectedAssets([]);
};
const deleteSelection = () => {
if (selectedAssets.length > 0 && duplicatedObjects.length === 0) {
if (selectedAssets.length > 0 && duplicatedObjects.length === 0 && pastedObjects.length === 0) {
const undoActions: UndoRedo3DAction[] = [];
const assetsToDelete: AssetData[] = [];
@@ -366,21 +361,22 @@ const SelectionControls3D: React.FC = () => {
selectedUUIDs.forEach((uuid: string) => {
removeAsset(uuid);
});
echo.success("Selected models removed!");
clearSelection();
}
echo.success("Selected models removed!");
clearSelection();
};
return (
<>
<MoveControls3D movedObjects={movedObjects} setMovedObjects={setMovedObjects} pastedObjects={pastedObjects} setpastedObjects={setpastedObjects} duplicatedObjects={duplicatedObjects} setDuplicatedObjects={setDuplicatedObjects} rotatedObjects={rotatedObjects} setRotatedObjects={setRotatedObjects} boundingBoxRef={boundingBoxRef} />
<MoveControls3D boundingBoxRef={boundingBoxRef} />
<RotateControls3D rotatedObjects={rotatedObjects} setRotatedObjects={setRotatedObjects} movedObjects={movedObjects} setMovedObjects={setMovedObjects} pastedObjects={pastedObjects} setpastedObjects={setpastedObjects} duplicatedObjects={duplicatedObjects} setDuplicatedObjects={setDuplicatedObjects} />
<RotateControls3D />
<DuplicationControls3D duplicatedObjects={duplicatedObjects} setDuplicatedObjects={setDuplicatedObjects} setpastedObjects={setpastedObjects} movedObjects={movedObjects} setMovedObjects={setMovedObjects} rotatedObjects={rotatedObjects} setRotatedObjects={setRotatedObjects} boundingBoxRef={boundingBoxRef} />
<DuplicationControls3D />
<CopyPasteControls3D copiedObjects={copiedObjects} setCopiedObjects={setCopiedObjects} pastedObjects={pastedObjects} setpastedObjects={setpastedObjects} setDuplicatedObjects={setDuplicatedObjects} movedObjects={movedObjects} setMovedObjects={setMovedObjects} rotatedObjects={rotatedObjects} setRotatedObjects={setRotatedObjects} boundingBoxRef={boundingBoxRef} />
<CopyPasteControls3D />
</>
);