v2-ui #83

Merged
Vishnu merged 31 commits from v2-ui into main 2025-05-08 14:20:43 +00:00
6 changed files with 573 additions and 418 deletions
Showing only changes of commit 1c0b09acb1 - Show all commits

View File

@@ -106,8 +106,7 @@ export default function Builder() {
const cursorPosition = new THREE.Vector3(); // 3D vector for storing the cursor position. const cursorPosition = new THREE.Vector3(); // 3D vector for storing the cursor position.
const [selectedItemsIndex, setSelectedItemsIndex] = const [selectedItemsIndex, setSelectedItemsIndex] = useState<Types.Number | null>(null); // State for tracking the index of the selected item.
useState<Types.Number | null>(null); // State for tracking the index of the selected item.
const { activeLayer } = useActiveLayer(); // State that changes based on which layer the user chooses in Layers.jsx. const { activeLayer } = useActiveLayer(); // State that changes based on which layer the user chooses in Layers.jsx.
const { toggleView } = useToggleView(); // State for toggling between 2D and 3D. const { toggleView } = useToggleView(); // State for toggling between 2D and 3D.
const { toolMode, setToolMode } = useToolMode(); const { toolMode, setToolMode } = useToolMode();

View File

@@ -5,11 +5,13 @@ import {
useActiveLayer, useActiveLayer,
useDeletedLines, useDeletedLines,
useNewLines, useNewLines,
useRoomsState,
useToggleView, useToggleView,
} from "../../../../../store/store"; } from "../../../../../store/store";
import objectLinesToArray from "../lineConvertions/objectLinesToArray"; import objectLinesToArray from "../lineConvertions/objectLinesToArray";
import { Html } from "@react-three/drei"; import { Html } from "@react-three/drei";
import * as Types from "../../../../../types/world/worldTypes"; import * as Types from "../../../../../types/world/worldTypes";
import getRoomsFromLines from "../getRoomsFromLines";
const DistanceText = () => { const DistanceText = () => {
const [lines, setLines] = useState< const [lines, setLines] = useState<
@@ -24,6 +26,30 @@ const DistanceText = () => {
const { toggleView } = useToggleView(); const { toggleView } = useToggleView();
const { newLines, setNewLines } = useNewLines(); const { newLines, setNewLines } = useNewLines();
const { deletedLines, setDeletedLines } = useDeletedLines(); const { deletedLines, setDeletedLines } = useDeletedLines();
const [linesState, setLinesState] = useState<Types.Lines>([]);
const { roomsState, setRoomsState } = useRoomsState();
useEffect(() => {
if (linesState.length === 0) return;
const getLines = async () => {
if (lines.length > 2) {
const linesByLayer = linesState.reduce((acc: { [key: number]: any[] }, pair) => {
const layer = pair[0][2];
if (!acc[layer]) acc[layer] = [];
acc[layer].push(pair);
return acc;
}, {});
for (const layer in linesByLayer) {
const rooms: Types.Rooms = await getRoomsFromLines({ current: linesByLayer[layer] });
}
}
}
getLines();
}, [linesState])
useEffect(() => { useEffect(() => {
const email = localStorage.getItem("email"); const email = localStorage.getItem("email");
@@ -32,6 +58,7 @@ const DistanceText = () => {
getLines(organization).then((data) => { getLines(organization).then((data) => {
data = objectLinesToArray(data); data = objectLinesToArray(data);
setLinesState(data);
const lines = data const lines = data
.filter((line: Types.Line) => line[0][2] === activeLayer) .filter((line: Types.Line) => line[0][2] === activeLayer)
@@ -88,6 +115,7 @@ const DistanceText = () => {
}; };
}); });
setLines((prevLines) => [...prevLines, ...newLinesData]); setLines((prevLines) => [...prevLines, ...newLinesData]);
setLinesState((prevLines) => [...prevLines, ...newLines]);
setNewLines([]); setNewLines([]);
} }
}, [newLines, activeLayer]); }, [newLines, activeLayer]);
@@ -104,6 +132,16 @@ const DistanceText = () => {
) )
) )
); );
setLinesState(prev =>
prev.filter(line =>
!(deletedLines as Types.Lines).some(
deleted =>
line[0][1] === deleted[0][1] && line[1][1] === deleted[1][1]
)
)
);
setDeletedLines([]); setDeletedLines([]);
} }
}, [deletedLines]); }, [deletedLines]);

View File

@@ -26,7 +26,7 @@ function RoboticArmInstance({ armBot }: { armBot: ArmBotStatus }) {
let startTime: number; let startTime: number;
const { setArmBotActive, setArmBotState, removeCurrentAction } = useArmBotStore(); const { setArmBotActive, setArmBotState, removeCurrentAction } = useArmBotStore();
const { setIsVisible } = useMaterialStore(); const { setIsVisible, getMaterialById } = useMaterialStore();
const { selectedProduct } = useSelectedProduct(); const { selectedProduct } = useSelectedProduct();
const { getActionByUuid } = useProductStore(); const { getActionByUuid } = useProductStore();
const { triggerPointActions } = useTriggerHandler(); const { triggerPointActions } = useTriggerHandler();
@@ -204,12 +204,10 @@ function RoboticArmInstance({ armBot }: { armBot: ArmBotStatus }) {
function createCurveBetweenTwoPoints(p1: any, p2: any) { function createCurveBetweenTwoPoints(p1: any, p2: any) {
const mid = new THREE.Vector3().addVectors(p1, p2).multiplyScalar(0.5); const mid = new THREE.Vector3().addVectors(p1, p2).multiplyScalar(0.5);
// mid.y += 0.5;
const points = [p1, mid, p2]; const points = [p1, mid, p2];
return new THREE.CatmullRomCurve3(points); return new THREE.CatmullRomCurve3(points);
} }
const HandleCallback = () => { const HandleCallback = () => {
if (armBot.isActive && armBot.state == "running" && currentPhase == "init-to-rest") { if (armBot.isActive && armBot.state == "running" && currentPhase == "init-to-rest") {
logStatus(armBot.modelUuid, "Callback triggered: rest"); logStatus(armBot.modelUuid, "Callback triggered: rest");

View File

@@ -14,7 +14,7 @@ export function useTriggerHandler() {
const { getVehicleById } = useVehicleStore(); const { getVehicleById } = useVehicleStore();
const { setCurrentLocation, setNextLocation, getMaterialById, setIsPaused, setIsVisible, setEndTime } = useMaterialStore(); const { setCurrentLocation, setNextLocation, getMaterialById, setIsPaused, setIsVisible, setEndTime } = useMaterialStore();
const handleTrigger = (trigger: TriggerSchema, action: Action, materialId: string) => { const handleTrigger = (trigger: TriggerSchema, action: Action, materialId?: string) => {
const fromEvent = getEventByTriggerUuid(selectedProduct.productId, trigger.triggerUuid); const fromEvent = getEventByTriggerUuid(selectedProduct.productId, trigger.triggerUuid);
@@ -23,7 +23,7 @@ export function useTriggerHandler() {
if (fromEvent?.type === 'transfer') { if (fromEvent?.type === 'transfer') {
if (toEvent?.type === 'transfer') { if (toEvent?.type === 'transfer') {
// Transfer to Transfer // Transfer to Transfer
if (trigger.triggeredAsset && trigger.triggeredAsset.triggeredPoint && trigger.triggeredAsset.triggeredAction) { if (materialId && trigger.triggeredAsset && trigger.triggeredAsset.triggeredPoint && trigger.triggeredAsset.triggeredAction) {
const material = getMaterialById(materialId); const material = getMaterialById(materialId);
if (material) { if (material) {
if (material.next) { if (material.next) {
@@ -44,7 +44,7 @@ export function useTriggerHandler() {
} }
} else if (toEvent?.type === 'vehicle') { } else if (toEvent?.type === 'vehicle') {
// Transfer to Vehicle // Transfer to Vehicle
if (trigger.triggeredAsset && trigger.triggeredAsset.triggeredPoint && trigger.triggeredAsset.triggeredAction) { if (materialId && trigger.triggeredAsset && trigger.triggeredAsset.triggeredPoint && trigger.triggeredAsset.triggeredAction) {
const material = getMaterialById(materialId); const material = getMaterialById(materialId);
if (material) { if (material) {
@@ -90,7 +90,7 @@ export function useTriggerHandler() {
} else if (toEvent?.type === 'roboticArm') { } else if (toEvent?.type === 'roboticArm') {
// Transfer to Robotic Arm // Transfer to Robotic Arm
if (trigger.triggeredAsset && trigger.triggeredAsset.triggeredPoint && trigger.triggeredAsset.triggeredAction) { if (materialId && trigger.triggeredAsset && trigger.triggeredAsset.triggeredPoint && trigger.triggeredAsset.triggeredAction) {
const material = getMaterialById(materialId); const material = getMaterialById(materialId);
if (material) { if (material) {
@@ -137,6 +137,33 @@ export function useTriggerHandler() {
} else if (fromEvent?.type === 'vehicle') { } else if (fromEvent?.type === 'vehicle') {
if (toEvent?.type === 'transfer') { if (toEvent?.type === 'transfer') {
// Vehicle to Transfer // Vehicle to Transfer
if (materialId && trigger.triggeredAsset && trigger.triggeredAsset.triggeredPoint && trigger.triggeredAsset.triggeredAction) {
const material = getMaterialById(materialId);
if (material) {
const action = getActionByUuid(selectedProduct.productId, trigger.triggeredAsset.triggeredAction.actionUuid);
setCurrentLocation(material.materialId, {
modelUuid: trigger.triggeredAsset.triggeredModel.modelUuid,
pointUuid: trigger.triggeredAsset.triggeredPoint.pointUuid,
actionUuid: trigger.triggeredAsset?.triggeredAction?.actionUuid,
});
setIsVisible(materialId, true);
if (action &&
action.triggers[0].triggeredAsset?.triggeredModel.modelUuid &&
action.triggers[0].triggeredAsset?.triggeredPoint?.pointUuid
) {
setNextLocation(material.materialId, {
modelUuid: action.triggers[0].triggeredAsset?.triggeredModel.modelUuid,
pointUuid: action.triggers[0].triggeredAsset?.triggeredPoint?.pointUuid,
});
handleAction(action, materialId);
}
}
}
} else if (toEvent?.type === 'vehicle') { } else if (toEvent?.type === 'vehicle') {
// Vehicle to Vehicle // Vehicle to Vehicle
@@ -146,6 +173,40 @@ export function useTriggerHandler() {
} else if (toEvent?.type === 'roboticArm') { } else if (toEvent?.type === 'roboticArm') {
// Vehicle to Robotic Arm // Vehicle to Robotic Arm
if (materialId && trigger.triggeredAsset && trigger.triggeredAsset.triggeredPoint && trigger.triggeredAsset.triggeredAction) {
const material = getMaterialById(materialId);
if (material) {
const action = getActionByUuid(selectedProduct.productId, trigger.triggeredAsset.triggeredAction.actionUuid);
const armBot = getArmBotById(trigger.triggeredAsset?.triggeredModel.modelUuid);
setCurrentLocation(material.materialId, {
modelUuid: trigger.triggeredAsset.triggeredModel.modelUuid,
pointUuid: trigger.triggeredAsset.triggeredPoint.pointUuid,
actionUuid: trigger.triggeredAsset?.triggeredAction?.actionUuid,
});
setNextLocation(material.materialId, null);
setIsVisible(materialId, false);
if (action && armBot &&
action.triggers[0].triggeredAsset?.triggeredModel.modelUuid &&
action.triggers[0].triggeredAsset?.triggeredPoint?.pointUuid
) {
if (armBot.isActive === false && armBot.state === 'idle') {
// Handle current action from arm bot
handleAction(action, materialId);
} else {
// Event Manager Needed
}
}
}
}
} else if (toEvent?.type === 'storageUnit') { } else if (toEvent?.type === 'storageUnit') {
// Vehicle to Storage Unit // Vehicle to Storage Unit
@@ -171,7 +232,7 @@ export function useTriggerHandler() {
} else if (fromEvent?.type === 'roboticArm') { } else if (fromEvent?.type === 'roboticArm') {
if (toEvent?.type === 'transfer') { if (toEvent?.type === 'transfer') {
// Robotic Arm to Transfer // Robotic Arm to Transfer
if (trigger.triggeredAsset && trigger.triggeredAsset.triggeredPoint && trigger.triggeredAsset.triggeredAction) { if (materialId && trigger.triggeredAsset && trigger.triggeredAsset.triggeredPoint && trigger.triggeredAsset.triggeredAction) {
const material = getMaterialById(materialId); const material = getMaterialById(materialId);
if (material) { if (material) {
setIsPaused(material.materialId, false); setIsPaused(material.materialId, false);
@@ -199,9 +260,12 @@ export function useTriggerHandler() {
} else if (toEvent?.type === 'vehicle') { } else if (toEvent?.type === 'vehicle') {
// Robotic Arm to Vehicle // Robotic Arm to Vehicle
if (trigger.triggeredAsset && trigger.triggeredAsset.triggeredPoint && trigger.triggeredAsset.triggeredAction) { if (materialId && trigger.triggeredAsset && trigger.triggeredAsset.triggeredPoint && trigger.triggeredAsset.triggeredAction) {
const material = getMaterialById(materialId); const material = getMaterialById(materialId);
if (material) { if (material) {
setIsPaused(material.materialId, false);
const action = getActionByUuid(selectedProduct.productId, trigger.triggeredAsset.triggeredAction.actionUuid); const action = getActionByUuid(selectedProduct.productId, trigger.triggeredAsset.triggeredAction.actionUuid);
const vehicle = getVehicleById(trigger.triggeredAsset?.triggeredModel.modelUuid); const vehicle = getVehicleById(trigger.triggeredAsset?.triggeredModel.modelUuid);
@@ -265,18 +329,18 @@ export function useTriggerHandler() {
} }
} }
const handleFinalAction = (action: Action, materialId: string) => { const handleFinalAction = (action: Action, materialId?: string) => {
if (!action) return; if (!action) return;
const modelUuid = getModelUuidByActionUuid(selectedProduct.productId, action.actionUuid); const modelUuid = getModelUuidByActionUuid(selectedProduct.productId, action.actionUuid);
if (!modelUuid) return; if (!modelUuid) return;
const finalModel = getEventByModelUuid(selectedProduct.productId, modelUuid); const finalModel = getEventByModelUuid(selectedProduct.productId, modelUuid);
if (!finalModel) return; if (!finalModel) return;
const material = getMaterialById(materialId);
if (finalModel.type === 'transfer') { if (finalModel.type === 'transfer') {
// Storage Unit to Transfer // Storage Unit to Transfer
if (!materialId) return;
const material = getMaterialById(materialId);
if (material) { if (material) {
const currentTime = performance.now(); const currentTime = performance.now();
@@ -309,7 +373,7 @@ export function useTriggerHandler() {
} }
const triggerPointActions = useCallback((action: Action, materialId: string) => { const triggerPointActions = useCallback((action: Action, materialId?: string) => {
if (!action) return; if (!action) return;
if (action.triggers.length > 0) { if (action.triggers.length > 0) {

View File

@@ -6,12 +6,18 @@ import { useNavMesh } from '../../../../../store/store';
import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../store/usePlayButtonStore'; import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../store/usePlayButtonStore';
import { useVehicleStore } from '../../../../../store/simulation/useVehicleStore'; import { useVehicleStore } from '../../../../../store/simulation/useVehicleStore';
import { useMaterialStore } from '../../../../../store/simulation/useMaterialStore'; import { useMaterialStore } from '../../../../../store/simulation/useMaterialStore';
import { useProductStore } from '../../../../../store/simulation/useProductStore';
import { useSelectedProduct } from '../../../../../store/simulation/useSimulationStore';
import { useTriggerHandler } from '../../../triggers/triggerHandler/useTriggerHandler';
import MaterialAnimator from '../animator/materialAnimator'; import MaterialAnimator from '../animator/materialAnimator';
function VehicleInstance({ agvDetail }: { agvDetail: VehicleStatus }) { function VehicleInstance({ agvDetail }: { agvDetail: VehicleStatus }) {
const { navMesh } = useNavMesh(); const { navMesh } = useNavMesh();
const { isPlaying } = usePlayButtonStore(); const { isPlaying } = usePlayButtonStore();
const { removeMaterial } = useMaterialStore(); const { removeMaterial } = useMaterialStore();
const { triggerPointActions } = useTriggerHandler();
const { getActionByUuid, getEventByModelUuid, getTriggerByUuid } = useProductStore();
const { selectedProduct } = useSelectedProduct();
const { vehicles, setVehicleActive, setVehicleState, clearCurrentMaterials, setVehicleLoad, decrementVehicleLoad, removeLastMaterial } = useVehicleStore(); const { vehicles, setVehicleActive, setVehicleState, clearCurrentMaterials, setVehicleLoad, decrementVehicleLoad, removeLastMaterial } = useVehicleStore();
const [currentPhase, setCurrentPhase] = useState<string>('stationed'); const [currentPhase, setCurrentPhase] = useState<string>('stationed');
const [path, setPath] = useState<[number, number, number][]>([]); const [path, setPath] = useState<[number, number, number][]>([]);
@@ -129,17 +135,62 @@ function VehicleInstance({ agvDetail }: { agvDetail: VehicleStatus }) {
} }
function startUnloadingProcess() { function startUnloadingProcess() {
if (agvDetail.point.action.triggers.length > 0) {
const trigger = getTriggerByUuid(selectedProduct.productId, agvDetail.point.action.triggers[0].triggerUuid);
const model = getEventByModelUuid(selectedProduct.productId, trigger?.triggeredAsset?.triggeredModel?.modelUuid || '');
if (trigger && model) {
if (model.type === 'transfer') {
const action = getActionByUuid(selectedProduct.productId, agvDetail.point.action.actionUuid);
if (action) {
handleMaterialDropToConveyor(action);
}
} else if (model.type === 'machine') {
} else if (model.type === 'roboticArm') {
const action = getActionByUuid(selectedProduct.productId, agvDetail.point.action.actionUuid);
if (action) {
handleMaterialDropToArmBot(action);
}
} else if (model.type === 'storageUnit') {
}
} else {
const droppedMaterial = agvDetail.currentLoad; const droppedMaterial = agvDetail.currentLoad;
startTime = performance.now(); startTime = performance.now();
handleMaterialDrop(droppedMaterial); handleMaterialDropByDefault(droppedMaterial);
}
} else {
const droppedMaterial = agvDetail.currentLoad;
startTime = performance.now();
handleMaterialDropByDefault(droppedMaterial);
}
} }
function handleMaterialDrop(droppedMaterial: number) { function handleMaterialDropToConveyor(action: Action) {
if (agvDetail.currentLoad > 1) {
} else if (agvDetail.currentLoad === 1 && agvDetail.currentMaterials.length === 1) {
triggerPointActions(action, agvDetail.currentMaterials[0].materialId);
decrementVehicleLoad(agvDetail.modelUuid, 1);
removeLastMaterial(agvDetail.modelUuid);
}
}
function handleMaterialDropToArmBot(action: Action) {
if (agvDetail.currentLoad > 1) {
} else if (agvDetail.currentLoad === 1 && agvDetail.currentMaterials.length === 1) {
triggerPointActions(action, agvDetail.currentMaterials[0].materialId);
}
}
function handleMaterialDropByDefault(droppedMaterial: number) {
if (isPausedRef.current) { if (isPausedRef.current) {
if (!pauseTimeRef.current) { if (!pauseTimeRef.current) {
pauseTimeRef.current = performance.now(); pauseTimeRef.current = performance.now();
} }
requestAnimationFrame(() => handleMaterialDrop(droppedMaterial)); requestAnimationFrame(() => handleMaterialDropByDefault(droppedMaterial));
return; return;
} }
@@ -162,12 +213,12 @@ function VehicleInstance({ agvDetail }: { agvDetail: VehicleStatus }) {
} }
if (droppedMat > 0) { if (droppedMat > 0) {
startTime = performance.now(); startTime = performance.now();
requestAnimationFrame(() => handleMaterialDrop(droppedMat)); requestAnimationFrame(() => handleMaterialDropByDefault(droppedMat));
} else { } else {
return; return;
} }
} else { } else {
requestAnimationFrame(() => handleMaterialDrop(droppedMaterial)); requestAnimationFrame(() => handleMaterialDropByDefault(droppedMaterial));
} }
} }

View File

@@ -66,6 +66,11 @@ export const useWalls = create<any>((set: any) => ({
setWalls: (x: any) => set(() => ({ walls: x })), setWalls: (x: any) => set(() => ({ walls: x })),
})); }));
export const useRoomsState = create<any>((set: any) => ({
roomsState: [],
setRoomsState: (x: any) => set(() => ({ walls: x })),
}));
export const useZones = create<any>((set: any) => ({ export const useZones = create<any>((set: any) => ({
zones: [], zones: [],
setZones: (callback: any) => setZones: (callback: any) =>