Merge remote-tracking branch 'origin/rtViz' into simulation

app/src/components/layout/sidebarRight/properties/ZoneProperties.tsx

@@ -28,9 +28,12 @@ const ZoneProperties: React.FC = () => {
       };
 
       let response = await zoneCameraUpdate(zonesdata, organization);
-      console.log('response: ', response);
+      if (response.message === "updated successfully") {
-
         setEdit(false);
+      } else {
+        console.log("Not updated Camera Position and Target");
+      }
+
     } catch (error) {
       console.error("Error in handleSetView:", error);
     }

app/src/components/ui/componets/AddButtons.tsx

@@ -66,6 +66,8 @@ const AddButtons: React.FC<ButtonsProps> = ({
 
   // Function to toggle lock/unlock a panel
   const toggleLockPanel = (side: Side) => {
+    console.log('side: ', side);
+    //add api
     const newLockedPanels = selectedZone.lockedPanels.includes(side)
       ? selectedZone.lockedPanels.filter((panel) => panel !== side)
       : [...selectedZone.lockedPanels, side];
@@ -93,6 +95,8 @@ const AddButtons: React.FC<ButtonsProps> = ({
 
   // Function to clean all widgets from a panel
   const cleanPanel = (side: Side) => {
+    //add api
+    console.log('side: ', side);
     const cleanedWidgets = selectedZone.widgets.filter(
       (widget) => widget.panel !== side
     );
@@ -101,7 +105,6 @@ const AddButtons: React.FC<ButtonsProps> = ({
       ...selectedZone,
       widgets: cleanedWidgets,
     };
-
     // Update the selectedZone state
     setSelectedZone(updatedZone);
   };

app/src/components/ui/componets/Dropped3dWidget.tsx

@@ -44,9 +44,7 @@ export default function Dropped3dWidgets() {
     const plane = useRef(new THREE.Plane(new THREE.Vector3(0, 1, 0), 0)); // Floor plane for horizontal move
     const verticalPlane = useRef(new THREE.Plane(new THREE.Vector3(0, 0, 1), 0)); // Vertical plane for vertical move
     const planeIntersect = useRef(new THREE.Vector3());
-    // const plane = useRef(new THREE.Plane(new THREE.Vector3(0, 1, 0), 0);
+
-    // const verticalPlane = useRef(new THREE.Plane(new THREE.Vector3(0, 0, 1), 0);
-    // const planeIntersect = useRef(new THREE.Vector3());
     const rotationStartRef = useRef<[number, number, number]>([0, 0, 0]);
     const mouseStartRef = useRef<{ x: number; y: number }>({ x: 0, y: 0 });
 
@@ -60,7 +58,7 @@ export default function Dropped3dWidgets() {
 
         async function get3dWidgetData() {
             const result = await get3dWidgetZoneData(selectedZone.zoneId, organization);
-            console.log('result: ', result);
+
             setWidgets3D(result);
 
             const formattedWidgets = result.map((widget: WidgetData) => ({
@@ -84,8 +82,31 @@ export default function Dropped3dWidgets() {
 
         const canvasElement = gl.domElement;
 
+        const handleDragEnter = (event: DragEvent) => {
+            event.preventDefault();
+            event.stopPropagation();
+            console.log("Drag enter");
+
+        };
+
+        const handleDragOver = (event: DragEvent) => {
+            event.preventDefault();
+            event.stopPropagation();
+
+        };
+
+        const handleDragLeave = (event: DragEvent) => {
+            event.preventDefault();
+            event.stopPropagation();
+            console.log("Drag leave");
+            // Remove visual feedback
+            canvasElement.style.cursor = "";
+        };
+
         const onDrop = async (event: DragEvent) => {
             event.preventDefault();
+            event.stopPropagation();
+            canvasElement.style.cursor = ""; // Reset cursor
 
             const email = localStorage.getItem("email") || "";
             const organization = email?.split("@")[1]?.split(".")[0];
@@ -93,6 +114,12 @@ export default function Dropped3dWidgets() {
             const group1 = scene.getObjectByName("itemsGroup");
             if (!group1) return;
 
+            // Update raycaster with current mouse position
+            const rect = canvasElement.getBoundingClientRect();
+            mouse.x = ((event.clientX - rect.left) / rect.width) * 2 - 1;
+            mouse.y = -((event.clientY - rect.top) / rect.height) * 2 + 1;
+            raycaster.setFromCamera(mouse, camera);
+
             const intersects = raycaster.intersectObjects(scene.children, true).filter(
                 (intersect) =>
                     !intersect.object.name.includes("Roof") &&
@@ -125,12 +152,21 @@ export default function Dropped3dWidgets() {
             }
         };
 
+        // Add all event listeners
+        // canvasElement.addEventListener("dragenter", handleDragEnter);
+        // canvasElement.addEventListener("dragover", handleDragOver);
+        // canvasElement.addEventListener("dragleave", handleDragLeave);
         canvasElement.addEventListener("drop", onDrop);
-        return () => {
-            canvasElement.removeEventListener("drop", onDrop);
-        };
-    }, [widgetSelect, activeModule, selectedZone.zoneId, widgetSubOption]);
 
+        return () => {
+            // // Clean up all event listeners
+            // canvasElement.removeEventListener("dragenter", handleDragEnter);
+            // canvasElement.removeEventListener("dragover", handleDragOver);
+            // canvasElement.removeEventListener("dragleave", handleDragLeave);
+            canvasElement.removeEventListener("drop", onDrop);
+            canvasElement.style.cursor = ""; // Ensure cursor is reset
+        };
+    }, [widgetSelect, activeModule, selectedZone.zoneId, widgetSubOption, gl.domElement, scene, raycaster, camera]);
     const activeZoneWidgets = zoneWidgetData[selectedZone.zoneId] || [];
 
     useEffect(() => {
@@ -161,7 +197,7 @@ export default function Dropped3dWidgets() {
                     visualizationSocket.emit("v2:viz-3D-widget:add", adding3dWidget);
                 }
                 // let response = await adding3dWidgets(selectedZone.zoneId, organization, newWidget)
-                // console.log('response: ', response);
+                // 
 
                 addWidget(selectedZone.zoneId, newWidget);
                 setRightSelect(null);
@@ -179,7 +215,7 @@ export default function Dropped3dWidgets() {
                         zoneId: selectedZone.zoneId,
                     };
 
-                    console.log('deleteWidget: ', deleteWidget);
+
                     if (visualizationSocket) {
                         visualizationSocket.emit("v2:viz-3D-widget:delete", deleteWidget);
                     }
@@ -190,7 +226,7 @@ export default function Dropped3dWidgets() {
                         activeZoneWidgets.filter((w: WidgetData) => w.id !== rightClickSelected)
                     );
                 } catch (error) {
-                    console.error("Error deleting widget:", error);
+
                 } finally {
                     setRightClickSelected(null);
                     setRightSelect(null);
@@ -304,20 +340,15 @@ export default function Dropped3dWidgets() {
 
             const selectedWidget = zoneWidgetData[selectedZone].find(widget => widget.id === rightClickSelected);
             if (!selectedWidget) return;
-
-
-
             // Format values to 2 decimal places
             const formatValues = (vals: number[]) => vals.map(val => parseFloat(val.toFixed(2)));
-
             if (rightSelect === "Horizontal Move" || rightSelect === "Vertical Move") {
-                console.log(`${rightSelect} Completed - Full Position:`, formatValues(selectedWidget.position));
                 let lastPosition = formatValues(selectedWidget.position) as [number, number, number];
                 // (async () => {
                 //     let response = await update3dWidget(selectedZone, organization, rightClickSelected, lastPosition);
-                //     console.log('response: ', response);
+                //     
                 //     if (response) {
-                //         console.log("Widget position updated in API:", response);
+                //         
                 //     }
                 // })();
                 let updatingPosition = {
@@ -333,13 +364,13 @@ export default function Dropped3dWidgets() {
             }
             else if (rightSelect.includes("Rotate")) {
                 const rotation = selectedWidget.rotation || [0, 0, 0];
-                console.log(`${rightSelect} Completed - Full Rotation:`, formatValues(rotation));
+
                 let lastRotation = formatValues(rotation) as [number, number, number];
                 // (async () => {
                 //     let response = await update3dWidgetRotation(selectedZone, organization, rightClickSelected, lastRotation);
-                //     console.log('response: ', response);
+                //     
                 //     if (response) {
-                //         console.log("Widget position updated in API:", response);
+                //         
                 //     }
                 // })();
                 let updatingRotation = {
@@ -388,49 +419,13 @@ export default function Dropped3dWidgets() {
 
                 switch (type) {
                     case "ui-Widget 1":
-                        return (
+                        return (<ProductionCapacity key={id} id={id} type={type} position={position} rotation={rotation} onContextMenu={(e) => handleRightClick(e, id)} />);
-                            <ProductionCapacity
-                                key={id}
-                                id={id}
-                                type={type}
-                                position={position}
-                                rotation={rotation}
-                                onContextMenu={(e) => handleRightClick(e, id)}
-                            />
-                        );
                     case "ui-Widget 2":
-                        return (
+                        return (<ReturnOfInvestment key={id} id={id} type={type} position={position} rotation={rotation} onContextMenu={(e) => handleRightClick(e, id)} />);
-                            <ReturnOfInvestment
-                                key={id}
-                                id={id}
-                                type={type}
-                                position={position}
-                                rotation={rotation}
-                                onContextMenu={(e) => handleRightClick(e, id)}
-                            />
-                        );
                     case "ui-Widget 3":
-                        return (
+                        return (<StateWorking key={id} id={id} type={type} position={position} rotation={rotation} onContextMenu={(e) => handleRightClick(e, id)} />);
-                            <StateWorking
-                                key={id}
-                                id={id}
-                                type={type}
-                                position={position}
-                                rotation={rotation}
-                                onContextMenu={(e) => handleRightClick(e, id)}
-                            />
-                        );
                     case "ui-Widget 4":
-                        return (
+                        return (<Throughput key={id} id={id} type={type} position={position} rotation={rotation} onContextMenu={(e) => handleRightClick(e, id)} />);
-                            <Throughput
-                                key={id}
-                                id={id}
-                                type={type}
-                                position={position}
-                                rotation={rotation}
-                                onContextMenu={(e) => handleRightClick(e, id)}
-                            />
-                        );
                     default:
                         return null;
                 }

app/src/components/ui/componets/Panel.tsx

@@ -21,7 +21,6 @@ interface PanelProps {
     zoneName: string;
     activeSides: Side[];
     panelOrder: Side[];
-
     lockedPanels: Side[];
     zoneId: string;
     zoneViewPortTarget: number[];

app/src/components/ui/list/DropDownList.tsx

@@ -47,80 +47,83 @@ const DropDownList: React.FC<DropDownListProps> = ({
   const [zoneDataList, setZoneDataList] = useState<
     { id: string; name: string; assets: Asset[] }[]
   >([]);
+  const [zonePoints3D, setZonePoints3D] = useState<[]>([]);
 
   const { selectedZone, setSelectedZone } = useSelectedZoneStore();
 
   useEffect(() => {
-    // console.log(zones);
+    // const value = (zones || []).map(
-    //     setZoneDataList([
+    //   (val: { zoneId: string; zoneName: string }) => ({
-    //       { id: "2e996073-546c-470c-8323-55bd3700c6aa", name: "zone1" },
+    //     id: val.zoneId,
-    //       { id: "3f473bf0-197c-471c-a71f-943fc9ca2b47", name: "zone2" },
+    //     name: val.zoneName,
-    //       { id: "905e8fb6-9e18-469b-9474-e0478fb9601b", name: "zone3" },
+    //   })
-    //       { id: "9d9efcbe-8e96-47eb-bfad-128a9e4c532e", name: "zone4" },
+    // );
-    //       { id: "884f3d29-eb5a-49a5-abe9-d11971c08e85", name: "zone5" },
+    // console.log('zones: ', zones);
-    //       { id: "70fa55cd-b5c9-4f80-a8c4-6319af3bfb4e", name: "zone6" },
+    const value = (zones || []).map((val: { zoneId: string; zoneName: string }) => ({
-    //     ])
-
-    const value = (zones || []).map(
-      (val: { zoneId: string; zoneName: string }) => ({
       id: val.zoneId,
-        name: val.zoneName,
+      name: val.zoneName
-      })
+    }));
-    );
+    setZoneDataList(prev => (JSON.stringify(prev) !== JSON.stringify(value) ? value : prev));
-    setZoneDataList([
+    const allPoints = zones.flatMap((zone: any) => zone.points);
-      {
+    setZonePoints3D(allPoints);
-        id: "zone1",
+    // setZoneDataList([
-        name: "Zone 1",
+    //   {
-        assets: [
+    //     id: "zone1",
-          {
+    //     name: "Zone 1",
-            id: "asset1",
+    //     assets: [
-            name: "Asset 1",
+    //       {
-          },
+    //         id: "asset1",
-          {
+    //         name: "Asset 1",
-            id: "asset2",
+    //       },
-            name: "Asset 2",
+    //       {
-          },
+    //         id: "asset2",
-          {
+    //         name: "Asset 2",
-            id: "asset3",
+    //       },
-            name: "Asset 3",
+    //       {
-          },
+    //         id: "asset3",
-        ],
+    //         name: "Asset 3",
-      },
+    //       },
-      {
+    //     ],
-        id: "zone2",
+    //   },
-        name: "Zone 2",
+    //   {
-        assets: [
+    //     id: "zone2",
-          {
+    //     name: "Zone 2",
-            id: "asset4",
+    //     assets: [
-            name: "Asset 4",
+    //       {
-          },
+    //         id: "asset4",
-          {
+    //         name: "Asset 4",
-            id: "asset5",
+    //       },
-            name: "Asset 5",
+    //       {
-          },
+    //         id: "asset5",
-          {
+    //         name: "Asset 5",
-            id: "asset6",
+    //       },
-            name: "Asset 6",
+    //       {
-          },
+    //         id: "asset6",
-        ],
+    //         name: "Asset 6",
-      },
+    //       },
-      {
+    //     ],
-        id: "zone3",
+    //   },
-        name: "Zone 3",
+    //   {
-        assets: [
+    //     id: "zone3",
-          {
+    //     name: "Zone 3",
-            id: "asset7",
+    //     assets: [
-            name: "Asset 7",
+    //       {
-          },
+    //         id: "asset7",
-          {
+    //         name: "Asset 7",
-            id: "asset8",
+    //       },
-            name: "Asset 8",
+    //       {
-          },
+    //         id: "asset8",
-        ],
+    //         name: "Asset 8",
-      },
+    //       },
-    ]);
+    //     ],
+    //   },
+    // ]);
 
   }, [zones]);
+  useEffect(() => {
+
+    // console.log('zonePoints3D: ', zonePoints3D);
+  }, [zonePoints3D])
 
   return (
     <div className="dropdown-list-container">

app/src/services/factoryBuilder/zones/deleteZoneApi.ts

@@ -15,7 +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) {

app/src/services/realTimeVisulization/zoneData/getZones.ts

@@ -2,8 +2,7 @@ let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_UR
 // let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 
 export const getZoneData = async (zoneId: string, organization: string) => {
-  console.log("organization: ", organization);
+
-  console.log("zoneId: ", zoneId);
   try {
     const response = await fetch(
       `${url_Backend_dwinzo}/api/v2/A_zone/${zoneId}/${organization}`,