From 46d66be1cadaa715d1d2df42feadd86f8361d92e Mon Sep 17 00:00:00 2001
From: Nalvazhuthi <nalvazhuthi@hexrfactory.com>
Date: Tue, 25 Mar 2025 16:30:33 +0530
Subject: [PATCH] Added scene

---
 .../ui/componets/RealTimeVisulization.tsx     | 28 +++++++++++--------
 app/src/styles/pages/realTimeViz.scss         |  8 ++++++
 2 files changed, 25 insertions(+), 11 deletions(-)

diff --git a/app/src/components/ui/componets/RealTimeVisulization.tsx b/app/src/components/ui/componets/RealTimeVisulization.tsx
index 1fec498..8a394fd 100644
--- a/app/src/components/ui/componets/RealTimeVisulization.tsx
+++ b/app/src/components/ui/componets/RealTimeVisulization.tsx
@@ -4,6 +4,7 @@ import Panel from "./Panel";
 import AddButtons from "./AddButtons";
 import { useSelectedZoneStore } from "../../../store/useZoneStore";
 import DisplayZone from "./DisplayZone";
+import Scene from "../../../modules/scene/scene";
 
 type Side = "top" | "bottom" | "left" | "right";
 
@@ -78,20 +79,25 @@ const RealTimeVisulization: React.FC = () => {
         left: isPlaying ? "0%" : "",
       }}
     >
-      <AddButtons
-        hiddenPanels={hiddenPanels}
-        setHiddenPanels={setHiddenPanels}
+      <div
+        className="scene-container"
+        style={{ height: "100%", width: "100%" }}
+      >
+        <Scene />
+      </div>
+      {!isPlaying && (
+        <AddButtons
+          hiddenPanels={hiddenPanels}
+          setHiddenPanels={setHiddenPanels}
+          selectedZone={selectedZone}
+          setSelectedZone={setSelectedZone}
+        />
+      )}
+      <DisplayZone
+        zonesData={zonesData}
         selectedZone={selectedZone}
         setSelectedZone={setSelectedZone}
       />
-      {/* {!isPlaying && ( */}
-      <AddButtons
-        hiddenPanels={hiddenPanels}
-        setHiddenPanels={setHiddenPanels}
-        selectedZone={selectedZone}
-        setSelectedZone={setSelectedZone}
-      />
-      {/* )} */}
       <Panel
         selectedZone={selectedZone}
         hiddenPanels={hiddenPanels}
diff --git a/app/src/styles/pages/realTimeViz.scss b/app/src/styles/pages/realTimeViz.scss
index 95aa4b0..145e21e 100644
--- a/app/src/styles/pages/realTimeViz.scss
+++ b/app/src/styles/pages/realTimeViz.scss
@@ -143,7 +143,15 @@
   width: calc((100vw * 1.65) - (320px + 270px + 70px) / 0.6);
   z-index: 100;
 
+.scene-container{
+  width: 100%;
+  height: 100%;
+  canvas{
+    width: calc((100vw * 1.65) - (320px + 270px + 70px) / 0.6) !important;
+    height: 100% !important;
 
+  }
+}
 
   &.top {
     transform: scale(1.5);