From 1ce24a64f174a58e1f42e1fbd22a22aaa1e50d25 Mon Sep 17 00:00:00 2001 From: Jerald-Golden-B Date: Sat, 29 Mar 2025 10:24:47 +0530 Subject: [PATCH 01/13] refactor: standardize activeTool casing and enhance trigger mechanics with bufferTime --- .../mechanics/ConveyorMechanics.tsx | 60 +++++++- .../mechanics/VehicleMechanics.tsx | 1 + app/src/components/ui/Tools.tsx | 143 ++++++++++++++---- .../builder/groups/floorItemsGroup.tsx | 4 +- .../simulation/behaviour/behaviour.tsx | 2 +- .../modules/simulation/path/pathCreation.tsx | 21 +-- app/src/modules/simulation/simulation.tsx | 2 +- app/src/store/store.ts | 2 +- app/src/types/world/worldTypes.d.ts | 2 +- 9 files changed, 179 insertions(+), 58 deletions(-) diff --git a/app/src/components/layout/sidebarRight/mechanics/ConveyorMechanics.tsx b/app/src/components/layout/sidebarRight/mechanics/ConveyorMechanics.tsx index a1f8bf3..2788c12 100644 --- a/app/src/components/layout/sidebarRight/mechanics/ConveyorMechanics.tsx +++ b/app/src/components/layout/sidebarRight/mechanics/ConveyorMechanics.tsx @@ -243,6 +243,7 @@ const ConveyorMechanics: React.FC = () => { uuid: THREE.MathUtils.generateUUID(), name: `Trigger ${triggerIndex + 1}`, type: '', + bufferTime: 0, isUsed: false }; @@ -298,8 +299,19 @@ const ConveyorMechanics: React.FC = () => { ); setSimulationPaths(updatedPaths); + + // Ensure the selectedItem is updated immediately + const updatedTrigger = updatedPaths + .flatMap((path) => (path.type === "Conveyor" ? path.points : [])) + .flatMap((point) => point.triggers) + .find((trigger) => trigger.uuid === uuid); + + if (updatedTrigger) { + setSelectedItem({ type: "trigger", item: updatedTrigger }); + } }; + // Update the toggle handlers to immediately update the selected item const handleActionToggle = (uuid: string) => { if (!selectedActionSphere) return; @@ -373,10 +385,45 @@ const ConveyorMechanics: React.FC = () => { } }; + const handleTriggerBufferTimeChange = (uuid: string, bufferTime: number) => { + if (!selectedActionSphere) return; + + const updatedPaths = simulationPaths.map((path) => + path.type === "Conveyor" + ? { + ...path, + points: path.points.map((point) => + point.uuid === selectedActionSphere.point.uuid + ? { + ...point, + triggers: point.triggers.map((trigger) => + trigger.uuid === uuid ? { ...trigger, bufferTime } : trigger + ), + } + : point + ), + } + : path + ); + + setSimulationPaths(updatedPaths); + + // Immediately update selectedItem if it's the currently selected trigger + if (selectedItem?.type === "trigger" && selectedItem.item.uuid === uuid) { + setSelectedItem({ + ...selectedItem, + item: { + ...selectedItem.item, + bufferTime + } + }); + } + }; + const [selectedItem, setSelectedItem] = useState<{ type: "action" | "trigger"; item: any; } | null>(null); useEffect(() => { - setSelectedItem(null); // Reset selectedItem when selectedActionSphere changes + setSelectedItem(null); }, [selectedActionSphere]); return ( @@ -559,8 +606,19 @@ const ConveyorMechanics: React.FC = () => { options={["On-Hit", "Buffer"]} onSelect={(option) => handleTriggerSelect(selectedItem.item.uuid, option)} /> + + {selectedItem.item.type === "Buffer" && ( + { + handleTriggerBufferTimeChange(selectedItem.item.uuid, parseInt(value)); + }} + /> + )} )} + )} diff --git a/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx b/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx index 7d3ffb0..de6eb8c 100644 --- a/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx +++ b/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx @@ -243,6 +243,7 @@ const VehicleMechanics: React.FC = () => { uuid: THREE.MathUtils.generateUUID(), name: `Trigger ${triggerIndex + 1}`, type: '', + bufferTime: 0, isUsed: false }; diff --git a/app/src/components/ui/Tools.tsx b/app/src/components/ui/Tools.tsx index abe7ba8..1f5438d 100644 --- a/app/src/components/ui/Tools.tsx +++ b/app/src/components/ui/Tools.tsx @@ -18,15 +18,19 @@ import { usePlayButtonStore } from "../../store/usePlayButtonStore"; import useTemplateStore from "../../store/useTemplateStore"; import { useSelectedZoneStore } from "../../store/useZoneStore"; import { + useActiveTool, useAddAction, useDeleteModels, + useDeletePointOrLine, + useMovePoint, useSelectedWallItem, useToggleView, + useToolMode, + useTransformMode, } from "../../store/store"; const Tools: React.FC = () => { const { templates } = useTemplateStore(); - const [activeTool, setActiveTool] = useState("cursor"); const [activeSubTool, setActiveSubTool] = useState("cursor"); const [toggleThreeD, setToggleThreeD] = useState(true); @@ -39,11 +43,17 @@ const Tools: React.FC = () => { const { selectedZone } = useSelectedZoneStore(); // wall options - const { setToggleView } = useToggleView(); + const { toggleView, setToggleView } = useToggleView(); const { setDeleteModels } = useDeleteModels(); const { setAddAction } = useAddAction(); const { setSelectedWallItem } = useSelectedWallItem(); + const { transformMode, setTransformMode } = useTransformMode(); + const { deletePointOrLine, setDeletePointOrLine } = useDeletePointOrLine(); + const { movePoint, setMovePoint } = useMovePoint(); + const { toolMode, setToolMode } = useToolMode(); + const { activeTool, setActiveTool } = useActiveTool(); + // Reset activeTool whenever activeModule changes useEffect(() => { setActiveTool(activeSubTool); @@ -60,6 +70,7 @@ const Tools: React.FC = () => { setToggleView(false); } setToggleThreeD(!toggleThreeD); + setActiveTool("cursor"); }; useEffect(() => { @@ -85,6 +96,84 @@ const Tools: React.FC = () => { }; }, []); + useEffect(() => { + setToolMode(null); + setDeleteModels(false); + setAddAction(null); + setTransformMode(null); + setMovePoint(false); + setDeletePointOrLine(false); + + switch (activeTool) { + case "Move": + if (toggleView) { + setMovePoint(true); + } else { + setTransformMode("translate"); + } + break; + + case "Rotate": + if (!toggleView) { + setTransformMode("rotate"); + } + break; + + case "Scale": + if (!toggleView) { + setTransformMode("scale"); + } + break; + + case "draw-wall": + if (toggleView) { + setToolMode("Wall"); + } + break; + + case "Draw Aisle": + if (toggleView) { + setToolMode("Aisle"); + } + break; + + case "Mark zone": + if (toggleView) { + setToolMode("Zone"); + } + break; + + case "Draw Floor": + if (toggleView) { + setToolMode("Floor"); + } + break; + + case "Measurement Tool": + setToolMode("MeasurementScale"); + break; + + case "Add pillar": + if (!toggleView) { + setAddAction("pillar"); + } + break; + + case "Delete": + if (toggleView) { + setDeletePointOrLine(true); + } else { + setDeleteModels(true); + } + break; + + default: + break; + } + + setActiveTool(activeTool); + }, [activeTool]); + return ( <> {!isPlaying ? ( @@ -94,9 +183,8 @@ const Tools: React.FC = () => {
{activeSubTool == "cursor" && (
{ setActiveTool("cursor"); }} @@ -106,9 +194,8 @@ const Tools: React.FC = () => { )} {activeSubTool == "free-hand" && (
{ setActiveTool("free-hand"); }} @@ -167,9 +254,8 @@ const Tools: React.FC = () => {
{ setActiveTool("draw-wall"); }} @@ -177,9 +263,8 @@ const Tools: React.FC = () => {
{ setActiveTool("draw-zone"); }} @@ -187,9 +272,8 @@ const Tools: React.FC = () => {
{ setActiveTool("draw-aisle"); }} @@ -197,9 +281,8 @@ const Tools: React.FC = () => {
{ setActiveTool("draw-floor"); }} @@ -214,9 +297,8 @@ const Tools: React.FC = () => {
{ setActiveTool("pen"); }} @@ -248,9 +330,8 @@ const Tools: React.FC = () => {
{ setActiveTool("comment"); }} @@ -258,9 +339,8 @@ const Tools: React.FC = () => {
{ setIsPlaying(!isPlaying); }} @@ -270,9 +350,8 @@ const Tools: React.FC = () => {
diff --git a/app/src/modules/builder/groups/floorItemsGroup.tsx b/app/src/modules/builder/groups/floorItemsGroup.tsx index 8ddcdc9..cf9d6b8 100644 --- a/app/src/modules/builder/groups/floorItemsGroup.tsx +++ b/app/src/modules/builder/groups/floorItemsGroup.tsx @@ -193,7 +193,7 @@ const FloorItemsGroup = ({ itemsGroup, hoveredDeletableFloorItem, AttachedObject } const Mode = transformMode; - if (Mode !== null || activeTool === "Cursor") { + if (Mode !== null || activeTool === "cursor") { if (!itemsGroup.current) return; let intersects = raycaster.intersectObjects(itemsGroup.current.children, true); if (intersects.length > 0 && intersects[0]?.object?.parent?.parent?.position && intersects[0]?.object?.parent?.parent?.scale && intersects[0]?.object?.parent?.parent?.rotation) { @@ -225,7 +225,7 @@ const FloorItemsGroup = ({ itemsGroup, hoveredDeletableFloorItem, AttachedObject const Mode = transformMode; - if (Mode !== null || activeTool === "Cursor") { + if (Mode !== null || activeTool === "cursor") { if (!itemsGroup.current) return; let intersects = raycaster.intersectObjects(itemsGroup.current.children, true); if (intersects.length > 0 && intersects[0]?.object?.parent?.parent?.position && intersects[0]?.object?.parent?.parent?.scale && intersects[0]?.object?.parent?.parent?.rotation) { diff --git a/app/src/modules/simulation/behaviour/behaviour.tsx b/app/src/modules/simulation/behaviour/behaviour.tsx index 2854172..868900a 100644 --- a/app/src/modules/simulation/behaviour/behaviour.tsx +++ b/app/src/modules/simulation/behaviour/behaviour.tsx @@ -67,7 +67,7 @@ function Behaviour() { point: { uuid: pointUUID, position: [pointPosition.x, pointPosition.y, pointPosition.z], - actions: [{ uuid: THREE.MathUtils.generateUUID(), name: 'Action 1', type: 'Start', start: THREE.MathUtils.generateUUID(), hitCount: 1, end: THREE.MathUtils.generateUUID(), buffer: 0, isUsed: false }], + actions: [{ uuid: THREE.MathUtils.generateUUID(), name: 'Action 1', type: 'Start', start: '', hitCount: 1, end: '', buffer: 0, isUsed: false }], triggers: [], connections: { source: { pathUUID: item.modeluuid, pointUUID: pointUUID }, targets: [] }, }, diff --git a/app/src/modules/simulation/path/pathCreation.tsx b/app/src/modules/simulation/path/pathCreation.tsx index 78a4491..33ca2f8 100644 --- a/app/src/modules/simulation/path/pathCreation.tsx +++ b/app/src/modules/simulation/path/pathCreation.tsx @@ -1,27 +1,10 @@ import * as THREE from 'three'; +import * as Types from '../../../types/world/worldTypes'; import { useRef, useState, useEffect } from 'react'; import { Sphere, TransformControls } from '@react-three/drei'; import { useIsConnecting, useRenderDistance, useSelectedActionSphere, useSelectedPath, useSimulationPaths } from '../../../store/store'; import { useFrame, useThree } from '@react-three/fiber'; import { useSubModuleStore } from '../../../store/useModuleStore'; -import { point } from '@turf/helpers'; - -interface ConveyorEventsSchema { - modeluuid: string; - modelName: string; - type: 'Conveyor'; - points: { - uuid: string; - position: [number, number, number]; - rotation: [number, number, number]; - actions: { uuid: string; name: string; type: string; material: string; delay: number | string; spawnInterval: number | string; isUsed: boolean }[] | []; - triggers: { uuid: string; name: string; type: string; isUsed: boolean }[] | []; - connections: { source: { pathUUID: string; pointUUID: string }; targets: { pathUUID: string; pointUUID: string }[] }; - }[]; - assetPosition: [number, number, number]; - assetRotation: [number, number, number]; - speed: number; -} function PathCreation({ pathsGroupRef }: { pathsGroupRef: React.MutableRefObject }) { const { renderDistance } = useRenderDistance(); @@ -89,7 +72,7 @@ function PathCreation({ pathsGroupRef }: { pathsGroupRef: React.MutableRefObject }; } return path; - }) as ConveyorEventsSchema[]; + }) as Types.ConveyorEventsSchema[]; setSimulationPaths(updatedPaths); }; diff --git a/app/src/modules/simulation/simulation.tsx b/app/src/modules/simulation/simulation.tsx index 73ef27f..10934fb 100644 --- a/app/src/modules/simulation/simulation.tsx +++ b/app/src/modules/simulation/simulation.tsx @@ -14,7 +14,7 @@ function Simulation() { const [processes, setProcesses] = useState([]); useEffect(() => { - + console.log('simulationPaths: ', simulationPaths); }, [simulationPaths]); // useEffect(() => { diff --git a/app/src/store/store.ts b/app/src/store/store.ts index 8bbcba1..388f9d0 100644 --- a/app/src/store/store.ts +++ b/app/src/store/store.ts @@ -214,7 +214,7 @@ export const useAddAction = create((set: any) => ({ })); export const useActiveTool = create((set: any) => ({ - activeTool: "Cursor", + activeTool: "cursor", setActiveTool: (x: any) => set({ activeTool: x }), })); diff --git a/app/src/types/world/worldTypes.d.ts b/app/src/types/world/worldTypes.d.ts index 2fcbd4f..71c2528 100644 --- a/app/src/types/world/worldTypes.d.ts +++ b/app/src/types/world/worldTypes.d.ts @@ -295,7 +295,7 @@ interface ConveyorEventsSchema { position: [number, number, number]; rotation: [number, number, number]; actions: { uuid: string; name: string; type: string; material: string; delay: number | string; spawnInterval: number | string; isUsed: boolean }[] | []; - triggers: { uuid: string; name: string; type: string; isUsed: boolean }[] | []; + triggers: { uuid: string; name: string; type: string; isUsed: boolean; bufferTime: number }[] | []; connections: { source: { pathUUID: string; pointUUID: string }; targets: { pathUUID: string; pointUUID: string }[] }; }[]; assetPosition: [number, number, number]; From cff29304d0187d5045c1644020ecb41b9049d0ad Mon Sep 17 00:00:00 2001 From: Poovizhi99 Date: Sat, 29 Mar 2025 12:57:16 +0530 Subject: [PATCH 02/13] integrated Factory builder features --- .../components/layout/sidebarLeft/Header.tsx | 1 + app/src/components/ui/Tools.tsx | 181 ++++++++++++++++-- app/src/modules/market/AssetPreview.tsx | 15 +- app/src/modules/market/Card.tsx | 9 +- app/src/modules/market/CardsContainer.tsx | 12 +- 5 files changed, 183 insertions(+), 35 deletions(-) diff --git a/app/src/components/layout/sidebarLeft/Header.tsx b/app/src/components/layout/sidebarLeft/Header.tsx index ce76cb3..c51de20 100644 --- a/app/src/components/layout/sidebarLeft/Header.tsx +++ b/app/src/components/layout/sidebarLeft/Header.tsx @@ -23,6 +23,7 @@ const Header: React.FC = () => { className={`toggle-sidebar-ui-button ${!toggleUI ? "active" : ""}`} onClick={() => { if (activeModule !== "market") setToggleUI(!toggleUI); + localStorage.setItem("navBarUi", JSON.stringify(!toggleUI)); }} > diff --git a/app/src/components/ui/Tools.tsx b/app/src/components/ui/Tools.tsx index abe7ba8..23a46bd 100644 --- a/app/src/components/ui/Tools.tsx +++ b/app/src/components/ui/Tools.tsx @@ -3,8 +3,10 @@ import { AsileIcon, CommentIcon, CursorIcon, + DeleteIcon, FloorIcon, FreeMoveIcon, + MeasureToolIcon, PenIcon, PlayIcon, SaveTemplateIcon, @@ -18,17 +20,23 @@ import { usePlayButtonStore } from "../../store/usePlayButtonStore"; import useTemplateStore from "../../store/useTemplateStore"; import { useSelectedZoneStore } from "../../store/useZoneStore"; import { + useActiveTool, useAddAction, useDeleteModels, + useDeletePointOrLine, + useMovePoint, useSelectedWallItem, useToggleView, + useToolMode, + useTransformMode, } from "../../store/store"; +import useToggleStore from "../../store/useUIToggleStore"; const Tools: React.FC = () => { const { templates } = useTemplateStore(); - const [activeTool, setActiveTool] = useState("cursor"); const [activeSubTool, setActiveSubTool] = useState("cursor"); const [toggleThreeD, setToggleThreeD] = useState(true); + const { toggleUI, setToggleUI } = useToggleStore(); const dropdownRef = useRef(null); const [openDrop, setOpenDrop] = useState(false); @@ -39,12 +47,24 @@ const Tools: React.FC = () => { const { selectedZone } = useSelectedZoneStore(); // wall options - const { setToggleView } = useToggleView(); + const { toggleView, setToggleView } = useToggleView(); const { setDeleteModels } = useDeleteModels(); const { setAddAction } = useAddAction(); const { setSelectedWallItem } = useSelectedWallItem(); - // Reset activeTool whenever activeModule changes + const { transformMode, setTransformMode } = useTransformMode(); + const { deletePointOrLine, setDeletePointOrLine } = useDeletePointOrLine(); + const { movePoint, setMovePoint } = useMovePoint(); + const { toolMode, setToolMode } = useToolMode(); + const { activeTool, setActiveTool } = useActiveTool(); + useEffect(() => { + const storedNavBar: any = localStorage.getItem("navBarUi"); + if (storedNavBar) { + const parsedNavBar = JSON.parse(storedNavBar); + setToggleUI(parsedNavBar); + } + }, []); + useEffect(() => { setActiveTool(activeSubTool); setActiveSubTool(activeSubTool); @@ -56,9 +76,12 @@ const Tools: React.FC = () => { setDeleteModels(false); setAddAction(null); setToggleView(true); + localStorage.setItem("navBarUi", JSON.stringify(!toggleThreeD)); } else { setToggleView(false); } + setActiveSubTool("cursor"); + setActiveTool("cursor"); setToggleThreeD(!toggleThreeD); }; @@ -84,7 +107,88 @@ const Tools: React.FC = () => { document.removeEventListener("keydown", handleEscKeyPress); // Clean up the event listener }; }, []); + useEffect(() => { + if (!toggleThreeD) { + setToggleUI(false); + } + }, [toggleThreeD]); + useEffect(() => { + setToolMode(null); + setDeleteModels(false); + setAddAction(null); + setTransformMode(null); + setMovePoint(false); + setDeletePointOrLine(false); + switch (activeTool) { + case "Move": + if (toggleView) { + setMovePoint(true); + } else { + setTransformMode("translate"); + } + break; + + case "Rotate": + if (!toggleView) { + setTransformMode("rotate"); + } + break; + + case "Scale": + if (!toggleView) { + setTransformMode("scale"); + } + break; + + case "draw-wall": + if (toggleView) { + setToolMode("Wall"); + } + break; + + case "draw-aisle": + if (toggleView) { + setToolMode("Aisle"); + } + break; + + case "draw-zone": + if (toggleView) { + setToolMode("Zone"); + } + break; + + case "draw-floor": + if (toggleView) { + setToolMode("Floor"); + } + break; + + case "measure": + setToolMode("MeasurementScale"); + break; + + case "Add pillar": + if (!toggleView) { + setAddAction("pillar"); + } + break; + + case "delete": + if (toggleView) { + setDeletePointOrLine(true); + } else { + setDeleteModels(true); + } + break; + + default: + break; + } + + setActiveTool(activeTool); + }, [activeTool]); return ( <> {!isPlaying ? ( @@ -116,13 +220,24 @@ const Tools: React.FC = () => {
)} + {activeSubTool == "delete" && ( +
{ + setActiveTool("delete"); + }} + > + +
+ )} {activeModule !== "visualization" && (
{ setOpenDrop(!openDrop); - console.log(openDrop); }} > @@ -156,6 +271,20 @@ const Tools: React.FC = () => {
Free Hand
+
{ + setOpenDrop(false); + setActiveTool("delete"); + setActiveSubTool("delete"); + }} + > +
+ {activeSubTool === "delete" && } +
+ +
Delete
+
)}
@@ -173,6 +302,7 @@ const Tools: React.FC = () => { onClick={() => { setActiveTool("draw-wall"); }} + title="Wall" >
@@ -183,6 +313,7 @@ const Tools: React.FC = () => { onClick={() => { setActiveTool("draw-zone"); }} + title="Zone" >
@@ -193,6 +324,7 @@ const Tools: React.FC = () => { onClick={() => { setActiveTool("draw-aisle"); }} + title="Aisle" >
@@ -203,12 +335,31 @@ const Tools: React.FC = () => { onClick={() => { setActiveTool("draw-floor"); }} + title="Floor" >
)} + {activeModule === "builder" && ( + <> +
+
+
{ + setActiveTool("measure"); + }} + title="Measure" + > + +
+
+ + )} {activeModule === "simulation" && ( <>
@@ -257,16 +408,18 @@ const Tools: React.FC = () => { >
-
{ - setIsPlaying(!isPlaying); - }} - > - -
+ {toggleThreeD && ( +
{ + setIsPlaying(!isPlaying); + }} + > + +
+ )}
= ({
{selectedCard.assetName}
- Lorem ipsum dolor sit amet consectetur adipisicing elit. - Doloremque nisi beatae facilis architecto quaerat delectus velit - aliquid assumenda cumque vitae! Tempore quibusdam ab natus in - minima voluptates, aliquid corrupti excepturi consectetur - distinctio sequi beatae odit autem? Distinctio ab, voluptatem - omnis quibusdam, incidunt eum ipsa aliquid enim eaque eveniet nisi - autem, accusantium vel! Laborum in iste voluptates ad! Harum eum - amet pariatur fugit laudantium dolorem maxime voluptates atque - molestiae modi inventore quidem maiores dolore numquam, natus - quisquam optio distinctio eveniet aliquam, aut eligendi laboriosam - eaque! Porro cumque cum distinctio ullam debitis, dolorum - similique! Harum cupiditate perferendis voluptatum molestiae, - fugiat quisquam assumenda! + {`${selectedCard.description} is used in factories to improve efficiency and production speed It is designed to handle heavy workloads and perform repetitive tasks with precision. Many industries rely on this machine to manufacture products quickly and accurately. It reduces human effort and minimizes errors in the production process. Regular maintenance is required to keep the machine in good working condition.With advanced technology, this machine continues to enhance industrial operations and increase productivity.`}
diff --git a/app/src/modules/market/Card.tsx b/app/src/modules/market/Card.tsx index e723f4f..ec9db06 100644 --- a/app/src/modules/market/Card.tsx +++ b/app/src/modules/market/Card.tsx @@ -12,17 +12,19 @@ import { getAssetDownload } from "../../services/marketplace/getAssetDownload"; interface CardProps { assetName: string; - uploadedOn: string; + uploadedOn: number; price: number; rating: number; views: number; image: string; + description: string; onSelectCard: (cardData: { assetName: string; - uploadedOn: string; + uploadedOn: number; price: number; rating: number; views: number; + description: string; }) => void; } @@ -33,10 +35,11 @@ const Card: React.FC = ({ rating, views, image, + description, onSelectCard, }) => { const handleCardSelect = () => { - onSelectCard({ assetName, uploadedOn, price, rating, views }); + onSelectCard({ assetName, uploadedOn, price, rating, views, description }); }; return ( diff --git a/app/src/modules/market/CardsContainer.tsx b/app/src/modules/market/CardsContainer.tsx index 423fd16..c2a7e6d 100644 --- a/app/src/modules/market/CardsContainer.tsx +++ b/app/src/modules/market/CardsContainer.tsx @@ -1,8 +1,7 @@ import React, { useEffect, useState } from "react"; import Card from "./Card"; import AssetPreview from "./AssetPreview"; -import RenderOverlay from "../../components/templates/Overlay"; -import { fetchAssets } from "../../services/marketplace/fetchAssets"; + interface ModelData { CreatedBy: string; animated: string | null; @@ -23,18 +22,20 @@ interface ModelsProps { const CardsContainer: React.FC = ({ models }) => { const [selectedCard, setSelectedCard] = useState<{ assetName: string; - uploadedOn: string; + uploadedOn: number; price: number; rating: number; views: number; + description: string; } | null>(null); const handleCardSelect = (cardData: { assetName: string; - uploadedOn: string; + uploadedOn: number; price: number; rating: number; views: number; + description: string; }) => { setSelectedCard(cardData); }; @@ -48,12 +49,13 @@ const CardsContainer: React.FC = ({ models }) => { ))} {/* */} From 13732a5679ec2704bf394118d6b884a04c489e01 Mon Sep 17 00:00:00 2001 From: Jerald-Golden-B Date: Sat, 29 Mar 2025 12:58:54 +0530 Subject: [PATCH 03/13] added ui and integerated ui for the vehicle mechanics --- .../layout/sidebarRight/SideBarRight.tsx | 2 +- .../mechanics/ConveyorMechanics.tsx | 33 +- .../mechanics/VehicleMechanics.tsx | 590 +++--------------- app/src/components/ui/Tools.tsx | 3 + app/src/components/ui/inputs/EyeDropInput.tsx | 32 +- app/src/modules/builder/functions/draw.ts | 2 +- .../modules/scene/tools/measurementTool.tsx | 4 +- app/src/modules/scene/world/world.tsx | 7 +- .../simulation/behaviour/behaviour.tsx | 5 +- .../simulationtemp/path/pathCreator.tsx | 3 + app/src/store/store.ts | 14 + app/src/types/world/worldTypes.d.ts | 5 +- 12 files changed, 156 insertions(+), 544 deletions(-) diff --git a/app/src/components/layout/sidebarRight/SideBarRight.tsx b/app/src/components/layout/sidebarRight/SideBarRight.tsx index 3ba5595..f2f6695 100644 --- a/app/src/components/layout/sidebarRight/SideBarRight.tsx +++ b/app/src/components/layout/sidebarRight/SideBarRight.tsx @@ -109,7 +109,7 @@ const SideBarRight: React.FC = () => { {subModule === "mechanics" && selectedActionSphere && selectedActionSphere.path.type === "Vehicle" && (
- {/* */} +
)} diff --git a/app/src/components/layout/sidebarRight/mechanics/ConveyorMechanics.tsx b/app/src/components/layout/sidebarRight/mechanics/ConveyorMechanics.tsx index 2788c12..23b566b 100644 --- a/app/src/components/layout/sidebarRight/mechanics/ConveyorMechanics.tsx +++ b/app/src/components/layout/sidebarRight/mechanics/ConveyorMechanics.tsx @@ -8,9 +8,7 @@ import { import RenameInput from "../../../ui/inputs/RenameInput"; import InputWithDropDown from "../../../ui/inputs/InputWithDropDown"; import LabledDropdown from "../../../ui/inputs/LabledDropdown"; -import RegularDropDown from "../../../ui/inputs/RegularDropDown"; import { handleResize } from "../../../../functions/handleResizePannel"; -import EyeDropInput from "../../../ui/inputs/EyeDropInput"; import { useSelectedActionSphere, useSelectedPath, useSimulationPaths } from "../../../../store/store"; import * as THREE from 'three'; import * as Types from '../../../../types/world/worldTypes'; @@ -428,9 +426,18 @@ const ConveyorMechanics: React.FC = () => { return (
-
- {selectedActionSphere?.path?.modelName || "point name not found"} -
+ {!selectedPath && +
+ {selectedActionSphere?.path?.modelName || "point name not found"} +
+ } + + {selectedPath && + +
+ {selectedPath.path.modelName || "path name not found"} +
+ }
{!selectedPath && @@ -632,10 +639,18 @@ const ConveyorMechanics: React.FC = () => {
)}
-
- - By selecting points, you can create events and triggers. -
+ {!selectedPath && ( +
+ + Configure the point's action and trigger properties. +
+ )} + {selectedPath && ( +
+ + Configure the path properties. +
+ )}
); diff --git a/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx b/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx index de6eb8c..42ad965 100644 --- a/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx +++ b/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx @@ -1,562 +1,128 @@ -import React, { useRef, useState, useMemo, useEffect } from "react"; -import { - AddIcon, - InfoIcon, - RemoveIcon, - ResizeHeightIcon, -} from "../../../icons/ExportCommonIcons"; -import RenameInput from "../../../ui/inputs/RenameInput"; +import React, { useRef, useMemo } from "react"; +import { InfoIcon } from "../../../icons/ExportCommonIcons"; import InputWithDropDown from "../../../ui/inputs/InputWithDropDown"; -import LabledDropdown from "../../../ui/inputs/LabledDropdown"; -import RegularDropDown from "../../../ui/inputs/RegularDropDown"; -import { handleResize } from "../../../../functions/handleResizePannel"; import EyeDropInput from "../../../ui/inputs/EyeDropInput"; -import { useSelectedActionSphere, useSelectedPath, useSimulationPaths } from "../../../../store/store"; -import * as THREE from 'three'; +import { useSelectedActionSphere, useSimulationPaths } from "../../../../store/store"; import * as Types from '../../../../types/world/worldTypes'; -import InputToggle from "../../../ui/inputs/InputToggle"; const VehicleMechanics: React.FC = () => { const { selectedActionSphere } = useSelectedActionSphere(); - const { selectedPath, setSelectedPath } = useSelectedPath(); const { simulationPaths, setSimulationPaths } = useSimulationPaths(); - const actionsContainerRef = useRef(null); - const triggersContainerRef = useRef(null); + const propertiesContainerRef = useRef(null); const selectedPoint = useMemo(() => { - if (!selectedActionSphere) return null; - return simulationPaths - .filter((path): path is Types.ConveyorEventsSchema => path.type === "Conveyor") - .flatMap((path) => path.points) - .find((point) => point.uuid === selectedActionSphere.point.uuid); - }, [selectedActionSphere, simulationPaths]); + if (!selectedActionSphere?.point?.uuid) return null; - const handleAddAction = () => { - if (!selectedActionSphere) return; + const vehiclePaths = simulationPaths.filter( + (path): path is Types.VehicleEventsSchema => path.type === "Vehicle" + ); + + return vehiclePaths.find( + (path) => path.point.uuid === selectedActionSphere.point.uuid + )?.point; + }, [selectedActionSphere, simulationPaths, selectedActionSphere?.point?.uuid]); + + const handleActionUpdate = React.useCallback((updatedAction: Partial) => { + if (!selectedActionSphere?.point?.uuid) return; const updatedPaths = simulationPaths.map((path) => { - if (path.type === "Conveyor") { + if (path.type === "Vehicle" && path.point.uuid === selectedActionSphere.point.uuid) { return { ...path, - points: path.points.map((point) => { - if (point.uuid === selectedActionSphere.point.uuid) { - const actionIndex = point.actions.length; - const newAction = { - uuid: THREE.MathUtils.generateUUID(), - name: `Action ${actionIndex + 1}`, - type: 'Inherit', - material: 'Inherit', - delay: 'Inherit', - spawnInterval: 'Inherit', - isUsed: false - }; - - return { ...point, actions: [...point.actions, newAction] }; + point: { + ...path.point, + actions: { + ...path.point.actions, + ...updatedAction } - return point; - }), + } }; } return path; }); setSimulationPaths(updatedPaths); - }; + }, [selectedActionSphere?.point?.uuid, simulationPaths, setSimulationPaths]); - const handleDeleteAction = (uuid: string) => { - if (!selectedActionSphere) return; + const handleStartPositionChange = React.useCallback((position: string) => { + handleActionUpdate({ start: position }); + }, [handleActionUpdate]); - const updatedPaths = simulationPaths.map((path) => - path.type === "Conveyor" - ? { - ...path, - points: path.points.map((point) => - point.uuid === selectedActionSphere.point.uuid - ? { ...point, actions: point.actions.filter(action => action.uuid !== uuid) } - : point - ), - } - : path - ); + const handleEndPositionChange = React.useCallback((position: string) => { + handleActionUpdate({ end: position }); + }, [handleActionUpdate]); - setSimulationPaths(updatedPaths); - }; + const handleHitCountChange = React.useCallback((hitCount: number) => { + handleActionUpdate({ hitCount }); + }, [handleActionUpdate]); - const handleActionSelect = (uuid: string, actionType: string) => { - if (!selectedActionSphere) return; + const handleBufferChange = React.useCallback((buffer: number) => { + handleActionUpdate({ buffer }); + }, [handleActionUpdate]); - const updatedPaths = simulationPaths.map((path) => - path.type === "Conveyor" - ? { - ...path, - points: path.points.map((point) => - point.uuid === selectedActionSphere.point.uuid - ? { - ...point, - actions: point.actions.map((action) => - action.uuid === uuid - ? { - ...action, - type: actionType, - material: actionType === 'Spawn' || actionType === 'Swap' ? 'Inherit' : action.material, - delay: actionType === 'Delay' ? 'Inherit' : action.delay, - spawnInterval: actionType === 'Spawn' ? 'Inherit' : action.spawnInterval - } - : action - ), - } - : point - ), - } - : path - ); - - setSimulationPaths(updatedPaths); - - // Update the selected item to reflect changes - if (selectedItem?.type === "action" && selectedItem.item.uuid === uuid) { - const updatedAction = updatedPaths - .filter((path): path is Types.ConveyorEventsSchema => path.type === "Conveyor") - .flatMap(path => path.points) - .find(p => p.uuid === selectedActionSphere.point.uuid) - ?.actions.find(a => a.uuid === uuid); - - if (updatedAction) { - setSelectedItem({ - type: "action", - item: updatedAction - }); - } - } - }; - - // Modified handleMaterialSelect to ensure it only applies to relevant action types - const handleMaterialSelect = (uuid: string, material: string) => { - if (!selectedActionSphere) return; - - const updatedPaths = simulationPaths.map((path) => - path.type === "Conveyor" - ? { - ...path, - points: path.points.map((point) => - point.uuid === selectedActionSphere.point.uuid - ? { - ...point, - actions: point.actions.map((action) => - action.uuid === uuid && - (action.type === 'Spawn' || action.type === 'Swap') - ? { ...action, material } - : action - ), - } - : point - ), - } - : path - ); - - setSimulationPaths(updatedPaths); - - // Update selected item if it's the current action - if (selectedItem?.type === "action" && selectedItem.item.uuid === uuid) { - setSelectedItem({ - ...selectedItem, - item: { - ...selectedItem.item, - material - } - }); - } - }; - - const handleDelayChange = (uuid: string, delay: number | string) => { - if (!selectedActionSphere) return; - - const updatedPaths = simulationPaths.map((path) => - path.type === "Conveyor" - ? { - ...path, - points: path.points.map((point) => - point.uuid === selectedActionSphere.point.uuid - ? { - ...point, - actions: point.actions.map((action) => - action.uuid === uuid ? { ...action, delay } : action - ), - } - : point - ), - } - : path - ); - - setSimulationPaths(updatedPaths); - }; - - const handleSpawnIntervalChange = (uuid: string, spawnInterval: number | string) => { - if (!selectedActionSphere) return; - - const updatedPaths = simulationPaths.map((path) => - path.type === "Conveyor" - ? { - ...path, - points: path.points.map((point) => - point.uuid === selectedActionSphere.point.uuid - ? { - ...point, - actions: point.actions.map((action) => - action.uuid === uuid ? { ...action, spawnInterval } : action - ), - } - : point - ), - } - : path - ); - - setSimulationPaths(updatedPaths); - }; - - const handleSpeedChange = (speed: number) => { - if (!selectedPath) return; - - const updatedPaths = simulationPaths.map((path) => - path.modeluuid === selectedPath.path.modeluuid ? { ...path, speed } : path - ); - - setSimulationPaths(updatedPaths); - setSelectedPath({ ...selectedPath, path: { ...selectedPath.path, speed } }); - }; - - const handleAddTrigger = () => { - if (!selectedActionSphere) return; - - const updatedPaths = simulationPaths.map((path) => - path.type === "Conveyor" - ? { - ...path, - points: path.points.map((point) => { - if (point.uuid === selectedActionSphere.point.uuid) { - const triggerIndex = point.triggers.length; - const newTrigger = { - uuid: THREE.MathUtils.generateUUID(), - name: `Trigger ${triggerIndex + 1}`, - type: '', - bufferTime: 0, - isUsed: false - }; - - return { ...point, triggers: [...point.triggers, newTrigger] }; - } - return point; - }), - } - : path - ); - - setSimulationPaths(updatedPaths); - }; - - const handleDeleteTrigger = (uuid: string) => { - if (!selectedActionSphere) return; - - const updatedPaths = simulationPaths.map((path) => - path.type === "Conveyor" - ? { - ...path, - points: path.points.map((point) => - point.uuid === selectedActionSphere.point.uuid - ? { ...point, triggers: point.triggers.filter(trigger => trigger.uuid !== uuid) } - : point - ), - } - : path - ); - - setSimulationPaths(updatedPaths); - }; - - const handleTriggerSelect = (uuid: string, triggerType: string) => { - if (!selectedActionSphere) return; - - const updatedPaths = simulationPaths.map((path) => - path.type === "Conveyor" - ? { - ...path, - points: path.points.map((point) => - point.uuid === selectedActionSphere.point.uuid - ? { - ...point, - triggers: point.triggers.map((trigger) => - trigger.uuid === uuid ? { ...trigger, type: triggerType } : trigger - ), - } - : point - ), - } - : path - ); - - setSimulationPaths(updatedPaths); - }; - - // Update the toggle handlers to immediately update the selected item - const handleActionToggle = (uuid: string) => { - if (!selectedActionSphere) return; - const updatedPaths = simulationPaths.map((path) => - path.type === "Conveyor" - ? { - ...path, - points: path.points.map((point) => - point.uuid === selectedActionSphere.point.uuid - ? { - ...point, - actions: point.actions.map((action) => ({ - ...action, - isUsed: action.uuid === uuid ? !action.isUsed : false, - })), - } - : point - ), - } - : path - ); - - setSimulationPaths(updatedPaths); - - // Immediately update the selected item if it's the one being toggled - if (selectedItem?.type === "action" && selectedItem.item.uuid === uuid) { - setSelectedItem({ - ...selectedItem, - item: { - ...selectedItem.item, - isUsed: !selectedItem.item.isUsed - } - }); - } - }; - - // Do the same for trigger toggle - const handleTriggerToggle = (uuid: string) => { - if (!selectedActionSphere) return; - - const updatedPaths = simulationPaths.map((path) => - path.type === "Conveyor" - ? { - ...path, - points: path.points.map((point) => - point.uuid === selectedActionSphere.point.uuid - ? { - ...point, - triggers: point.triggers.map((trigger) => ({ - ...trigger, - isUsed: trigger.uuid === uuid ? !trigger.isUsed : false, - })), - } - : point - ), - } - : path - ); - - setSimulationPaths(updatedPaths); - - // Immediately update the selected item if it's the one being toggled - if (selectedItem?.type === "trigger" && selectedItem.item.uuid === uuid) { - setSelectedItem({ - ...selectedItem, - item: { - ...selectedItem.item, - isUsed: !selectedItem.item.isUsed - } - }); - } - }; - - const [selectedItem, setSelectedItem] = useState<{ type: "action" | "trigger"; item: any; } | null>(null); - - useEffect(() => { - setSelectedItem(null); // Reset selectedItem when selectedActionSphere changes - }, [selectedActionSphere]); + const handleSpeedChange = React.useCallback((speed: number) => { + + }, [selectedActionSphere?.point?.uuid, simulationPaths, setSimulationPaths]); return ( -
+
- {selectedActionSphere?.path?.modelName || "point name not found"} + {selectedActionSphere?.path?.modelName || "Vehicle point not found"}
-
-
-
Actions
-
- Add -
-
-
-
- <> - {console.log(selectedPoint)} - -
-
handleResize(e, actionsContainerRef)} - > - -
-
-
-
-
-
Triggers
-
- Add -
-
-
-
- {selectedPoint?.triggers.map((trigger) => ( -
-
setSelectedItem({ type: "trigger", item: trigger })} - > - -
-
handleDeleteTrigger(trigger.uuid)} - > - -
-
- ))} -
-
handleResize(e, triggersContainerRef)} - > - -
-
-
-
- {selectedItem && ( +
+
Vehicle Properties
+ + {selectedPoint && ( <> -
{selectedItem.item.name}
+ - {selectedItem.type === "action" && ( - <> - handleActionToggle(selectedItem.item.uuid)} - /> - handleActionSelect(selectedItem.item.uuid, option)} - /> + - {/* Only show material dropdown for Spawn/Swap actions */} - {(selectedItem.item.type === 'Spawn' || selectedItem.item.type === 'Swap') && ( - handleMaterialSelect(selectedItem.item.uuid, option)} - /> - )} + handleHitCountChange(parseInt(value))} + /> - {/* Only show delay input for Delay actions */} - {selectedItem.item.type === 'Delay' && ( - { - const numValue = parseInt(value); - handleDelayChange( - selectedItem.item.uuid, - !value ? 'Inherit' : numValue - ); - }} - /> - )} + handleBufferChange(parseInt(value))} + /> - {/* Only show spawn interval for Spawn actions */} - {selectedItem.item.type === 'Spawn' && ( - { - handleSpawnIntervalChange(selectedItem.item.uuid, (value === "") ? "Inherit" : parseInt(value)); - }} - /> - - )} - - )} - - {selectedItem.type === "trigger" && ( - <> - handleTriggerToggle(selectedItem.item.uuid)} - /> - - handleTriggerSelect(selectedItem.item.uuid, option)} - /> - - )} + handleSpeedChange(parseFloat(value))} + /> )} - {selectedPath && !selectedItem && ( -
- handleSpeedChange(parseFloat(value))} - /> -
- )}
+
- By selecting points, you can create events and triggers. + Configure vehicle's movement and interaction properties.
); }; -export default VehicleMechanics; \ No newline at end of file +export default React.memo(VehicleMechanics); \ No newline at end of file diff --git a/app/src/components/ui/Tools.tsx b/app/src/components/ui/Tools.tsx index 1f5438d..3e605a8 100644 --- a/app/src/components/ui/Tools.tsx +++ b/app/src/components/ui/Tools.tsx @@ -23,6 +23,7 @@ import { useDeleteModels, useDeletePointOrLine, useMovePoint, + useRefTextUpdate, useSelectedWallItem, useToggleView, useToolMode, @@ -53,6 +54,7 @@ const Tools: React.FC = () => { const { movePoint, setMovePoint } = useMovePoint(); const { toolMode, setToolMode } = useToolMode(); const { activeTool, setActiveTool } = useActiveTool(); + const { refTextupdate, setRefTextUpdate } = useRefTextUpdate(); // Reset activeTool whenever activeModule changes useEffect(() => { @@ -103,6 +105,7 @@ const Tools: React.FC = () => { setTransformMode(null); setMovePoint(false); setDeletePointOrLine(false); + setRefTextUpdate((prevUpdate) => prevUpdate - 1); switch (activeTool) { case "Move": diff --git a/app/src/components/ui/inputs/EyeDropInput.tsx b/app/src/components/ui/inputs/EyeDropInput.tsx index 2823392..d29613a 100644 --- a/app/src/components/ui/inputs/EyeDropInput.tsx +++ b/app/src/components/ui/inputs/EyeDropInput.tsx @@ -1,18 +1,30 @@ import React from "react"; -import RegularDropDown from "./RegularDropDown"; import { EyeDroperIcon } from "../../icons/ExportCommonIcons"; -const EyeDropInput: React.FC = () => { +interface EyeDropInputProps { + label: string; + value: string; + onChange: (value: string) => void; + options?: string[]; +} + +const EyeDropInput: React.FC = ({ + label = "Object", + onChange, +}) => { + const handleEyeDropClick = () => { + // Here you would typically implement the eye dropper functionality + // For now, we'll just simulate selecting a value + const simulatedValue = "picked_value"; // Replace with actual eye dropper logic + onChange(simulatedValue); + }; + return (
-
Object
+
{label}
- {}} - /> -
+ +
@@ -20,4 +32,4 @@ const EyeDropInput: React.FC = () => { ); }; -export default EyeDropInput; +export default EyeDropInput; \ No newline at end of file diff --git a/app/src/modules/builder/functions/draw.ts b/app/src/modules/builder/functions/draw.ts index fc4dafa..0172707 100644 --- a/app/src/modules/builder/functions/draw.ts +++ b/app/src/modules/builder/functions/draw.ts @@ -17,7 +17,7 @@ async function Draw( floorPlanGroup: Types.RefGroup, ReferenceLineMesh: Types.RefMesh, LineCreated: Types.RefBoolean, - setRefTextUpdate: Types.NumberIncrementState, + setRefTextUpdate: any, Tube: Types.RefTubeGeometry, anglesnappedPoint: Types.RefVector3, isAngleSnapped: Types.RefBoolean, diff --git a/app/src/modules/scene/tools/measurementTool.tsx b/app/src/modules/scene/tools/measurementTool.tsx index 3c56a21..f8054af 100644 --- a/app/src/modules/scene/tools/measurementTool.tsx +++ b/app/src/modules/scene/tools/measurementTool.tsx @@ -36,7 +36,7 @@ const MeasurementTool = () => { isLeftMouseDown = false; if (evt.button === 0 && !drag) { raycaster.setFromCamera(pointer, camera); - const intersects = raycaster.intersectObjects(scene.children, true).filter(intersect => !intersect.object.name.includes("Roof") && !intersect.object.name.includes("MeasurementReference") && !(intersect.object.type === "GridHelper")); + const intersects = raycaster.intersectObjects(scene.children, true).filter(intersect => !intersect.object.name.includes("Roof") && !intersect.object.name.includes("MeasurementReference") && !intersect.object.name.includes("agv-collider") && !(intersect.object.type === "GridHelper")); if (intersects.length > 0) { const intersectionPoint = intersects[0].point.clone(); @@ -83,7 +83,7 @@ const MeasurementTool = () => { useFrame(() => { if (points.length === 1) { raycaster.setFromCamera(pointer, camera); - const intersects = raycaster.intersectObjects(scene.children, true).filter(intersect => !intersect.object.name.includes("Roof") && !intersect.object.name.includes("MeasurementReference") && !(intersect.object.type === "GridHelper")); + const intersects = raycaster.intersectObjects(scene.children, true).filter(intersect => !intersect.object.name.includes("Roof") && !intersect.object.name.includes("MeasurementReference") && !intersect.object.name.includes("agv-collider") && !(intersect.object.type === "GridHelper")); if (intersects.length > 0) { updateMeasurement(points[0], intersects[0].point); diff --git a/app/src/modules/scene/world/world.tsx b/app/src/modules/scene/world/world.tsx index 16b4b53..eb7d555 100644 --- a/app/src/modules/scene/world/world.tsx +++ b/app/src/modules/scene/world/world.tsx @@ -29,6 +29,7 @@ import { useUpdateScene, useWalls, useToolMode, + useRefTextUpdate, } from "../../../store/store"; ////////// 3D Function Imports ////////// @@ -118,7 +119,7 @@ export default function World() { const { shadows, setShadows } = useShadows(); const { updateScene, setUpdateScene } = useUpdateScene(); const { walls, setWalls } = useWalls(); - const [RefTextupdate, setRefTextUpdate] = useState(-1000); + const { refTextupdate, setRefTextUpdate } = useRefTextUpdate(); // const loader = new GLTFLoader(); // const dracoLoader = new DRACOLoader(); @@ -158,7 +159,7 @@ export default function World() { ////////// All Toggle's ////////// useEffect(() => { - setRefTextUpdate((prevUpdate) => prevUpdate - 1); + setRefTextUpdate((prevUpdate: number) => prevUpdate - 1); if (dragPointControls.current) { dragPointControls.current.enabled = false; } @@ -241,7 +242,7 @@ export default function World() { diff --git a/app/src/modules/simulation/behaviour/behaviour.tsx b/app/src/modules/simulation/behaviour/behaviour.tsx index 868900a..fa976aa 100644 --- a/app/src/modules/simulation/behaviour/behaviour.tsx +++ b/app/src/modules/simulation/behaviour/behaviour.tsx @@ -67,12 +67,11 @@ function Behaviour() { point: { uuid: pointUUID, position: [pointPosition.x, pointPosition.y, pointPosition.z], - actions: [{ uuid: THREE.MathUtils.generateUUID(), name: 'Action 1', type: 'Start', start: '', hitCount: 1, end: '', buffer: 0, isUsed: false }], - triggers: [], + actions: { uuid: THREE.MathUtils.generateUUID(), name: 'Action 1', type: 'Start', start: '', hitCount: 1, end: '', buffer: 0 }, connections: { source: { pathUUID: item.modeluuid, pointUUID: pointUUID }, targets: [] }, + speed: 2, }, assetPosition: [...item.position], - speed: 2, }; newPaths.push(newVehiclePath); diff --git a/app/src/modules/simulation/simulationtemp/path/pathCreator.tsx b/app/src/modules/simulation/simulationtemp/path/pathCreator.tsx index 1c63289..c09b21c 100644 --- a/app/src/modules/simulation/simulationtemp/path/pathCreator.tsx +++ b/app/src/modules/simulation/simulationtemp/path/pathCreator.tsx @@ -93,6 +93,7 @@ const PathCreator = ({ simulationPaths, setSimulationPaths, connections, setConn intersects = intersects.filter( (intersect) => !intersect.object.name.includes("Roof") && + !intersect.object.name.includes("agv-collider") && !intersect.object.name.includes("MeasurementReference") && !intersect.object.userData.isPathObject && !(intersect.object.type === "GridHelper") @@ -146,6 +147,7 @@ const PathCreator = ({ simulationPaths, setSimulationPaths, connections, setConn const intersects = raycaster.intersectObjects(scene.children, true).filter( (intersect) => !intersect.object.name.includes("Roof") && + !intersect.object.name.includes("agv-collider") && !intersect.object.name.includes("MeasurementReference") && !intersect.object.userData.isPathObject && !(intersect.object.type === "GridHelper") @@ -262,6 +264,7 @@ const PathCreator = ({ simulationPaths, setSimulationPaths, connections, setConn const intersects = raycaster.intersectObjects(scene.children, true).filter( (intersect) => !intersect.object.name.includes("Roof") && + !intersect.object.name.includes("agv-collider") && !intersect.object.name.includes("MeasurementReference") && !intersect.object.userData.isPathObject && !(intersect.object.type === "GridHelper") diff --git a/app/src/store/store.ts b/app/src/store/store.ts index 388f9d0..b3dc67b 100644 --- a/app/src/store/store.ts +++ b/app/src/store/store.ts @@ -203,6 +203,20 @@ export const useActiveLayer = create((set: any) => ({ setActiveLayer: (x: any) => set({ activeLayer: x }), })); +interface RefTextUpdateState { + refTextupdate: number; + setRefTextUpdate: (callback: (currentValue: number) => number | number) => void; +} + +export const useRefTextUpdate = create((set) => ({ + refTextupdate: -1000, + setRefTextUpdate: (callback) => + set((state) => ({ + refTextupdate: + typeof callback === "function" ? callback(state.refTextupdate) : callback, + })), +})); + export const useResetCamera = create((set: any) => ({ resetCamera: false, setResetCamera: (x: any) => set({ resetCamera: x }), diff --git a/app/src/types/world/worldTypes.d.ts b/app/src/types/world/worldTypes.d.ts index 71c2528..39ebeeb 100644 --- a/app/src/types/world/worldTypes.d.ts +++ b/app/src/types/world/worldTypes.d.ts @@ -310,10 +310,9 @@ interface VehicleEventsSchema { point: { uuid: string; position: [number, number, number]; - actions: { uuid: string; name: string; type: string; start: string, hitCount: number, end: string, buffer: number; isUsed: boolean }[] | []; - triggers: { uuid: string; name: string; type: string; isUsed: boolean }[] | []; + actions: { uuid: string; name: string; type: string; start: string, hitCount: number, end: string, buffer: number }; connections: { source: { pathUUID: string; pointUUID: string }; targets: { pathUUID: string; pointUUID: string }[] }; + speed: number; }; assetPosition: [number, number, number]; - speed: number; } \ No newline at end of file From a42d9260f69c4f1966dc83618b885ee326c5276a Mon Sep 17 00:00:00 2001 From: Poovizhi99 Date: Sat, 29 Mar 2025 13:04:28 +0530 Subject: [PATCH 04/13] included measureIcon --- app/src/components/icons/ExportToolsIcons.tsx | 29 +++++++++++++++++++ app/src/modules/market/AssetPreview.tsx | 2 +- 2 files changed, 30 insertions(+), 1 deletion(-) diff --git a/app/src/components/icons/ExportToolsIcons.tsx b/app/src/components/icons/ExportToolsIcons.tsx index 9e2c937..478113c 100644 --- a/app/src/components/icons/ExportToolsIcons.tsx +++ b/app/src/components/icons/ExportToolsIcons.tsx @@ -636,3 +636,32 @@ export function SaveTemplateIcon({ isActive }: { isActive: boolean }) { ); } + +export function MeasureToolIcon({ isActive }: { isActive: boolean }) { + return ( + + + + + + + ); +} diff --git a/app/src/modules/market/AssetPreview.tsx b/app/src/modules/market/AssetPreview.tsx index 1bb070b..db8d3c3 100644 --- a/app/src/modules/market/AssetPreview.tsx +++ b/app/src/modules/market/AssetPreview.tsx @@ -94,7 +94,7 @@ const AssetPreview: React.FC = ({
{selectedCard.assetName}
- {`${selectedCard.description} is used in factories to improve efficiency and production speed It is designed to handle heavy workloads and perform repetitive tasks with precision. Many industries rely on this machine to manufacture products quickly and accurately. It reduces human effort and minimizes errors in the production process. Regular maintenance is required to keep the machine in good working condition.With advanced technology, this machine continues to enhance industrial operations and increase productivity.`} + {`${selectedCard.assetName} is used in factories to improve efficiency and production speed It is designed to handle heavy workloads and perform repetitive tasks with precision. Many industries rely on this machine to manufacture products quickly and accurately. It reduces human effort and minimizes errors in the production process. Regular maintenance is required to keep the machine in good working condition.With advanced technology, this machine continues to enhance industrial operations and increase productivity.`}
From 8606cbbe5485460499a0d545decf33c6bc9ac296 Mon Sep 17 00:00:00 2001 From: Jerald-Golden-B Date: Sat, 29 Mar 2025 13:43:29 +0530 Subject: [PATCH 05/13] refactor: update speed handling in ConveyorMechanics and related types to support string values --- .../layout/sidebarRight/mechanics/ConveyorMechanics.tsx | 9 +++++---- app/src/modules/market/AssetPreview.tsx | 2 +- app/src/modules/simulation/behaviour/behaviour.tsx | 2 +- app/src/types/world/worldTypes.d.ts | 2 +- 4 files changed, 8 insertions(+), 7 deletions(-) diff --git a/app/src/components/layout/sidebarRight/mechanics/ConveyorMechanics.tsx b/app/src/components/layout/sidebarRight/mechanics/ConveyorMechanics.tsx index 23b566b..f80fca0 100644 --- a/app/src/components/layout/sidebarRight/mechanics/ConveyorMechanics.tsx +++ b/app/src/components/layout/sidebarRight/mechanics/ConveyorMechanics.tsx @@ -216,7 +216,7 @@ const ConveyorMechanics: React.FC = () => { setSimulationPaths(updatedPaths); }; - const handleSpeedChange = (speed: number) => { + const handleSpeedChange = (speed: number | string) => { if (!selectedPath) return; const updatedPaths = simulationPaths.map((path) => @@ -630,11 +630,12 @@ const ConveyorMechanics: React.FC = () => { )} {selectedPath && !selectedItem && ( -
+
handleSpeedChange(parseFloat(value))} + min={0} + value={selectedPath.path.speed === "Inherit" ? "" : selectedPath.path.speed.toString()} + onChange={(value) => handleSpeedChange((value === "") ? "Inherit" : parseInt(value))} />
)} diff --git a/app/src/modules/market/AssetPreview.tsx b/app/src/modules/market/AssetPreview.tsx index a3eb23c..db8d3c3 100644 --- a/app/src/modules/market/AssetPreview.tsx +++ b/app/src/modules/market/AssetPreview.tsx @@ -9,7 +9,7 @@ import * as THREE from "three"; // Define the shape of the selected card interface SelectedCard { assetName: string; - uploadedOn: string; + uploadedOn: number; price: number; rating: number; views: number; diff --git a/app/src/modules/simulation/behaviour/behaviour.tsx b/app/src/modules/simulation/behaviour/behaviour.tsx index fa976aa..c1281b5 100644 --- a/app/src/modules/simulation/behaviour/behaviour.tsx +++ b/app/src/modules/simulation/behaviour/behaviour.tsx @@ -52,7 +52,7 @@ function Behaviour() { ], assetPosition: [...item.position], assetRotation: [item.rotation.x, item.rotation.y, item.rotation.z], - speed: 1, + speed: 'Inherit', }; newPaths.push(newPath); diff --git a/app/src/types/world/worldTypes.d.ts b/app/src/types/world/worldTypes.d.ts index 39ebeeb..31c032c 100644 --- a/app/src/types/world/worldTypes.d.ts +++ b/app/src/types/world/worldTypes.d.ts @@ -300,7 +300,7 @@ interface ConveyorEventsSchema { }[]; assetPosition: [number, number, number]; assetRotation: [number, number, number]; - speed: number; + speed: number | string; } interface VehicleEventsSchema { From 1cca51e652063d873789e825086f0e121f52ce0b Mon Sep 17 00:00:00 2001 From: Jerald-Golden-B Date: Sat, 29 Mar 2025 13:46:31 +0530 Subject: [PATCH 06/13] fix: prevent speed change when no action sphere is selected in VehicleMechanics --- .../sidebarRight/mechanics/VehicleMechanics.tsx | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) diff --git a/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx b/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx index 42ad965..39773ab 100644 --- a/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx +++ b/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx @@ -62,7 +62,22 @@ const VehicleMechanics: React.FC = () => { }, [handleActionUpdate]); const handleSpeedChange = React.useCallback((speed: number) => { - + if (!selectedActionSphere?.point?.uuid) return; + + const updatedPaths = simulationPaths.map((path) => { + if (path.type === "Vehicle" && path.point.uuid === selectedActionSphere.point.uuid) { + return { + ...path, + point: { + ...path.point, + speed: speed + } + }; + } + return path; + }); + + setSimulationPaths(updatedPaths); }, [selectedActionSphere?.point?.uuid, simulationPaths, setSimulationPaths]); return ( From c2dc898d53107b89079894de02d236492d0897fd Mon Sep 17 00:00:00 2001 From: Jerald-Golden-B Date: Sat, 29 Mar 2025 13:57:39 +0530 Subject: [PATCH 07/13] refactor: rename position handlers to startPoint and endPoint for clarity; update toggle UI logic to use localStorage --- .../mechanics/VehicleMechanics.tsx | 12 +++++------ app/src/components/ui/ModuleToggle.tsx | 11 +++++----- app/src/components/ui/Tools.tsx | 21 +++++++------------ 3 files changed, 18 insertions(+), 26 deletions(-) diff --git a/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx b/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx index 39773ab..a81ce15 100644 --- a/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx +++ b/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx @@ -45,11 +45,11 @@ const VehicleMechanics: React.FC = () => { setSimulationPaths(updatedPaths); }, [selectedActionSphere?.point?.uuid, simulationPaths, setSimulationPaths]); - const handleStartPositionChange = React.useCallback((position: string) => { + const handleStartPointChange = React.useCallback((position: string) => { handleActionUpdate({ start: position }); }, [handleActionUpdate]); - const handleEndPositionChange = React.useCallback((position: string) => { + const handleEndPointChange = React.useCallback((position: string) => { handleActionUpdate({ end: position }); }, [handleActionUpdate]); @@ -94,16 +94,16 @@ const VehicleMechanics: React.FC = () => { <> { className={`module-list ${activeModule === "builder" && "active"}`} onClick={() => { setActiveModule("builder"); - setToggleUI(true); + setToggleUI(localStorage.getItem('navBarUi') ? localStorage.getItem('navBarUi') === 'true' : true) }} >
@@ -30,7 +30,7 @@ const ModuleToggle: React.FC = () => { className={`module-list ${activeModule === "simulation" && "active"}`} onClick={() => { setActiveModule("simulation"); - setToggleUI(true); + setToggleUI(localStorage.getItem('navBarUi') ? localStorage.getItem('navBarUi') === 'true' : true) }} >
@@ -39,12 +39,11 @@ const ModuleToggle: React.FC = () => {
Simulation
{ setActiveModule("visualization"); - setToggleUI(true); + setToggleUI(localStorage.getItem('navBarUi') ? localStorage.getItem('navBarUi') === 'true' : true) }} >
diff --git a/app/src/components/ui/Tools.tsx b/app/src/components/ui/Tools.tsx index 77e4429..fc85909 100644 --- a/app/src/components/ui/Tools.tsx +++ b/app/src/components/ui/Tools.tsx @@ -62,11 +62,7 @@ const Tools: React.FC = () => { // Reset activeTool whenever activeModule changes useEffect(() => { - const storedNavBar: any = localStorage.getItem("navBarUi"); - if (storedNavBar) { - const parsedNavBar = JSON.parse(storedNavBar); - setToggleUI(parsedNavBar); - } + setToggleUI(localStorage.getItem('navBarUi') ? localStorage.getItem('navBarUi') === 'true' : true) }, []); useEffect(() => { @@ -228,9 +224,8 @@ const Tools: React.FC = () => { )} {activeSubTool == "delete" && (
{ setActiveTool("delete"); }} @@ -349,9 +344,8 @@ const Tools: React.FC = () => {
{ setActiveTool("measure"); }} @@ -410,9 +404,8 @@ const Tools: React.FC = () => {
{toggleThreeD && (
{ setIsPlaying(!isPlaying); }} From 725abcf0c68950a071c026f7eedaffd626523c4c Mon Sep 17 00:00:00 2001 From: Poovizhi99 Date: Sat, 29 Mar 2025 14:29:32 +0530 Subject: [PATCH 08/13] added toggle functionality --- .../properties/GlobalProperties.tsx | 137 +++++++++++++++++- 1 file changed, 133 insertions(+), 4 deletions(-) diff --git a/app/src/components/layout/sidebarRight/properties/GlobalProperties.tsx b/app/src/components/layout/sidebarRight/properties/GlobalProperties.tsx index 672d847..633b144 100644 --- a/app/src/components/layout/sidebarRight/properties/GlobalProperties.tsx +++ b/app/src/components/layout/sidebarRight/properties/GlobalProperties.tsx @@ -3,8 +3,31 @@ import InputRange from "../../../ui/inputs/InputRange"; import InputToggle from "../../../ui/inputs/InputToggle"; import { AI_Icon } from "../../../icons/ExportCommonIcons"; import LabeledButton from "../../../ui/inputs/LabledButton"; +import { + useAzimuth, + useElevation, + useRenderDistance, + useResetCamera, + useRoofVisibility, + useSelectedWallItem, + useShadows, + useSocketStore, + useToggleView, + useWallVisibility, +} from "../../../../store/store"; +import { setEnvironment } from "../../../../services/factoryBuilder/environment/setEnvironment"; const GlobalProperties: React.FC = () => { + const { toggleView, setToggleView } = useToggleView(); + const { selectedWallItem, setSelectedWallItem } = useSelectedWallItem(); + const { roofVisibility, setRoofVisibility } = useRoofVisibility(); + const { wallVisibility, setWallVisibility } = useWallVisibility(); + const { shadows, setShadows } = useShadows(); + const { resetCamera, setResetCamera } = useResetCamera(); + const { elevation, setElevation } = useElevation(); + const { azimuth, setAzimuth } = useAzimuth(); + const { renderDistance, setRenderDistance } = useRenderDistance(); + const { socket } = useSocketStore(); const [limitDistance, setLimitDistance] = useState(false); const [distance, setDistance] = useState(5); @@ -23,6 +46,93 @@ const GlobalProperties: React.FC = () => { function updateGridDistance(value: number) { setGridDistance(value); } + // Function to toggle roof visibility + const changeRoofVisibility = async () => { + const email = localStorage.getItem("email"); + const organization = email!.split("@")[1].split(".")[0]; + + //using REST + const data = await setEnvironment( + organization, + localStorage.getItem("userId")!, + wallVisibility, + !roofVisibility, + shadows + ); + // console.log('data: ', data); + + //using Socket + // const visData = { + // organization: organization, + // userId: localStorage.getItem('userId')!, + // wallVisibility: wallVisibility, + // roofVisibility: !roofVisibility, + // shadowVisibility: shadows, + // socketId: socket.id + // }; + // socket.emit('v1:Environment:set', visData) + + setRoofVisibility(!roofVisibility); // Toggle roof visibility + }; + // Function to toggle wall visibility + const changeWallVisibility = async () => { + const email = localStorage.getItem("email"); + const organization = email!.split("@")[1].split(".")[0]; + //using REST + const data = await setEnvironment( + organization, + localStorage.getItem("userId")!, + !wallVisibility, + roofVisibility, + shadows + ); + // console.log('data: ', data); + + //using Socket + // const visData = { + // organization: organization, + // userId: localStorage.getItem('userId')!, + // wallVisibility: !wallVisibility, + // roofVisibility: roofVisibility, + // shadowVisibility: shadows, + // socketId: socket.id + // }; + // socket.emit('v1:Environment:set', visData) + + setWallVisibility(!wallVisibility); // Toggle wall visibility + }; + + const shadowVisibility = async () => { + const email = localStorage.getItem("email"); + const organization = email!.split("@")[1].split(".")[0]; + //using REST + const data = await setEnvironment( + organization, + localStorage.getItem("userId")!, + wallVisibility, + roofVisibility, + !shadows + ); + // console.log('data: ', data); + + //using Socket + // const visData = { + // organization: organization, + // userId: localStorage.getItem('userId')!, + // wallVisibility: wallVisibility, + // roofVisibility: roofVisibility, + // shadowVisibility: !shadows, + // socketId: socket.id + // }; + // socket.emit('v1:Environment:set', visData) + + setShadows(!shadows); + }; + const toggleResetCamera = () => { + if (!toggleView) { + setResetCamera(true); // Trigger reset camera action + } + }; return (
@@ -34,10 +144,29 @@ const GlobalProperties: React.FC = () => {
- - - - {}} value="Reset"/> + + + +
From d4d4b145c74d613011a6a3191da65e57a8b7d7b4 Mon Sep 17 00:00:00 2001 From: Jerald-Golden-B Date: Sat, 29 Mar 2025 14:31:02 +0530 Subject: [PATCH 09/13] refactor: improve toggle UI logic in Header and Tools components for better state management --- app/src/components/layout/sidebarLeft/Header.tsx | 6 ++++-- app/src/components/ui/Tools.tsx | 6 +++--- 2 files changed, 7 insertions(+), 5 deletions(-) diff --git a/app/src/components/layout/sidebarLeft/Header.tsx b/app/src/components/layout/sidebarLeft/Header.tsx index c51de20..06706c6 100644 --- a/app/src/components/layout/sidebarLeft/Header.tsx +++ b/app/src/components/layout/sidebarLeft/Header.tsx @@ -22,8 +22,10 @@ const Header: React.FC = () => {
{ - if (activeModule !== "market") setToggleUI(!toggleUI); - localStorage.setItem("navBarUi", JSON.stringify(!toggleUI)); + if (activeModule !== "market") { + setToggleUI(!toggleUI); + localStorage.setItem("navBarUi", JSON.stringify(!toggleUI)); + } }} > diff --git a/app/src/components/ui/Tools.tsx b/app/src/components/ui/Tools.tsx index fc85909..c86164c 100644 --- a/app/src/components/ui/Tools.tsx +++ b/app/src/components/ui/Tools.tsx @@ -76,13 +76,13 @@ const Tools: React.FC = () => { setDeleteModels(false); setAddAction(null); setToggleView(true); - localStorage.setItem("navBarUi", JSON.stringify(!toggleThreeD)); + // localStorage.setItem("navBarUi", JSON.stringify(!toggleThreeD)); } else { setToggleView(false); } - setActiveSubTool("cursor"); - setActiveTool("cursor"); + setToggleUI(localStorage.getItem('navBarUi') ? localStorage.getItem('navBarUi') === 'true' : true) setToggleThreeD(!toggleThreeD); + setActiveSubTool("cursor"); setActiveTool("cursor"); }; From 9fb0b78e45a8ae34d7d1049ca50e2af5516c994c Mon Sep 17 00:00:00 2001 From: Poovizhi99 Date: Sat, 29 Mar 2025 17:46:47 +0530 Subject: [PATCH 10/13] integrated asset properties in builder --- .../components/layout/sidebarRight/Header.tsx | 1 - .../layout/sidebarRight/SideBarRight.tsx | 71 ++++++++++++------- .../customInput/PositionInputs.tsx | 6 ++ .../customInput/RotationInput.tsx | 5 +- .../properties/AssetProperties.tsx | 20 ++++-- 5 files changed, 71 insertions(+), 32 deletions(-) diff --git a/app/src/components/layout/sidebarRight/Header.tsx b/app/src/components/layout/sidebarRight/Header.tsx index 9abf096..b4983c6 100644 --- a/app/src/components/layout/sidebarRight/Header.tsx +++ b/app/src/components/layout/sidebarRight/Header.tsx @@ -12,7 +12,6 @@ const Header: React.FC = () => { const guestUsers: ActiveUser[] = activeUsers.filter( (user: ActiveUser) => user.userName !== userName ); - console.log('guestUsers: ', guestUsers); return (
diff --git a/app/src/components/layout/sidebarRight/SideBarRight.tsx b/app/src/components/layout/sidebarRight/SideBarRight.tsx index f2f6695..4821772 100644 --- a/app/src/components/layout/sidebarRight/SideBarRight.tsx +++ b/app/src/components/layout/sidebarRight/SideBarRight.tsx @@ -14,7 +14,10 @@ import ConveyorMechanics from "./mechanics/ConveyorMechanics"; import Visualization from "./visualization/Visualization"; import Analysis from "./analysis/Analysis"; import Simulations from "./simulation/Simulations"; -import { useSelectedActionSphere } from "../../../store/store"; +import { + useSelectedActionSphere, + useselectedFloorItem, +} from "../../../store/store"; import GlobalProperties from "./properties/GlobalProperties"; import AsstePropertiies from "./properties/AssetProperties"; import ZoneProperties from "./properties/ZoneProperties"; @@ -25,6 +28,7 @@ const SideBarRight: React.FC = () => { const { toggleUI } = useToggleStore(); const { selectedActionSphere } = useSelectedActionSphere(); const { subModule, setSubModule } = useSubModuleStore(); + const { selectedFloorItem } = useselectedFloorItem(); // Reset activeList whenever activeModule changes useEffect(() => { if (activeModule !== "simulation") setSubModule("properties"); @@ -38,8 +42,9 @@ const SideBarRight: React.FC = () => {
{/* {activeModule === "builder" && ( */}
setSubModule("properties")} > @@ -48,22 +53,25 @@ const SideBarRight: React.FC = () => { {activeModule === "simulation" && ( <>
setSubModule("mechanics")} >
setSubModule("simulations")} >
setSubModule("analysis")} > @@ -75,12 +83,21 @@ const SideBarRight: React.FC = () => { {/* process builder */} {toggleUI && subModule === "properties" && - activeModule !== "visualization" && ( + activeModule !== "visualization" && + !selectedFloorItem && (
- {/* */} - {/* */} +
+
+ )} + {toggleUI && + subModule === "properties" && + activeModule !== "visualization" && + selectedFloorItem && ( +
+
+
)} @@ -89,9 +106,7 @@ const SideBarRight: React.FC = () => { activeModule === "builder" && (
- {/* */} - {/* */}
)} @@ -99,20 +114,24 @@ const SideBarRight: React.FC = () => { {toggleUI && activeModule === "simulation" && ( <> - {subModule === "mechanics" && selectedActionSphere && selectedActionSphere.path.type === "Conveyor" && ( -
-
- + {subModule === "mechanics" && + selectedActionSphere && + selectedActionSphere.path.type === "Conveyor" && ( +
+
+ +
-
- )} - {subModule === "mechanics" && selectedActionSphere && selectedActionSphere.path.type === "Vehicle" && ( -
-
- + )} + {subModule === "mechanics" && + selectedActionSphere && + selectedActionSphere.path.type === "Vehicle" && ( +
+
+ +
-
- )} + )} {subModule === "mechanics" && !selectedActionSphere && (
diff --git a/app/src/components/layout/sidebarRight/customInput/PositionInputs.tsx b/app/src/components/layout/sidebarRight/customInput/PositionInputs.tsx index b65d782..881e225 100644 --- a/app/src/components/layout/sidebarRight/customInput/PositionInputs.tsx +++ b/app/src/components/layout/sidebarRight/customInput/PositionInputs.tsx @@ -4,12 +4,16 @@ interface PositionInputProps { onChange: (value: string) => void; // Callback for value change placeholder?: string; // Optional placeholder type?: string; // Input type (e.g., text, number, email) + value1?: number; + value2?: number; } const PositionInput: React.FC = ({ onChange, placeholder = "Enter value", // Default placeholder type = "number", // Default type + value1 = "number", + value2 = "number", }) => { return (
@@ -22,6 +26,7 @@ const PositionInput: React.FC = ({ type={type} onChange={(e) => onChange(e.target.value)} placeholder={placeholder} + value={value2} />
@@ -31,6 +36,7 @@ const PositionInput: React.FC = ({ type={type} onChange={(e) => onChange(e.target.value)} placeholder={placeholder} + value={value1} />
diff --git a/app/src/components/layout/sidebarRight/customInput/RotationInput.tsx b/app/src/components/layout/sidebarRight/customInput/RotationInput.tsx index 3ab01a4..962e967 100644 --- a/app/src/components/layout/sidebarRight/customInput/RotationInput.tsx +++ b/app/src/components/layout/sidebarRight/customInput/RotationInput.tsx @@ -4,17 +4,19 @@ interface RotationInputProps { onChange: (value: string) => void; // Callback for value change placeholder?: string; // Optional placeholder type?: string; // Input type (e.g., text, number, email) + value?: number; } const RotationInput: React.FC = ({ onChange, placeholder = "Enter value", // Default placeholder type = "number", // Default type + value = "number", }) => { return (
Rotation
-
+
Rotate :
= ({ type={type} onChange={(e) => onChange(e.target.value)} placeholder={placeholder} + value={value} />
diff --git a/app/src/components/layout/sidebarRight/properties/AssetProperties.tsx b/app/src/components/layout/sidebarRight/properties/AssetProperties.tsx index 8309024..c47fd81 100644 --- a/app/src/components/layout/sidebarRight/properties/AssetProperties.tsx +++ b/app/src/components/layout/sidebarRight/properties/AssetProperties.tsx @@ -1,9 +1,11 @@ -import React, { useState } from "react"; +import React, { useEffect, useState } from "react"; import InputToggle from "../../../ui/inputs/InputToggle"; import InputWithDropDown from "../../../ui/inputs/InputWithDropDown"; import { RemoveIcon } from "../../../icons/ExportCommonIcons"; import PositionInput from "../customInput/PositionInputs"; import RotationInput from "../customInput/RotationInput"; +import { useselectedFloorItem } from "../../../../store/store"; +import * as THREE from "three"; interface UserData { id: number; // Unique identifier for the user data @@ -14,7 +16,13 @@ interface UserData { const AssetProperties: React.FC = () => { const [userData, setUserData] = useState([]); // State to track user data const [nextId, setNextId] = useState(1); // Unique ID for new entries + const { selectedFloorItem } = useselectedFloorItem(); + let xValue = selectedFloorItem.position.x; + let zValue = selectedFloorItem.position.z; + let rotationRad = selectedFloorItem.rotation.y; + let rotationDeg = THREE.MathUtils.radToDeg(rotationRad); + // useEffect(() => {}, [selectedFloorItem]); // Function to handle adding new user data const handleAddUserData = () => { const newUserData: UserData = { @@ -45,12 +53,16 @@ const AssetProperties: React.FC = () => { return (
{/* Name */} -
Selected Object
+
{selectedFloorItem.userData.name}
- { }} /> - { }} /> + {}} + value1={xValue.toFixed(5)} + value2={zValue.toFixed(5)} + /> + {}} value={rotationDeg} />
From 5564eecf76660f0e34202e4659448111e96c6886 Mon Sep 17 00:00:00 2001 From: Jerald-Golden-B Date: Sat, 29 Mar 2025 18:14:29 +0530 Subject: [PATCH 11/13] refactor: update VehicleMechanics to use LabledDropdown for start and end point selection; clean up unused MQTT code and improve zone data fetching logic --- .../mechanics/VehicleMechanics.tsx | 47 ++-- .../ui/componets/RealTimeVisulization.tsx | 4 +- app/src/components/ui/inputs/EyeDropInput.tsx | 8 +- app/src/modules/builder/agv/agv.tsx | 16 +- .../builder/geomentries/roofs/hideRoof.ts | 3 +- .../modules/simulation/path/pathConnector.tsx | 261 ++++++++++++++---- .../factoryBuilder/mqtt/mqttEvents.ts | 48 ++-- .../zoneData/getSelect2dZoneData.ts | 1 - 8 files changed, 279 insertions(+), 109 deletions(-) diff --git a/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx b/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx index a81ce15..c611a13 100644 --- a/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx +++ b/app/src/components/layout/sidebarRight/mechanics/VehicleMechanics.tsx @@ -1,9 +1,9 @@ import React, { useRef, useMemo } from "react"; import { InfoIcon } from "../../../icons/ExportCommonIcons"; import InputWithDropDown from "../../../ui/inputs/InputWithDropDown"; -import EyeDropInput from "../../../ui/inputs/EyeDropInput"; import { useSelectedActionSphere, useSimulationPaths } from "../../../../store/store"; import * as Types from '../../../../types/world/worldTypes'; +import LabledDropdown from "../../../ui/inputs/LabledDropdown"; const VehicleMechanics: React.FC = () => { const { selectedActionSphere } = useSelectedActionSphere(); @@ -11,17 +11,31 @@ const VehicleMechanics: React.FC = () => { const propertiesContainerRef = useRef(null); - const selectedPoint = useMemo(() => { - if (!selectedActionSphere?.point?.uuid) return null; + const { selectedPoint, connectedPointUuids } = useMemo(() => { + if (!selectedActionSphere?.point?.uuid) return { selectedPoint: null, connectedPointUuids: [] }; const vehiclePaths = simulationPaths.filter( (path): path is Types.VehicleEventsSchema => path.type === "Vehicle" ); - return vehiclePaths.find( + const point = vehiclePaths.find( (path) => path.point.uuid === selectedActionSphere.point.uuid )?.point; - }, [selectedActionSphere, simulationPaths, selectedActionSphere?.point?.uuid]); + + if (!point) return { selectedPoint: null, connectedPointUuids: [] }; + + const connectedUuids: string[] = []; + if (point.connections?.targets) { + point.connections.targets.forEach(target => { + connectedUuids.push(target.pointUUID); + }); + } + + return { + selectedPoint: point, + connectedPointUuids: connectedUuids + }; + }, [selectedActionSphere, simulationPaths]); const handleActionUpdate = React.useCallback((updatedAction: Partial) => { if (!selectedActionSphere?.point?.uuid) return; @@ -45,12 +59,12 @@ const VehicleMechanics: React.FC = () => { setSimulationPaths(updatedPaths); }, [selectedActionSphere?.point?.uuid, simulationPaths, setSimulationPaths]); - const handleStartPointChange = React.useCallback((position: string) => { - handleActionUpdate({ start: position }); + const handleStartPointChange = React.useCallback((uuid: string) => { + handleActionUpdate({ start: uuid }); }, [handleActionUpdate]); - const handleEndPointChange = React.useCallback((position: string) => { - handleActionUpdate({ end: position }); + const handleEndPointChange = React.useCallback((uuid: string) => { + handleActionUpdate({ end: uuid }); }, [handleActionUpdate]); const handleHitCountChange = React.useCallback((hitCount: number) => { @@ -92,18 +106,20 @@ const VehicleMechanics: React.FC = () => { {selectedPoint && ( <> - - { /> )} -
diff --git a/app/src/components/ui/componets/RealTimeVisulization.tsx b/app/src/components/ui/componets/RealTimeVisulization.tsx index 27044b1..1948433 100644 --- a/app/src/components/ui/componets/RealTimeVisulization.tsx +++ b/app/src/components/ui/componets/RealTimeVisulization.tsx @@ -76,7 +76,7 @@ const RealTimeVisulization: React.FC = () => { } GetZoneData(); - }, []); // Removed `zones` from dependencies + }, [activeModule]); // Removed `zones` from dependencies useEffect(() => { @@ -97,7 +97,7 @@ const RealTimeVisulization: React.FC = () => { }; }); }, [selectedZone]); - + useEffect(() => { }, [floatingWidgets]) diff --git a/app/src/components/ui/inputs/EyeDropInput.tsx b/app/src/components/ui/inputs/EyeDropInput.tsx index d29613a..72c5ded 100644 --- a/app/src/components/ui/inputs/EyeDropInput.tsx +++ b/app/src/components/ui/inputs/EyeDropInput.tsx @@ -1,5 +1,6 @@ import React from "react"; import { EyeDroperIcon } from "../../icons/ExportCommonIcons"; +import RegularDropDown from "./RegularDropDown"; interface EyeDropInputProps { label: string; @@ -23,7 +24,12 @@ const EyeDropInput: React.FC = ({
{label}
- + {/* */} + { }} + />
diff --git a/app/src/modules/builder/agv/agv.tsx b/app/src/modules/builder/agv/agv.tsx index 749e39f..37c4f4e 100644 --- a/app/src/modules/builder/agv/agv.tsx +++ b/app/src/modules/builder/agv/agv.tsx @@ -1,24 +1,17 @@ import PolygonGenerator from "./polygonGenerator"; import { useThree } from "@react-three/fiber"; -import { useEffect, useRef, useState } from "react"; +import { useEffect, useMemo, useRef, useState } from "react"; import * as THREE from "three"; import * as Types from "../../../types/world/worldTypes"; import PathNavigator from "./pathNavigator"; import NavMeshDetails from "./navMeshDetails"; -const Agv = ({ - lines, - plane, -}: { - lines: Types.RefLines; - plane: Types.RefMesh; -}) => { - let pathPoints = [ +const Agv = ({ lines, plane }: { lines: Types.RefLines; plane: Types.RefMesh; }) => { + const pathPoints = useMemo(() => [ [ { x: 8.477161935339709, y: 0, z: 17.41343083550102 }, { x: 9.175416491482693, y: 0, z: -12.361001232663693 }, ], - , // [ // { x: 13.508213355232144, y: 0, z: -15.456970649652018 }, // { x: -30.464866520869617, y: 0, z: 9.779806557688929 }, @@ -27,7 +20,8 @@ const Agv = ({ { x: 16.792040856420844, y: 0, z: 15.86281907549489 }, { x: -42.77173264503395, y: 0, z: -15.821322764400804 }, ], - ]; + ], []); + let groupRef = useRef() as Types.RefGroup; const [navMesh, setNavMesh] = useState(); diff --git a/app/src/modules/builder/geomentries/roofs/hideRoof.ts b/app/src/modules/builder/geomentries/roofs/hideRoof.ts index 8eb80f8..3dc48fe 100644 --- a/app/src/modules/builder/geomentries/roofs/hideRoof.ts +++ b/app/src/modules/builder/geomentries/roofs/hideRoof.ts @@ -22,7 +22,8 @@ function hideRoof( if (roofChild.material) { const materials = Array.isArray(roofChild.material) ? roofChild.material : [roofChild.material]; materials.forEach(material => { - material.visible = v.dot(u) < 0.25; + // material.visible = v.dot(u) < 0.25; + material.visible = true; }); } } diff --git a/app/src/modules/simulation/path/pathConnector.tsx b/app/src/modules/simulation/path/pathConnector.tsx index 8df718c..0888966 100644 --- a/app/src/modules/simulation/path/pathConnector.tsx +++ b/app/src/modules/simulation/path/pathConnector.tsx @@ -86,6 +86,7 @@ function PathConnector({ pathsGroupRef }: { pathsGroupRef: React.MutableRefObjec }; } } + // In the updatePathConnections function, modify the Vehicle handling section: else if (path.type === 'Vehicle') { // Handle outgoing connections from Vehicle if (path.modeluuid === fromPathUUID && path.point.uuid === fromPointUUID) { @@ -95,6 +96,27 @@ function PathConnector({ pathsGroupRef }: { pathsGroupRef: React.MutableRefObjec }; const existingTargets = path.point.connections.targets || []; + // Check if we're trying to add a connection to a Conveyor + const toPath = simulationPaths.find(p => p.modeluuid === toPathUUID); + const isConnectingToConveyor = toPath?.type === 'Conveyor'; + + // Count existing connections + if (existingTargets.length >= 2) { + console.log("Vehicle can have maximum 2 connections"); + return path; + } + + // Check if we already have a Conveyor connection and trying to add another + const hasConveyorConnection = existingTargets.some(target => { + const targetPath = simulationPaths.find(p => p.modeluuid === target.pathUUID); + return targetPath?.type === 'Conveyor'; + }); + + if (hasConveyorConnection && isConnectingToConveyor) { + console.log("Vehicle can only have one connection to a Conveyor"); + return path; + } + if (!existingTargets.some(target => target.pathUUID === newTarget.pathUUID && target.pointUUID === newTarget.pointUUID @@ -119,6 +141,27 @@ function PathConnector({ pathsGroupRef }: { pathsGroupRef: React.MutableRefObjec }; const existingTargets = path.point.connections.targets || []; + // Check if we're receiving a connection from a Conveyor + const fromPath = simulationPaths.find(p => p.modeluuid === fromPathUUID); + const isConnectingFromConveyor = fromPath?.type === 'Conveyor'; + + // Count existing connections + if (existingTargets.length >= 2) { + console.log("Vehicle can have maximum 2 connections"); + return path; + } + + // Check if we already have a Conveyor connection and trying to add another + const hasConveyorConnection = existingTargets.some(target => { + const targetPath = simulationPaths.find(p => p.modeluuid === target.pathUUID); + return targetPath?.type === 'Conveyor'; + }); + + if (hasConveyorConnection && isConnectingFromConveyor) { + console.log("Vehicle can only have one connection to a Conveyor"); + return path; + } + if (!existingTargets.some(target => target.pathUUID === reverseTarget.pathUUID && target.pointUUID === reverseTarget.pointUUID @@ -135,6 +178,7 @@ function PathConnector({ pathsGroupRef }: { pathsGroupRef: React.MutableRefObjec }; } } + return path; } return path; }); @@ -168,7 +212,6 @@ function PathConnector({ pathsGroupRef }: { pathsGroupRef: React.MutableRefObjec drag = true; } }; - const onContextMenu = (evt: MouseEvent) => { evt.preventDefault(); if (drag || evt.button === 0) return; @@ -200,29 +243,126 @@ function PathConnector({ pathsGroupRef }: { pathsGroupRef: React.MutableRefObjec const firstPath = simulationPaths.find(p => p.modeluuid === firstSelected?.pathUUID); const secondPath = simulationPaths.find(p => p.modeluuid === pathUUID); + // Prevent vehicle-to-vehicle connections if (firstPath && secondPath && firstPath.type === 'Vehicle' && secondPath.type === 'Vehicle') { console.log("Cannot connect two vehicle paths together"); return; } - const isAlreadyConnected = simulationPaths.some(path => { - if (path.type === 'Conveyor') { - return path.points.some(point => - point.uuid === sphereUUID && - point.connections.targets.length > 0 - ); - } else if (path.type === 'Vehicle') { - return path.point.uuid === sphereUUID && - path.point.connections.targets.length > 0; - } - return false; - }); - if (isAlreadyConnected) { - console.log("Sphere is already connected. Ignoring."); + // Prevent conveyor middle point to conveyor connections + if (firstPath && secondPath && + firstPath.type === 'Conveyor' && + secondPath.type === 'Conveyor' && + !firstSelected?.isCorner) { + console.log("Conveyor middle points can only connect to non-conveyor paths"); return; } - if (!firstSelected) { + // Check if this specific connection already exists + const isDuplicateConnection = firstSelected + ? simulationPaths.some(path => { + if (path.modeluuid === firstSelected.pathUUID) { + if (path.type === 'Conveyor') { + const point = path.points.find(p => p.uuid === firstSelected.sphereUUID); + return point?.connections.targets.some(t => + t.pathUUID === pathUUID && t.pointUUID === sphereUUID + ); + } else if (path.type === 'Vehicle') { + return path.point.connections.targets.some(t => + t.pathUUID === pathUUID && t.pointUUID === sphereUUID + ); + } + } + return false; + }) + : false; + + if (isDuplicateConnection) { + console.log("These points are already connected. Ignoring."); + return; + } + + // For Vehicles, skip the "already connected" check since they can have multiple connections + if (intersected.userData.path.type !== 'Vehicle') { + const isAlreadyConnected = simulationPaths.some(path => { + if (path.type === 'Conveyor') { + return path.points.some(point => + point.uuid === sphereUUID && + point.connections.targets.length > 0 + ); + } + return false; + }); + + if (isAlreadyConnected) { + console.log("Conveyor point is already connected. Ignoring."); + return; + } + } + + // Check vehicle connection limits + const checkVehicleConnections = (pathUUID: string) => { + const path = simulationPaths.find(p => p.modeluuid === pathUUID); + if (path?.type === 'Vehicle') { + return path.point.connections.targets.length >= 2; + } + return false; + }; + + if (firstSelected) { + // Check if either selected point is from a Vehicle with max connections + if (checkVehicleConnections(firstSelected.pathUUID) || + checkVehicleConnections(pathUUID)) { + console.log("Vehicle already has maximum connections"); + return; + } + + // Check if we're trying to add a second Conveyor connection to a Vehicle + if (firstPath?.type === 'Vehicle' && secondPath?.type === 'Conveyor') { + const hasConveyorConnection = firstPath.point.connections.targets.some(target => { + const targetPath = simulationPaths.find(p => p.modeluuid === target.pathUUID); + return targetPath?.type === 'Conveyor'; + }); + + if (hasConveyorConnection) { + console.log("Vehicle can only have one connection to a Conveyor"); + return; + } + } + + if (secondPath?.type === 'Vehicle' && firstPath?.type === 'Conveyor') { + const hasConveyorConnection = secondPath.point.connections.targets.some(target => { + const targetPath = simulationPaths.find(p => p.modeluuid === target.pathUUID); + return targetPath?.type === 'Conveyor'; + }); + + if (hasConveyorConnection) { + console.log("Vehicle can only have one connection to a Conveyor"); + return; + } + } + + // Prevent same-path connections + if (firstSelected.pathUUID === pathUUID) { + console.log("Cannot connect spheres on the same path."); + return; + } + + // At least one must be start/end point + if (!firstSelected.isCorner && !isStartOrEnd) { + console.log("At least one of the selected spheres must be a start or end point."); + return; + } + + // All checks passed - make the connection + handleAddConnection( + firstSelected.pathUUID, + firstSelected.sphereUUID, + pathUUID, + sphereUUID + ); + } else { + // First selection - just store it setFirstSelected({ pathUUID, sphereUUID, @@ -230,28 +370,11 @@ function PathConnector({ pathsGroupRef }: { pathsGroupRef: React.MutableRefObjec isCorner: isStartOrEnd }); setIsConnecting(true); - } else { - if (firstSelected.sphereUUID === sphereUUID) return; - - if (firstSelected.pathUUID === pathUUID) { - console.log("Cannot connect spheres on the same path."); - return; - } - if (!firstSelected.isCorner && !isStartOrEnd) { - console.log("At least one of the selected spheres must be a start or end point."); - return; - } - - handleAddConnection( - firstSelected.pathUUID, - firstSelected.sphereUUID, - pathUUID, - sphereUUID - ); } } } } else { + // Clicked outside - cancel connection setFirstSelected(null); setCurrentLine(null); setIsConnecting(false); @@ -294,7 +417,6 @@ function PathConnector({ pathsGroupRef }: { pathsGroupRef: React.MutableRefObjec if (intersects.length > 0) { point = intersects[0].point; - if (point.y < 0.05) { point = new THREE.Vector3(point.x, 0.05, point.z); } @@ -316,28 +438,68 @@ function PathConnector({ pathsGroupRef }: { pathsGroupRef: React.MutableRefObjec const secondPath = simulationPaths.find(p => p.modeluuid === pathUUID); const isVehicleToVehicle = firstPath?.type === 'Vehicle' && secondPath?.type === 'Vehicle'; + // Inside the useFrame hook, where we check for snapped spheres: const isConnectable = (pathData.type === 'Vehicle' || (pathData.points.length > 0 && ( sphereUUID === pathData.points[0].uuid || sphereUUID === pathData.points[pathData.points.length - 1].uuid - ))) && !isVehicleToVehicle; + ))) && + !isVehicleToVehicle && + !(firstPath?.type === 'Conveyor' && + pathData.type === 'Conveyor' && + !firstSelected.isCorner); - const isAlreadyConnected = simulationPaths.some(path => { - if (path.type === 'Conveyor') { - return path.points.some(point => - point.uuid === sphereUUID && - point.connections.targets.length > 0 - ); - } else if (path.type === 'Vehicle') { - return path.point.uuid === sphereUUID && - path.point.connections.targets.length > 0; + // Check for duplicate connection (regardless of path type) + const isDuplicateConnection = simulationPaths.some(path => { + if (path.modeluuid === firstSelected.pathUUID) { + if (path.type === 'Conveyor') { + const point = path.points.find(p => p.uuid === firstSelected.sphereUUID); + return point?.connections.targets.some(t => + t.pathUUID === pathUUID && t.pointUUID === sphereUUID + ); + } else if (path.type === 'Vehicle') { + return path.point.connections.targets.some(t => + t.pathUUID === pathUUID && t.pointUUID === sphereUUID + ); + } } return false; }); + // For non-Vehicle paths, check if already connected + const isNonVehicleAlreadyConnected = pathData.type !== 'Vehicle' && + simulationPaths.some(path => { + if (path.type === 'Conveyor') { + return path.points.some(point => + point.uuid === sphereUUID && + point.connections.targets.length > 0 + ); + } + return false; + }); + + // Check vehicle connection limits + const isVehicleAtMaxConnections = pathData.type === 'Vehicle' && + pathData.point.connections.targets.length >= 2; + + const isVehicleConveyorConflict = + (firstPath?.type === 'Vehicle' && secondPath?.type === 'Conveyor' && + firstPath.point.connections.targets.some(t => { + const targetPath = simulationPaths.find(p => p.modeluuid === t.pathUUID); + return targetPath?.type === 'Conveyor'; + })) || + (secondPath?.type === 'Vehicle' && firstPath?.type === 'Conveyor' && + secondPath.point.connections.targets.some(t => { + const targetPath = simulationPaths.find(p => p.modeluuid === t.pathUUID); + return targetPath?.type === 'Conveyor'; + })); + if ( - !isAlreadyConnected && + !isDuplicateConnection && !isVehicleToVehicle && + !isNonVehicleAlreadyConnected && + !isVehicleAtMaxConnections && + !isVehicleConveyorConflict && firstSelected.sphereUUID !== sphereUUID && firstSelected.pathUUID !== pathUUID && (firstSelected.isCorner || isConnectable) @@ -371,13 +533,6 @@ function PathConnector({ pathsGroupRef }: { pathsGroupRef: React.MutableRefObjec end: point, mid: midPoint, }); - console.log({ - start: firstSelected.position, - end: point, - mid: midPoint, - }); - - // setIsConnecting(true); if (sphereIntersects.length > 0) { setHelperLineColor(isInvalidConnection ? 'red' : '#6cf542'); diff --git a/app/src/services/factoryBuilder/mqtt/mqttEvents.ts b/app/src/services/factoryBuilder/mqtt/mqttEvents.ts index 41175ca..34d3939 100644 --- a/app/src/services/factoryBuilder/mqtt/mqttEvents.ts +++ b/app/src/services/factoryBuilder/mqtt/mqttEvents.ts @@ -6,37 +6,37 @@ const MqttEvents = () => { const { setTouch, setTemperature, setHumidity } = useDrieUIValue(); useEffect(() => { - const client = mqtt.connect(`ws://${process.env.REACT_APP_SERVER_MQTT_URL}`); + // const client = mqtt.connect(`ws://${process.env.REACT_APP_SERVER_MQTT_URL}`); - client.subscribe("touch"); - client.subscribe("temperature"); - client.subscribe("humidity"); + // client.subscribe("touch"); + // client.subscribe("temperature"); + // client.subscribe("humidity"); - const handleMessage = (topic: string, message: any) => { - const value = message.toString(); + // const handleMessage = (topic: string, message: any) => { + // const value = message.toString(); - if (topic === "touch") { - setTouch(value); - } else if (topic === "temperature") { - setTemperature(parseFloat(value)); - } else if (topic === "humidity") { - setHumidity(parseFloat(value)); - } - }; + // if (topic === "touch") { + // setTouch(value); + // } else if (topic === "temperature") { + // setTemperature(parseFloat(value)); + // } else if (topic === "humidity") { + // setHumidity(parseFloat(value)); + // } + // }; - client.on("message", handleMessage); + // client.on("message", handleMessage); - client.on("error", (err) => { - console.error("MQTT Connection Error:", err); - }); + // client.on("error", (err) => { + // console.error("MQTT Connection Error:", err); + // }); - client.on("close", () => { - console.log("MQTT Connection Closed"); - }); + // client.on("close", () => { + // console.log("MQTT Connection Closed"); + // }); - return () => { - client.end(); - }; + // return () => { + // client.end(); + // }; }, [setTouch, setTemperature, setHumidity]); return null; diff --git a/app/src/services/realTimeVisulization/zoneData/getSelect2dZoneData.ts b/app/src/services/realTimeVisulization/zoneData/getSelect2dZoneData.ts index 71d9c2f..26a88c5 100644 --- a/app/src/services/realTimeVisulization/zoneData/getSelect2dZoneData.ts +++ b/app/src/services/realTimeVisulization/zoneData/getSelect2dZoneData.ts @@ -1,5 +1,4 @@ let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`; -console.log("url_Backend_dwinzo: ", url_Backend_dwinzo); export const getSelect2dZoneData = async ( ZoneId?: string, From 98eb403b4acdd813e414bb4a1c078a6a6007e046 Mon Sep 17 00:00:00 2001 From: Jerald-Golden-B Date: Sat, 29 Mar 2025 18:35:34 +0530 Subject: [PATCH 12/13] refactor: clean up code in various components; streamline material properties and improve state management --- .../components/layout/sidebarRight/Header.tsx | 16 +++++++--------- .../builder/geomentries/roofs/addRoofToScene.ts | 2 +- .../builder/geomentries/roofs/hideRoof.ts | 3 +-- app/src/modules/collaboration/collabCams.tsx | 8 +------- .../factoryBuilder/zones/deleteZoneApi.ts | 1 + 5 files changed, 11 insertions(+), 19 deletions(-) diff --git a/app/src/components/layout/sidebarRight/Header.tsx b/app/src/components/layout/sidebarRight/Header.tsx index b4983c6..46bfdaf 100644 --- a/app/src/components/layout/sidebarRight/Header.tsx +++ b/app/src/components/layout/sidebarRight/Header.tsx @@ -28,15 +28,13 @@ const Header: React.FC = () => {
+{guestUsers.length - 3}
)} {guestUsers.slice(0, 3).map((user, index) => ( - <> -
- {user.userName[0]} -
- +
+ {user.userName[0]} +
))}
diff --git a/app/src/modules/builder/geomentries/roofs/addRoofToScene.ts b/app/src/modules/builder/geomentries/roofs/addRoofToScene.ts index 090dc06..4630efc 100644 --- a/app/src/modules/builder/geomentries/roofs/addRoofToScene.ts +++ b/app/src/modules/builder/geomentries/roofs/addRoofToScene.ts @@ -17,7 +17,7 @@ function addRoofToScene( }; const geometry = new THREE.ExtrudeGeometry(shape, extrudeSettings); - const material = new THREE.MeshStandardMaterial({ color: CONSTANTS.roofConfig.defaultColor, side: THREE.DoubleSide, transparent: true, depthWrite: false }); + const material = new THREE.MeshStandardMaterial({ color: CONSTANTS.roofConfig.defaultColor, side: THREE.DoubleSide }); const mesh = new THREE.Mesh(geometry, material); mesh.position.y = CONSTANTS.wallConfig.height + floor; mesh.castShadow = true; diff --git a/app/src/modules/builder/geomentries/roofs/hideRoof.ts b/app/src/modules/builder/geomentries/roofs/hideRoof.ts index 3dc48fe..8eb80f8 100644 --- a/app/src/modules/builder/geomentries/roofs/hideRoof.ts +++ b/app/src/modules/builder/geomentries/roofs/hideRoof.ts @@ -22,8 +22,7 @@ function hideRoof( if (roofChild.material) { const materials = Array.isArray(roofChild.material) ? roofChild.material : [roofChild.material]; materials.forEach(material => { - // material.visible = v.dot(u) < 0.25; - material.visible = true; + material.visible = v.dot(u) < 0.25; }); } } diff --git a/app/src/modules/collaboration/collabCams.tsx b/app/src/modules/collaboration/collabCams.tsx index af135a7..a699bf3 100644 --- a/app/src/modules/collaboration/collabCams.tsx +++ b/app/src/modules/collaboration/collabCams.tsx @@ -20,12 +20,7 @@ const CamModelsGroup = () => { const loader = new GLTFLoader(); const dracoLoader = new DRACOLoader(); const [cams, setCams] = useState([]); - const [models, setModels] = useState< - Record< - string, - { targetPosition: THREE.Vector3; targetRotation: THREE.Euler } - > - >({}); + const [models, setModels] = useState>({}); dracoLoader.setDecoderPath("three/examples/jsm/libs/draco/gltf/"); loader.setDRACOLoader(dracoLoader); @@ -163,7 +158,6 @@ const CamModelsGroup = () => { cam.rotation.z ); newModel.userData = cam.userData; - console.log('cam.userData: ', cam.userData); setActiveUsers([...activeUsers, cam.userData]); return newModel; }); diff --git a/app/src/services/factoryBuilder/zones/deleteZoneApi.ts b/app/src/services/factoryBuilder/zones/deleteZoneApi.ts index 2ba5156..fbe4a83 100644 --- a/app/src/services/factoryBuilder/zones/deleteZoneApi.ts +++ b/app/src/services/factoryBuilder/zones/deleteZoneApi.ts @@ -15,6 +15,7 @@ export const deleteZonesApi = async (userId: string, organization: string, zoneI } const result = await response.json(); + console.log('result: ', result); return result; } catch (error) { if (error instanceof Error) { From 3b80402fb60492de1641f9a5e4986bf294ac8410 Mon Sep 17 00:00:00 2001 From: Jerald-Golden-B Date: Sat, 29 Mar 2025 18:45:10 +0530 Subject: [PATCH 13/13] refactor: remove unnecessary whitespace in RealTimeVisualization component --- app/src/components/ui/componets/RealTimeVisulization.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/app/src/components/ui/componets/RealTimeVisulization.tsx b/app/src/components/ui/componets/RealTimeVisulization.tsx index 1948433..d84e6e8 100644 --- a/app/src/components/ui/componets/RealTimeVisulization.tsx +++ b/app/src/components/ui/componets/RealTimeVisulization.tsx @@ -162,7 +162,6 @@ const RealTimeVisulization: React.FC = () => { onDrop={(event) => handleDrop(event)} onDragOver={(event) => event.preventDefault()} > -