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

refactor: Update selectedObjects iteration method in SelectionControls

This commit is contained in:
Jerald-Golden-B 2025-05-29 12:08:15 +05:30
parent d3ea36d1ba
commit e26de7e651
2 changed files with 79 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

120
app/src/modules/scene/controls/selectionControls/boundingBoxHelper.tsx
View File

@ -3,60 +3,96 @@ import { useMemo } from "react";
import * as THREE from "three"; import * as THREE from "three";
import { useSelectedAssets } from "../../../../store/builder/store"; import { useSelectedAssets } from "../../../../store/builder/store";
const BoundingBox = ({ boundingBoxRef }: any) => { interface BoundingBoxProps {
boundingBoxRef?: any;
isPerAsset?: boolean;
}
const getBoxLines = (min: THREE.Vector3, max: THREE.Vector3) => [
[min.x, min.y, min.z], [max.x, min.y, min.z],
[max.x, min.y, min.z], [max.x, max.y, min.z],
[max.x, max.y, min.z], [min.x, max.y, min.z],
[min.x, max.y, min.z], [min.x, min.y, min.z],
[min.x, min.y, max.z], [max.x, min.y, max.z],
[max.x, min.y, max.z], [max.x, max.y, max.z],
[max.x, max.y, max.z], [min.x, max.y, max.z],
[min.x, max.y, max.z], [min.x, min.y, max.z],
[min.x, min.y, min.z], [min.x, min.y, max.z],
[max.x, min.y, min.z], [max.x, min.y, max.z],
[max.x, max.y, min.z], [max.x, max.y, max.z],
[min.x, max.y, min.z], [min.x, max.y, max.z],
];
const BoundingBox = ({ boundingBoxRef, isPerAsset = true }: BoundingBoxProps) => {
const { selectedAssets } = useSelectedAssets(); const { selectedAssets } = useSelectedAssets();
const savedTheme: string = localStorage.getItem("theme") || "light";
const { points, boxProps } = useMemo(() => { const boxes = useMemo(() => {
if (selectedAssets.length === 0) return { points: [], boxProps: {} }; if (selectedAssets.length === 0) return [];
const box = new THREE.Box3(); if (isPerAsset) {
selectedAssets.forEach((obj: any) => box.expandByObject(obj.clone())); return selectedAssets.map((obj: any) => {
const box = new THREE.Box3().setFromObject(obj.clone());
const size = new THREE.Vector3();
const center = new THREE.Vector3();
box.getSize(size);
box.getCenter(center);
const size = new THREE.Vector3(); const halfSize = size.clone().multiplyScalar(0.5);
box.getSize(size); const min = center.clone().sub(halfSize);
const center = new THREE.Vector3(); const max = center.clone().add(halfSize);
box.getCenter(center);
const halfSize = size.clone().multiplyScalar(0.5); return {
const min = center.clone().sub(halfSize); points: getBoxLines(min, max),
const max = center.clone().add(halfSize); position: center.toArray(),
size: size.toArray(),
};
});
} else {
const box = new THREE.Box3();
selectedAssets.forEach((obj: any) => box.expandByObject(obj.clone()));
const size = new THREE.Vector3();
const center = new THREE.Vector3();
box.getSize(size);
box.getCenter(center);
const points: any = [ const halfSize = size.clone().multiplyScalar(0.5);
[min.x, min.y, min.z], [max.x, min.y, min.z], const min = center.clone().sub(halfSize);
[max.x, min.y, min.z], [max.x, max.y, min.z], const max = center.clone().add(halfSize);
[max.x, max.y, min.z], [min.x, max.y, min.z],
[min.x, max.y, min.z], [min.x, min.y, min.z],
[min.x, min.y, max.z], [max.x, min.y, max.z], return [
[max.x, min.y, max.z], [max.x, max.y, max.z], {
[max.x, max.y, max.z], [min.x, max.y, max.z], points: getBoxLines(min, max),
[min.x, max.y, max.z], [min.x, min.y, max.z], position: center.toArray(),
size: size.toArray(),
[min.x, min.y, min.z], [min.x, min.y, max.z], },
[max.x, min.y, min.z], [max.x, min.y, max.z], ];
[max.x, max.y, min.z], [max.x, max.y, max.z], }
[min.x, max.y, min.z], [min.x, max.y, max.z], }, [selectedAssets, isPerAsset]);
];
return {
points,
boxProps: { position: center.toArray(), args: size.toArray() }
};
}, [selectedAssets]);
const savedTheme: string | null = localStorage.getItem("theme") || "light";
return ( return (
<> <>
{points.length > 0 && ( {boxes.map((box: any, index: number) => (
<> <group key={index}>
<Line depthWrite={false} points={points} color={savedTheme === "dark" ? "#c4abf1" : "#6f42c1"} lineWidth={2.7} segments /> <Line
<mesh ref={boundingBoxRef} visible={false} position={boxProps.position}> depthWrite={false}
<boxGeometry args={boxProps.args} /> points={box.points}
color={savedTheme === "dark" ? "#c4abf1" : "#6f42c1"}
lineWidth={2.7}
segments
/>
<mesh
ref={index === 0 ? boundingBoxRef : null}
visible={false}
position={box.position}
>
<boxGeometry args={box.size} />
<meshBasicMaterial /> <meshBasicMaterial />
</mesh> </mesh>
</> </group>
)} ))}
</> </>
); );
}; };

2
app/src/modules/scene/controls/selectionControls/selectionControls.tsx
View File

@ -158,7 +158,7 @@ const SelectionControls: React.FC = () => {
let selectedObjects = selectionBox.select(); let selectedObjects = selectionBox.select();
let Objects = new Set<THREE.Object3D>(); let Objects = new Set<THREE.Object3D>();
selectedObjects.map((object) => { selectedObjects.forEach((object) => {
let currentObject: THREE.Object3D | null = object; let currentObject: THREE.Object3D | null = object;
while (currentObject) { while (currentObject) {
if (currentObject.userData.modelUuid) { if (currentObject.userData.modelUuid) {