feat: Introduce asset display and search UI, robotic arm animation logic, and core simulation handling.

This commit is contained in:
2025-12-29 12:27:13 +05:30
parent b7da96e027
commit 6e8b1ae667
3 changed files with 40 additions and 51 deletions

View File

@@ -111,7 +111,6 @@ const Assets: React.FC = () => {
onClick={async () => {
setIsLoading(true);
const res = await fetchCategoryDecals(cat.name);
console.log('res: ', res);
setAssets(res);
setSelectedDecalCategory(cat.name);
setIsLoading(false);

View File

@@ -36,6 +36,7 @@ function RoboticArmAnimator({ HandleCallback, restPosition, ikSolver, targetBone
const { getMaterialById, getMaterialPosition } = materialStore();
const { getEventByModelUuid, getActionByUuid, getPointByUuid, getTriggeringModels, selectedProduct } = productStore();
const { scene } = useThree();
const showHelper = false;
let curveHeight = 1.75;
const CIRCLE_RADIUS = 1.6;
@@ -366,59 +367,47 @@ function RoboticArmAnimator({ HandleCallback, restPosition, ikSolver, targetBone
return (
<>
{/* {customCurvePoints && customCurvePoints?.length >= 2 && currentPath && isPlaying && (
<mesh rotation={armBot.rotation} position={armBot.position} visible={false}>
<Line
points={customCurvePoints.map((p) => [p.x, p.y, p.z] as [number, number, number])}
color="green"
lineWidth={5}
dashed={false}
/>
</mesh>
)}
<group
position={[armBot.position[0], armBot.position[1] + 1.5, armBot.position[2]]}
rotation={[armBot.rotation[0], armBot.rotation[1], armBot.rotation[2]]}
visible={false}
>
<mesh rotation={[-Math.PI / 2, 0, 0]} visible={false}>
<ringGeometry args={[CIRCLE_RADIUS, CIRCLE_RADIUS + 0.02, 64]} />
<meshBasicMaterial color="green" side={THREE.DoubleSide} />
</mesh>
{[90, 180, 270, 360].map((degree, index) => {
const rad = ((degree) * Math.PI) / 180;
const x = CIRCLE_RADIUS * Math.cos(rad);
const z = CIRCLE_RADIUS * Math.sin(rad);
const y = 0;
return (
<mesh key={index} position={[x, y, z]}>
<sphereGeometry args={[0.05, 16, 16]} />
<meshStandardMaterial color="red" />
{showHelper && (
<>
{customCurvePoints && customCurvePoints?.length >= 2 && currentPath && isPlaying && (
<mesh rotation={armBot.rotation} position={armBot.position} visible={false}>
<Line points={customCurvePoints.map((p) => [p.x, p.y, p.z] as [number, number, number])} color="green" lineWidth={5} dashed={false} />
</mesh>
)}
<group position={[armBot.position[0], armBot.position[1] + 1.5, armBot.position[2]]} rotation={[armBot.rotation[0], armBot.rotation[1], armBot.rotation[2]]} visible={false}>
<mesh rotation={[-Math.PI / 2, 0, 0]} visible={false}>
<ringGeometry args={[CIRCLE_RADIUS, CIRCLE_RADIUS + 0.02, 64]} />
<meshBasicMaterial color="green" side={THREE.DoubleSide} />
</mesh>
);
})}
{[90, 180, 270, 360].map((degree, index) => {
const rad = ((degree) * Math.PI) / 180;
const x = CIRCLE_RADIUS * Math.cos(rad);
const z = CIRCLE_RADIUS * Math.sin(rad);
const y = 0.15;
{[90, 180, 270, 360].map((degree, index) => {
const rad = (degree * Math.PI) / 180;
const x = CIRCLE_RADIUS * Math.cos(rad);
const z = CIRCLE_RADIUS * Math.sin(rad);
const y = 0;
return (
<mesh key={index} position={[x, y, z]}>
<sphereGeometry args={[0.05, 16, 16]} />
<meshStandardMaterial color="red" />
</mesh>
);
})}
return (
<Text
key={`text-${index}`}
position={[x, y, z]}
fontSize={0.2}
color="yellow"
anchorX="center"
anchorY="middle"
>
{degree}°
</Text>
);
})}
</group> */}
{[90, 180, 270, 360].map((degree, index) => {
const rad = (degree * Math.PI) / 180;
const x = CIRCLE_RADIUS * Math.cos(rad);
const z = CIRCLE_RADIUS * Math.sin(rad);
const y = 0.15;
return (
<Text key={`text-${index}`} position={[x, y, z]} fontSize={0.2} color="yellow" anchorX="center" anchorY="middle">
{degree}°
</Text>
);
})}
</group>
</>
)}
</>
);
}

View File

@@ -10,6 +10,7 @@ import { heatMapImageApi } from "../../../services/simulation/products/heatMapIm
import { useHeatMapStore } from "../../../store/simulation/useHeatMapStore";
import * as CONSTANTS from "../../../types/world/worldConstants";
import { useThree } from "@react-three/fiber";
const SimulationHandler = () => {
const {
materialStore,