From 900723c14a1c74ec40041aa9aaed68f663a49485 Mon Sep 17 00:00:00 2001
From: Gomathi9520 <gomathi@hexrfactory.com>
Date: Tue, 1 Apr 2025 15:16:54 +0530
Subject: [PATCH] server api changed for RealTimeVisulization
---
.../3D-cards/cards/ProductionCapacity.tsx | 10 +-
.../components/ui/componets/AddButtons.tsx | 93 ++++++++++---------
.../components/ui/componets/DisplayZone.tsx | 22 ++---
.../components/ui/componets/DistanceLines.tsx | 26 +++++-
.../ui/componets/Dropped3dWidget.tsx | 35 ++-----
.../ui/componets/DroppedFloatingWidgets.tsx | 60 +++++++++---
app/src/components/ui/componets/Panel.tsx | 6 +-
.../ui/componets/RealTimeVisulization.tsx | 2 +
.../componets/functions/determinePosition.ts | 84 ++---------------
.../zoneData/add3dWidget.ts | 4 +-
.../zoneData/addFloatingWidgets.ts | 4 +-
.../zoneData/addWidgets.ts | 4 +-
.../zoneData/deleteFloatingWidget.ts | 4 +-
.../zoneData/deletePanel.ts | 4 +-
.../zoneData/deleteTemplate.ts | 4 +-
.../zoneData/deleteWidgetApi.ts | 4 +-
.../zoneData/duplicateWidget.ts | 4 +-
.../zoneData/get3dWidgetData.ts | 4 +-
.../zoneData/getFloatingData.ts | 4 +-
.../zoneData/getSelect2dZoneData.ts | 4 +-
.../zoneData/getTemplate.ts | 4 +-
.../zoneData/getZoneData.ts | 4 +-
.../realTimeVisulization/zoneData/getZones.ts | 4 +-
.../zoneData/loadTemplate.ts | 4 +-
.../realTimeVisulization/zoneData/panel.ts | 4 +-
.../zoneData/saveTempleteApi.ts | 4 +-
.../zoneData/useFloatingDataStore.ts | 8 --
app/src/store/store.ts | 10 +-
app/src/styles/pages/realTimeViz.scss | 2 -
29 files changed, 201 insertions(+), 225 deletions(-)
delete mode 100644 app/src/services/realTimeVisulization/zoneData/useFloatingDataStore.ts
diff --git a/app/src/components/layout/3D-cards/cards/ProductionCapacity.tsx b/app/src/components/layout/3D-cards/cards/ProductionCapacity.tsx
index 4da32bc..785f20d 100644
--- a/app/src/components/layout/3D-cards/cards/ProductionCapacity.tsx
+++ b/app/src/components/layout/3D-cards/cards/ProductionCapacity.tsx
@@ -25,7 +25,7 @@ interface ProductionCapacityProps {
position: [number, number, number];
}
-const ProductionCapacity : React.FC<ProductionCapacityProps> = ({ position }) => {
+const ProductionCapacity: React.FC<ProductionCapacityProps> = ({ position }) => {
// Chart data for a week
const chartData = {
labels: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], // Days of the week
@@ -79,10 +79,10 @@ const ProductionCapacity : React.FC<ProductionCapacityProps> = ({ position }) =>
};
return (
- <Html position={[position[0], position[1], position[2]]}
- scale={[0.5, 0.5, 0.5]}
- transform
- sprite>
+ <Html position={[position[0], position[1], position[2]]}
+ scale={[0.5, 0.5, 0.5]}
+ transform
+ sprite>
<div className="productionCapacity-wrapper card">
<div className="headeproductionCapacityr-wrapper">
<div className="header">Production Capacity</div>
diff --git a/app/src/components/ui/componets/AddButtons.tsx b/app/src/components/ui/componets/AddButtons.tsx
index 18a7628..d06be19 100644
--- a/app/src/components/ui/componets/AddButtons.tsx
+++ b/app/src/components/ui/componets/AddButtons.tsx
@@ -105,68 +105,69 @@ const AddButtons: React.FC<ButtonsProps> = ({
// Function to handle "+" button click
const handlePlusButtonClick = async (side: Side) => {
-
if (selectedZone.activeSides.includes(side)) {
+ // Panel already exists: Remove widgets from that side and update activeSides
const email = localStorage.getItem("email") || "";
const organization = email?.split("@")[1]?.split(".")[0]; // Fallback value
- // If the panel is already active, remove all widgets and close the panel
+
+ // Remove all widgets associated with the side and update active sides
const cleanedWidgets = selectedZone.widgets.filter(
(widget) => widget.panel !== side
);
const newActiveSides = selectedZone.activeSides.filter((s) => s !== side);
-
+
const updatedZone = {
...selectedZone,
widgets: cleanedWidgets,
activeSides: newActiveSides,
panelOrder: newActiveSides,
};
-
- let response = await deletePanelApi(selectedZone.zoneId, side, organization)
-
- if (response.message === 'Panel deleted successfully') {
-
- setSelectedZone(updatedZone);
- }
-
- // Delete the selectedZone state
- } else {
- const updatePanelData = async () => {
- try {
- // Get email and organization safely
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0] || "defaultOrg"; // Fallback value
-
- // Prevent duplicate side entries
- const newActiveSides = selectedZone.activeSides.includes(side)
- ? [...selectedZone.activeSides]
- : [...selectedZone.activeSides, side];
-
- const updatedZone = {
- ...selectedZone,
- activeSides: newActiveSides,
- panelOrder: newActiveSides,
- };
-
- // API call
- const response = await panelData(organization, selectedZone.zoneId, newActiveSides);
-
- if (response.message === 'Panels created successfully') {
- setSelectedZone(updatedZone);
- }
-
- // Update state
-
- } catch (error) {
-
+
+ // API call to delete the panel
+ try {
+ const response = await deletePanelApi(selectedZone.zoneId, side, organization);
+ console.log('response: ', response);
+ if (response.message === "Panel deleted successfully") {
+ setSelectedZone(updatedZone);
+ } else {
+ console.error("Unexpected response:", response);
}
- };
-
- updatePanelData(); // Call the async function
+ } catch (error) {
+ console.error("Error deleting panel:", error);
+ }
+ } else {
+ // Panel does not exist: Create panel
+ try {
+ // Get email and organization safely with a default fallback
+ const email = localStorage.getItem("email") || "";
+ const organization = email?.split("@")[1]?.split(".")[0] ;
+
+ // Prevent duplicate side entries
+ const newActiveSides = selectedZone.activeSides.includes(side)
+ ? [...selectedZone.activeSides]
+ : [...selectedZone.activeSides, side];
+
+ const updatedZone = {
+ ...selectedZone,
+ activeSides: newActiveSides,
+ panelOrder: newActiveSides,
+ };
+
+ // API call to create panels
+ const response = await panelData(organization, selectedZone.zoneId, newActiveSides);
+ console.log('response: ', response);
+
+ if (response.message === "Panels created successfully") {
+ setSelectedZone(updatedZone);
+ } else {
+ console.error("Unexpected response:", response);
+ }
+ } catch (error) {
+ console.error("Error creating panels:", error);
+ }
}
-
-
};
+
return (
<>
diff --git a/app/src/components/ui/componets/DisplayZone.tsx b/app/src/components/ui/componets/DisplayZone.tsx
index b482a83..ddc7903 100644
--- a/app/src/components/ui/componets/DisplayZone.tsx
+++ b/app/src/components/ui/componets/DisplayZone.tsx
@@ -2,7 +2,10 @@ import React, { useEffect, useRef, useState, useCallback } from "react";
import { Widget } from "../../../store/useWidgetStore";
import { MoveArrowLeft, MoveArrowRight } from "../../icons/SimulationIcons";
import { InfoIcon } from "../../icons/ExportCommonIcons";
-import { useDroppedObjectsStore, useFloatingWidget } from "../../../store/useDroppedObjectsStore";
+import {
+ useDroppedObjectsStore,
+ useFloatingWidget,
+} from "../../../store/useDroppedObjectsStore";
import { getSelect2dZoneData } from "../../../services/realTimeVisulization/zoneData/getSelect2dZoneData";
import { getFloatingZoneData } from "../../../services/realTimeVisulization/zoneData/getFloatingData";
import { get3dWidgetZoneData } from "../../../services/realTimeVisulization/zoneData/get3dWidgetData";
@@ -66,14 +69,13 @@ const DisplayZone: React.FC<DisplayZoneProps> = ({
selectedZone,
setSelectedZone,
}) => {
-
// Ref for the container element
const containerRef = useRef<HTMLDivElement | null>(null);
// State to track overflow visibility
const [showLeftArrow, setShowLeftArrow] = useState(false);
const [showRightArrow, setShowRightArrow] = useState(false);
- const { floatingWidget, setFloatingWidget } = useFloatingWidget()
+ const { floatingWidget, setFloatingWidget } = useFloatingWidget();
// Function to calculate overflow state
const updateOverflowState = useCallback(() => {
@@ -158,10 +160,10 @@ const DisplayZone: React.FC<DisplayZoneProps> = ({
const organization = email?.split("@")[1]?.split(".")[0];
// Fetch data from backend
let response = await getSelect2dZoneData(zoneId, organization);
- console.log('response: ', response);
+
let res = await getFloatingZoneData(zoneId, organization);
- console.log('res: ', res);
- setFloatingWidget(res)
+
+ setFloatingWidget(res);
// Set the selected zone in the store
useDroppedObjectsStore.getState().setZone(zoneName, zoneId);
if (Array.isArray(res)) {
@@ -180,13 +182,9 @@ const DisplayZone: React.FC<DisplayZoneProps> = ({
zoneViewPortTarget: response.viewPortCenter || {},
zoneViewPortPosition: response.viewPortposition || {},
});
- } catch (error) {
-
-
- }
+ } catch (error) { }
}
-
return (
<div
ref={containerRef}
@@ -209,7 +207,7 @@ const DisplayZone: React.FC<DisplayZoneProps> = ({
className={`zone ${selectedZone.zoneName === zoneName ? "active" : ""
}`}
onClick={() => {
- handleSelect2dZoneData(zonesData[zoneName]?.zoneId, zoneName)
+ handleSelect2dZoneData(zonesData[zoneName]?.zoneId, zoneName);
}}
>
{zoneName}
diff --git a/app/src/components/ui/componets/DistanceLines.tsx b/app/src/components/ui/componets/DistanceLines.tsx
index 07cf202..e2ccbc1 100644
--- a/app/src/components/ui/componets/DistanceLines.tsx
+++ b/app/src/components/ui/componets/DistanceLines.tsx
@@ -32,7 +32,12 @@ const DistanceLines: React.FC<DistanceLinesProps> = ({ obj, activeEdges }) => {
height: `${obj.position.top}px`,
}}
>
- <span className="distance-label">{obj.position.top}px</span>
+ <span className="distance-label"
+ style={{
+ position: 'absolute',
+ top: "50%"
+ }}
+ >{obj.position.top}px</span>
</div>
)}
@@ -49,7 +54,12 @@ const DistanceLines: React.FC<DistanceLinesProps> = ({ obj, activeEdges }) => {
height: `${obj.position.bottom}px`,
}}
>
- <span className="distance-label">{obj.position.bottom}px</span>
+ <span className="distance-label"
+ style={{
+ position: 'absolute',
+ bottom: "50%"
+ }}
+ >{obj.position.bottom}px</span>
</div>
)}
@@ -66,7 +76,11 @@ const DistanceLines: React.FC<DistanceLinesProps> = ({ obj, activeEdges }) => {
width: `${obj.position.left}px`,
}}
>
- <span className="distance-label">{obj.position.left}px</span>
+ <span className="distance-label" style={{
+ position: 'absolute',
+ left: "50%"
+ }}
+ >{obj.position.left}px</span>
</div>
)}
@@ -83,7 +97,11 @@ const DistanceLines: React.FC<DistanceLinesProps> = ({ obj, activeEdges }) => {
width: `${obj.position.right}px`,
}}
>
- <span className="distance-label">{obj.position.right}px</span>
+ <span className="distance-label" style={{
+ position: 'absolute',
+ right: "50%"
+ }}
+ >{obj.position.right}px</span>
</div>
)}
</>
diff --git a/app/src/components/ui/componets/Dropped3dWidget.tsx b/app/src/components/ui/componets/Dropped3dWidget.tsx
index 94c5e45..b970872 100644
--- a/app/src/components/ui/componets/Dropped3dWidget.tsx
+++ b/app/src/components/ui/componets/Dropped3dWidget.tsx
@@ -51,29 +51,12 @@ export default function Dropped3dWidgets() {
get3dWidgetData();
- }, [selectedZone.zoneId,activeModule]);
- // useEffect(() => {
- // // ✅ Set data only for the selected zone, keeping existing state structure
- // setZoneWidgetData((prev) => ({
- // ...prev,
- // [selectedZone.zoneId]: [
- // {
- // "id": "1743322674626-50mucpb1c",
- // "type": "ui-Widget 1",
- // "position": [120.94655021768133, 4.142360029666558, 124.39283546121099]
- // },
- // {
- // "id": "1743322682086-je2h9x33v",
- // "type": "ui-Widget 2",
- // "position": [131.28751045879255, 0.009999999999970264, 133.92059801984362]
- // }
- // ]
- // }));
- // }, [selectedZone.zoneId]); // ✅ Only update when the zone changes
+ }, [selectedZone.zoneId, activeModule]);
useEffect(() => {
if (activeModule !== "visualization") return;
if (widgetSubOption === "Floating") return;
+ if (widgetSubOption === "2D") return;
if (selectedZone.zoneName === "") return
const canvasElement = gl.domElement;
const onDrop = async (event: DragEvent) => {
@@ -103,13 +86,15 @@ export default function Dropped3dWidgets() {
let response = await adding3dWidgets(selectedZone.zoneId, organization, newWidget)
+ console.log('response: ', response);
-
- // ✅ Store widgets uniquely for each zone
- setZoneWidgetData((prev) => ({
- ...prev,
- [selectedZone.zoneId]: [...(prev[selectedZone.zoneId] || []), newWidget],
- }));
+ if (response.message === "Widget created successfully") {
+ // ✅ Store widgets uniquely for each zone
+ setZoneWidgetData((prev) => ({
+ ...prev,
+ [selectedZone.zoneId]: [...(prev[selectedZone.zoneId] || []), newWidget],
+ }));
+ }
}
};
diff --git a/app/src/components/ui/componets/DroppedFloatingWidgets.tsx b/app/src/components/ui/componets/DroppedFloatingWidgets.tsx
index c3d61e3..cc9883d 100644
--- a/app/src/components/ui/componets/DroppedFloatingWidgets.tsx
+++ b/app/src/components/ui/componets/DroppedFloatingWidgets.tsx
@@ -68,6 +68,8 @@ const DroppedObjects: React.FC = () => {
} | null>(null); // State to track the current position during drag
const animationRef = useRef<number | null>(null);
const { activeModule } = useModuleStore();
+ const kebabRef = useRef<HTMLDivElement>(null);
+
// Clean up animation frame on unmount
useEffect(() => {
@@ -77,6 +79,21 @@ const DroppedObjects: React.FC = () => {
}
};
}, []);
+ // useEffect(() => {
+ // const handleClickOutside = (event: MouseEvent) => {
+ // if (kebabRef.current && !kebabRef.current.contains(event.target as Node)) {
+ // setOpenKebabId(null);
+ // }
+ // };
+
+ // // Add event listener when component mounts
+ // document.addEventListener("mousedown", handleClickOutside);
+
+ // // Clean up event listener when component unmounts
+ // return () => {
+ // document.removeEventListener("mousedown", handleClickOutside);
+ // };
+ // }, []);
const zoneEntries = Object.entries(zones);
if (zoneEntries.length === 0) return null;
@@ -109,6 +126,8 @@ const DroppedObjects: React.FC = () => {
return; // Prevent dragging when clicking on the kebab menu or its options
}
const obj = zone.objects[index];
+ const element = event.currentTarget as HTMLElement;
+ element.setPointerCapture(event.pointerId);
const container = document.getElementById("real-time-vis-canvas");
if (!container) return;
@@ -201,13 +220,15 @@ const DroppedObjects: React.FC = () => {
// Update the current position state for DistanceLines
setCurrentPosition(newPosition);
+ // Update position immediately without animation frame
+ updateObjectPosition(zoneName, draggingIndex.index, newPosition);
- if (!animationRef.current) {
- animationRef.current = requestAnimationFrame(() => {
- updateObjectPosition(zoneName, draggingIndex.index, newPosition);
- animationRef.current = null;
- });
- }
+ // if (!animationRef.current) {
+ // animationRef.current = requestAnimationFrame(() => {
+ // updateObjectPosition(zoneName, draggingIndex.index, newPosition);
+ // animationRef.current = null;
+ // });
+ // }
};
const handlePointerUp = async (event: React.PointerEvent<HTMLDivElement>) => {
@@ -249,6 +270,9 @@ const DroppedObjects: React.FC = () => {
...finalPosition,
[activeProp1]: finalY,
[activeProp2]: finalX,
+ // Clear opposite properties
+ [activeProp1 === "top" ? "bottom" : "top"]: "auto",
+ [activeProp2 === "left" ? "right" : "left"]: "auto",
};
// Save to backend
@@ -264,17 +288,29 @@ const DroppedObjects: React.FC = () => {
updateObjectPosition(zoneName, draggingIndex.index, boundedPosition);
}
- // Clean up
+ // // Clean up
+ // setDraggingIndex(null);
+ // setOffset(null);
+ // setActiveEdges(null); // Clear active edges
+ // setCurrentPosition(null); // Reset current position
+ // if (animationRef.current) {
+ // cancelAnimationFrame(animationRef.current);
+ // animationRef.current = null;
+ // }
+ } catch (error) {
+ console.error("Error in handlePointerUp:", error);
+ } finally {
+ // Clean up regardless of success or failure
setDraggingIndex(null);
setOffset(null);
- setActiveEdges(null); // Clear active edges
- setCurrentPosition(null); // Reset current position
+ setActiveEdges(null);
+ setCurrentPosition(null);
+
+ // Cancel any pending animation frame
if (animationRef.current) {
cancelAnimationFrame(animationRef.current);
animationRef.current = null;
}
- } catch (error) {
- console.error("Error in handlePointerUp:", error);
}
};
@@ -333,6 +369,7 @@ const DroppedObjects: React.FC = () => {
<div
className="icon kebab"
+ ref={kebabRef}
onClick={(event) => {
event.stopPropagation();
handleKebabClick(obj.id, event)
@@ -362,6 +399,7 @@ const DroppedObjects: React.FC = () => {
</div>
</div>
)}
+
</div>
))}
diff --git a/app/src/components/ui/componets/Panel.tsx b/app/src/components/ui/componets/Panel.tsx
index 6500119..61956b9 100644
--- a/app/src/components/ui/componets/Panel.tsx
+++ b/app/src/components/ui/componets/Panel.tsx
@@ -4,6 +4,7 @@ import { usePlayButtonStore } from "../../../store/usePlayButtonStore";
import { DraggableWidget } from "./DraggableWidget";
import { arrayMove } from "@dnd-kit/sortable";
import { addingWidgets } from "../../../services/realTimeVisulization/zoneData/addWidgets";
+import { useAsset3dWidget } from "../../../store/store";
type Side = "top" | "bottom" | "left" | "right";
@@ -53,6 +54,7 @@ const Panel: React.FC<PanelProps> = ({
hiddenPanels,
setZonesData,
}) => {
+ const { widgetSelect, setWidgetSelect } = useAsset3dWidget();
const panelRefs = useRef<{ [side in Side]?: HTMLDivElement }>({});
const [panelDimensions, setPanelDimensions] = useState<{
[side in Side]?: { width: number; height: number };
@@ -101,7 +103,9 @@ const Panel: React.FC<PanelProps> = ({
const handleDrop = (e: React.DragEvent, panel: Side) => {
+
e.preventDefault();
+ setWidgetSelect("")
const { draggedAsset } = useWidgetStore.getState();
if (!draggedAsset) return;
if (isPanelLocked(panel)) return;
@@ -149,7 +153,7 @@ const Panel: React.FC<PanelProps> = ({
};
try {
let response = await addingWidgets(selectedZone.zoneId, organization, newWidget);
-
+
if (response.message === "Widget created successfully") {
setSelectedZone((prev) => ({
...prev,
diff --git a/app/src/components/ui/componets/RealTimeVisulization.tsx b/app/src/components/ui/componets/RealTimeVisulization.tsx
index f6a041a..387729d 100644
--- a/app/src/components/ui/componets/RealTimeVisulization.tsx
+++ b/app/src/components/ui/componets/RealTimeVisulization.tsx
@@ -132,6 +132,8 @@ const RealTimeVisulization: React.FC = () => {
const relativeX = event.clientX - canvasRect.left;
const relativeY = event.clientY - canvasRect.top;
+ const newPosition = determinePosition(canvasRect, relativeX, relativeY)
+ console.log('newPosition: ', newPosition);
const newObject = {
...droppedData,
id: generateUniqueId(),
diff --git a/app/src/components/ui/componets/functions/determinePosition.ts b/app/src/components/ui/componets/functions/determinePosition.ts
index 000e3a1..af9991b 100644
--- a/app/src/components/ui/componets/functions/determinePosition.ts
+++ b/app/src/components/ui/componets/functions/determinePosition.ts
@@ -1,69 +1,3 @@
-// export function determinePosition(
-// canvasRect: DOMRect,
-// relativeX: number,
-// relativeY: number
-// ): {
-// top: number | "auto";
-// left: number | "auto";
-// right: number | "auto";
-// bottom: number | "auto";
-// } {
-// // Calculate the midpoints of the canvas
-// const centerX = canvasRect.width / 2;
-// const centerY = canvasRect.height / 2;
-
-// // Initialize position with default values
-// let position: {
-// top: number | "auto";
-// left: number | "auto";
-// right: number | "auto";
-// bottom: number | "auto";
-// };
-
-// if (relativeY < centerY) {
-// // Top half
-// if (relativeX < centerX) {
-// // Left side
-// position = {
-// top: relativeY,
-// left: relativeX,
-// right: "auto",
-// bottom: "auto",
-// };
-// } else {
-// // Right side
-// position = {
-// top: relativeY,
-// right: canvasRect.width - relativeX,
-// left: "auto",
-// bottom: "auto",
-// };
-// }
-// } else {
-// // Bottom half
-// if (relativeX < centerX) {
-// // Left side
-// position = {
-// bottom: canvasRect.height - relativeY,
-// left: relativeX,
-// right: "auto",
-// top: "auto",
-// };
-// } else {
-// // Right side
-// position = {
-// bottom: canvasRect.height - relativeY,
-// right: canvasRect.width - relativeX,
-// left: "auto",
-// top: "auto",
-// };
-// }
-// }
-
-// return position;
-// }
-
-
export function determinePosition(
canvasRect: DOMRect,
@@ -89,16 +23,16 @@ export function determinePosition(
if (relativeX < centerX) {
console.log("Top-left");
position = {
- top: relativeY,
- left: relativeX,
+ top: relativeY - 41.5,
+ left: relativeX - 125,
right: "auto",
bottom: "auto",
};
} else {
console.log("Top-right");
position = {
- top: relativeY,
- right: canvasRect.width - relativeX,
+ top: relativeY - 41.5,
+ right: canvasRect.width - relativeX - 125,
left: "auto",
bottom: "auto",
};
@@ -107,16 +41,16 @@ export function determinePosition(
if (relativeX < centerX) {
console.log("Bottom-left");
position = {
- bottom: canvasRect.height - relativeY,
- left: relativeX,
+ bottom: canvasRect.height - relativeY - 41.5,
+ left: relativeX - 125,
right: "auto",
top: "auto",
};
} else {
console.log("Bottom-right");
position = {
- bottom: canvasRect.height - relativeY,
- right: canvasRect.width - relativeX,
+ bottom: canvasRect.height - relativeY - 41.5,
+ right: canvasRect.width - relativeX - 125,
left: "auto",
top: "auto",
};
@@ -124,4 +58,4 @@ export function determinePosition(
}
return position;
-}
\ No newline at end of file
+}
diff --git a/app/src/services/realTimeVisulization/zoneData/add3dWidget.ts b/app/src/services/realTimeVisulization/zoneData/add3dWidget.ts
index 6d976b6..82562b7 100644
--- a/app/src/services/realTimeVisulization/zoneData/add3dWidget.ts
+++ b/app/src/services/realTimeVisulization/zoneData/add3dWidget.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const adding3dWidgets = async (
zoneId: string,
organization: string,
diff --git a/app/src/services/realTimeVisulization/zoneData/addFloatingWidgets.ts b/app/src/services/realTimeVisulization/zoneData/addFloatingWidgets.ts
index ee84841..fb644c6 100644
--- a/app/src/services/realTimeVisulization/zoneData/addFloatingWidgets.ts
+++ b/app/src/services/realTimeVisulization/zoneData/addFloatingWidgets.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const addingFloatingWidgets = async (
zoneId: string,
diff --git a/app/src/services/realTimeVisulization/zoneData/addWidgets.ts b/app/src/services/realTimeVisulization/zoneData/addWidgets.ts
index 08969ab..8539e54 100644
--- a/app/src/services/realTimeVisulization/zoneData/addWidgets.ts
+++ b/app/src/services/realTimeVisulization/zoneData/addWidgets.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const addingWidgets = async (
zoneId: string,
organization: string,
diff --git a/app/src/services/realTimeVisulization/zoneData/deleteFloatingWidget.ts b/app/src/services/realTimeVisulization/zoneData/deleteFloatingWidget.ts
index cd46e5d..85c96b8 100644
--- a/app/src/services/realTimeVisulization/zoneData/deleteFloatingWidget.ts
+++ b/app/src/services/realTimeVisulization/zoneData/deleteFloatingWidget.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const deleteFloatingWidgetApi = async (
floatWidgetID: string,
diff --git a/app/src/services/realTimeVisulization/zoneData/deletePanel.ts b/app/src/services/realTimeVisulization/zoneData/deletePanel.ts
index 0fc22e4..21f4846 100644
--- a/app/src/services/realTimeVisulization/zoneData/deletePanel.ts
+++ b/app/src/services/realTimeVisulization/zoneData/deletePanel.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const deletePanelApi = async (
zoneId: string,
diff --git a/app/src/services/realTimeVisulization/zoneData/deleteTemplate.ts b/app/src/services/realTimeVisulization/zoneData/deleteTemplate.ts
index df55b37..e452f6d 100644
--- a/app/src/services/realTimeVisulization/zoneData/deleteTemplate.ts
+++ b/app/src/services/realTimeVisulization/zoneData/deleteTemplate.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const deleteTemplateApi = async (
templateID: string,
diff --git a/app/src/services/realTimeVisulization/zoneData/deleteWidgetApi.ts b/app/src/services/realTimeVisulization/zoneData/deleteWidgetApi.ts
index 92836ed..e57e8cb 100644
--- a/app/src/services/realTimeVisulization/zoneData/deleteWidgetApi.ts
+++ b/app/src/services/realTimeVisulization/zoneData/deleteWidgetApi.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const deleteWidgetApi = async (
widgetID: string,
diff --git a/app/src/services/realTimeVisulization/zoneData/duplicateWidget.ts b/app/src/services/realTimeVisulization/zoneData/duplicateWidget.ts
index 80f486d..f5ec834 100644
--- a/app/src/services/realTimeVisulization/zoneData/duplicateWidget.ts
+++ b/app/src/services/realTimeVisulization/zoneData/duplicateWidget.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const duplicateWidgetApi = async (
zoneId: string,
organization: string,
diff --git a/app/src/services/realTimeVisulization/zoneData/get3dWidgetData.ts b/app/src/services/realTimeVisulization/zoneData/get3dWidgetData.ts
index 71a6be7..b5b6200 100644
--- a/app/src/services/realTimeVisulization/zoneData/get3dWidgetData.ts
+++ b/app/src/services/realTimeVisulization/zoneData/get3dWidgetData.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const get3dWidgetZoneData = async (
ZoneId?: string,
organization?: string
diff --git a/app/src/services/realTimeVisulization/zoneData/getFloatingData.ts b/app/src/services/realTimeVisulization/zoneData/getFloatingData.ts
index 0246175..80d2b19 100644
--- a/app/src/services/realTimeVisulization/zoneData/getFloatingData.ts
+++ b/app/src/services/realTimeVisulization/zoneData/getFloatingData.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const getFloatingZoneData = async (
ZoneId?: string,
organization?: string
diff --git a/app/src/services/realTimeVisulization/zoneData/getSelect2dZoneData.ts b/app/src/services/realTimeVisulization/zoneData/getSelect2dZoneData.ts
index 2d85b73..00d4dfe 100644
--- a/app/src/services/realTimeVisulization/zoneData/getSelect2dZoneData.ts
+++ b/app/src/services/realTimeVisulization/zoneData/getSelect2dZoneData.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const getSelect2dZoneData = async (
ZoneId?: string,
diff --git a/app/src/services/realTimeVisulization/zoneData/getTemplate.ts b/app/src/services/realTimeVisulization/zoneData/getTemplate.ts
index 3e516d7..a3aa3a3 100644
--- a/app/src/services/realTimeVisulization/zoneData/getTemplate.ts
+++ b/app/src/services/realTimeVisulization/zoneData/getTemplate.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const getTemplateData = async (organization?: string) => {
try {
const response = await fetch(
diff --git a/app/src/services/realTimeVisulization/zoneData/getZoneData.ts b/app/src/services/realTimeVisulization/zoneData/getZoneData.ts
index f68ef15..efbac3b 100644
--- a/app/src/services/realTimeVisulization/zoneData/getZoneData.ts
+++ b/app/src/services/realTimeVisulization/zoneData/getZoneData.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const getZone2dData = async (organization?: string) => {
try {
const response = await fetch(
diff --git a/app/src/services/realTimeVisulization/zoneData/getZones.ts b/app/src/services/realTimeVisulization/zoneData/getZones.ts
index 3be5c3c..8dbf79a 100644
--- a/app/src/services/realTimeVisulization/zoneData/getZones.ts
+++ b/app/src/services/realTimeVisulization/zoneData/getZones.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const getZoneData = async (zoneId: string, organization: string) => {
console.log("organization: ", organization);
diff --git a/app/src/services/realTimeVisulization/zoneData/loadTemplate.ts b/app/src/services/realTimeVisulization/zoneData/loadTemplate.ts
index 1ec0573..915160d 100644
--- a/app/src/services/realTimeVisulization/zoneData/loadTemplate.ts
+++ b/app/src/services/realTimeVisulization/zoneData/loadTemplate.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const loadTempleteApi = async (
templateID: string,
zoneId: string,
diff --git a/app/src/services/realTimeVisulization/zoneData/panel.ts b/app/src/services/realTimeVisulization/zoneData/panel.ts
index 6d93d1f..82f1289 100644
--- a/app/src/services/realTimeVisulization/zoneData/panel.ts
+++ b/app/src/services/realTimeVisulization/zoneData/panel.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
type Side = "top" | "bottom" | "left" | "right";
export const panelData = async (
diff --git a/app/src/services/realTimeVisulization/zoneData/saveTempleteApi.ts b/app/src/services/realTimeVisulization/zoneData/saveTempleteApi.ts
index aa85b47..5c18031 100644
--- a/app/src/services/realTimeVisulization/zoneData/saveTempleteApi.ts
+++ b/app/src/services/realTimeVisulization/zoneData/saveTempleteApi.ts
@@ -1,5 +1,5 @@
-// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const saveTemplateApi = async (organization: string, template: {}) => {
console.log('template: ', template);
try {
diff --git a/app/src/services/realTimeVisulization/zoneData/useFloatingDataStore.ts b/app/src/services/realTimeVisulization/zoneData/useFloatingDataStore.ts
deleted file mode 100644
index 39a542a..0000000
--- a/app/src/services/realTimeVisulization/zoneData/useFloatingDataStore.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-import { create } from "zustand";
-
-const useFloatingDataStore = create((set) => ({
- floatingdata: [], // Initial state
- setfloatingadata: (newData: []) => set({ floatingdata: newData }), // Setter function
-}));
-
-export default useFloatingDataStore;
diff --git a/app/src/store/store.ts b/app/src/store/store.ts
index 6affa99..16064e1 100644
--- a/app/src/store/store.ts
+++ b/app/src/store/store.ts
@@ -11,16 +11,22 @@ export const useSocketStore = create<any>((set: any, get: any) => ({
return;
}
- const socket = io(`http://${process.env.REACT_APP_SERVER_SOCKET_API_BASE_URL}/Builder`, {
+ const socket = io(`http://${process.env.REACT_APP_SERVER_SOCKET_API_BASE_URL}`, {
reconnection: false,
auth: { email, organization },
});
- set({ socket });
+ const VisualizationSocket = io(`http://${process.env.REACT_APP_SERVER_SOCKET_API_BASE_URL}/Visualization`, {
+ reconnection: false,
+ auth: { email, organization },
+ });
+
+ set({ socket, VisualizationSocket });
},
disconnectSocket: () => {
set((state: any) => {
state.socket?.disconnect();
+ state.VisualizationSocket?.disconnect();
return { socket: null };
});
},
diff --git a/app/src/styles/pages/realTimeViz.scss b/app/src/styles/pages/realTimeViz.scss
index d58f12d..4c18feb 100644
--- a/app/src/styles/pages/realTimeViz.scss
+++ b/app/src/styles/pages/realTimeViz.scss
@@ -616,8 +616,6 @@
-
-
.distance-line {
position: absolute;
border-style: dashed;