From fb1995acdbba51cc9d88e4005b93b757872b7e9f Mon Sep 17 00:00:00 2001 From: Gomathi9520 Date: Wed, 30 Apr 2025 16:50:31 +0530 Subject: [PATCH] arm ui added --- .../simulation/roboticArm/roboticArm.tsx | 18 +- .../modules/simulation/ui/arm/armBotUI.tsx | 155 ++++++++++++++++++ 2 files changed, 171 insertions(+), 2 deletions(-) create mode 100644 app/src/modules/simulation/ui/arm/armBotUI.tsx diff --git a/app/src/modules/simulation/roboticArm/roboticArm.tsx b/app/src/modules/simulation/roboticArm/roboticArm.tsx index 37e350e..5a5bd38 100644 --- a/app/src/modules/simulation/roboticArm/roboticArm.tsx +++ b/app/src/modules/simulation/roboticArm/roboticArm.tsx @@ -2,9 +2,17 @@ import { useEffect } from "react"; import RoboticArmInstances from "./instances/roboticArmInstances"; import { useArmBotStore } from "../../../store/simulation/useArmBotStore"; import { useFloorItems } from "../../../store/store"; +import { useSelectedEventData, useSelectedEventSphere } from "../../../store/simulation/useSimulationStore"; +import { useEventsStore } from "../../../store/simulation/useEventsStore"; +import { usePlayButtonStore } from "../../../store/usePlayButtonStore"; +import ArmBotUI from "../ui/arm/armBotUI"; function RoboticArm() { const { armBots, addArmBot, removeArmBot } = useArmBotStore(); + const { addEvent } = useEventsStore(); + const { selectedEventSphere } = useSelectedEventSphere(); + const { selectedEventData } = useSelectedEventData(); + const { isPlaying } = usePlayButtonStore(); const { floorItems } = useFloorItems(); const armBotStatusSample: RoboticArmEventSchema[] = [ { @@ -156,12 +164,18 @@ function RoboticArm() { }, []); useEffect(() => { - - }, [armBots]); + + console.log('isPlaying: ', isPlaying); + console.log('selectedEventData: ', selectedEventData); + console.log('selectedEventSphere: ', selectedEventSphere); + }, [selectedEventData, selectedEventSphere, isPlaying]); return ( <> + {selectedEventSphere && selectedEventData?.data.type === "roboticArm" && !isPlaying && + < ArmBotUI /> + } ); } diff --git a/app/src/modules/simulation/ui/arm/armBotUI.tsx b/app/src/modules/simulation/ui/arm/armBotUI.tsx new file mode 100644 index 0000000..7e111e3 --- /dev/null +++ b/app/src/modules/simulation/ui/arm/armBotUI.tsx @@ -0,0 +1,155 @@ +import React from 'react' +import PickDropPoints from './PickDropPoints'; +import { useSelectedEventData, useSelectedEventSphere } from '../../../../store/simulation/useSimulationStore'; +import { useArmBotStore } from '../../../../store/simulation/useArmBotStore'; +import useModuleStore from '../../../../store/useModuleStore'; +import { useGLTF } from '@react-three/drei'; +import armPick from "../../../../assets/gltf-glb/arm_ui_pick.glb"; +import armDrop from "../../../../assets/gltf-glb/arm_ui_drop.glb"; +import useDraggableGLTF from './useDraggableGLTF'; +import * as THREE from "three"; +import { useThree } from '@react-three/fiber'; +const ArmBotUI = () => { + console.log("called"); + const { selectedEventSphere } = useSelectedEventSphere(); + const { selectedEventData } = useSelectedEventData(); + const { armBots, updateArmBot } = useArmBotStore(); + const armUiPick = useGLTF(armPick) as any; + const { scene } = useThree(); + const armUiDrop = useGLTF(armDrop) as any; + + const getDefaultPositions = (modelUuid: string) => { + const modelData = getModelByUuid(modelUuid); + if (modelData) { + + const baseX = modelData.position?.[0] || 0; + const baseY = 2.6; + const baseZ = modelData.position?.[2] || 0; + return { + pick: [baseX, baseY, baseZ + 0.4], + drop: [baseX, baseY, baseZ - 1.2], + default: [baseX, baseY, baseZ - 1.5], + }; + } + return { + pick: [0.5, 1.5, 0], + drop: [-0.5, 1.5, 0], + default: [0, 1.5, 0], + }; + }; + const getModelByUuid = (modelUuid: string) => { + try { + const modelsJson = localStorage.getItem("FloorItems"); + if (modelsJson) { + const models = JSON.parse(modelsJson); + return models.find((m: any) => m.modeluuid === modelUuid); + } + const storeModels = (useModuleStore.getState() as any).models || []; + return storeModels.find((m: any) => m.modelUuid === modelUuid); + } catch (error) { } + return null; + }; + const updatePointToState = (obj: THREE.Object3D) => { + const { modelUuid, pointUuid, actionType, actionUuid } = obj.userData; + + const newPosition = new THREE.Vector3(); + obj.getWorldPosition(newPosition); + const worldPositionArray = newPosition.toArray(); + + const armBot = armBots.find((a) => a.modelUuid === modelUuid); + if (!armBot) return; + + const updatedActions = armBot.point.actions.map((action: any) => { + if (action.actionUuid === actionUuid) { + const updatedProcess = { ...action.process }; + + if (actionType === "pick") { + updatedProcess.startPoint = getLocalPosition(modelUuid, worldPositionArray); + } + if (actionType === "drop") { + updatedProcess.endPoint = getLocalPosition(modelUuid, worldPositionArray); + } + return { + ...action, + process: updatedProcess, + }; + } + return action; + }); + + updateArmBot(modelUuid, { + point: { + ...armBot.point, + actions: updatedActions, + }, + }); + }; + function getLocalPosition(parentUuid: string, worldPosArray: [number, number, number] | null): [number, number, number] | null { + if (worldPosArray) { + const worldPos = new THREE.Vector3(...worldPosArray); + const localPos = worldPos.clone(); + + const parentObject = scene.getObjectByProperty('uuid', parentUuid); + if (parentObject) { + parentObject.worldToLocal(localPos); + + return [localPos.x, localPos.y, localPos.z]; + } else { + + } + } + return null; + } + const { handlePointerDown } = useDraggableGLTF(updatePointToState); + + return ( + <> + {armBots.map((event: any) => { + const defaultPositions = getDefaultPositions(event.modelUuid); + const isSelected = + selectedEventSphere?.userData?.modelUuid === event.modelUuid; + + return event.point.actions.map((action: any) => { + if (action.actionType === "pickAndPlace") { + const pickPosition = action.process.startPoint || defaultPositions.pick; + const dropPosition = action.process.endPoint || defaultPositions.drop; + + return ( + + {/* Pick Point */} + + + {/* Drop Point */} + + + ); + } + return null; + }); + })} + + ); + + +} +export default ArmBotUI \ No newline at end of file