Dwinzo-Beta
/
Dwinzo_dev
4
0
Fork 3
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'v3' into v3-refactor

This commit is contained in:
Gomathi 2025-06-11 16:34:25 +05:30
parent 7e85cf4e53 6bb2947e24
commit b56a54cb5a
45 changed files with 839 additions and 936 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/src/app.tsx
View File

@ -1,4 +1,5 @@
import React, { useEffect, useState } from "react"; import React, { useEffect } from "react";
import { Cache } from "three";
import { BrowserRouter as Router, Routes, Route } from "react-router-dom"; import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
import Dashboard from "./pages/Dashboard"; import Dashboard from "./pages/Dashboard";
import Project from "./pages/Project"; import Project from "./pages/Project";
@ -8,6 +9,11 @@ import { LoggerProvider } from "./components/ui/log/LoggerContext";
const App: React.FC = () => { const App: React.FC = () => {
useEffect(() => {
Cache.clear();
Cache.enabled = true;
}, []);
return ( return (
<LoggerProvider> <LoggerProvider>
<Router> <Router>

1
app/src/components/layout/sidebarRight/simulation/Simulations.tsx
View File

@ -137,6 +137,7 @@ const Simulations: React.FC = () => {
} }
); );
} }
}, [selectedProduct.productUuid, products]); }, [selectedProduct.productUuid, products]);
return ( return (

19
app/src/components/ui/Tools.tsx
View File

@ -22,8 +22,6 @@ import { useSelectedZoneStore } from "../../store/visualization/useZoneStore";
import { import {
useActiveTool, useActiveTool,
useAddAction, useAddAction,
useDeleteTool,
useDeletePointOrLine,
useRefTextUpdate, useRefTextUpdate,
useSelectedWallItem, useSelectedWallItem,
useSocketStore, useSocketStore,
@ -32,7 +30,7 @@ import {
useActiveSubTool, useActiveSubTool,
useShortcutStore, useShortcutStore,
} from "../../store/builder/store"; } from "../../store/builder/store";
import {useToggleStore} from "../../store/useUIToggleStore"; import { useToggleStore } from "../../store/useUIToggleStore";
import { import {
use3DWidget, use3DWidget,
useFloatingWidget, useFloatingWidget,
@ -72,8 +70,6 @@ const Tools: React.FC = () => {
setActiveTool, setActiveTool,
setToolMode, setToolMode,
setAddAction, setAddAction,
setDeleteTool,
setDeletePointOrLine,
} = useStoreHooks(); } = useStoreHooks();
const { setActiveSubTool, activeSubTool } = useActiveSubTool(); const { setActiveSubTool, activeSubTool } = useActiveSubTool();
@ -131,18 +127,14 @@ const Tools: React.FC = () => {
const resetTools = () => { const resetTools = () => {
setToolMode(null); setToolMode(null);
setDeleteTool(false);
setAddAction(null); setAddAction(null);
setDeletePointOrLine(false);
setRefTextUpdate((prev) => prev - 1); setRefTextUpdate((prev) => prev - 1);
}; };
const updateToolBehavior = (tool: string, is2D: boolean) => { const updateToolBehavior = (tool: string, is2D: boolean) => {
switch (tool) { switch (tool) {
case "cursor": case "cursor":
if (toggleView) { is2D ? setToolMode("move") : setToolMode("cursor");
setToolMode("move");
}
break; break;
case "draw-wall": case "draw-wall":
is2D && setToolMode("Wall"); is2D && setToolMode("Wall");
@ -160,10 +152,10 @@ const Tools: React.FC = () => {
setToolMode("MeasurementScale"); setToolMode("MeasurementScale");
break; break;
case "Add pillar": case "Add pillar":
if (!is2D) setAddAction("pillar"); if (!is2D) setAddAction("Pillar");
break; break;
case "delete": case "delete":
is2D ? setDeletePointOrLine(true) : setDeleteTool(true); is2D ? setToolMode('2D-Delete') : setToolMode('3D-Delete');
break; break;
} }
}; };
@ -175,7 +167,6 @@ const Tools: React.FC = () => {
setToggleUI(toggleTo2D, toggleTo2D); setToggleUI(toggleTo2D, toggleTo2D);
if (toggleTo2D) { if (toggleTo2D) {
setSelectedWallItem(null); setSelectedWallItem(null);
setDeleteTool(false);
setAddAction(null); setAddAction(null);
} }
setActiveTool("cursor"); setActiveTool("cursor");
@ -410,9 +401,7 @@ const useStoreHooks = () => {
return { return {
...useActiveTool(), ...useActiveTool(),
...useToolMode(), ...useToolMode(),
...useDeleteTool(),
...useAddAction(), ...useAddAction(),
...useDeletePointOrLine(),
...useRefTextUpdate(), ...useRefTextUpdate(),
}; };
}; };

28
app/src/components/ui/compareVersion/ComparisonResult.tsx
View File

@ -1,7 +1,7 @@
import React, { useMemo } from "react"; import React, { useMemo } from "react";
import PerformanceResult from "./result-card/PerformanceResult"; import PerformanceResult from "./result-card/PerformanceResult";
import EnergyUsage from "./result-card/EnergyUsage"; import EnergyUsage from "./result-card/EnergyUsage";
import { Bar, Line } from "react-chartjs-2"; import { Bar, Line, Pie } from "react-chartjs-2";
const ComparisonResult = () => { const ComparisonResult = () => {
const options = useMemo( const options = useMemo(
@ -33,21 +33,22 @@ const ComparisonResult = () => {
backgroundColor: [purpleDark, purpleLight], backgroundColor: [purpleDark, purpleLight],
borderColor: [purpleDark, purpleLight], borderColor: [purpleDark, purpleLight],
borderWidth: 1, borderWidth: 1,
borderRadius: 10, // ✅ Rounded all corners (TypeScript-safe)
// borderSkipped: "bottom", // ✅ This is allowed by the Chart.js types
}, },
], ],
}; };
const cycleTimeData = {
const cycleTimePieData = {
labels: ["Layout 1", "Layout 2"], labels: ["Layout 1", "Layout 2"],
datasets: [ datasets: [
{ {
label: "Cycle Time (sec)", label: "Cycle Time (sec)",
data: [110, 110], data: [120, 110],
backgroundColor: [purpleLight], backgroundColor: [purpleDark, purpleLight],
borderColor: purpleDark, borderColor: "#fff",
borderWidth: 2, borderWidth: 2,
tension: 0.4,
fill: false,
}, },
], ],
}; };
@ -61,6 +62,8 @@ const ComparisonResult = () => {
backgroundColor: [purpleDark, purpleLight], backgroundColor: [purpleDark, purpleLight],
borderColor: [purpleDark, purpleLight], borderColor: [purpleDark, purpleLight],
borderWidth: 1, borderWidth: 1,
borderRadius: 10,
borderSkipped: false,
}, },
], ],
}; };
@ -74,6 +77,8 @@ const ComparisonResult = () => {
backgroundColor: [purpleDark, purpleLight], backgroundColor: [purpleDark, purpleLight],
borderColor: [purpleDark, purpleLight], borderColor: [purpleDark, purpleLight],
borderWidth: 1, borderWidth: 1,
borderRadius: 10,
borderSkipped: false,
}, },
], ],
}; };
@ -83,7 +88,6 @@ const ComparisonResult = () => {
<div className="header">Performance Comparison</div> <div className="header">Performance Comparison</div>
<div className="compare-result-wrapper"> <div className="compare-result-wrapper">
<EnergyUsage /> <EnergyUsage />
<div className="throughPutCard-container comparisionCard"> <div className="throughPutCard-container comparisionCard">
<h4>Throughput (units/hr)</h4> <h4>Throughput (units/hr)</h4>
<div className="layers-wrapper"> <div className="layers-wrapper">
@ -95,9 +99,9 @@ const ComparisonResult = () => {
<div className="key">Layout 2</div> <div className="key">Layout 2</div>
<div className="value">550/ hr</div> <div className="value">550/ hr</div>
</div> </div>
</div> <div className="chart">
<div className="chart"> <Bar data={throughputData} options={options} />
<Bar data={throughputData} options={options} /> </div>
</div> </div>
</div> </div>
@ -122,7 +126,7 @@ const ComparisonResult = () => {
</div> </div>
</div> </div>
<div className="chart"> <div className="chart">
<Line data={cycleTimeData} options={options} /> <Pie data={cycleTimePieData} options={options} />
</div> </div>
</div> </div>

18
app/src/modules/builder/IntialLoad/loadInitialWallItems.ts
View File

@ -7,7 +7,7 @@ import { retrieveGLTF, storeGLTF } from '../../../utils/indexDB/idbUtils';
async function loadInitialWallItems( async function loadInitialWallItems(
setWallItems: Types.setWallItemSetState, setWallItems: Types.setWallItemSetState,
projectId?:string projectId?: string
): Promise<void> { ): Promise<void> {
try { try {
const email = localStorage.getItem('email'); const email = localStorage.getItem('email');
@ -16,7 +16,7 @@ async function loadInitialWallItems(
} }
const organization = email.split("@")[1].split(".")[0]; const organization = email.split("@")[1].split(".")[0];
const items = await getWallItems(organization,projectId); const items = await getWallItems(organization, projectId);
let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_MARKETPLACE_URL}`; let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_MARKETPLACE_URL}`;
@ -34,33 +34,33 @@ async function loadInitialWallItems(
const loadedWallItems = await Promise.all(items.map(async (item: Types.WallItem) => { const loadedWallItems = await Promise.all(items.map(async (item: Types.WallItem) => {
// Check THREE.js cache first // Check THREE.js cache first
const cachedModel = THREE.Cache.get(item.modelfileID!); const cachedModel = THREE.Cache.get(item.assetId!);
if (cachedModel) { if (cachedModel) {
return processModel(cachedModel, item); return processModel(cachedModel, item);
} }
// Check IndexedDB cache // Check IndexedDB cache
const cachedModelBlob = await retrieveGLTF(item.modelfileID!); const cachedModelBlob = await retrieveGLTF(item.assetId!);
if (cachedModelBlob) { if (cachedModelBlob) {
const blobUrl = URL.createObjectURL(cachedModelBlob); const blobUrl = URL.createObjectURL(cachedModelBlob);
return new Promise<Types.WallItem>((resolve) => { return new Promise<Types.WallItem>((resolve) => {
loader.load(blobUrl, (gltf) => { loader.load(blobUrl, (gltf) => {
URL.revokeObjectURL(blobUrl); URL.revokeObjectURL(blobUrl);
THREE.Cache.add(item.modelfileID!, gltf); THREE.Cache.add(item.assetId!, gltf);
resolve(processModel(gltf, item)); resolve(processModel(gltf, item));
}); });
}); });
} }
// Load from original URL if not cached // Load from original URL if not cached
const modelUrl = `${url_Backend_dwinzo}/api/v2/AssetFile/${item.modelfileID!}`; const modelUrl = `${url_Backend_dwinzo}/api/v2/AssetFile/${item.assetId!}`;
return new Promise<Types.WallItem>((resolve) => { return new Promise<Types.WallItem>((resolve) => {
loader.load(modelUrl, async (gltf) => { loader.load(modelUrl, async (gltf) => {
try { try {
// Cache the model // Cache the model
const modelBlob = await fetch(modelUrl).then((res) => res.blob()); const modelBlob = await fetch(modelUrl).then((res) => res.blob());
await storeGLTF(item.modelfileID!, modelBlob); await storeGLTF(item.assetId!, modelBlob);
THREE.Cache.add(item.modelfileID!, gltf); THREE.Cache.add(item.assetId!, gltf);
resolve(processModel(gltf, item)); resolve(processModel(gltf, item));
} catch (error) { } catch (error) {
console.error('Failed to cache model:', error); console.error('Failed to cache model:', error);
@ -91,7 +91,7 @@ function processModel(gltf: GLTF, item: Types.WallItem): Types.WallItem {
type: item.type, type: item.type,
model: model, model: model,
modelName: item.modelName, modelName: item.modelName,
modelfileID: item.modelfileID, assetId: item.assetId,
scale: item.scale, scale: item.scale,
csgscale: item.csgscale, csgscale: item.csgscale,
csgposition: item.csgposition, csgposition: item.csgposition,

6
app/src/modules/builder/asset/assetsGroup.tsx
View File

@ -63,7 +63,7 @@ function AssetsGroup({ floorGroup, plane }: { readonly floorGroup: RefGroup, rea
getFloorAssets(organization, projectId).then((data) => { getFloorAssets(organization, projectId).then((data) => {
if (data.length > 0) { if (data.length > 0) {
const uniqueItems = (data as FloorItems).filter((item, index, self) => index === self.findIndex((t) => t.modelfileID === item.modelfileID)); const uniqueItems = (data as FloorItems).filter((item, index, self) => index === self.findIndex((t) => t.assetId === item.assetId));
totalAssets = uniqueItems.length; totalAssets = uniqueItems.length;
if (totalAssets === 0) { if (totalAssets === 0) {
updateLoadingProgress(100); updateLoadingProgress(100);
@ -96,7 +96,7 @@ function AssetsGroup({ floorGroup, plane }: { readonly floorGroup: RefGroup, rea
assets.push({ assets.push({
modelUuid: item.modelUuid, modelUuid: item.modelUuid,
modelName: item.modelName, modelName: item.modelName,
assetId: item.modelfileID, assetId: item.assetId,
position: item.position, position: item.position,
rotation: [item.rotation.x, item.rotation.y, item.rotation.z], rotation: [item.rotation.x, item.rotation.y, item.rotation.z],
isLocked: item.isLocked, isLocked: item.isLocked,
@ -236,7 +236,7 @@ function AssetsGroup({ floorGroup, plane }: { readonly floorGroup: RefGroup, rea
assets.push({ assets.push({
modelUuid: item.modelUuid, modelUuid: item.modelUuid,
modelName: item.modelName, modelName: item.modelName,
assetId: item.modelfileID, assetId: item.assetId,
position: item.position, position: item.position,
rotation: [item.rotation.x, item.rotation.y, item.rotation.z], rotation: [item.rotation.x, item.rotation.y, item.rotation.z],
isLocked: item.isLocked, isLocked: item.isLocked,

10
app/src/modules/builder/asset/functions/addAssetModel.ts
View File

@ -136,7 +136,7 @@ async function handleModelLoad(
// organization, // organization,
// newFloorItem.modelUuid, // newFloorItem.modelUuid,
// newFloorItem.modelName, // newFloorItem.modelName,
// newFloorItem.modelfileID, // newFloorItem.assetId,
// newFloorItem.position, // newFloorItem.position,
// { x: 0, y: 0, z: 0 }, // { x: 0, y: 0, z: 0 },
// false, // false,
@ -352,7 +352,7 @@ async function handleModelLoad(
organization, organization,
modelUuid: newFloorItem.modelUuid, modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName, modelName: newFloorItem.modelName,
modelfileID: newFloorItem.assetId, assetId: newFloorItem.assetId,
position: newFloorItem.position, position: newFloorItem.position,
rotation: { rotation: {
x: model.rotation.x, x: model.rotation.x,
@ -372,7 +372,7 @@ async function handleModelLoad(
const asset: Asset = { const asset: Asset = {
modelUuid: completeData.modelUuid, modelUuid: completeData.modelUuid,
modelName: completeData.modelName, modelName: completeData.modelName,
assetId: completeData.modelfileID, assetId: completeData.assetId,
position: completeData.position, position: completeData.position,
rotation: [ rotation: [
completeData.rotation.x, completeData.rotation.x,
@ -392,7 +392,7 @@ async function handleModelLoad(
organization, organization,
modelUuid: newFloorItem.modelUuid, modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName, modelName: newFloorItem.modelName,
modelfileID: newFloorItem.assetId, assetId: newFloorItem.assetId,
position: newFloorItem.position, position: newFloorItem.position,
rotation: { rotation: {
x: model.rotation.x, x: model.rotation.x,
@ -411,7 +411,7 @@ async function handleModelLoad(
const asset = { const asset = {
modelUuid: data.modelUuid, modelUuid: data.modelUuid,
modelName: data.modelName, modelName: data.modelName,
assetId: data.modelfileID, assetId: data.assetId,
position: data.position, position: data.position,
rotation: [data.rotation.x, data.rotation.y, data.rotation.z] as [number, number, number], rotation: [data.rotation.x, data.rotation.y, data.rotation.z] as [number, number, number],
isLocked: data.isLocked, isLocked: data.isLocked,

22
app/src/modules/builder/asset/models/model/model.tsx
View File

@ -1,10 +1,10 @@
import * as THREE from 'three'; import * as THREE from 'three';
import { useEffect, useRef, useState } from 'react'; import { useCallback, useEffect, useRef, useState } from 'react';
import { retrieveGLTF, storeGLTF } from '../../../../../utils/indexDB/idbUtils'; import { retrieveGLTF, storeGLTF } from '../../../../../utils/indexDB/idbUtils';
import { GLTF, GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader'; import { GLTF, GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';
import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader'; import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader';
import { ThreeEvent, useFrame, useThree } from '@react-three/fiber'; import { ThreeEvent, useFrame, useThree } from '@react-three/fiber';
import { useActiveTool, useDeletableFloorItem, useRenderDistance, useSelectedFloorItem, useSocketStore, useToggleView } from '../../../../../store/builder/store'; import { useActiveTool, useDeletableFloorItem, useRenderDistance, useSelectedFloorItem, useSocketStore, useToggleView, useToolMode } from '../../../../../store/builder/store';
import { AssetBoundingBox } from '../../functions/assetBoundingBox'; import { AssetBoundingBox } from '../../functions/assetBoundingBox';
import { CameraControls } from '@react-three/drei'; import { CameraControls } from '@react-three/drei';
import { useAssetsStore } from '../../../../../store/builder/useAssetStore'; import { useAssetsStore } from '../../../../../store/builder/useAssetStore';
@ -39,8 +39,13 @@ function Model({ asset }: { readonly asset: Asset }) {
const [gltfScene, setGltfScene] = useState<GLTF["scene"] | null>(null); const [gltfScene, setGltfScene] = useState<GLTF["scene"] | null>(null);
const [boundingBox, setBoundingBox] = useState<THREE.Box3 | null>(null); const [boundingBox, setBoundingBox] = useState<THREE.Box3 | null>(null);
const groupRef = useRef<THREE.Group>(null); const groupRef = useRef<THREE.Group>(null);
const { toolMode } = useToolMode();
const { projectId } = useParams(); const { projectId } = useParams();
useEffect(() => {
setDeletableFloorItem(null);
}, [activeModule, toolMode])
useEffect(() => { useEffect(() => {
const loader = new GLTFLoader(); const loader = new GLTFLoader();
const dracoLoader = new DRACOLoader(); const dracoLoader = new DRACOLoader();
@ -191,21 +196,21 @@ function Model({ asset }: { readonly asset: Asset }) {
} }
} }
const handlePointerOver = (asset: Asset) => { const handlePointerOver = useCallback((asset: Asset) => {
if (activeTool === "delete") { if (activeTool === "delete" && activeModule === 'builder') {
if (deletableFloorItem && deletableFloorItem.uuid === asset.modelUuid) { if (deletableFloorItem && deletableFloorItem.uuid === asset.modelUuid) {
return; return;
} else { } else {
setDeletableFloorItem(groupRef.current); setDeletableFloorItem(groupRef.current);
} }
} }
} }, [activeTool, activeModule, deletableFloorItem]);
const handlePointerOut = (asset: Asset) => { const handlePointerOut = useCallback((asset: Asset) => {
if (activeTool === "delete" && deletableFloorItem && deletableFloorItem.uuid === asset.modelUuid) { if (activeTool === "delete" && deletableFloorItem && deletableFloorItem.uuid === asset.modelUuid) {
setDeletableFloorItem(null); setDeletableFloorItem(null);
} }
} }, [activeTool, deletableFloorItem]);
const handleContextMenu = (asset: Asset, evt: ThreeEvent<MouseEvent>) => { const handleContextMenu = (asset: Asset, evt: ThreeEvent<MouseEvent>) => {
if (activeTool === "cursor" && subModule === 'simulations') { if (activeTool === "cursor" && subModule === 'simulations') {
@ -247,6 +252,7 @@ function Model({ asset }: { readonly asset: Asset }) {
return ( return (
<group <group
key={asset.modelUuid}
name='Asset Model' name='Asset Model'
ref={groupRef} ref={groupRef}
uuid={asset.modelUuid} uuid={asset.modelUuid}
@ -266,7 +272,7 @@ function Model({ asset }: { readonly asset: Asset }) {
handleClick(asset); handleClick(asset);
} }
}} }}
onPointerOver={(e) => { onPointerEnter={(e) => {
if (!toggleView) { if (!toggleView) {
e.stopPropagation(); e.stopPropagation();
handlePointerOver(asset); handlePointerOver(asset);

31
app/src/modules/builder/builder.tsx
View File

@ -13,7 +13,6 @@ import ReferenceDistanceText from "./geomentries/lines/distanceText/referenceDis
import { import {
useToggleView, useToggleView,
useDeletePointOrLine,
useActiveLayer, useActiveLayer,
useWallVisibility, useWallVisibility,
useRoofVisibility, useRoofVisibility,
@ -58,18 +57,10 @@ export default function Builder() {
const csg = useRef(); // Reference for CSG object, used for 3D modeling. const csg = useRef(); // Reference for CSG object, used for 3D modeling.
const CSGGroup = useRef() as Types.RefMesh; // Reference to a group of CSG objects. const CSGGroup = useRef() as Types.RefMesh; // Reference to a group of CSG objects.
const scene = useRef() as Types.RefScene; // Reference to the scene. const scene = useRef() as Types.RefScene; // Reference to the scene.
const camera = useRef() as Types.RefCamera; // Reference to the camera object.
const controls = useRef<any>(); // Reference to the controls object.
const raycaster = useRef() as Types.RefRaycaster; // Reference for raycaster used for detecting objects being pointed at in the scene.
const dragPointControls = useRef() as Types.RefDragControl; // Reference for drag point controls, an array for drag control. const dragPointControls = useRef() as Types.RefDragControl; // Reference for drag point controls, an array for drag control.
// Assigning the scene and camera from the Three.js state to the references. // Assigning the scene and camera from the Three.js state to the references.
scene.current = state.scene;
camera.current = state.camera;
controls.current = state.controls;
raycaster.current = state.raycaster;
const plane = useRef<THREE.Mesh>(null); // Reference for a plane object for raycaster reference. const plane = useRef<THREE.Mesh>(null); // Reference for a plane object for raycaster reference.
const grid = useRef() as any; // Reference for a grid object for raycaster reference. const grid = useRef() as any; // Reference for a grid object for raycaster reference.
const snappedPoint = useRef() as Types.RefVector3; // Reference for storing a snapped point at the (end = isSnapped) and (start = ispreSnapped) of the line. const snappedPoint = useRef() as Types.RefVector3; // Reference for storing a snapped point at the (end = isSnapped) and (start = ispreSnapped) of the line.
@ -78,8 +69,6 @@ export default function Builder() {
const isAngleSnapped = useRef(false) as Types.RefBoolean; // Boolean to indicate if angle snapping is active. const isAngleSnapped = useRef(false) as Types.RefBoolean; // Boolean to indicate if angle snapping is active.
const isSnappedUUID = useRef() as Types.RefString; // UUID reference to identify the snapped point. const isSnappedUUID = useRef() as Types.RefString; // UUID reference to identify the snapped point.
const ispreSnapped = useRef(false) as Types.RefBoolean; // Boolean reference to indicate if an object is snapped at the (start). const ispreSnapped = useRef(false) as Types.RefBoolean; // Boolean reference to indicate if an object is snapped at the (start).
const tempLoader = useRef() as Types.RefMesh; // Reference for a temporary loader for the floor items.
const isTempLoader = useRef() as Types.RefBoolean; // Reference to check if a temporary loader is active.
const Tube = useRef() as Types.RefTubeGeometry; // Reference for tubes used for reference line creation and updation. const Tube = useRef() as Types.RefTubeGeometry; // Reference for tubes used for reference line creation and updation.
const line = useRef([]) as Types.RefLine; // Reference for line which stores the current line that is being drawn. const line = useRef([]) as Types.RefLine; // Reference for line which stores the current line that is being drawn.
const lines = useRef([]) as Types.RefLines; // Reference for lines which stores all the lines that are ever drawn. const lines = useRef([]) as Types.RefLines; // Reference for lines which stores all the lines that are ever drawn.
@ -88,13 +77,10 @@ export default function Builder() {
const ReferenceLineMesh = useRef() as Types.RefMesh; // Reference for storing the mesh of the reference line for moving it during draw. const ReferenceLineMesh = useRef() as Types.RefMesh; // Reference for storing the mesh of the reference line for moving it during draw.
const LineCreated = useRef(false) as Types.RefBoolean; // Boolean to track whether the reference line is created or not. const LineCreated = useRef(false) as Types.RefBoolean; // Boolean to track whether the reference line is created or not.
const referencePole = useRef() as Types.RefMesh; // Reference for a pole that is used as the reference for the user to show where it is placed. const referencePole = useRef() as Types.RefMesh; // Reference for a pole that is used as the reference for the user to show where it is placed.
const itemsGroup = useRef() as Types.RefGroup; // Reference to the THREE.Group that has the floor items (Gltf).
const floorGroup = useRef() as Types.RefGroup; // Reference to the THREE.Group that has the roofs and the floors. const floorGroup = useRef() as Types.RefGroup; // Reference to the THREE.Group that has the roofs and the floors.
const floorPlanGroup = useRef() as Types.RefGroup; // Reference for a THREE.Group that has the lines group and the points group. const floorPlanGroup = useRef() as Types.RefGroup; // Reference for a THREE.Group that has the lines group and the points group.
const floorPlanGroupLine = useRef() as Types.RefGroup; // Reference for a THREE.Group that has the lines that are drawn. const floorPlanGroupLine = useRef() as Types.RefGroup; // Reference for a THREE.Group that has the lines that are drawn.
const floorPlanGroupPoint = useRef() as Types.RefGroup; // Reference for a THREE.Group that has the points that are created. const floorPlanGroupPoint = useRef() as Types.RefGroup; // Reference for a THREE.Group that has the points that are created.
const floorGroupAisle = useRef() as Types.RefGroup;
const zoneGroup = useRef() as Types.RefGroup;
const currentLayerPoint = useRef([]) as Types.RefMeshArray; // Reference for points that re in the current layer used to update the points in drag controls. const currentLayerPoint = useRef([]) as Types.RefMeshArray; // Reference for points that re in the current layer used to update the points in drag controls.
const hoveredDeletablePoint = useRef() as Types.RefMesh; // Reference for the currently hovered point that can be deleted. const hoveredDeletablePoint = useRef() as Types.RefMesh; // Reference for the currently hovered point that can be deleted.
const hoveredDeletableLine = useRef() as Types.RefMesh; // Reference for the currently hovered line that can be deleted. const hoveredDeletableLine = useRef() as Types.RefMesh; // Reference for the currently hovered line that can be deleted.
@ -108,7 +94,6 @@ export default function Builder() {
const { activeLayer } = useActiveLayer(); // State that changes based on which layer the user chooses in Layers.jsx. const { activeLayer } = useActiveLayer(); // State that changes based on which layer the user chooses in Layers.jsx.
const { toggleView } = useToggleView(); // State for toggling between 2D and 3D. const { toggleView } = useToggleView(); // State for toggling between 2D and 3D.
const { toolMode, setToolMode } = useToolMode(); const { toolMode, setToolMode } = useToolMode();
const { setDeletePointOrLine } = useDeletePointOrLine();
const { setRoofVisibility } = useRoofVisibility(); const { setRoofVisibility } = useRoofVisibility();
const { setWallVisibility } = useWallVisibility(); const { setWallVisibility } = useWallVisibility();
const { setShadows } = useShadows(); const { setShadows } = useShadows();
@ -141,19 +126,13 @@ export default function Builder() {
); );
} else { } else {
setHoveredPoint(null); setHoveredPoint(null);
setToolMode(null); setToolMode('cursor');
setDeletePointOrLine(false);
loadWalls(lines, setWalls); loadWalls(lines, setWalls);
setUpdateScene(true); setUpdateScene(true);
line.current = []; line.current = [];
} }
}, [toggleView]); }, [toggleView]);
useEffect(() => {
THREE.Cache.clear();
THREE.Cache.enabled = true;
}, []);
useEffect(() => { useEffect(() => {
const email = localStorage.getItem("email"); const email = localStorage.getItem("email");
const organization = email!.split("@")[1].split(".")[0]; const organization = email!.split("@")[1].split(".")[0];
@ -180,12 +159,10 @@ export default function Builder() {
plane, plane,
cursorPosition, cursorPosition,
floorPlanGroupPoint, floorPlanGroupPoint,
floorPlanGroupLine,
snappedPoint, snappedPoint,
isSnapped, isSnapped,
isSnappedUUID, isSnappedUUID,
line, line,
lines,
ispreSnapped, ispreSnapped,
floorPlanGroup, floorPlanGroup,
ReferenceLineMesh, ReferenceLineMesh,
@ -219,16 +196,11 @@ export default function Builder() {
floorPlanGroup={floorPlanGroup} floorPlanGroup={floorPlanGroup}
lines={lines} lines={lines}
floorGroup={floorGroup} floorGroup={floorGroup}
floorGroupAisle={floorGroupAisle}
scene={scene} scene={scene}
onlyFloorlines={onlyFloorlines} onlyFloorlines={onlyFloorlines}
itemsGroup={itemsGroup}
isTempLoader={isTempLoader}
tempLoader={tempLoader}
currentLayerPoint={currentLayerPoint} currentLayerPoint={currentLayerPoint}
floorPlanGroupPoint={floorPlanGroupPoint} floorPlanGroupPoint={floorPlanGroupPoint}
floorPlanGroupLine={floorPlanGroupLine} floorPlanGroupLine={floorPlanGroupLine}
zoneGroup={zoneGroup}
dragPointControls={dragPointControls} dragPointControls={dragPointControls}
/> />
</Bvh> </Bvh>
@ -290,6 +262,7 @@ export default function Builder() {
<MeasurementTool /> <MeasurementTool />
<CalculateAreaGroup /> <CalculateAreaGroup />
<NavMesh lines={lines} /> <NavMesh lines={lines} />
<DxfFile <DxfFile

8
app/src/modules/builder/csg/csg.tsx
View File

@ -1,7 +1,7 @@
import * as THREE from "three"; import * as THREE from "three";
import { Geometry, Base, Subtraction } from "@react-three/csg"; import { Geometry, Base, Subtraction } from "@react-three/csg";
import { useDeleteTool } from "../../../store/builder/store";
import { useRef } from "react"; import { useRef } from "react";
import { useToolMode } from "../../../store/builder/store";
export interface CsgProps { export interface CsgProps {
position: THREE.Vector3 | [number, number, number]; position: THREE.Vector3 | [number, number, number];
@ -11,19 +11,19 @@ export interface CsgProps {
} }
export const Csg: React.FC<CsgProps> = (props) => { export const Csg: React.FC<CsgProps> = (props) => {
const { deleteTool } = useDeleteTool(); const { toolMode } = useToolMode();
const modelRef = useRef<THREE.Object3D>(); const modelRef = useRef<THREE.Object3D>();
const originalMaterials = useRef<Map<THREE.Mesh, THREE.Material>>(new Map()); const originalMaterials = useRef<Map<THREE.Mesh, THREE.Material>>(new Map());
const handleHover = (hovered: boolean, object: THREE.Mesh | null) => { const handleHover = (hovered: boolean, object: THREE.Mesh | null) => {
if (modelRef.current && deleteTool) { if (modelRef.current && toolMode === "3D-Delete") {
modelRef.current.traverse((child) => { modelRef.current.traverse((child) => {
if (child instanceof THREE.Mesh) { if (child instanceof THREE.Mesh) {
if (!originalMaterials.current.has(child)) { if (!originalMaterials.current.has(child)) {
originalMaterials.current.set(child, child.material); originalMaterials.current.set(child, child.material);
} }
child.material = child.material.clone(); child.material = child.material.clone();
child.material.color.set(hovered && deleteTool ? 0xff0000 : (originalMaterials.current.get(child) as any).color); child.material.color.set(hovered && toolMode === "3D-Delete" ? 0xff0000 : (originalMaterials.current.get(child) as any).color);
} }
}); });
} }

10
app/src/modules/builder/functions/draw.ts
View File

@ -7,12 +7,10 @@ async function Draw(
plane: Types.RefMesh, plane: Types.RefMesh,
cursorPosition: Types.Vector3, cursorPosition: Types.Vector3,
floorPlanGroupPoint: Types.RefGroup, floorPlanGroupPoint: Types.RefGroup,
floorPlanGroupLine: Types.RefGroup,
snappedPoint: Types.RefVector3, snappedPoint: Types.RefVector3,
isSnapped: Types.RefBoolean, isSnapped: Types.RefBoolean,
isSnappedUUID: Types.RefString, isSnappedUUID: Types.RefString,
line: Types.RefLine, line: Types.RefLine,
lines: Types.RefLines,
ispreSnapped: Types.RefBoolean, ispreSnapped: Types.RefBoolean,
floorPlanGroup: Types.RefGroup, floorPlanGroup: Types.RefGroup,
ReferenceLineMesh: Types.RefMesh, ReferenceLineMesh: Types.RefMesh,
@ -29,7 +27,7 @@ async function Draw(
if (!plane.current) return; if (!plane.current) return;
const intersects = state.raycaster.intersectObject(plane.current, true); const intersects = state.raycaster.intersectObject(plane.current, true);
if (intersects.length > 0 && (toolMode === "Wall" || toolMode === "Aisle" || toolMode === "Floor")) { if (intersects.length > 0 && (toolMode === "Wall" || toolMode === "Floor")) {
const intersectionPoint = intersects[0].point; const intersectionPoint = intersects[0].point;
cursorPosition.copy(intersectionPoint); cursorPosition.copy(intersectionPoint);
const snapThreshold = 1; const snapThreshold = 1;
@ -40,8 +38,7 @@ async function Draw(
const canSnap = const canSnap =
((toolMode === "Wall") && (pointType === CONSTANTS.lineConfig.wallName || pointType === CONSTANTS.lineConfig.floorName)) || ((toolMode === "Wall") && (pointType === CONSTANTS.lineConfig.wallName || pointType === CONSTANTS.lineConfig.floorName)) ||
((toolMode === "Floor") && (pointType === CONSTANTS.lineConfig.wallName || pointType === CONSTANTS.lineConfig.floorName)) || ((toolMode === "Floor") && (pointType === CONSTANTS.lineConfig.wallName || pointType === CONSTANTS.lineConfig.floorName))
((toolMode === "Aisle") && pointType === CONSTANTS.lineConfig.aisleName);;
if (canSnap && cursorPosition.distanceTo(point.position) < snapThreshold + 0.5 && point.visible) { if (canSnap && cursorPosition.distanceTo(point.position) < snapThreshold + 0.5 && point.visible) {
cursorPosition.copy(point.position); cursorPosition.copy(point.position);
@ -60,8 +57,7 @@ async function Draw(
let canSnap = let canSnap =
((toolMode === "Wall") && (pointType === CONSTANTS.lineConfig.wallName || pointType === CONSTANTS.lineConfig.floorName)) || ((toolMode === "Wall") && (pointType === CONSTANTS.lineConfig.wallName || pointType === CONSTANTS.lineConfig.floorName)) ||
((toolMode === "Floor") && (pointType === CONSTANTS.lineConfig.wallName || pointType === CONSTANTS.lineConfig.floorName)) || ((toolMode === "Floor") && (pointType === CONSTANTS.lineConfig.wallName || pointType === CONSTANTS.lineConfig.floorName))
((toolMode === "Aisle") && pointType === CONSTANTS.lineConfig.aisleName);
if (canSnap && cursorPosition.distanceTo(point.position) < snapThreshold && point.visible) { if (canSnap && cursorPosition.distanceTo(point.position) < snapThreshold && point.visible) {
cursorPosition.copy(point.position); cursorPosition.copy(point.position);

2
app/src/modules/builder/geomentries/lines/drawWall.ts
View File

@ -95,7 +95,6 @@ async function drawWall(
userId userId
} }
console.log('input: ', input);
socket.emit('v1:Line:create', input); socket.emit('v1:Line:create', input);
setNewLines([newLines[0], newLines[1], line.current]); setNewLines([newLines[0], newLines[1], line.current]);
@ -158,7 +157,6 @@ async function drawWall(
userId userId
} }
console.log('input: ', input);
socket.emit('v1:Line:create', input); socket.emit('v1:Line:create', input);
setNewLines([line.current]) setNewLines([line.current])

5
app/src/modules/builder/geomentries/walls/addWallItems.ts
View File

@ -91,7 +91,7 @@ async function AddWallItems(
type: selected.subCategory, type: selected.subCategory,
model: model, model: model,
modelName: selected.name, modelName: selected.name,
modelfileID: selected.id, assetId: selected.id,
scale: [1, 1, 1] as [number, number, number], scale: [1, 1, 1] as [number, number, number],
csgscale: csgscale, csgscale: csgscale,
csgposition: csgposition, csgposition: csgposition,
@ -107,7 +107,7 @@ async function AddWallItems(
organization: organization, organization: organization,
modelUuid: model.uuid, modelUuid: model.uuid,
modelName: newWallItem.modelName, modelName: newWallItem.modelName,
modelfileID: selected.id, assetId: selected.id,
type: selected.subCategory, type: selected.subCategory,
csgposition: newWallItem.csgposition, csgposition: newWallItem.csgposition,
csgscale: newWallItem.csgscale, csgscale: newWallItem.csgscale,
@ -119,7 +119,6 @@ async function AddWallItems(
userId userId
}; };
// console.log('data: ', data);
socket.emit('v1:wallItems:set', data); socket.emit('v1:wallItems:set', data);
setWallItems((prevItems) => { setWallItems((prevItems) => {

10
app/src/modules/builder/groups/floorGroup.tsx
View File

@ -1,12 +1,12 @@
import { useFrame, useThree } from "@react-three/fiber"; import { useFrame, useThree } from "@react-three/fiber";
import { import {
useAddAction, useAddAction,
useDeleteTool,
useRoofVisibility, useRoofVisibility,
useToggleView, useToggleView,
useWallVisibility, useWallVisibility,
useUpdateScene, useUpdateScene,
useRenameModeStore, useRenameModeStore,
useToolMode,
} from "../../../store/builder/store"; } from "../../../store/builder/store";
import hideRoof from "../geomentries/roofs/hideRoof"; import hideRoof from "../geomentries/roofs/hideRoof";
import hideWalls from "../geomentries/walls/hideWalls"; import hideWalls from "../geomentries/walls/hideWalls";
@ -30,7 +30,7 @@ const FloorGroup = ({
const { toggleView } = useToggleView(); const { toggleView } = useToggleView();
const { scene, camera, raycaster, gl } = useThree(); const { scene, camera, raycaster, gl } = useThree();
const { addAction } = useAddAction(); const { addAction } = useAddAction();
const { deleteTool } = useDeleteTool(); const { toolMode } = useToolMode();
const { updateScene, setUpdateScene } = useUpdateScene(); const { updateScene, setUpdateScene } = useUpdateScene();
const { setTop } = useTopData(); const { setTop } = useTopData();
const { setLeft } = useLeftData(); const { setLeft } = useLeftData();
@ -75,7 +75,7 @@ const FloorGroup = ({
if (addAction === "pillar") { if (addAction === "pillar") {
addPillar(referencePole, floorGroup); addPillar(referencePole, floorGroup);
} }
if (deleteTool) { if (toolMode === '3D-Delete') {
DeletePillar(hoveredDeletablePillar, floorGroup); DeletePillar(hoveredDeletablePillar, floorGroup);
} }
} }
@ -105,7 +105,7 @@ const FloorGroup = ({
canvasElement.removeEventListener("mouseup", onMouseUp); canvasElement.removeEventListener("mouseup", onMouseUp);
canvasElement.removeEventListener("mousemove", onMouseMove); canvasElement.removeEventListener("mousemove", onMouseMove);
}; };
}, [deleteTool, addAction, isRenameMode]); }, [toolMode, addAction, isRenameMode]);
useFrame(() => { useFrame(() => {
hideRoof(roofVisibility, floorGroup, camera); hideRoof(roofVisibility, floorGroup, camera);
@ -114,7 +114,7 @@ const FloorGroup = ({
if (addAction === "pillar") { if (addAction === "pillar") {
addAndUpdateReferencePillar(raycaster, floorGroup, referencePole); addAndUpdateReferencePillar(raycaster, floorGroup, referencePole);
} }
if (deleteTool) { if (toolMode === '3D-Delete') {
DeletableHoveredPillar(state, floorGroup, hoveredDeletablePillar); DeletableHoveredPillar(state, floorGroup, hoveredDeletablePillar);
} }
}); });

29
app/src/modules/builder/groups/floorPlanGroup.tsx
View File

@ -1,6 +1,6 @@
import { useEffect } from "react"; import { useEffect } from "react";
import * as Types from '../../../types/world/worldTypes'; import * as Types from '../../../types/world/worldTypes';
import { useActiveLayer, useDeletedLines, useDeletePointOrLine, useToolMode, useNewLines, useRemovedLayer, useSocketStore, useToggleView, useUpdateScene } from "../../../store/builder/store"; import { useActiveLayer, useDeletedLines, useToolMode, useNewLines, useRemovedLayer, useSocketStore, useToggleView, useUpdateScene } from "../../../store/builder/store";
import Layer2DVisibility from "../geomentries/layers/layer2DVisibility"; import Layer2DVisibility from "../geomentries/layers/layer2DVisibility";
import { useFrame, useThree } from "@react-three/fiber"; import { useFrame, useThree } from "@react-three/fiber";
import DeletableLineorPoint from "../functions/deletableLineOrPoint"; import DeletableLineorPoint from "../functions/deletableLineOrPoint";
@ -23,8 +23,7 @@ const FloorPlanGroup = ({ floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoin
const { camera, gl, raycaster, controls } = state; const { camera, gl, raycaster, controls } = state;
const { activeLayer } = useActiveLayer(); const { activeLayer } = useActiveLayer();
const { toggleView } = useToggleView(); const { toggleView } = useToggleView();
const { deletePointOrLine, setDeletePointOrLine } = useDeletePointOrLine(); const { toolMode } = useToolMode();
const { toolMode, setToolMode } = useToolMode();
const { removedLayer, setRemovedLayer } = useRemovedLayer(); const { removedLayer, setRemovedLayer } = useRemovedLayer();
const { setUpdateScene } = useUpdateScene(); const { setUpdateScene } = useUpdateScene();
const { setNewLines } = useNewLines(); const { setNewLines } = useNewLines();
@ -32,7 +31,6 @@ const FloorPlanGroup = ({ floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoin
const { socket } = useSocketStore(); const { socket } = useSocketStore();
const { projectId } = useParams(); const { projectId } = useParams();
useEffect(() => { useEffect(() => {
if (toolMode === 'move') { if (toolMode === 'move') {
addDragControl(dragPointControls, currentLayerPoint, state, floorPlanGroupPoint, floorPlanGroupLine, lines, onlyFloorlines, socket, projectId); addDragControl(dragPointControls, currentLayerPoint, state, floorPlanGroupPoint, floorPlanGroupLine, lines, onlyFloorlines, socket, projectId);
@ -74,17 +72,12 @@ const FloorPlanGroup = ({ floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoin
}, [toggleView]); }, [toggleView]);
useEffect(() => { useEffect(() => {
if (toolMode === "Wall" || toolMode === "Floor") { removeSoloPoint(line, floorPlanGroupLine, floorPlanGroupPoint);
setDeletePointOrLine(false); removeReferenceLine(floorPlanGroup, ReferenceLineMesh, LineCreated, line);
} else {
removeSoloPoint(line, floorPlanGroupLine, floorPlanGroupPoint);
removeReferenceLine(floorPlanGroup, ReferenceLineMesh, LineCreated, line);
}
}, [toolMode]); }, [toolMode]);
useEffect(() => { useEffect(() => {
if (toolMode === 'move' && toggleView) { if (toolMode === 'move' && toggleView) {
setDeletePointOrLine(false);
if (dragPointControls.current) { if (dragPointControls.current) {
dragPointControls.current.enabled = true; dragPointControls.current.enabled = true;
} }
@ -95,12 +88,6 @@ const FloorPlanGroup = ({ floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoin
} }
}, [toolMode, toggleView, state]); }, [toolMode, toggleView, state]);
useEffect(() => {
if (deletePointOrLine) {
setToolMode(null);
}
}, [deletePointOrLine]);
useEffect(() => { useEffect(() => {
Layer2DVisibility(activeLayer, floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoint, currentLayerPoint, dragPointControls); Layer2DVisibility(activeLayer, floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoint, currentLayerPoint, dragPointControls);
}, [activeLayer]); }, [activeLayer]);
@ -151,7 +138,7 @@ const FloorPlanGroup = ({ floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoin
const onMouseClick = (evt: any) => { const onMouseClick = (evt: any) => {
if (!plane.current || drag) return; if (!plane.current || drag) return;
if (deletePointOrLine) { if (toolMode === "2D-Delete") {
if (hoveredDeletablePoint.current !== null) { if (hoveredDeletablePoint.current !== null) {
deletePoint(hoveredDeletablePoint, onlyFloorlines, floorPlanGroupPoint, floorPlanGroupLine, lines, setDeletedLines, socket, projectId); deletePoint(hoveredDeletablePoint, onlyFloorlines, floorPlanGroupPoint, floorPlanGroupLine, lines, setDeletedLines, socket, projectId);
} }
@ -169,7 +156,7 @@ const FloorPlanGroup = ({ floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoin
} }
} }
if (deletePointOrLine || toolMode === "Wall" || toolMode === "Floor") { if (toolMode === "2D-Delete" || toolMode === "Wall" || toolMode === "Floor") {
canvasElement.addEventListener("mousedown", onMouseDown); canvasElement.addEventListener("mousedown", onMouseDown);
canvasElement.addEventListener("mouseup", onMouseUp); canvasElement.addEventListener("mouseup", onMouseUp);
canvasElement.addEventListener("mousemove", onMouseMove); canvasElement.addEventListener("mousemove", onMouseMove);
@ -184,11 +171,11 @@ const FloorPlanGroup = ({ floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoin
canvasElement.removeEventListener("click", onMouseClick); canvasElement.removeEventListener("click", onMouseClick);
canvasElement.removeEventListener("contextmenu", onContextMenu); canvasElement.removeEventListener("contextmenu", onContextMenu);
}; };
}, [deletePointOrLine, toolMode, activeLayer]) }, [toolMode, activeLayer])
useFrame(() => { useFrame(() => {
if (deletePointOrLine) { if (toolMode === '2D-Delete') {
DeletableLineorPoint(state, plane, floorPlanGroupLine, floorPlanGroupPoint, hoveredDeletableLine, hoveredDeletablePoint); DeletableLineorPoint(state, plane, floorPlanGroupLine, floorPlanGroupPoint, hoveredDeletableLine, hoveredDeletablePoint);
} }
}) })

26
app/src/modules/builder/groups/wallItemsGroup.tsx
View File

@ -1,13 +1,12 @@
import { useEffect } from "react"; import { useEffect } from "react";
import { import {
useDeleteTool,
useDeletePointOrLine,
useObjectPosition, useObjectPosition,
useObjectRotation, useObjectRotation,
useSelectedWallItem, useSelectedWallItem,
useSocketStore, useSocketStore,
useWallItems, useWallItems,
useSelectedItem, useSelectedItem,
useToolMode,
} from "../../../store/builder/store"; } from "../../../store/builder/store";
import { Csg } from "../csg/csg"; import { Csg } from "../csg/csg";
import * as Types from "../../../types/world/worldTypes"; import * as Types from "../../../types/world/worldTypes";
@ -31,11 +30,10 @@ const WallItemsGroup = ({
const state = useThree(); const state = useThree();
const { socket } = useSocketStore(); const { socket } = useSocketStore();
const { pointer, camera, raycaster } = state; const { pointer, camera, raycaster } = state;
const { deleteTool } = useDeleteTool(); const { toolMode } = useToolMode();
const { wallItems, setWallItems } = useWallItems(); const { wallItems, setWallItems } = useWallItems();
const { setObjectPosition } = useObjectPosition(); const { setObjectPosition } = useObjectPosition();
const { setObjectRotation } = useObjectRotation(); const { setObjectRotation } = useObjectRotation();
const { deletePointOrLine } = useDeletePointOrLine();
const { setSelectedWallItem } = useSelectedWallItem(); const { setSelectedWallItem } = useSelectedWallItem();
const { activeModule } = useModuleStore(); const { activeModule } = useModuleStore();
const { selectedItem } = useSelectedItem(); const { selectedItem } = useSelectedItem();
@ -43,7 +41,7 @@ const WallItemsGroup = ({
useEffect(() => { useEffect(() => {
// Load Wall Items from the backend // Load Wall Items from the backend
loadInitialWallItems(setWallItems,projectId); loadInitialWallItems(setWallItems, projectId);
}, []); }, []);
////////// Update the Position value changes in the selected item ////////// ////////// Update the Position value changes in the selected item //////////
@ -51,7 +49,7 @@ const WallItemsGroup = ({
useEffect(() => { useEffect(() => {
const canvasElement = state.gl.domElement; const canvasElement = state.gl.domElement;
function handlePointerMove(e: any) { function handlePointerMove(e: any) {
if (selectedItemsIndex !== null && !deletePointOrLine && e.buttons === 1) { if (selectedItemsIndex !== null && toolMode === 'cursor' && e.buttons === 1) {
const Raycaster = state.raycaster; const Raycaster = state.raycaster;
const intersects = Raycaster.intersectObjects(CSGGroup.current?.children[0].children!, true); const intersects = Raycaster.intersectObjects(CSGGroup.current?.children[0].children!, true);
const Object = intersects.find((child) => child.object.name.includes("WallRaycastReference")); const Object = intersects.find((child) => child.object.name.includes("WallRaycastReference"));
@ -123,7 +121,7 @@ const WallItemsGroup = ({
setTimeout(async () => { setTimeout(async () => {
const email = localStorage.getItem("email"); const email = localStorage.getItem("email");
const organization = email!.split("@")[1].split(".")[0]; const organization = email!.split("@")[1].split(".")[0];
const userId = localStorage.getItem("userId"); const userId = localStorage.getItem("userId");
//REST //REST
@ -132,7 +130,7 @@ const WallItemsGroup = ({
// organization, // organization,
// currentItem?.model?.uuid, // currentItem?.model?.uuid,
// currentItem.modelName, // currentItem.modelName,
// currentItem.modelfileID, // currentItem.assetId,
// currentItem.type!, // currentItem.type!,
// currentItem.csgposition!, // currentItem.csgposition!,
// currentItem.csgscale!, // currentItem.csgscale!,
@ -146,7 +144,7 @@ const WallItemsGroup = ({
const data = { const data = {
organization: organization, organization: organization,
modelUuid: currentItem.model?.uuid!, modelUuid: currentItem.model?.uuid!,
modelfileID: currentItem.modelfileID, assetId: currentItem.assetId,
modelName: currentItem.modelName!, modelName: currentItem.modelName!,
type: currentItem.type!, type: currentItem.type!,
csgposition: currentItem.csgposition!, csgposition: currentItem.csgposition!,
@ -191,12 +189,12 @@ const WallItemsGroup = ({
const onMouseUp = (evt: any) => { const onMouseUp = (evt: any) => {
if (evt.button === 0) { if (evt.button === 0) {
isLeftMouseDown = false; isLeftMouseDown = false;
if (!drag && deleteTool && activeModule === "builder") { if (!drag && toolMode === '3D-Delete' && activeModule === "builder") {
DeleteWallItems( DeleteWallItems(
hoveredDeletableWallItem, hoveredDeletableWallItem,
setWallItems, setWallItems,
wallItems, wallItems,
socket,projectId socket, projectId
); );
} }
} }
@ -248,10 +246,10 @@ const WallItemsGroup = ({
canvasElement.removeEventListener("drop", onDrop); canvasElement.removeEventListener("drop", onDrop);
canvasElement.removeEventListener("dragover", onDragOver); canvasElement.removeEventListener("dragover", onDragOver);
}; };
}, [deleteTool, wallItems, selectedItem, camera]); }, [toolMode, wallItems, selectedItem, camera]);
useEffect(() => { useEffect(() => {
if (deleteTool && activeModule === "builder") { if (toolMode && activeModule === "builder") {
handleMeshMissed( handleMeshMissed(
currentWallItem, currentWallItem,
setSelectedWallItem, setSelectedWallItem,
@ -260,7 +258,7 @@ const WallItemsGroup = ({
setSelectedWallItem(null); setSelectedWallItem(null);
setSelectedItemsIndex(null); setSelectedItemsIndex(null);
} }
}, [deleteTool]); }, [toolMode]);
return ( return (
<> <>

8
app/src/modules/builder/groups/wallsAndWallItems.tsx
View File

@ -1,8 +1,8 @@
import { Geometry } from "@react-three/csg"; import { Geometry } from "@react-three/csg";
import { import {
useDeleteTool,
useSelectedWallItem, useSelectedWallItem,
useToggleView, useToggleView,
useToolMode,
useWallItems, useWallItems,
useWalls, useWalls,
} from "../../../store/builder/store"; } from "../../../store/builder/store";
@ -23,7 +23,7 @@ const WallsAndWallItems = ({
const { walls } = useWalls(); const { walls } = useWalls();
const { wallItems } = useWallItems(); const { wallItems } = useWallItems();
const { toggleView } = useToggleView(); const { toggleView } = useToggleView();
const { deleteTool } = useDeleteTool(); const { toolMode } = useToolMode();
const { setSelectedWallItem } = useSelectedWallItem(); const { setSelectedWallItem } = useSelectedWallItem();
return ( return (
@ -34,7 +34,7 @@ const WallsAndWallItems = ({
receiveShadow receiveShadow
visible={!toggleView} visible={!toggleView}
onClick={(event) => { onClick={(event) => {
if (!deleteTool) { if (toolMode === "cursor") {
handleMeshDown( handleMeshDown(
event, event,
currentWallItem, currentWallItem,
@ -46,7 +46,7 @@ const WallsAndWallItems = ({
} }
}} }}
onPointerMissed={() => { onPointerMissed={() => {
if (!deleteTool) { if (toolMode === "cursor") {
handleMeshMissed( handleMeshMissed(
currentWallItem, currentWallItem,
setSelectedWallItem, setSelectedWallItem,

1289
app/src/modules/builder/groups/zoneGroup.tsx
View File

File diff suppressed because it is too large Load Diff

15
app/src/modules/builder/point/point.tsx
View File

@ -1,7 +1,7 @@
import * as THREE from 'three'; import * as THREE from 'three';
import * as Constants from '../../../types/world/worldConstants'; import * as Constants from '../../../types/world/worldConstants';
import { useRef, useState, useEffect, useMemo } from 'react'; import { useRef, useState, useEffect, useMemo } from 'react';
import { useDeletePointOrLine, useToolMode } from '../../../store/builder/store'; import { useToolMode } from '../../../store/builder/store';
import { DragControls } from '@react-three/drei'; import { DragControls } from '@react-three/drei';
import { useAisleStore } from '../../../store/builder/useAisleStore'; import { useAisleStore } from '../../../store/builder/useAisleStore';
import { useThree } from '@react-three/fiber'; import { useThree } from '@react-three/fiber';
@ -24,7 +24,6 @@ function Point({ point }: { readonly point: Point }) {
const { snapPosition } = useAislePointSnapping(point); const { snapPosition } = useAislePointSnapping(point);
const { checkSnapForAisle } = usePointSnapping({ uuid: point.pointUuid, pointType: point.pointType, position: point.position }); const { checkSnapForAisle } = usePointSnapping({ uuid: point.pointUuid, pointType: point.pointType, position: point.position });
const { hoveredPoint, setHoveredPoint } = useBuilderStore(); const { hoveredPoint, setHoveredPoint } = useBuilderStore();
const { deletePointOrLine } = useDeletePointOrLine();
const { projectId } = useParams(); const { projectId } = useParams();
const boxScale: [number, number, number] = Constants.pointConfig.boxScale; const boxScale: [number, number, number] = Constants.pointConfig.boxScale;
const colors = getColor(point); const colors = getColor(point);
@ -64,12 +63,12 @@ function Point({ point }: { readonly point: Point }) {
} }
useEffect(() => { useEffect(() => {
if (materialRef.current && (toolMode === 'move' || deletePointOrLine)) { if (materialRef.current && (toolMode === 'move' || toolMode === '2D-Delete')) {
let innerColor; let innerColor;
let outerColor; let outerColor;
if (isHovered) { if (isHovered) {
innerColor = deletePointOrLine ? colors.defaultDeleteColor : colors.defaultOuterColor; innerColor = toolMode === '2D-Delete' ? colors.defaultDeleteColor : colors.defaultOuterColor;
outerColor = deletePointOrLine ? colors.defaultDeleteColor : colors.defaultOuterColor; outerColor = toolMode === '2D-Delete' ? colors.defaultDeleteColor : colors.defaultOuterColor;
} else { } else {
innerColor = colors.defaultInnerColor; innerColor = colors.defaultInnerColor;
outerColor = colors.defaultOuterColor; outerColor = colors.defaultOuterColor;
@ -82,7 +81,7 @@ function Point({ point }: { readonly point: Point }) {
materialRef.current.uniforms.uOuterColor.value.set(colors.defaultOuterColor); materialRef.current.uniforms.uOuterColor.value.set(colors.defaultOuterColor);
materialRef.current.uniformsNeedUpdate = true; materialRef.current.uniformsNeedUpdate = true;
} }
}, [isHovered, colors.defaultInnerColor, colors.defaultOuterColor, colors.defaultDeleteColor, toolMode, deletePointOrLine]); }, [isHovered, colors.defaultInnerColor, colors.defaultOuterColor, colors.defaultDeleteColor, toolMode]);
const uniforms = useMemo(() => ({ const uniforms = useMemo(() => ({
uOuterColor: { value: new THREE.Color(colors.defaultOuterColor) }, uOuterColor: { value: new THREE.Color(colors.defaultOuterColor) },
@ -114,7 +113,7 @@ function Point({ point }: { readonly point: Point }) {
} }
const handleDragEnd = (point: Point) => { const handleDragEnd = (point: Point) => {
if (deletePointOrLine) return; if (toolMode === '2D-Delete') return;
if (point.pointType === 'Aisle') { if (point.pointType === 'Aisle') {
const updatedAisles = getAislesByPointId(point.pointUuid); const updatedAisles = getAislesByPointId(point.pointUuid);
if (updatedAisles.length > 0 && projectId) { if (updatedAisles.length > 0 && projectId) {
@ -128,7 +127,7 @@ function Point({ point }: { readonly point: Point }) {
} }
const handlePointClick = (point: Point) => { const handlePointClick = (point: Point) => {
if (deletePointOrLine) { if (toolMode === '2D-Delete') {
if (point.pointType === 'Aisle') { if (point.pointType === 'Aisle') {
const removedAisles = removeAislePoint(point.pointUuid); const removedAisles = removeAislePoint(point.pointUuid);
if (removedAisles.length > 0) { if (removedAisles.length > 0) {

33
app/src/modules/collaboration/socket/socketResponses.dev.tsx
View File

@ -40,16 +40,11 @@ export default function SocketResponses({
floorPlanGroup, floorPlanGroup,
lines, lines,
floorGroup, floorGroup,
floorGroupAisle,
scene, scene,
onlyFloorlines, onlyFloorlines,
itemsGroup,
isTempLoader,
tempLoader,
currentLayerPoint, currentLayerPoint,
floorPlanGroupPoint, floorPlanGroupPoint,
floorPlanGroupLine, floorPlanGroupLine,
zoneGroup,
dragPointControls, dragPointControls,
}: any) { }: any) {
const { socket } = useSocketStore(); const { socket } = useSocketStore();
@ -104,7 +99,7 @@ export default function SocketResponses({
const asset: Asset = { const asset: Asset = {
modelUuid: data.data.modelUuid, modelUuid: data.data.modelUuid,
modelName: data.data.modelName, modelName: data.data.modelName,
assetId: data.data.modelfileID, assetId: data.data.assetId,
position: data.data.position, position: data.data.position,
rotation: [data.data.rotation.x, data.data.rotation.y, data.data.rotation.z], rotation: [data.data.rotation.x, data.data.rotation.y, data.data.rotation.z],
isLocked: data.data.isLocked, isLocked: data.data.isLocked,
@ -125,7 +120,7 @@ export default function SocketResponses({
const asset: Asset = { const asset: Asset = {
modelUuid: data.data.modelUuid, modelUuid: data.data.modelUuid,
modelName: data.data.modelName, modelName: data.data.modelName,
assetId: data.data.modelfileID, assetId: data.data.assetId,
position: data.data.position, position: data.data.position,
rotation: [data.data.rotation.x, data.data.rotation.y, data.data.rotation.z], rotation: [data.data.rotation.x, data.data.rotation.y, data.data.rotation.z],
isLocked: data.data.isLocked, isLocked: data.data.isLocked,
@ -474,13 +469,14 @@ export default function SocketResponses({
let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_MARKETPLACE_URL}`; let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_MARKETPLACE_URL}`;
socket.on("v1:wallItem:Response:Delete", (data: any) => { socket.on("v1:wallItem:Response:Delete", (data: any) => {
// console.log('data: ', data);
if (socket.id === data.socketId) { if (socket.id === data.socketId) {
return; return;
} }
if (organization !== data.organization) { if (organization !== data.organization) {
return; return;
} }
if (data.message === "wallitem deleted") { if (data.message === "wall Item deleted successfully") {
const deletedUUID = data.data.modelUuid; const deletedUUID = data.data.modelUuid;
let WallItemsRef = wallItems; let WallItemsRef = wallItems;
const Items = WallItemsRef.filter((item: any) => item.model?.uuid !== deletedUUID); const Items = WallItemsRef.filter((item: any) => item.model?.uuid !== deletedUUID);
@ -504,6 +500,7 @@ export default function SocketResponses({
}); });
socket.on("v1:wallItems:Response:Update", (data: any) => { socket.on("v1:wallItems:Response:Update", (data: any) => {
// console.log('data: ', data);
// //
if (socket.id === data.socketId) { if (socket.id === data.socketId) {
return; return;
@ -511,7 +508,7 @@ export default function SocketResponses({
if (organization !== data.organization) { if (organization !== data.organization) {
return; return;
} }
if (data.message === "wallIitem created") { if (data.message === "wall Item created successfully") {
const loader = new GLTFLoader(); const loader = new GLTFLoader();
const dracoLoader = new DRACOLoader(); const dracoLoader = new DRACOLoader();
@ -519,20 +516,20 @@ export default function SocketResponses({
loader.setDRACOLoader(dracoLoader); loader.setDRACOLoader(dracoLoader);
// Check THREE.js cache first // Check THREE.js cache first
const cachedModel = THREE.Cache.get(data.data.modelfileID); const cachedModel = THREE.Cache.get(data.data.assetId);
if (cachedModel) { if (cachedModel) {
handleModelLoad(cachedModel); handleModelLoad(cachedModel);
return; return;
} }
// Check IndexedDB cache // Check IndexedDB cache
retrieveGLTF(data.data.modelfileID).then((cachedModelBlob) => { retrieveGLTF(data.data.assetId).then((cachedModelBlob) => {
if (cachedModelBlob) { if (cachedModelBlob) {
const blobUrl = URL.createObjectURL(cachedModelBlob); const blobUrl = URL.createObjectURL(cachedModelBlob);
loader.load(blobUrl, (gltf) => { loader.load(blobUrl, (gltf) => {
URL.revokeObjectURL(blobUrl); URL.revokeObjectURL(blobUrl);
THREE.Cache.remove(blobUrl); THREE.Cache.remove(blobUrl);
THREE.Cache.add(data.data.modelfileID, gltf); THREE.Cache.add(data.data.assetId, gltf);
handleModelLoad(gltf); handleModelLoad(gltf);
}); });
return; return;
@ -540,11 +537,11 @@ export default function SocketResponses({
}) })
// Load from backend if not in any cache // Load from backend if not in any cache
loader.load(`${url_Backend_dwinzo}/api/v2/AssetFile/${data.data.modelfileID}`, async (gltf) => { loader.load(`${url_Backend_dwinzo}/api/v2/AssetFile/${data.data.assetId}`, async (gltf) => {
try { try {
const modelBlob = await fetch(`${url_Backend_dwinzo}/api/v2/AssetFile/${data.data.modelfileID}`).then((res) => res.blob()); const modelBlob = await fetch(`${url_Backend_dwinzo}/api/v2/AssetFile/${data.data.assetId}`).then((res) => res.blob());
await storeGLTF(data.data.modelfileID, modelBlob); await storeGLTF(data.data.assetId, modelBlob);
THREE.Cache.add(data.data.modelfileID, gltf); THREE.Cache.add(data.data.assetId, gltf);
await handleModelLoad(gltf); await handleModelLoad(gltf);
} catch (error) { } catch (error) {
@ -567,7 +564,7 @@ export default function SocketResponses({
type: data.data.type, type: data.data.type,
model: model, model: model,
modelName: data.data.modelName, modelName: data.data.modelName,
modelfileID: data.data.modelfileID, assetId: data.data.assetId,
scale: data.data.scale, scale: data.data.scale,
csgscale: data.data.csgscale, csgscale: data.data.csgscale,
csgposition: data.data.csgposition, csgposition: data.data.csgposition,
@ -592,7 +589,7 @@ export default function SocketResponses({
}); });
} }
} else if (data.message === "wallIitem updated") { } else if (data.message === "Updated successfully") {
const updatedUUID = data.data.modelUuid; const updatedUUID = data.data.modelUuid;
setWallItems((prevItems: any) => { setWallItems((prevItems: any) => {

4
app/src/modules/market/CardsContainer.tsx
View File

@ -10,7 +10,7 @@ interface ModelData {
description: string; description: string;
filename: string; filename: string;
isArchieve: boolean; isArchieve: boolean;
modelfileID: string; assetId: string;
tags: string; tags: string;
thumbnail: string; thumbnail: string;
uploadDate: number; uploadDate: number;
@ -65,7 +65,7 @@ const CardsContainer: React.FC<ModelsProps> = ({ models }) => {
onSelectCard={handleCardSelect} onSelectCard={handleCardSelect}
AssetID={assetDetail.AssetID} AssetID={assetDetail.AssetID}
image={assetDetail.thumbnail} image={assetDetail.thumbnail}
modelUrl={assetDetail.modelfileID} modelUrl={assetDetail.assetId}
description={assetDetail.description} description={assetDetail.description}
/> />
</React.Fragment> </React.Fragment>

2
app/src/modules/market/FilterSearch.tsx
View File

@ -10,7 +10,7 @@ interface ModelData {
description: string; description: string;
filename: string; filename: string;
isArchieve: boolean; isArchieve: boolean;
modelfileID: string; assetId: string;
tags: string; tags: string;
thumbnail: string; thumbnail: string;
uploadDate: number; uploadDate: number;

2
app/src/modules/market/MarketPlace.tsx
View File

@ -10,7 +10,7 @@ interface ModelData {
description: string; description: string;
filename: string; filename: string;
isArchieve: boolean; isArchieve: boolean;
modelfileID: string; assetId: string;
tags: string; tags: string;
thumbnail: string; thumbnail: string;
uploadDate: number; uploadDate: number;

12
app/src/modules/scene/controls/selectionControls/copyPasteControls.tsx
View File

@ -158,7 +158,7 @@ const CopyPasteControls = ({
const newFloorItem: Types.FloorItemType = { const newFloorItem: Types.FloorItemType = {
modelUuid: THREE.MathUtils.generateUUID(), modelUuid: THREE.MathUtils.generateUUID(),
modelName: obj.userData.modelName, modelName: obj.userData.modelName,
modelfileID: obj.userData.assetId, assetId: obj.userData.assetId,
position: [worldPosition.x, worldPosition.y, worldPosition.z], position: [worldPosition.x, worldPosition.y, worldPosition.z],
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z, }, rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z, },
isLocked: false, isLocked: false,
@ -352,7 +352,7 @@ const CopyPasteControls = ({
organization, organization,
modelUuid: newFloorItem.modelUuid, modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName, modelName: newFloorItem.modelName,
modelfileID: newFloorItem.modelfileID, assetId: newFloorItem.assetId,
position: newFloorItem.position, position: newFloorItem.position,
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z }, rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
isLocked: false, isLocked: false,
@ -368,7 +368,7 @@ const CopyPasteControls = ({
obj.userData = { obj.userData = {
name: newFloorItem.modelName, name: newFloorItem.modelName,
modelId: newFloorItem.modelfileID, modelId: newFloorItem.assetId,
modelUuid: newFloorItem.modelUuid, modelUuid: newFloorItem.modelUuid,
eventData: JSON.parse(JSON.stringify(eventData)) eventData: JSON.parse(JSON.stringify(eventData))
}; };
@ -376,7 +376,7 @@ const CopyPasteControls = ({
const asset: Asset = { const asset: Asset = {
modelUuid: data.modelUuid, modelUuid: data.modelUuid,
modelName: data.modelName, modelName: data.modelName,
assetId: data.modelfileID, assetId: data.assetId,
position: data.position, position: data.position,
rotation: [data.rotation.x, data.rotation.y, data.rotation.z], rotation: [data.rotation.x, data.rotation.y, data.rotation.z],
isLocked: data.isLocked, isLocked: data.isLocked,
@ -409,7 +409,7 @@ const CopyPasteControls = ({
organization, organization,
modelUuid: newFloorItem.modelUuid, modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName, modelName: newFloorItem.modelName,
modelfileID: newFloorItem.modelfileID, assetId: newFloorItem.assetId,
position: newFloorItem.position, position: newFloorItem.position,
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z }, rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
isLocked: false, isLocked: false,
@ -425,7 +425,7 @@ const CopyPasteControls = ({
const asset: Asset = { const asset: Asset = {
modelUuid: data.modelUuid, modelUuid: data.modelUuid,
modelName: data.modelName, modelName: data.modelName,
assetId: data.modelfileID, assetId: data.assetId,
position: data.position, position: data.position,
rotation: [data.rotation.x, data.rotation.y, data.rotation.z], rotation: [data.rotation.x, data.rotation.y, data.rotation.z],
isLocked: data.isLocked, isLocked: data.isLocked,

10
app/src/modules/scene/controls/selectionControls/duplicationControls.tsx
View File

@ -133,7 +133,7 @@ const DuplicationControls = ({
const newFloorItem: Types.FloorItemType = { const newFloorItem: Types.FloorItemType = {
modelUuid: THREE.MathUtils.generateUUID(), modelUuid: THREE.MathUtils.generateUUID(),
modelName: obj.userData.modelName, modelName: obj.userData.modelName,
modelfileID: obj.userData.assetId, assetId: obj.userData.assetId,
position: [worldPosition.x, worldPosition.y, worldPosition.z], position: [worldPosition.x, worldPosition.y, worldPosition.z],
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z, }, rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z, },
isLocked: false, isLocked: false,
@ -327,7 +327,7 @@ const DuplicationControls = ({
organization, organization,
modelUuid: newFloorItem.modelUuid, modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName, modelName: newFloorItem.modelName,
modelfileID: newFloorItem.modelfileID, assetId: newFloorItem.assetId,
position: newFloorItem.position, position: newFloorItem.position,
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z }, rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
isLocked: false, isLocked: false,
@ -344,7 +344,7 @@ const DuplicationControls = ({
const asset: Asset = { const asset: Asset = {
modelUuid: data.modelUuid, modelUuid: data.modelUuid,
modelName: data.modelName, modelName: data.modelName,
assetId: data.modelfileID, assetId: data.assetId,
position: data.position, position: data.position,
rotation: [data.rotation.x, data.rotation.y, data.rotation.z], rotation: [data.rotation.x, data.rotation.y, data.rotation.z],
isLocked: data.isLocked, isLocked: data.isLocked,
@ -378,7 +378,7 @@ const DuplicationControls = ({
organization, organization,
modelUuid: newFloorItem.modelUuid, modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName, modelName: newFloorItem.modelName,
modelfileID: newFloorItem.modelfileID, assetId: newFloorItem.assetId,
position: newFloorItem.position, position: newFloorItem.position,
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z }, rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
isLocked: false, isLocked: false,
@ -394,7 +394,7 @@ const DuplicationControls = ({
const asset: Asset = { const asset: Asset = {
modelUuid: data.modelUuid, modelUuid: data.modelUuid,
modelName: data.modelName, modelName: data.modelName,
assetId: data.modelfileID, assetId: data.assetId,
position: data.position, position: data.position,
rotation: [data.rotation.x, data.rotation.y, data.rotation.z], rotation: [data.rotation.x, data.rotation.y, data.rotation.z],
isLocked: data.isLocked, isLocked: data.isLocked,

4
app/src/modules/scene/controls/selectionControls/moveControls.tsx
View File

@ -237,7 +237,7 @@ function MoveControls({
const newFloorItem: Types.FloorItemType = { const newFloorItem: Types.FloorItemType = {
modelUuid: obj.userData.modelUuid, modelUuid: obj.userData.modelUuid,
modelName: obj.userData.modelName, modelName: obj.userData.modelName,
modelfileID: obj.userData.assetId, assetId: obj.userData.assetId,
position: [worldPosition.x, worldPosition.y, worldPosition.z], position: [worldPosition.x, worldPosition.y, worldPosition.z],
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z }, rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
isLocked: false, isLocked: false,
@ -304,7 +304,7 @@ function MoveControls({
organization, organization,
modelUuid: newFloorItem.modelUuid, modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName, modelName: newFloorItem.modelName,
modelfileID: newFloorItem.modelfileID, assetId: newFloorItem.assetId,
position: newFloorItem.position, position: newFloorItem.position,
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z }, rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
isLocked: false, isLocked: false,

4
app/src/modules/scene/controls/selectionControls/rotateControls.tsx
View File

@ -203,7 +203,7 @@ function RotateControls({
const newFloorItem: Types.FloorItemType = { const newFloorItem: Types.FloorItemType = {
modelUuid: obj.userData.modelUuid, modelUuid: obj.userData.modelUuid,
modelName: obj.userData.modelName, modelName: obj.userData.modelName,
modelfileID: obj.userData.assetId, assetId: obj.userData.assetId,
position: [worldPosition.x, worldPosition.y, worldPosition.z], position: [worldPosition.x, worldPosition.y, worldPosition.z],
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z }, rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
isLocked: false, isLocked: false,
@ -263,7 +263,7 @@ function RotateControls({
organization, organization,
modelUuid: newFloorItem.modelUuid, modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName, modelName: newFloorItem.modelName,
modelfileID: newFloorItem.modelfileID, assetId: newFloorItem.assetId,
position: newFloorItem.position, position: newFloorItem.position,
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z }, rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
isLocked: false, isLocked: false,

7
app/src/modules/scene/controls/selectionControls/selectionControls.tsx
View File

@ -3,7 +3,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { SelectionBox } from "three/examples/jsm/interactive/SelectionBox"; import { SelectionBox } from "three/examples/jsm/interactive/SelectionBox";
import { SelectionHelper } from "./selectionHelper"; import { SelectionHelper } from "./selectionHelper";
import { useFrame, useThree } from "@react-three/fiber"; import { useFrame, useThree } from "@react-three/fiber";
import { useSelectedAssets, useSocketStore, useToggleView, } from "../../../../store/builder/store"; import { useSelectedAssets, useSocketStore, useToggleView, useToolMode, } from "../../../../store/builder/store";
import BoundingBox from "./boundingBoxHelper"; import BoundingBox from "./boundingBoxHelper";
// import { deleteFloorItem } from '../../../../services/factoryBuilder/assest/floorAsset/deleteFloorItemApi'; // import { deleteFloorItem } from '../../../../services/factoryBuilder/assest/floorAsset/deleteFloorItemApi';
import * as Types from "../../../../types/world/worldTypes"; import * as Types from "../../../../types/world/worldTypes";
@ -33,6 +33,7 @@ const SelectionControls: React.FC = () => {
const { socket } = useSocketStore(); const { socket } = useSocketStore();
const { removeAsset } = useAssetsStore(); const { removeAsset } = useAssetsStore();
const selectionBox = useMemo(() => new SelectionBox(camera, scene), [camera, scene]); const selectionBox = useMemo(() => new SelectionBox(camera, scene), [camera, scene]);
const { toolMode } = useToolMode();
const { projectId } = useParams(); const { projectId } = useParams();
const isDragging = useRef(false); const isDragging = useRef(false);
@ -173,7 +174,7 @@ const SelectionControls: React.FC = () => {
rightClickMoved.current = false; rightClickMoved.current = false;
}; };
if (!toggleView && activeModule === "builder") { if (!toggleView && activeModule === "builder" && toolMode === 'cursor') {
helper.enabled = true; helper.enabled = true;
canvasElement.addEventListener("pointermove", onPointerMove); canvasElement.addEventListener("pointermove", onPointerMove);
canvasElement.addEventListener("pointerup", onPointerUp); canvasElement.addEventListener("pointerup", onPointerUp);
@ -194,7 +195,7 @@ const SelectionControls: React.FC = () => {
helper.enabled = false; helper.enabled = false;
helper.dispose(); helper.dispose();
}; };
}, [camera, controls, scene, toggleView, selectedAssets, copiedObjects, pastedObjects, duplicatedObjects, movedObjects, socket, rotatedObjects, activeModule,]); }, [camera, controls, scene, toggleView, selectedAssets, copiedObjects, pastedObjects, duplicatedObjects, movedObjects, socket, rotatedObjects, activeModule, toolMode]);
useEffect(() => { useEffect(() => {
if (activeModule !== "builder") { if (activeModule !== "builder") {

2
app/src/modules/scene/controls/transformControls/transformControls.tsx
View File

@ -124,7 +124,7 @@ export default function TransformControl() {
organization, organization,
modelUuid: asset.modelUuid, modelUuid: asset.modelUuid,
modelName: asset.modelName, modelName: asset.modelName,
modelfileID: asset.assetId, assetId: asset.assetId,
position: [selectedFloorItem.position.x, 0, selectedFloorItem.position.z] as [number, number, number], position: [selectedFloorItem.position.x, 0, selectedFloorItem.position.z] as [number, number, number],
rotation: { x: selectedFloorItem.rotation.x, y: selectedFloorItem.rotation.y, z: selectedFloorItem.rotation.z }, rotation: { x: selectedFloorItem.rotation.x, y: selectedFloorItem.rotation.y, z: selectedFloorItem.rotation.z },
isLocked: false, isLocked: false,

8
app/src/modules/simulation/events/arrows/arrows.tsx
View File

@ -1,7 +1,7 @@
import * as THREE from "three"; import * as THREE from "three";
import { useMemo, useRef, useState } from "react"; import { useMemo, useRef, useState } from "react";
import { useThree } from "@react-three/fiber"; import { useThree } from "@react-three/fiber";
import { useDeleteTool } from "../../../../store/builder/store"; import { useToolMode } from "../../../../store/builder/store";
interface ConnectionLine { interface ConnectionLine {
id: string; id: string;
@ -14,7 +14,7 @@ export function Arrows({ connections }: { readonly connections: ConnectionLine[]
const [hoveredLineKey, setHoveredLineKey] = useState<string | null>(null); const [hoveredLineKey, setHoveredLineKey] = useState<string | null>(null);
const groupRef = useRef<THREE.Group>(null); const groupRef = useRef<THREE.Group>(null);
const { scene } = useThree(); const { scene } = useThree();
const { deleteTool } = useDeleteTool(); const { toolMode } = useToolMode();
const getWorldPositionFromScene = (uuid: string): THREE.Vector3 | null => { const getWorldPositionFromScene = (uuid: string): THREE.Vector3 | null => {
const obj = scene.getObjectByProperty("uuid", uuid); const obj = scene.getObjectByProperty("uuid", uuid);
@ -61,7 +61,7 @@ export function Arrows({ connections }: { readonly connections: ConnectionLine[]
onPointerOut={() => setHoveredLineKey(null)} onPointerOut={() => setHoveredLineKey(null)}
> >
<meshStandardMaterial <meshStandardMaterial
color={deleteTool && hoveredLineKey === key ? "red" : "#42a5f5"} color={toolMode === '2D-Delete' && hoveredLineKey === key ? "red" : "#42a5f5"}
/> />
</mesh> </mesh>
<mesh <mesh
@ -72,7 +72,7 @@ export function Arrows({ connections }: { readonly connections: ConnectionLine[]
onPointerOut={() => setHoveredLineKey(null)} onPointerOut={() => setHoveredLineKey(null)}
> >
<meshStandardMaterial <meshStandardMaterial
color={deleteTool && hoveredLineKey === key ? "red" : "#42a5f5"} color={toolMode === '2D-Delete' && hoveredLineKey === key ? "red" : "#42a5f5"}
/> />
</mesh> </mesh>
</group> </group>

43
app/src/modules/simulation/events/points/creator/pointsCreator.tsx
View File

@ -11,6 +11,7 @@ import { usePlayButtonStore } from "../../../../../store/usePlayButtonStore";
import { upsertProductOrEventApi } from "../../../../../services/simulation/products/UpsertProductOrEventApi"; import { upsertProductOrEventApi } from "../../../../../services/simulation/products/UpsertProductOrEventApi";
import { useProductContext } from "../../../products/productContext"; import { useProductContext } from "../../../products/productContext";
import { useParams } from "react-router-dom"; import { useParams } from "react-router-dom";
import { useToolMode } from "../../../../../store/builder/store";
function PointsCreator() { function PointsCreator() {
const { gl, raycaster, scene, pointer, camera } = useThree(); const { gl, raycaster, scene, pointer, camera } = useThree();
@ -26,7 +27,7 @@ function PointsCreator() {
const { selectedEventSphere, setSelectedEventSphere, clearSelectedEventSphere, } = useSelectedEventSphere(); const { selectedEventSphere, setSelectedEventSphere, clearSelectedEventSphere, } = useSelectedEventSphere();
const { setSelectedEventData, clearSelectedEventData } = useSelectedEventData(); const { setSelectedEventData, clearSelectedEventData } = useSelectedEventData();
const { isPlaying } = usePlayButtonStore(); const { isPlaying } = usePlayButtonStore();
const { toolMode } = useToolMode();
const { projectId } = useParams(); const { projectId } = useParams();
const updateBackend = ( const updateBackend = (
@ -204,9 +205,11 @@ function PointsCreator() {
ref={(el) => (sphereRefs.current[point.uuid] = el!)} ref={(el) => (sphereRefs.current[point.uuid] = el!)}
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();
setSelectedEventSphere( if (toolMode === 'cursor') {
sphereRefs.current[point.uuid] setSelectedEventSphere(
); sphereRefs.current[point.uuid]
);
}
}} }}
key={`${index}-${point.uuid}`} key={`${index}-${point.uuid}`}
position={new THREE.Vector3(...point.position)} position={new THREE.Vector3(...point.position)}
@ -235,9 +238,11 @@ function PointsCreator() {
ref={(el) => (sphereRefs.current[point.uuid] = el!)} ref={(el) => (sphereRefs.current[point.uuid] = el!)}
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();
setSelectedEventSphere( if (toolMode === 'cursor') {
sphereRefs.current[point.uuid] setSelectedEventSphere(
); sphereRefs.current[point.uuid]
);
}
}} }}
position={new THREE.Vector3(...point.position)} position={new THREE.Vector3(...point.position)}
userData={{ userData={{
@ -264,9 +269,11 @@ function PointsCreator() {
ref={(el) => (sphereRefs.current[point.uuid] = el!)} ref={(el) => (sphereRefs.current[point.uuid] = el!)}
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();
setSelectedEventSphere( if (toolMode === 'cursor') {
sphereRefs.current[point.uuid] setSelectedEventSphere(
); sphereRefs.current[point.uuid]
);
}
}} }}
position={new THREE.Vector3(...point.position)} position={new THREE.Vector3(...point.position)}
userData={{ userData={{
@ -293,9 +300,11 @@ function PointsCreator() {
ref={(el) => (sphereRefs.current[point.uuid] = el!)} ref={(el) => (sphereRefs.current[point.uuid] = el!)}
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();
setSelectedEventSphere( if (toolMode === 'cursor') {
sphereRefs.current[point.uuid] setSelectedEventSphere(
); sphereRefs.current[point.uuid]
);
}
}} }}
position={new THREE.Vector3(...point.position)} position={new THREE.Vector3(...point.position)}
userData={{ userData={{
@ -322,9 +331,11 @@ function PointsCreator() {
ref={(el) => (sphereRefs.current[point.uuid] = el!)} ref={(el) => (sphereRefs.current[point.uuid] = el!)}
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();
setSelectedEventSphere( if (toolMode === 'cursor') {
sphereRefs.current[point.uuid] setSelectedEventSphere(
); sphereRefs.current[point.uuid]
);
}
}} }}
position={new THREE.Vector3(...point.position)} position={new THREE.Vector3(...point.position)}
userData={{ userData={{

14
app/src/modules/simulation/events/triggerConnections/triggerConnector.tsx
View File

@ -8,11 +8,11 @@ import { useEventsStore } from "../../../../store/simulation/useEventsStore";
import { handleAddEventToProduct } from "../points/functions/handleAddEventToProduct"; import { handleAddEventToProduct } from "../points/functions/handleAddEventToProduct";
import { QuadraticBezierLine } from "@react-three/drei"; import { QuadraticBezierLine } from "@react-three/drei";
import { upsertProductOrEventApi } from "../../../../services/simulation/products/UpsertProductOrEventApi"; import { upsertProductOrEventApi } from "../../../../services/simulation/products/UpsertProductOrEventApi";
import { useDeleteTool } from "../../../../store/builder/store";
import { usePlayButtonStore } from "../../../../store/usePlayButtonStore"; import { usePlayButtonStore } from "../../../../store/usePlayButtonStore";
import { ArrowOnQuadraticBezier, Arrows } from "../arrows/arrows"; import { ArrowOnQuadraticBezier, Arrows } from "../arrows/arrows";
import { useProductContext } from "../../products/productContext"; import { useProductContext } from "../../products/productContext";
import { useParams } from "react-router-dom"; import { useParams } from "react-router-dom";
import { useToolMode } from "../../../../store/builder/store";
interface ConnectionLine { interface ConnectionLine {
id: string; id: string;
@ -32,7 +32,7 @@ function TriggerConnector() {
const groupRefs = useRef<Record<string, any>>({}); const groupRefs = useRef<Record<string, any>>({});
const [helperlineColor, setHelperLineColor] = useState<string>("red"); const [helperlineColor, setHelperLineColor] = useState<string>("red");
const [currentLine, setCurrentLine] = useState<{ start: THREE.Vector3; end: THREE.Vector3; mid: THREE.Vector3; } | null>(null); const [currentLine, setCurrentLine] = useState<{ start: THREE.Vector3; end: THREE.Vector3; mid: THREE.Vector3; } | null>(null);
const { deleteTool } = useDeleteTool(); const { toolMode } = useToolMode();
const { isPlaying } = usePlayButtonStore(); const { isPlaying } = usePlayButtonStore();
const { selectedAction } = useSelectedAction(); const { selectedAction } = useSelectedAction();
const { projectId } = useParams(); const { projectId } = useParams();
@ -344,7 +344,7 @@ function TriggerConnector() {
} }
}; };
if (subModule === 'mechanics' && !deleteTool && selectedAction.actionId && selectedAction.actionName) { if (subModule === 'mechanics' && toolMode === 'cursor' && selectedAction.actionId && selectedAction.actionName) {
canvasElement.addEventListener("mousedown", onMouseDown); canvasElement.addEventListener("mousedown", onMouseDown);
canvasElement.addEventListener("mouseup", onMouseUp); canvasElement.addEventListener("mouseup", onMouseUp);
canvasElement.addEventListener("mousemove", onMouseMove); canvasElement.addEventListener("mousemove", onMouseMove);
@ -360,7 +360,7 @@ function TriggerConnector() {
canvasElement.removeEventListener('contextmenu', handleRightClick); canvasElement.removeEventListener('contextmenu', handleRightClick);
}; };
}, [gl, subModule, selectedProduct, firstSelectedPoint, deleteTool, selectedAction]); }, [gl, subModule, selectedProduct, firstSelectedPoint, toolMode, selectedAction]);
useFrame(() => { useFrame(() => {
if (firstSelectedPoint) { if (firstSelectedPoint) {
@ -477,15 +477,15 @@ function TriggerConnector() {
start={startPoint.toArray()} start={startPoint.toArray()}
end={endPoint.toArray()} end={endPoint.toArray()}
mid={midPoint.toArray()} mid={midPoint.toArray()}
color={deleteTool && hoveredLineKey === connection.id ? "red" : "#42a5f5"} color={toolMode === '3D-Delete' && hoveredLineKey === connection.id ? "red" : "#42a5f5"}
lineWidth={4} lineWidth={4}
dashed={deleteTool && hoveredLineKey === connection.id ? false : true} dashed={toolMode === '3D-Delete' && hoveredLineKey === connection.id ? false : true}
dashSize={0.75} dashSize={0.75}
dashScale={20} dashScale={20}
onPointerOver={() => setHoveredLineKey(connection.id)} onPointerOver={() => setHoveredLineKey(connection.id)}
onPointerOut={() => setHoveredLineKey(null)} onPointerOut={() => setHoveredLineKey(null)}
onClick={() => { onClick={() => {
if (deleteTool) { if (toolMode === '3D-Delete') {
setHoveredLineKey(null); setHoveredLineKey(null);
setCurrentLine(null); setCurrentLine(null);
removeConnection(connection); removeConnection(connection);

18
app/src/modules/simulation/roboticArm/instances/armInstance/roboticArmInstance.tsx
View File

@ -46,7 +46,7 @@ function RoboticArmInstance({ armBot }: { readonly armBot: ArmBotStatus }) {
const animationFrameIdRef = useRef<number | null>(null); const animationFrameIdRef = useRef<number | null>(null);
const previousTimeRef = useRef<number | null>(null); const previousTimeRef = useRef<number | null>(null);
const lastRemoved = useRef<{ type: string, materialId: string } | null>(null); const lastRemoved = useRef<{ type: string, materialId: string, modelId: string } | null>(null);
function firstFrame() { function firstFrame() {
startTime = performance.now(); startTime = performance.now();
@ -73,7 +73,7 @@ function RoboticArmInstance({ armBot }: { readonly armBot: ArmBotStatus }) {
removeLastStorageMaterial(previousModel.modelUuid); removeLastStorageMaterial(previousModel.modelUuid);
updateCurrentLoad(previousModel.modelUuid, -1) updateCurrentLoad(previousModel.modelUuid, -1)
} }
lastRemoved.current = { type: previousModel.type, materialId: armBot.currentAction.materialId }; lastRemoved.current = { type: previousModel.type, materialId: armBot.currentAction.materialId, modelId: previousModel.modelUuid };
} else { } else {
setIsVisible(armBot.currentAction.materialId, false); setIsVisible(armBot.currentAction.materialId, false);
} }
@ -105,13 +105,13 @@ function RoboticArmInstance({ armBot }: { readonly armBot: ArmBotStatus }) {
removeCurrentAction(armBot.modelUuid) removeCurrentAction(armBot.modelUuid)
} }
if (lastRemoved.current) { // if (lastRemoved.current) {
if (lastRemoved.current.type === 'transfer') { // if (lastRemoved.current.type === 'transfer') {
setIsPaused(lastRemoved.current.materialId, true) // setIsPaused(lastRemoved.current.materialId, true)
} else { // } else {
setIsPaused(lastRemoved.current.materialId, false) // setIsPaused(lastRemoved.current.materialId, false)
} // }
} // }
} }
} }

1
app/src/modules/simulation/simulator/simulator.tsx
View File

@ -15,7 +15,6 @@ function Simulator() {
useEffect(() => { useEffect(() => {
if (!isPlaying || isReset || !selectedProduct.productUuid) return; if (!isPlaying || isReset || !selectedProduct.productUuid) return;
console.log('selectedProduct: ', selectedProduct);
const product = getProductById(selectedProduct.productUuid); const product = getProductById(selectedProduct.productUuid);
if (!product) return; if (!product) return;

1
app/src/modules/simulation/triggers/triggerHandler/useTriggerHandler.ts
View File

@ -604,6 +604,7 @@ export function useTriggerHandler() {
modelUuid: action.triggers[0]?.triggeredAsset?.triggeredModel.modelUuid, modelUuid: action.triggers[0]?.triggeredAsset?.triggeredModel.modelUuid,
pointUuid: action.triggers[0]?.triggeredAsset?.triggeredPoint?.pointUuid, pointUuid: action.triggers[0]?.triggeredAsset?.triggeredPoint?.pointUuid,
}) })
setIsPaused(material.materialId, false); // New
handleAction(action, material.materialId); handleAction(action, material.materialId);
} }
} else { } else {

2
app/src/modules/visualization/widgets/panel/Panel.tsx
View File

@ -340,4 +340,4 @@ const Panel: React.FC<PanelProps> = ({
); );
}; };
export default Panel; export default Panel;

2
app/src/services/factoryBuilder/assest/floorAsset/getFloorItemsApi.ts
View File

@ -1,6 +1,6 @@
let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`; let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
export const getFloorAssets = async (organization: string,projectId?:string) => { export const getFloorAssets = async (organization: string, projectId?: string) => {
try { try {
const response = await fetch( const response = await fetch(
`${url_Backend_dwinzo}/api/V1/floorAssets/${projectId}`, `${url_Backend_dwinzo}/api/V1/floorAssets/${projectId}`,

4
app/src/services/factoryBuilder/assest/floorAsset/setFloorItemApi.ts
View File

@ -4,7 +4,7 @@ export const setFloorItemApi = async (
modelUuid?: string, modelUuid?: string,
modelName?: string, modelName?: string,
projectId?: string, projectId?: string,
modelfileID?: string, assetId?: string,
position?: Object, position?: Object,
rotation?: Object, rotation?: Object,
isLocked?: boolean, isLocked?: boolean,
@ -18,7 +18,7 @@ export const setFloorItemApi = async (
projectId, projectId,
position, position,
rotation, rotation,
modelfileID, assetId,
isLocked, isLocked,
isVisible, isVisible,
}; };

1
app/src/services/factoryBuilder/assest/wallAsset/getWallItemsApi.ts
View File

@ -21,7 +21,6 @@ export const getWallItems = async (organization: string,projectId?:string) => {
} }
const result = await response.json(); const result = await response.json();
// console.log('result: ', result);
return result; return result;
} catch (error) { } catch (error) {
echo.error("Failed to get wall items"); echo.error("Failed to get wall items");

8
app/src/services/factoryBuilder/webWorkers/gltfLoaderWorker.js
View File

@ -13,14 +13,14 @@ onmessage = async (event) => {
const { floorItems } = event.data; const { floorItems } = event.data;
const uniqueItems = floorItems.filter((item, index, self) => const uniqueItems = floorItems.filter((item, index, self) =>
index === self.findIndex((t) => t.modelfileID === item.modelfileID) index === self.findIndex((t) => t.assetId === item.assetId)
); );
for (const item of uniqueItems) { for (const item of uniqueItems) {
if(item.modelfileID === null || item.modelfileID === undefined) { if(item.assetId === null || item.assetId === undefined) {
continue; // Skip items without a valid modelfileID continue; // Skip items without a valid assetId
} }
const modelID = item.modelfileID; const modelID = item.assetId;
const indexedDBModel = await retrieveGLTF(modelID); const indexedDBModel = await retrieveGLTF(modelID);
let modelBlob; let modelBlob;

19
app/src/store/builder/store.ts
View File

@ -197,10 +197,10 @@ export const useMenuVisible = create<any>((set: any) => ({
setMenuVisible: (x: any) => set(() => ({ menuVisible: x })), setMenuVisible: (x: any) => set(() => ({ menuVisible: x })),
})); }));
export const useDeleteTool = create<any>((set: any) => ({ // export const useDeleteTool = create<any>((set: any) => ({
deleteTool: false, // deleteTool: false,
setDeleteTool: (x: any) => set(() => ({ deleteTool: x })), // setDeleteTool: (x: any) => set(() => ({ deleteTool: x })),
})); // }));
export const useToolMode = create<any>((set: any) => ({ export const useToolMode = create<any>((set: any) => ({
toolMode: null, toolMode: null,
@ -222,10 +222,10 @@ export const useMovePoint = create<any>((set: any) => ({
setMovePoint: (x: any) => set(() => ({ movePoint: x })), setMovePoint: (x: any) => set(() => ({ movePoint: x })),
})); }));
export const useDeletePointOrLine = create<any>((set: any) => ({ // export const useDeletePointOrLine = create<any>((set: any) => ({
deletePointOrLine: false, // deletePointOrLine: false,
setDeletePointOrLine: (x: any) => set(() => ({ deletePointOrLine: x })), // setDeletePointOrLine: (x: any) => set(() => ({ deletePointOrLine: x })),
})); // }));
export const useWallItems = create<any>((set: any) => ({ export const useWallItems = create<any>((set: any) => ({
wallItems: [], wallItems: [],
@ -626,11 +626,12 @@ interface CompareStore {
} }
export const useCompareStore = create<CompareStore>((set) => ({ export const useCompareStore = create<CompareStore>((set) => ({
comparePopUp: true, comparePopUp: false,
setComparePopUp: (value) => set({ comparePopUp: value }), setComparePopUp: (value) => set({ comparePopUp: value }),
toggleComparePopUp: () => toggleComparePopUp: () =>
set((state) => ({ comparePopUp: !state.comparePopUp })), set((state) => ({ comparePopUp: !state.comparePopUp })),
})); }));
// Save state store // Save state store
interface SaveVersionStore { interface SaveVersionStore {
isVersionSaved: boolean; isVersionSaved: boolean;

17
app/src/styles/layout/compareLayout.scss
View File

@ -463,6 +463,7 @@
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
position: relative;
.layer-wrapper { .layer-wrapper {
display: flex; display: flex;
@ -472,6 +473,12 @@
justify-content: end; justify-content: end;
} }
} }
.chart {
width: 60%;
height: 70%;
position: absolute;
}
} }
.chart { .chart {
@ -484,6 +491,8 @@
} }
.cycle-time-container { .cycle-time-container {
position: relative;
.cycle-main { .cycle-main {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -519,6 +528,14 @@
} }
} }
} }
.chart {
position: absolute;
bottom: 0;
left: 10px;
width: 60%;
height: 80%;
}
} }
.overallDowntime-container { .overallDowntime-container {

4
app/src/styles/pages/dashboard.scss
View File

@ -144,7 +144,7 @@
&.active { &.active {
background: var(--background-color-button); background: var(--background-color-button);
color: var(--text-color); color: var(--text-button-color);
} }
} }
} }
@ -342,4 +342,4 @@
font-family: #{$font-roboto}; font-family: #{$font-roboto};
cursor: pointer; cursor: pointer;
} }
} }

4
app/src/types/world/worldTypes.d.ts vendored
View File

@ -193,7 +193,7 @@ export type FloorItemType = {
modelName: string; modelName: string;
position: [number, number, number]; position: [number, number, number];
rotation: { x: number; y: number; z: number }; rotation: { x: number; y: number; z: number };
modelfileID: string; assetId: string;
isLocked: boolean; isLocked: boolean;
isVisible: boolean; isVisible: boolean;
eventData?: { eventData?: {
@ -224,7 +224,7 @@ interface WallItem {
type: "fixed-move" | "free-move" | undefined; type: "fixed-move" | "free-move" | undefined;
model?: THREE.Group; model?: THREE.Group;
modelUuid?: string; modelUuid?: string;
modelfileID: string; assetId: string;
modelName?: string; modelName?: string;
scale?: [number, number, number]; scale?: [number, number, number];
csgscale?: [number, number, number]; csgscale?: [number, number, number];

4
app/src/utils/shortcutkeys/handleShortcutKeys.ts
View File

@ -5,7 +5,6 @@ import {
useActiveSubTool, useActiveSubTool,
useActiveTool, useActiveTool,
useAddAction, useAddAction,
useDeleteTool,
useRenameModeStore, useRenameModeStore,
useSaveVersion, useSaveVersion,
useSelectedFloorItem, useSelectedFloorItem,
@ -32,7 +31,6 @@ const KeyPressListener: React.FC = () => {
const { setToolMode } = useToolMode(); const { setToolMode } = useToolMode();
const { isPlaying, setIsPlaying } = usePlayButtonStore(); const { isPlaying, setIsPlaying } = usePlayButtonStore();
const { toggleView, setToggleView } = useToggleView(); const { toggleView, setToggleView } = useToggleView();
const { setDeleteTool } = useDeleteTool();
const { setAddAction } = useAddAction(); const { setAddAction } = useAddAction();
const { setSelectedWallItem } = useSelectedWallItem(); const { setSelectedWallItem } = useSelectedWallItem();
const { setActiveTool } = useActiveTool(); const { setActiveTool } = useActiveTool();
@ -60,7 +58,6 @@ const KeyPressListener: React.FC = () => {
}; };
const module = modules[keyCombination]; const module = modules[keyCombination];
if (module && !toggleView) { if (module && !toggleView) {
console.log("hi");
setActiveTool("cursor"); setActiveTool("cursor");
setActiveSubTool("cursor"); setActiveSubTool("cursor");
if (module === "market") setToggleUI(false, false); if (module === "market") setToggleUI(false, false);
@ -91,7 +88,6 @@ const KeyPressListener: React.FC = () => {
setToggleUI(toggleTo2D, toggleTo2D); setToggleUI(toggleTo2D, toggleTo2D);
if (toggleTo2D) { if (toggleTo2D) {
setSelectedWallItem(null); setSelectedWallItem(null);
setDeleteTool(false);
setAddAction(null); setAddAction(null);
} }
setActiveTool("cursor"); setActiveTool("cursor");