Merge branch 'v3' into v3-refactor
This commit is contained in:
commit
b56a54cb5a
|
@ -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 Dashboard from "./pages/Dashboard";
|
||||
import Project from "./pages/Project";
|
||||
|
@ -8,6 +9,11 @@ import { LoggerProvider } from "./components/ui/log/LoggerContext";
|
|||
|
||||
const App: React.FC = () => {
|
||||
|
||||
useEffect(() => {
|
||||
Cache.clear();
|
||||
Cache.enabled = true;
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<LoggerProvider>
|
||||
<Router>
|
||||
|
|
|
@ -137,6 +137,7 @@ const Simulations: React.FC = () => {
|
|||
}
|
||||
);
|
||||
}
|
||||
|
||||
}, [selectedProduct.productUuid, products]);
|
||||
|
||||
return (
|
||||
|
|
|
@ -22,8 +22,6 @@ import { useSelectedZoneStore } from "../../store/visualization/useZoneStore";
|
|||
import {
|
||||
useActiveTool,
|
||||
useAddAction,
|
||||
useDeleteTool,
|
||||
useDeletePointOrLine,
|
||||
useRefTextUpdate,
|
||||
useSelectedWallItem,
|
||||
useSocketStore,
|
||||
|
@ -32,7 +30,7 @@ import {
|
|||
useActiveSubTool,
|
||||
useShortcutStore,
|
||||
} from "../../store/builder/store";
|
||||
import {useToggleStore} from "../../store/useUIToggleStore";
|
||||
import { useToggleStore } from "../../store/useUIToggleStore";
|
||||
import {
|
||||
use3DWidget,
|
||||
useFloatingWidget,
|
||||
|
@ -72,8 +70,6 @@ const Tools: React.FC = () => {
|
|||
setActiveTool,
|
||||
setToolMode,
|
||||
setAddAction,
|
||||
setDeleteTool,
|
||||
setDeletePointOrLine,
|
||||
} = useStoreHooks();
|
||||
|
||||
const { setActiveSubTool, activeSubTool } = useActiveSubTool();
|
||||
|
@ -131,18 +127,14 @@ const Tools: React.FC = () => {
|
|||
|
||||
const resetTools = () => {
|
||||
setToolMode(null);
|
||||
setDeleteTool(false);
|
||||
setAddAction(null);
|
||||
setDeletePointOrLine(false);
|
||||
setRefTextUpdate((prev) => prev - 1);
|
||||
};
|
||||
|
||||
const updateToolBehavior = (tool: string, is2D: boolean) => {
|
||||
switch (tool) {
|
||||
case "cursor":
|
||||
if (toggleView) {
|
||||
setToolMode("move");
|
||||
}
|
||||
is2D ? setToolMode("move") : setToolMode("cursor");
|
||||
break;
|
||||
case "draw-wall":
|
||||
is2D && setToolMode("Wall");
|
||||
|
@ -160,10 +152,10 @@ const Tools: React.FC = () => {
|
|||
setToolMode("MeasurementScale");
|
||||
break;
|
||||
case "Add pillar":
|
||||
if (!is2D) setAddAction("pillar");
|
||||
if (!is2D) setAddAction("Pillar");
|
||||
break;
|
||||
case "delete":
|
||||
is2D ? setDeletePointOrLine(true) : setDeleteTool(true);
|
||||
is2D ? setToolMode('2D-Delete') : setToolMode('3D-Delete');
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
@ -175,7 +167,6 @@ const Tools: React.FC = () => {
|
|||
setToggleUI(toggleTo2D, toggleTo2D);
|
||||
if (toggleTo2D) {
|
||||
setSelectedWallItem(null);
|
||||
setDeleteTool(false);
|
||||
setAddAction(null);
|
||||
}
|
||||
setActiveTool("cursor");
|
||||
|
@ -410,9 +401,7 @@ const useStoreHooks = () => {
|
|||
return {
|
||||
...useActiveTool(),
|
||||
...useToolMode(),
|
||||
...useDeleteTool(),
|
||||
...useAddAction(),
|
||||
...useDeletePointOrLine(),
|
||||
...useRefTextUpdate(),
|
||||
};
|
||||
};
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import React, { useMemo } from "react";
|
||||
import PerformanceResult from "./result-card/PerformanceResult";
|
||||
import EnergyUsage from "./result-card/EnergyUsage";
|
||||
import { Bar, Line } from "react-chartjs-2";
|
||||
import { Bar, Line, Pie } from "react-chartjs-2";
|
||||
|
||||
const ComparisonResult = () => {
|
||||
const options = useMemo(
|
||||
|
@ -33,21 +33,22 @@ const ComparisonResult = () => {
|
|||
backgroundColor: [purpleDark, purpleLight],
|
||||
borderColor: [purpleDark, purpleLight],
|
||||
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"],
|
||||
datasets: [
|
||||
{
|
||||
label: "Cycle Time (sec)",
|
||||
data: [110, 110],
|
||||
backgroundColor: [purpleLight],
|
||||
borderColor: purpleDark,
|
||||
data: [120, 110],
|
||||
backgroundColor: [purpleDark, purpleLight],
|
||||
borderColor: "#fff",
|
||||
borderWidth: 2,
|
||||
tension: 0.4,
|
||||
fill: false,
|
||||
},
|
||||
],
|
||||
};
|
||||
|
@ -61,6 +62,8 @@ const ComparisonResult = () => {
|
|||
backgroundColor: [purpleDark, purpleLight],
|
||||
borderColor: [purpleDark, purpleLight],
|
||||
borderWidth: 1,
|
||||
borderRadius: 10,
|
||||
borderSkipped: false,
|
||||
},
|
||||
],
|
||||
};
|
||||
|
@ -74,6 +77,8 @@ const ComparisonResult = () => {
|
|||
backgroundColor: [purpleDark, purpleLight],
|
||||
borderColor: [purpleDark, purpleLight],
|
||||
borderWidth: 1,
|
||||
borderRadius: 10,
|
||||
borderSkipped: false,
|
||||
},
|
||||
],
|
||||
};
|
||||
|
@ -83,7 +88,6 @@ const ComparisonResult = () => {
|
|||
<div className="header">Performance Comparison</div>
|
||||
<div className="compare-result-wrapper">
|
||||
<EnergyUsage />
|
||||
|
||||
<div className="throughPutCard-container comparisionCard">
|
||||
<h4>Throughput (units/hr)</h4>
|
||||
<div className="layers-wrapper">
|
||||
|
@ -95,11 +99,11 @@ const ComparisonResult = () => {
|
|||
<div className="key">Layout 2</div>
|
||||
<div className="value">550/ hr</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="chart">
|
||||
<Bar data={throughputData} options={options} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="cycle-time-container comparisionCard">
|
||||
<div className="cycle-main">
|
||||
|
@ -122,7 +126,7 @@ const ComparisonResult = () => {
|
|||
</div>
|
||||
</div>
|
||||
<div className="chart">
|
||||
<Line data={cycleTimeData} options={options} />
|
||||
<Pie data={cycleTimePieData} options={options} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -7,7 +7,7 @@ import { retrieveGLTF, storeGLTF } from '../../../utils/indexDB/idbUtils';
|
|||
|
||||
async function loadInitialWallItems(
|
||||
setWallItems: Types.setWallItemSetState,
|
||||
projectId?:string
|
||||
projectId?: string
|
||||
): Promise<void> {
|
||||
try {
|
||||
const email = localStorage.getItem('email');
|
||||
|
@ -16,7 +16,7 @@ async function loadInitialWallItems(
|
|||
}
|
||||
|
||||
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}`;
|
||||
|
||||
|
@ -34,33 +34,33 @@ async function loadInitialWallItems(
|
|||
|
||||
const loadedWallItems = await Promise.all(items.map(async (item: Types.WallItem) => {
|
||||
// Check THREE.js cache first
|
||||
const cachedModel = THREE.Cache.get(item.modelfileID!);
|
||||
const cachedModel = THREE.Cache.get(item.assetId!);
|
||||
if (cachedModel) {
|
||||
return processModel(cachedModel, item);
|
||||
}
|
||||
|
||||
// Check IndexedDB cache
|
||||
const cachedModelBlob = await retrieveGLTF(item.modelfileID!);
|
||||
const cachedModelBlob = await retrieveGLTF(item.assetId!);
|
||||
if (cachedModelBlob) {
|
||||
const blobUrl = URL.createObjectURL(cachedModelBlob);
|
||||
return new Promise<Types.WallItem>((resolve) => {
|
||||
loader.load(blobUrl, (gltf) => {
|
||||
URL.revokeObjectURL(blobUrl);
|
||||
THREE.Cache.add(item.modelfileID!, gltf);
|
||||
THREE.Cache.add(item.assetId!, gltf);
|
||||
resolve(processModel(gltf, item));
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// 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) => {
|
||||
loader.load(modelUrl, async (gltf) => {
|
||||
try {
|
||||
// Cache the model
|
||||
const modelBlob = await fetch(modelUrl).then((res) => res.blob());
|
||||
await storeGLTF(item.modelfileID!, modelBlob);
|
||||
THREE.Cache.add(item.modelfileID!, gltf);
|
||||
await storeGLTF(item.assetId!, modelBlob);
|
||||
THREE.Cache.add(item.assetId!, gltf);
|
||||
resolve(processModel(gltf, item));
|
||||
} catch (error) {
|
||||
console.error('Failed to cache model:', error);
|
||||
|
@ -91,7 +91,7 @@ function processModel(gltf: GLTF, item: Types.WallItem): Types.WallItem {
|
|||
type: item.type,
|
||||
model: model,
|
||||
modelName: item.modelName,
|
||||
modelfileID: item.modelfileID,
|
||||
assetId: item.assetId,
|
||||
scale: item.scale,
|
||||
csgscale: item.csgscale,
|
||||
csgposition: item.csgposition,
|
||||
|
|
|
@ -63,7 +63,7 @@ function AssetsGroup({ floorGroup, plane }: { readonly floorGroup: RefGroup, rea
|
|||
|
||||
getFloorAssets(organization, projectId).then((data) => {
|
||||
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;
|
||||
if (totalAssets === 0) {
|
||||
updateLoadingProgress(100);
|
||||
|
@ -96,7 +96,7 @@ function AssetsGroup({ floorGroup, plane }: { readonly floorGroup: RefGroup, rea
|
|||
assets.push({
|
||||
modelUuid: item.modelUuid,
|
||||
modelName: item.modelName,
|
||||
assetId: item.modelfileID,
|
||||
assetId: item.assetId,
|
||||
position: item.position,
|
||||
rotation: [item.rotation.x, item.rotation.y, item.rotation.z],
|
||||
isLocked: item.isLocked,
|
||||
|
@ -236,7 +236,7 @@ function AssetsGroup({ floorGroup, plane }: { readonly floorGroup: RefGroup, rea
|
|||
assets.push({
|
||||
modelUuid: item.modelUuid,
|
||||
modelName: item.modelName,
|
||||
assetId: item.modelfileID,
|
||||
assetId: item.assetId,
|
||||
position: item.position,
|
||||
rotation: [item.rotation.x, item.rotation.y, item.rotation.z],
|
||||
isLocked: item.isLocked,
|
||||
|
|
|
@ -136,7 +136,7 @@ async function handleModelLoad(
|
|||
// organization,
|
||||
// newFloorItem.modelUuid,
|
||||
// newFloorItem.modelName,
|
||||
// newFloorItem.modelfileID,
|
||||
// newFloorItem.assetId,
|
||||
// newFloorItem.position,
|
||||
// { x: 0, y: 0, z: 0 },
|
||||
// false,
|
||||
|
@ -352,7 +352,7 @@ async function handleModelLoad(
|
|||
organization,
|
||||
modelUuid: newFloorItem.modelUuid,
|
||||
modelName: newFloorItem.modelName,
|
||||
modelfileID: newFloorItem.assetId,
|
||||
assetId: newFloorItem.assetId,
|
||||
position: newFloorItem.position,
|
||||
rotation: {
|
||||
x: model.rotation.x,
|
||||
|
@ -372,7 +372,7 @@ async function handleModelLoad(
|
|||
const asset: Asset = {
|
||||
modelUuid: completeData.modelUuid,
|
||||
modelName: completeData.modelName,
|
||||
assetId: completeData.modelfileID,
|
||||
assetId: completeData.assetId,
|
||||
position: completeData.position,
|
||||
rotation: [
|
||||
completeData.rotation.x,
|
||||
|
@ -392,7 +392,7 @@ async function handleModelLoad(
|
|||
organization,
|
||||
modelUuid: newFloorItem.modelUuid,
|
||||
modelName: newFloorItem.modelName,
|
||||
modelfileID: newFloorItem.assetId,
|
||||
assetId: newFloorItem.assetId,
|
||||
position: newFloorItem.position,
|
||||
rotation: {
|
||||
x: model.rotation.x,
|
||||
|
@ -411,7 +411,7 @@ async function handleModelLoad(
|
|||
const asset = {
|
||||
modelUuid: data.modelUuid,
|
||||
modelName: data.modelName,
|
||||
assetId: data.modelfileID,
|
||||
assetId: data.assetId,
|
||||
position: data.position,
|
||||
rotation: [data.rotation.x, data.rotation.y, data.rotation.z] as [number, number, number],
|
||||
isLocked: data.isLocked,
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
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 { GLTF, GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';
|
||||
import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader';
|
||||
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 { CameraControls } from '@react-three/drei';
|
||||
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 [boundingBox, setBoundingBox] = useState<THREE.Box3 | null>(null);
|
||||
const groupRef = useRef<THREE.Group>(null);
|
||||
const { toolMode } = useToolMode();
|
||||
const { projectId } = useParams();
|
||||
|
||||
useEffect(() => {
|
||||
setDeletableFloorItem(null);
|
||||
}, [activeModule, toolMode])
|
||||
|
||||
useEffect(() => {
|
||||
const loader = new GLTFLoader();
|
||||
const dracoLoader = new DRACOLoader();
|
||||
|
@ -191,21 +196,21 @@ function Model({ asset }: { readonly asset: Asset }) {
|
|||
}
|
||||
}
|
||||
|
||||
const handlePointerOver = (asset: Asset) => {
|
||||
if (activeTool === "delete") {
|
||||
const handlePointerOver = useCallback((asset: Asset) => {
|
||||
if (activeTool === "delete" && activeModule === 'builder') {
|
||||
if (deletableFloorItem && deletableFloorItem.uuid === asset.modelUuid) {
|
||||
return;
|
||||
} else {
|
||||
setDeletableFloorItem(groupRef.current);
|
||||
}
|
||||
}
|
||||
}
|
||||
}, [activeTool, activeModule, deletableFloorItem]);
|
||||
|
||||
const handlePointerOut = (asset: Asset) => {
|
||||
const handlePointerOut = useCallback((asset: Asset) => {
|
||||
if (activeTool === "delete" && deletableFloorItem && deletableFloorItem.uuid === asset.modelUuid) {
|
||||
setDeletableFloorItem(null);
|
||||
}
|
||||
}
|
||||
}, [activeTool, deletableFloorItem]);
|
||||
|
||||
const handleContextMenu = (asset: Asset, evt: ThreeEvent<MouseEvent>) => {
|
||||
if (activeTool === "cursor" && subModule === 'simulations') {
|
||||
|
@ -247,6 +252,7 @@ function Model({ asset }: { readonly asset: Asset }) {
|
|||
|
||||
return (
|
||||
<group
|
||||
key={asset.modelUuid}
|
||||
name='Asset Model'
|
||||
ref={groupRef}
|
||||
uuid={asset.modelUuid}
|
||||
|
@ -266,7 +272,7 @@ function Model({ asset }: { readonly asset: Asset }) {
|
|||
handleClick(asset);
|
||||
}
|
||||
}}
|
||||
onPointerOver={(e) => {
|
||||
onPointerEnter={(e) => {
|
||||
if (!toggleView) {
|
||||
e.stopPropagation();
|
||||
handlePointerOver(asset);
|
||||
|
|
|
@ -13,7 +13,6 @@ import ReferenceDistanceText from "./geomentries/lines/distanceText/referenceDis
|
|||
|
||||
import {
|
||||
useToggleView,
|
||||
useDeletePointOrLine,
|
||||
useActiveLayer,
|
||||
useWallVisibility,
|
||||
useRoofVisibility,
|
||||
|
@ -58,18 +57,10 @@ export default function Builder() {
|
|||
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 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.
|
||||
|
||||
// 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 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.
|
||||
|
@ -78,8 +69,6 @@ export default function Builder() {
|
|||
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 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 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.
|
||||
|
@ -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 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 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 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 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 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.
|
||||
|
@ -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 { toggleView } = useToggleView(); // State for toggling between 2D and 3D.
|
||||
const { toolMode, setToolMode } = useToolMode();
|
||||
const { setDeletePointOrLine } = useDeletePointOrLine();
|
||||
const { setRoofVisibility } = useRoofVisibility();
|
||||
const { setWallVisibility } = useWallVisibility();
|
||||
const { setShadows } = useShadows();
|
||||
|
@ -141,19 +126,13 @@ export default function Builder() {
|
|||
);
|
||||
} else {
|
||||
setHoveredPoint(null);
|
||||
setToolMode(null);
|
||||
setDeletePointOrLine(false);
|
||||
setToolMode('cursor');
|
||||
loadWalls(lines, setWalls);
|
||||
setUpdateScene(true);
|
||||
line.current = [];
|
||||
}
|
||||
}, [toggleView]);
|
||||
|
||||
useEffect(() => {
|
||||
THREE.Cache.clear();
|
||||
THREE.Cache.enabled = true;
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
const email = localStorage.getItem("email");
|
||||
const organization = email!.split("@")[1].split(".")[0];
|
||||
|
@ -180,12 +159,10 @@ export default function Builder() {
|
|||
plane,
|
||||
cursorPosition,
|
||||
floorPlanGroupPoint,
|
||||
floorPlanGroupLine,
|
||||
snappedPoint,
|
||||
isSnapped,
|
||||
isSnappedUUID,
|
||||
line,
|
||||
lines,
|
||||
ispreSnapped,
|
||||
floorPlanGroup,
|
||||
ReferenceLineMesh,
|
||||
|
@ -219,16 +196,11 @@ export default function Builder() {
|
|||
floorPlanGroup={floorPlanGroup}
|
||||
lines={lines}
|
||||
floorGroup={floorGroup}
|
||||
floorGroupAisle={floorGroupAisle}
|
||||
scene={scene}
|
||||
onlyFloorlines={onlyFloorlines}
|
||||
itemsGroup={itemsGroup}
|
||||
isTempLoader={isTempLoader}
|
||||
tempLoader={tempLoader}
|
||||
currentLayerPoint={currentLayerPoint}
|
||||
floorPlanGroupPoint={floorPlanGroupPoint}
|
||||
floorPlanGroupLine={floorPlanGroupLine}
|
||||
zoneGroup={zoneGroup}
|
||||
dragPointControls={dragPointControls}
|
||||
/>
|
||||
</Bvh>
|
||||
|
@ -290,6 +262,7 @@ export default function Builder() {
|
|||
<MeasurementTool />
|
||||
|
||||
<CalculateAreaGroup />
|
||||
|
||||
<NavMesh lines={lines} />
|
||||
|
||||
<DxfFile
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import * as THREE from "three";
|
||||
import { Geometry, Base, Subtraction } from "@react-three/csg";
|
||||
import { useDeleteTool } from "../../../store/builder/store";
|
||||
import { useRef } from "react";
|
||||
import { useToolMode } from "../../../store/builder/store";
|
||||
|
||||
export interface CsgProps {
|
||||
position: THREE.Vector3 | [number, number, number];
|
||||
|
@ -11,19 +11,19 @@ export interface CsgProps {
|
|||
}
|
||||
|
||||
export const Csg: React.FC<CsgProps> = (props) => {
|
||||
const { deleteTool } = useDeleteTool();
|
||||
const { toolMode } = useToolMode();
|
||||
const modelRef = useRef<THREE.Object3D>();
|
||||
const originalMaterials = useRef<Map<THREE.Mesh, THREE.Material>>(new Map());
|
||||
|
||||
const handleHover = (hovered: boolean, object: THREE.Mesh | null) => {
|
||||
if (modelRef.current && deleteTool) {
|
||||
if (modelRef.current && toolMode === "3D-Delete") {
|
||||
modelRef.current.traverse((child) => {
|
||||
if (child instanceof THREE.Mesh) {
|
||||
if (!originalMaterials.current.has(child)) {
|
||||
originalMaterials.current.set(child, child.material);
|
||||
}
|
||||
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);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
|
@ -7,12 +7,10 @@ async function Draw(
|
|||
plane: Types.RefMesh,
|
||||
cursorPosition: Types.Vector3,
|
||||
floorPlanGroupPoint: Types.RefGroup,
|
||||
floorPlanGroupLine: Types.RefGroup,
|
||||
snappedPoint: Types.RefVector3,
|
||||
isSnapped: Types.RefBoolean,
|
||||
isSnappedUUID: Types.RefString,
|
||||
line: Types.RefLine,
|
||||
lines: Types.RefLines,
|
||||
ispreSnapped: Types.RefBoolean,
|
||||
floorPlanGroup: Types.RefGroup,
|
||||
ReferenceLineMesh: Types.RefMesh,
|
||||
|
@ -29,7 +27,7 @@ async function Draw(
|
|||
if (!plane.current) return;
|
||||
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;
|
||||
cursorPosition.copy(intersectionPoint);
|
||||
const snapThreshold = 1;
|
||||
|
@ -40,8 +38,7 @@ async function Draw(
|
|||
|
||||
const canSnap =
|
||||
((toolMode === "Wall") && (pointType === CONSTANTS.lineConfig.wallName || pointType === CONSTANTS.lineConfig.floorName)) ||
|
||||
((toolMode === "Floor") && (pointType === CONSTANTS.lineConfig.wallName || pointType === CONSTANTS.lineConfig.floorName)) ||
|
||||
((toolMode === "Aisle") && pointType === CONSTANTS.lineConfig.aisleName);;
|
||||
((toolMode === "Floor") && (pointType === CONSTANTS.lineConfig.wallName || pointType === CONSTANTS.lineConfig.floorName))
|
||||
|
||||
if (canSnap && cursorPosition.distanceTo(point.position) < snapThreshold + 0.5 && point.visible) {
|
||||
cursorPosition.copy(point.position);
|
||||
|
@ -60,8 +57,7 @@ async function Draw(
|
|||
|
||||
let canSnap =
|
||||
((toolMode === "Wall") && (pointType === CONSTANTS.lineConfig.wallName || pointType === CONSTANTS.lineConfig.floorName)) ||
|
||||
((toolMode === "Floor") && (pointType === CONSTANTS.lineConfig.wallName || pointType === CONSTANTS.lineConfig.floorName)) ||
|
||||
((toolMode === "Aisle") && pointType === CONSTANTS.lineConfig.aisleName);
|
||||
((toolMode === "Floor") && (pointType === CONSTANTS.lineConfig.wallName || pointType === CONSTANTS.lineConfig.floorName))
|
||||
|
||||
if (canSnap && cursorPosition.distanceTo(point.position) < snapThreshold && point.visible) {
|
||||
cursorPosition.copy(point.position);
|
||||
|
|
|
@ -95,7 +95,6 @@ async function drawWall(
|
|||
userId
|
||||
}
|
||||
|
||||
console.log('input: ', input);
|
||||
socket.emit('v1:Line:create', input);
|
||||
|
||||
setNewLines([newLines[0], newLines[1], line.current]);
|
||||
|
@ -158,7 +157,6 @@ async function drawWall(
|
|||
userId
|
||||
}
|
||||
|
||||
console.log('input: ', input);
|
||||
socket.emit('v1:Line:create', input);
|
||||
|
||||
setNewLines([line.current])
|
||||
|
|
|
@ -91,7 +91,7 @@ async function AddWallItems(
|
|||
type: selected.subCategory,
|
||||
model: model,
|
||||
modelName: selected.name,
|
||||
modelfileID: selected.id,
|
||||
assetId: selected.id,
|
||||
scale: [1, 1, 1] as [number, number, number],
|
||||
csgscale: csgscale,
|
||||
csgposition: csgposition,
|
||||
|
@ -107,7 +107,7 @@ async function AddWallItems(
|
|||
organization: organization,
|
||||
modelUuid: model.uuid,
|
||||
modelName: newWallItem.modelName,
|
||||
modelfileID: selected.id,
|
||||
assetId: selected.id,
|
||||
type: selected.subCategory,
|
||||
csgposition: newWallItem.csgposition,
|
||||
csgscale: newWallItem.csgscale,
|
||||
|
@ -119,7 +119,6 @@ async function AddWallItems(
|
|||
userId
|
||||
};
|
||||
|
||||
// console.log('data: ', data);
|
||||
socket.emit('v1:wallItems:set', data);
|
||||
|
||||
setWallItems((prevItems) => {
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
import { useFrame, useThree } from "@react-three/fiber";
|
||||
import {
|
||||
useAddAction,
|
||||
useDeleteTool,
|
||||
useRoofVisibility,
|
||||
useToggleView,
|
||||
useWallVisibility,
|
||||
useUpdateScene,
|
||||
useRenameModeStore,
|
||||
useToolMode,
|
||||
} from "../../../store/builder/store";
|
||||
import hideRoof from "../geomentries/roofs/hideRoof";
|
||||
import hideWalls from "../geomentries/walls/hideWalls";
|
||||
|
@ -30,7 +30,7 @@ const FloorGroup = ({
|
|||
const { toggleView } = useToggleView();
|
||||
const { scene, camera, raycaster, gl } = useThree();
|
||||
const { addAction } = useAddAction();
|
||||
const { deleteTool } = useDeleteTool();
|
||||
const { toolMode } = useToolMode();
|
||||
const { updateScene, setUpdateScene } = useUpdateScene();
|
||||
const { setTop } = useTopData();
|
||||
const { setLeft } = useLeftData();
|
||||
|
@ -75,7 +75,7 @@ const FloorGroup = ({
|
|||
if (addAction === "pillar") {
|
||||
addPillar(referencePole, floorGroup);
|
||||
}
|
||||
if (deleteTool) {
|
||||
if (toolMode === '3D-Delete') {
|
||||
DeletePillar(hoveredDeletablePillar, floorGroup);
|
||||
}
|
||||
}
|
||||
|
@ -105,7 +105,7 @@ const FloorGroup = ({
|
|||
canvasElement.removeEventListener("mouseup", onMouseUp);
|
||||
canvasElement.removeEventListener("mousemove", onMouseMove);
|
||||
};
|
||||
}, [deleteTool, addAction, isRenameMode]);
|
||||
}, [toolMode, addAction, isRenameMode]);
|
||||
|
||||
useFrame(() => {
|
||||
hideRoof(roofVisibility, floorGroup, camera);
|
||||
|
@ -114,7 +114,7 @@ const FloorGroup = ({
|
|||
if (addAction === "pillar") {
|
||||
addAndUpdateReferencePillar(raycaster, floorGroup, referencePole);
|
||||
}
|
||||
if (deleteTool) {
|
||||
if (toolMode === '3D-Delete') {
|
||||
DeletableHoveredPillar(state, floorGroup, hoveredDeletablePillar);
|
||||
}
|
||||
});
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import { useEffect } from "react";
|
||||
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 { useFrame, useThree } from "@react-three/fiber";
|
||||
import DeletableLineorPoint from "../functions/deletableLineOrPoint";
|
||||
|
@ -23,8 +23,7 @@ const FloorPlanGroup = ({ floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoin
|
|||
const { camera, gl, raycaster, controls } = state;
|
||||
const { activeLayer } = useActiveLayer();
|
||||
const { toggleView } = useToggleView();
|
||||
const { deletePointOrLine, setDeletePointOrLine } = useDeletePointOrLine();
|
||||
const { toolMode, setToolMode } = useToolMode();
|
||||
const { toolMode } = useToolMode();
|
||||
const { removedLayer, setRemovedLayer } = useRemovedLayer();
|
||||
const { setUpdateScene } = useUpdateScene();
|
||||
const { setNewLines } = useNewLines();
|
||||
|
@ -32,7 +31,6 @@ const FloorPlanGroup = ({ floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoin
|
|||
const { socket } = useSocketStore();
|
||||
const { projectId } = useParams();
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
if (toolMode === 'move') {
|
||||
addDragControl(dragPointControls, currentLayerPoint, state, floorPlanGroupPoint, floorPlanGroupLine, lines, onlyFloorlines, socket, projectId);
|
||||
|
@ -74,17 +72,12 @@ const FloorPlanGroup = ({ floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoin
|
|||
}, [toggleView]);
|
||||
|
||||
useEffect(() => {
|
||||
if (toolMode === "Wall" || toolMode === "Floor") {
|
||||
setDeletePointOrLine(false);
|
||||
} else {
|
||||
removeSoloPoint(line, floorPlanGroupLine, floorPlanGroupPoint);
|
||||
removeReferenceLine(floorPlanGroup, ReferenceLineMesh, LineCreated, line);
|
||||
}
|
||||
}, [toolMode]);
|
||||
|
||||
useEffect(() => {
|
||||
if (toolMode === 'move' && toggleView) {
|
||||
setDeletePointOrLine(false);
|
||||
if (dragPointControls.current) {
|
||||
dragPointControls.current.enabled = true;
|
||||
}
|
||||
|
@ -95,12 +88,6 @@ const FloorPlanGroup = ({ floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoin
|
|||
}
|
||||
}, [toolMode, toggleView, state]);
|
||||
|
||||
useEffect(() => {
|
||||
if (deletePointOrLine) {
|
||||
setToolMode(null);
|
||||
}
|
||||
}, [deletePointOrLine]);
|
||||
|
||||
useEffect(() => {
|
||||
Layer2DVisibility(activeLayer, floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoint, currentLayerPoint, dragPointControls);
|
||||
}, [activeLayer]);
|
||||
|
@ -151,7 +138,7 @@ const FloorPlanGroup = ({ floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoin
|
|||
const onMouseClick = (evt: any) => {
|
||||
if (!plane.current || drag) return;
|
||||
|
||||
if (deletePointOrLine) {
|
||||
if (toolMode === "2D-Delete") {
|
||||
if (hoveredDeletablePoint.current !== null) {
|
||||
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("mouseup", onMouseUp);
|
||||
canvasElement.addEventListener("mousemove", onMouseMove);
|
||||
|
@ -184,11 +171,11 @@ const FloorPlanGroup = ({ floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoin
|
|||
canvasElement.removeEventListener("click", onMouseClick);
|
||||
canvasElement.removeEventListener("contextmenu", onContextMenu);
|
||||
};
|
||||
}, [deletePointOrLine, toolMode, activeLayer])
|
||||
}, [toolMode, activeLayer])
|
||||
|
||||
|
||||
useFrame(() => {
|
||||
if (deletePointOrLine) {
|
||||
if (toolMode === '2D-Delete') {
|
||||
DeletableLineorPoint(state, plane, floorPlanGroupLine, floorPlanGroupPoint, hoveredDeletableLine, hoveredDeletablePoint);
|
||||
}
|
||||
})
|
||||
|
|
|
@ -1,13 +1,12 @@
|
|||
import { useEffect } from "react";
|
||||
import {
|
||||
useDeleteTool,
|
||||
useDeletePointOrLine,
|
||||
useObjectPosition,
|
||||
useObjectRotation,
|
||||
useSelectedWallItem,
|
||||
useSocketStore,
|
||||
useWallItems,
|
||||
useSelectedItem,
|
||||
useToolMode,
|
||||
} from "../../../store/builder/store";
|
||||
import { Csg } from "../csg/csg";
|
||||
import * as Types from "../../../types/world/worldTypes";
|
||||
|
@ -31,11 +30,10 @@ const WallItemsGroup = ({
|
|||
const state = useThree();
|
||||
const { socket } = useSocketStore();
|
||||
const { pointer, camera, raycaster } = state;
|
||||
const { deleteTool } = useDeleteTool();
|
||||
const { toolMode } = useToolMode();
|
||||
const { wallItems, setWallItems } = useWallItems();
|
||||
const { setObjectPosition } = useObjectPosition();
|
||||
const { setObjectRotation } = useObjectRotation();
|
||||
const { deletePointOrLine } = useDeletePointOrLine();
|
||||
const { setSelectedWallItem } = useSelectedWallItem();
|
||||
const { activeModule } = useModuleStore();
|
||||
const { selectedItem } = useSelectedItem();
|
||||
|
@ -43,7 +41,7 @@ const WallItemsGroup = ({
|
|||
|
||||
useEffect(() => {
|
||||
// Load Wall Items from the backend
|
||||
loadInitialWallItems(setWallItems,projectId);
|
||||
loadInitialWallItems(setWallItems, projectId);
|
||||
}, []);
|
||||
|
||||
////////// Update the Position value changes in the selected item //////////
|
||||
|
@ -51,7 +49,7 @@ const WallItemsGroup = ({
|
|||
useEffect(() => {
|
||||
const canvasElement = state.gl.domElement;
|
||||
function handlePointerMove(e: any) {
|
||||
if (selectedItemsIndex !== null && !deletePointOrLine && e.buttons === 1) {
|
||||
if (selectedItemsIndex !== null && toolMode === 'cursor' && e.buttons === 1) {
|
||||
const Raycaster = state.raycaster;
|
||||
const intersects = Raycaster.intersectObjects(CSGGroup.current?.children[0].children!, true);
|
||||
const Object = intersects.find((child) => child.object.name.includes("WallRaycastReference"));
|
||||
|
@ -132,7 +130,7 @@ const WallItemsGroup = ({
|
|||
// organization,
|
||||
// currentItem?.model?.uuid,
|
||||
// currentItem.modelName,
|
||||
// currentItem.modelfileID,
|
||||
// currentItem.assetId,
|
||||
// currentItem.type!,
|
||||
// currentItem.csgposition!,
|
||||
// currentItem.csgscale!,
|
||||
|
@ -146,7 +144,7 @@ const WallItemsGroup = ({
|
|||
const data = {
|
||||
organization: organization,
|
||||
modelUuid: currentItem.model?.uuid!,
|
||||
modelfileID: currentItem.modelfileID,
|
||||
assetId: currentItem.assetId,
|
||||
modelName: currentItem.modelName!,
|
||||
type: currentItem.type!,
|
||||
csgposition: currentItem.csgposition!,
|
||||
|
@ -191,12 +189,12 @@ const WallItemsGroup = ({
|
|||
const onMouseUp = (evt: any) => {
|
||||
if (evt.button === 0) {
|
||||
isLeftMouseDown = false;
|
||||
if (!drag && deleteTool && activeModule === "builder") {
|
||||
if (!drag && toolMode === '3D-Delete' && activeModule === "builder") {
|
||||
DeleteWallItems(
|
||||
hoveredDeletableWallItem,
|
||||
setWallItems,
|
||||
wallItems,
|
||||
socket,projectId
|
||||
socket, projectId
|
||||
);
|
||||
}
|
||||
}
|
||||
|
@ -248,10 +246,10 @@ const WallItemsGroup = ({
|
|||
canvasElement.removeEventListener("drop", onDrop);
|
||||
canvasElement.removeEventListener("dragover", onDragOver);
|
||||
};
|
||||
}, [deleteTool, wallItems, selectedItem, camera]);
|
||||
}, [toolMode, wallItems, selectedItem, camera]);
|
||||
|
||||
useEffect(() => {
|
||||
if (deleteTool && activeModule === "builder") {
|
||||
if (toolMode && activeModule === "builder") {
|
||||
handleMeshMissed(
|
||||
currentWallItem,
|
||||
setSelectedWallItem,
|
||||
|
@ -260,7 +258,7 @@ const WallItemsGroup = ({
|
|||
setSelectedWallItem(null);
|
||||
setSelectedItemsIndex(null);
|
||||
}
|
||||
}, [deleteTool]);
|
||||
}, [toolMode]);
|
||||
|
||||
return (
|
||||
<>
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
import { Geometry } from "@react-three/csg";
|
||||
import {
|
||||
useDeleteTool,
|
||||
useSelectedWallItem,
|
||||
useToggleView,
|
||||
useToolMode,
|
||||
useWallItems,
|
||||
useWalls,
|
||||
} from "../../../store/builder/store";
|
||||
|
@ -23,7 +23,7 @@ const WallsAndWallItems = ({
|
|||
const { walls } = useWalls();
|
||||
const { wallItems } = useWallItems();
|
||||
const { toggleView } = useToggleView();
|
||||
const { deleteTool } = useDeleteTool();
|
||||
const { toolMode } = useToolMode();
|
||||
const { setSelectedWallItem } = useSelectedWallItem();
|
||||
|
||||
return (
|
||||
|
@ -34,7 +34,7 @@ const WallsAndWallItems = ({
|
|||
receiveShadow
|
||||
visible={!toggleView}
|
||||
onClick={(event) => {
|
||||
if (!deleteTool) {
|
||||
if (toolMode === "cursor") {
|
||||
handleMeshDown(
|
||||
event,
|
||||
currentWallItem,
|
||||
|
@ -46,7 +46,7 @@ const WallsAndWallItems = ({
|
|||
}
|
||||
}}
|
||||
onPointerMissed={() => {
|
||||
if (!deleteTool) {
|
||||
if (toolMode === "cursor") {
|
||||
handleMeshMissed(
|
||||
currentWallItem,
|
||||
setSelectedWallItem,
|
||||
|
|
|
@ -4,8 +4,6 @@ import { useThree, useFrame } from "@react-three/fiber";
|
|||
import * as THREE from "three";
|
||||
import {
|
||||
useActiveLayer,
|
||||
useDeleteTool,
|
||||
useDeletePointOrLine,
|
||||
useSocketStore,
|
||||
useToggleView,
|
||||
useToolMode,
|
||||
|
@ -37,10 +35,8 @@ const ZoneGroup: React.FC = () => {
|
|||
[]
|
||||
);
|
||||
const { toggleView } = useToggleView();
|
||||
const { deletePointOrLine, setDeletePointOrLine } = useDeletePointOrLine();
|
||||
const { removedLayer, setRemovedLayer } = useRemovedLayer();
|
||||
const { toolMode } = useToolMode();
|
||||
const { setDeleteTool } = useDeleteTool();
|
||||
const { activeLayer } = useActiveLayer();
|
||||
const { socket } = useSocketStore();
|
||||
const { projectId } = useParams();
|
||||
|
@ -97,11 +93,7 @@ const ZoneGroup: React.FC = () => {
|
|||
setZones(fetchedZones);
|
||||
|
||||
const fetchedPoints = data.flatMap((zone: any) =>
|
||||
zone.points
|
||||
.slice(0, 4)
|
||||
.map(
|
||||
(point: [number, number, number]) => new THREE.Vector3(...point)
|
||||
)
|
||||
zone.points.slice(0, 4).map((point: [number, number, number]) => new THREE.Vector3(...point))
|
||||
);
|
||||
|
||||
setZonePoints(fetchedPoints);
|
||||
|
@ -117,9 +109,7 @@ const ZoneGroup: React.FC = () => {
|
|||
|
||||
useEffect(() => {
|
||||
if (removedLayer) {
|
||||
const updatedZones = zones.filter(
|
||||
(zone: any) => zone.layer !== removedLayer
|
||||
);
|
||||
const updatedZones = zones.filter((zone: any) => zone.layer !== removedLayer);
|
||||
setZones(updatedZones);
|
||||
|
||||
const updatedzonePoints = zonePoints.filter((_: any, index: any) => {
|
||||
|
@ -128,11 +118,7 @@ const ZoneGroup: React.FC = () => {
|
|||
});
|
||||
setZonePoints(updatedzonePoints);
|
||||
|
||||
zones
|
||||
.filter((zone: any) => zone.layer === removedLayer)
|
||||
.forEach((zone: any) => {
|
||||
deleteZoneFromBackend(zone.zoneUuid);
|
||||
});
|
||||
zones.filter((zone: any) => zone.layer === removedLayer).forEach((zone: any) => { deleteZoneFromBackend(zone.zoneUuid); });
|
||||
|
||||
setRemovedLayer(null);
|
||||
}
|
||||
|
@ -142,9 +128,6 @@ const ZoneGroup: React.FC = () => {
|
|||
if (toolMode !== "Zone") {
|
||||
setStartPoint(null);
|
||||
setEndPoint(null);
|
||||
} else {
|
||||
setDeletePointOrLine(false);
|
||||
setDeleteTool(false);
|
||||
}
|
||||
if (!toggleView) {
|
||||
setStartPoint(null);
|
||||
|
@ -159,7 +142,6 @@ const ZoneGroup: React.FC = () => {
|
|||
points: [number, number, number][];
|
||||
layer: string;
|
||||
}) => {
|
||||
console.log('zoneUuid: ', zone);
|
||||
const email = localStorage.getItem("email");
|
||||
const userId = localStorage.getItem("userId");
|
||||
const organization = email!.split("@")[1].split(".")[0];
|
||||
|
@ -167,9 +149,7 @@ const ZoneGroup: React.FC = () => {
|
|||
const calculateCenter = (points: number[][]) => {
|
||||
if (!points || points.length === 0) return null;
|
||||
|
||||
let sumX = 0,
|
||||
sumY = 0,
|
||||
sumZ = 0;
|
||||
let sumX = 0, sumY = 0, sumZ = 0;
|
||||
const numPoints = points.length;
|
||||
|
||||
points.forEach(([x, y, z]) => {
|
||||
|
@ -185,9 +165,7 @@ const ZoneGroup: React.FC = () => {
|
|||
];
|
||||
};
|
||||
|
||||
const target: [number, number, number] | null = calculateCenter(
|
||||
zone.points
|
||||
);
|
||||
const target: [number, number, number] | null = calculateCenter(zone.points);
|
||||
if (!target || zone.points.length < 4) return;
|
||||
const position = [target[0], 10, target[2]];
|
||||
|
||||
|
@ -222,9 +200,7 @@ const ZoneGroup: React.FC = () => {
|
|||
const calculateCenter = (points: number[][]) => {
|
||||
if (!points || points.length === 0) return null;
|
||||
|
||||
let sumX = 0,
|
||||
sumY = 0,
|
||||
sumZ = 0;
|
||||
let sumX = 0, sumY = 0, sumZ = 0;
|
||||
const numPoints = points.length;
|
||||
|
||||
points.forEach(([x, y, z]) => {
|
||||
|
@ -240,9 +216,7 @@ const ZoneGroup: React.FC = () => {
|
|||
];
|
||||
};
|
||||
|
||||
const target: [number, number, number] | null = calculateCenter(
|
||||
zone.points
|
||||
);
|
||||
const target: [number, number, number] | null = calculateCenter(zone.points);
|
||||
if (!target || zone.points.length < 4) return;
|
||||
const position = [target[0], 10, target[2]];
|
||||
|
||||
|
@ -285,17 +259,9 @@ const ZoneGroup: React.FC = () => {
|
|||
|
||||
const zoneIndex = zones.findIndex((zone: any) => zone.zoneUuid === zoneUuid);
|
||||
if (zoneIndex !== -1) {
|
||||
const zonePointsToRemove = zonePoints.slice(
|
||||
zoneIndex * 4,
|
||||
zoneIndex * 4 + 4
|
||||
);
|
||||
zonePointsToRemove.forEach((point: any) =>
|
||||
groupsRef.current.remove(point)
|
||||
);
|
||||
const updatedzonePoints = zonePoints.filter(
|
||||
(_: any, index: any) =>
|
||||
index < zoneIndex * 4 || index >= zoneIndex * 4 + 4
|
||||
);
|
||||
const zonePointsToRemove = zonePoints.slice(zoneIndex * 4, zoneIndex * 4 + 4);
|
||||
zonePointsToRemove.forEach((point: any) => groupsRef.current.remove(point));
|
||||
const updatedzonePoints = zonePoints.filter((_: any, index: any) => index < zoneIndex * 4 || index >= zoneIndex * 4 + 4);
|
||||
setZonePoints(updatedzonePoints);
|
||||
}
|
||||
deleteZoneFromBackend(zoneUuid);
|
||||
|
@ -314,10 +280,7 @@ const ZoneGroup: React.FC = () => {
|
|||
drag = false;
|
||||
|
||||
raycaster.setFromCamera(pointer, camera);
|
||||
const intersects = raycaster.intersectObjects(
|
||||
groupsRef.current.children,
|
||||
true
|
||||
);
|
||||
const intersects = raycaster.intersectObjects(groupsRef.current.children, true);
|
||||
|
||||
if (intersects.length > 0 && toolMode === "move") {
|
||||
const clickedObject = intersects[0].object;
|
||||
|
@ -334,10 +297,10 @@ const ZoneGroup: React.FC = () => {
|
|||
};
|
||||
|
||||
const onMouseUp = (evt: any) => {
|
||||
if (evt.button === 0 && !drag && !isDragging && !deletePointOrLine) {
|
||||
if (evt.button === 0 && !drag && !isDragging && toolMode === 'Zone') {
|
||||
isLeftMouseDown = false;
|
||||
|
||||
if (!startPoint && toolMode !== "move") {
|
||||
if (!startPoint) {
|
||||
raycaster.setFromCamera(pointer, camera);
|
||||
const intersectionPoint = new THREE.Vector3();
|
||||
const point = raycaster.ray.intersectPlane(plane, intersectionPoint);
|
||||
|
@ -345,7 +308,7 @@ const ZoneGroup: React.FC = () => {
|
|||
setStartPoint(point);
|
||||
setEndPoint(null);
|
||||
}
|
||||
} else if (startPoint && toolMode !== "move") {
|
||||
} else if (startPoint) {
|
||||
raycaster.setFromCamera(pointer, camera);
|
||||
const intersectionPoint = new THREE.Vector3();
|
||||
const point = raycaster.ray.intersectPlane(plane, intersectionPoint);
|
||||
|
@ -386,12 +349,7 @@ const ZoneGroup: React.FC = () => {
|
|||
setStartPoint(null);
|
||||
setEndPoint(null);
|
||||
}
|
||||
} else if (
|
||||
evt.button === 0 &&
|
||||
!drag &&
|
||||
!isDragging &&
|
||||
deletePointOrLine
|
||||
) {
|
||||
} else if (evt.button === 0 && !drag && !isDragging && toolMode === '2D-Delete') {
|
||||
raycaster.setFromCamera(pointer, camera);
|
||||
const intersects = raycaster.intersectObjects(
|
||||
groupsRef.current.children,
|
||||
|
@ -418,9 +376,7 @@ const ZoneGroup: React.FC = () => {
|
|||
setIsDragging(false);
|
||||
setDraggedSphere(null);
|
||||
|
||||
const sphereIndex = zonePoints.findIndex(
|
||||
(point: any) => point === draggedSphere
|
||||
);
|
||||
const sphereIndex = zonePoints.findIndex((point: any) => point === draggedSphere);
|
||||
if (sphereIndex !== -1) {
|
||||
const zoneIndex = Math.floor(sphereIndex / 4);
|
||||
|
||||
|
@ -438,17 +394,10 @@ const ZoneGroup: React.FC = () => {
|
|||
drag = true;
|
||||
}
|
||||
raycaster.setFromCamera(pointer, camera);
|
||||
const intersects = raycaster.intersectObjects(
|
||||
groupsRef.current.children,
|
||||
true
|
||||
);
|
||||
const intersects = raycaster.intersectObjects(groupsRef.current.children, true);
|
||||
|
||||
if (
|
||||
intersects.length > 0 &&
|
||||
intersects[0].object.name.includes("point")
|
||||
) {
|
||||
gl.domElement.style.cursor =
|
||||
toolMode === "move" ? "pointer" : "default";
|
||||
if (intersects.length > 0 && intersects[0].object.name.includes("point")) {
|
||||
gl.domElement.style.cursor = toolMode === "move" ? "pointer" : "default";
|
||||
} else {
|
||||
gl.domElement.style.cursor = "default";
|
||||
}
|
||||
|
@ -459,9 +408,7 @@ const ZoneGroup: React.FC = () => {
|
|||
if (point) {
|
||||
draggedSphere.set(point.x, 0.15, point.z);
|
||||
|
||||
const sphereIndex = zonePoints.findIndex(
|
||||
(point: any) => point === draggedSphere
|
||||
);
|
||||
const sphereIndex = zonePoints.findIndex((point: any) => point === draggedSphere);
|
||||
if (sphereIndex !== -1) {
|
||||
const zoneIndex = Math.floor(sphereIndex / 4);
|
||||
const cornerIndex = sphereIndex % 4;
|
||||
|
@ -488,7 +435,7 @@ const ZoneGroup: React.FC = () => {
|
|||
setEndPoint(null);
|
||||
};
|
||||
|
||||
if (toolMode === "Zone" || deletePointOrLine || toolMode === "move") {
|
||||
if (toolMode === "Zone" || toolMode === '2D-Delete' || toolMode === "move") {
|
||||
canvasElement.addEventListener("mousedown", onMouseDown);
|
||||
canvasElement.addEventListener("mouseup", onMouseUp);
|
||||
canvasElement.addEventListener("mousemove", onMouseMove);
|
||||
|
@ -500,29 +447,7 @@ const ZoneGroup: React.FC = () => {
|
|||
canvasElement.removeEventListener("mousemove", onMouseMove);
|
||||
canvasElement.removeEventListener("contextmenu", onContext);
|
||||
};
|
||||
}, [
|
||||
gl,
|
||||
camera,
|
||||
startPoint,
|
||||
toggleView,
|
||||
scene,
|
||||
toolMode,
|
||||
zones,
|
||||
isDragging,
|
||||
deletePointOrLine,
|
||||
zonePoints,
|
||||
draggedSphere,
|
||||
activeLayer,
|
||||
raycaster,
|
||||
pointer,
|
||||
controls,
|
||||
plane,
|
||||
setZones,
|
||||
setZonePoints,
|
||||
addZoneToBackend,
|
||||
handleDeleteZone,
|
||||
updateZoneToBackend,
|
||||
]);
|
||||
}, [gl, camera, startPoint, toggleView, scene, toolMode, zones, isDragging, zonePoints, draggedSphere, activeLayer, raycaster, pointer, controls, plane, setZones, setZonePoints, addZoneToBackend, handleDeleteZone, updateZoneToBackend,]);
|
||||
|
||||
useFrame(() => {
|
||||
if (!startPoint) return;
|
||||
|
@ -643,7 +568,7 @@ const ZoneGroup: React.FC = () => {
|
|||
lineWidth={3}
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
if (deletePointOrLine) {
|
||||
if (toolMode === '2D-Delete') {
|
||||
handleDeleteZone(zone.zoneUuid);
|
||||
}
|
||||
}}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import * as THREE from 'three';
|
||||
import * as Constants from '../../../types/world/worldConstants';
|
||||
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 { useAisleStore } from '../../../store/builder/useAisleStore';
|
||||
import { useThree } from '@react-three/fiber';
|
||||
|
@ -24,7 +24,6 @@ function Point({ point }: { readonly point: Point }) {
|
|||
const { snapPosition } = useAislePointSnapping(point);
|
||||
const { checkSnapForAisle } = usePointSnapping({ uuid: point.pointUuid, pointType: point.pointType, position: point.position });
|
||||
const { hoveredPoint, setHoveredPoint } = useBuilderStore();
|
||||
const { deletePointOrLine } = useDeletePointOrLine();
|
||||
const { projectId } = useParams();
|
||||
const boxScale: [number, number, number] = Constants.pointConfig.boxScale;
|
||||
const colors = getColor(point);
|
||||
|
@ -64,12 +63,12 @@ function Point({ point }: { readonly point: Point }) {
|
|||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (materialRef.current && (toolMode === 'move' || deletePointOrLine)) {
|
||||
if (materialRef.current && (toolMode === 'move' || toolMode === '2D-Delete')) {
|
||||
let innerColor;
|
||||
let outerColor;
|
||||
if (isHovered) {
|
||||
innerColor = deletePointOrLine ? colors.defaultDeleteColor : colors.defaultOuterColor;
|
||||
outerColor = deletePointOrLine ? colors.defaultDeleteColor : colors.defaultOuterColor;
|
||||
innerColor = toolMode === '2D-Delete' ? colors.defaultDeleteColor : colors.defaultOuterColor;
|
||||
outerColor = toolMode === '2D-Delete' ? colors.defaultDeleteColor : colors.defaultOuterColor;
|
||||
} else {
|
||||
innerColor = colors.defaultInnerColor;
|
||||
outerColor = colors.defaultOuterColor;
|
||||
|
@ -82,7 +81,7 @@ function Point({ point }: { readonly point: Point }) {
|
|||
materialRef.current.uniforms.uOuterColor.value.set(colors.defaultOuterColor);
|
||||
materialRef.current.uniformsNeedUpdate = true;
|
||||
}
|
||||
}, [isHovered, colors.defaultInnerColor, colors.defaultOuterColor, colors.defaultDeleteColor, toolMode, deletePointOrLine]);
|
||||
}, [isHovered, colors.defaultInnerColor, colors.defaultOuterColor, colors.defaultDeleteColor, toolMode]);
|
||||
|
||||
const uniforms = useMemo(() => ({
|
||||
uOuterColor: { value: new THREE.Color(colors.defaultOuterColor) },
|
||||
|
@ -114,7 +113,7 @@ function Point({ point }: { readonly point: Point }) {
|
|||
}
|
||||
|
||||
const handleDragEnd = (point: Point) => {
|
||||
if (deletePointOrLine) return;
|
||||
if (toolMode === '2D-Delete') return;
|
||||
if (point.pointType === 'Aisle') {
|
||||
const updatedAisles = getAislesByPointId(point.pointUuid);
|
||||
if (updatedAisles.length > 0 && projectId) {
|
||||
|
@ -128,7 +127,7 @@ function Point({ point }: { readonly point: Point }) {
|
|||
}
|
||||
|
||||
const handlePointClick = (point: Point) => {
|
||||
if (deletePointOrLine) {
|
||||
if (toolMode === '2D-Delete') {
|
||||
if (point.pointType === 'Aisle') {
|
||||
const removedAisles = removeAislePoint(point.pointUuid);
|
||||
if (removedAisles.length > 0) {
|
||||
|
|
|
@ -40,16 +40,11 @@ export default function SocketResponses({
|
|||
floorPlanGroup,
|
||||
lines,
|
||||
floorGroup,
|
||||
floorGroupAisle,
|
||||
scene,
|
||||
onlyFloorlines,
|
||||
itemsGroup,
|
||||
isTempLoader,
|
||||
tempLoader,
|
||||
currentLayerPoint,
|
||||
floorPlanGroupPoint,
|
||||
floorPlanGroupLine,
|
||||
zoneGroup,
|
||||
dragPointControls,
|
||||
}: any) {
|
||||
const { socket } = useSocketStore();
|
||||
|
@ -104,7 +99,7 @@ export default function SocketResponses({
|
|||
const asset: Asset = {
|
||||
modelUuid: data.data.modelUuid,
|
||||
modelName: data.data.modelName,
|
||||
assetId: data.data.modelfileID,
|
||||
assetId: data.data.assetId,
|
||||
position: data.data.position,
|
||||
rotation: [data.data.rotation.x, data.data.rotation.y, data.data.rotation.z],
|
||||
isLocked: data.data.isLocked,
|
||||
|
@ -125,7 +120,7 @@ export default function SocketResponses({
|
|||
const asset: Asset = {
|
||||
modelUuid: data.data.modelUuid,
|
||||
modelName: data.data.modelName,
|
||||
assetId: data.data.modelfileID,
|
||||
assetId: data.data.assetId,
|
||||
position: data.data.position,
|
||||
rotation: [data.data.rotation.x, data.data.rotation.y, data.data.rotation.z],
|
||||
isLocked: data.data.isLocked,
|
||||
|
@ -474,13 +469,14 @@ export default function SocketResponses({
|
|||
let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_MARKETPLACE_URL}`;
|
||||
|
||||
socket.on("v1:wallItem:Response:Delete", (data: any) => {
|
||||
// console.log('data: ', data);
|
||||
if (socket.id === data.socketId) {
|
||||
return;
|
||||
}
|
||||
if (organization !== data.organization) {
|
||||
return;
|
||||
}
|
||||
if (data.message === "wallitem deleted") {
|
||||
if (data.message === "wall Item deleted successfully") {
|
||||
const deletedUUID = data.data.modelUuid;
|
||||
let WallItemsRef = wallItems;
|
||||
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) => {
|
||||
// console.log('data: ', data);
|
||||
//
|
||||
if (socket.id === data.socketId) {
|
||||
return;
|
||||
|
@ -511,7 +508,7 @@ export default function SocketResponses({
|
|||
if (organization !== data.organization) {
|
||||
return;
|
||||
}
|
||||
if (data.message === "wallIitem created") {
|
||||
if (data.message === "wall Item created successfully") {
|
||||
const loader = new GLTFLoader();
|
||||
const dracoLoader = new DRACOLoader();
|
||||
|
||||
|
@ -519,20 +516,20 @@ export default function SocketResponses({
|
|||
loader.setDRACOLoader(dracoLoader);
|
||||
|
||||
// Check THREE.js cache first
|
||||
const cachedModel = THREE.Cache.get(data.data.modelfileID);
|
||||
const cachedModel = THREE.Cache.get(data.data.assetId);
|
||||
if (cachedModel) {
|
||||
handleModelLoad(cachedModel);
|
||||
return;
|
||||
}
|
||||
|
||||
// Check IndexedDB cache
|
||||
retrieveGLTF(data.data.modelfileID).then((cachedModelBlob) => {
|
||||
retrieveGLTF(data.data.assetId).then((cachedModelBlob) => {
|
||||
if (cachedModelBlob) {
|
||||
const blobUrl = URL.createObjectURL(cachedModelBlob);
|
||||
loader.load(blobUrl, (gltf) => {
|
||||
URL.revokeObjectURL(blobUrl);
|
||||
THREE.Cache.remove(blobUrl);
|
||||
THREE.Cache.add(data.data.modelfileID, gltf);
|
||||
THREE.Cache.add(data.data.assetId, gltf);
|
||||
handleModelLoad(gltf);
|
||||
});
|
||||
return;
|
||||
|
@ -540,11 +537,11 @@ export default function SocketResponses({
|
|||
})
|
||||
|
||||
// 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 {
|
||||
const modelBlob = await fetch(`${url_Backend_dwinzo}/api/v2/AssetFile/${data.data.modelfileID}`).then((res) => res.blob());
|
||||
await storeGLTF(data.data.modelfileID, modelBlob);
|
||||
THREE.Cache.add(data.data.modelfileID, gltf);
|
||||
const modelBlob = await fetch(`${url_Backend_dwinzo}/api/v2/AssetFile/${data.data.assetId}`).then((res) => res.blob());
|
||||
await storeGLTF(data.data.assetId, modelBlob);
|
||||
THREE.Cache.add(data.data.assetId, gltf);
|
||||
await handleModelLoad(gltf);
|
||||
} catch (error) {
|
||||
|
||||
|
@ -567,7 +564,7 @@ export default function SocketResponses({
|
|||
type: data.data.type,
|
||||
model: model,
|
||||
modelName: data.data.modelName,
|
||||
modelfileID: data.data.modelfileID,
|
||||
assetId: data.data.assetId,
|
||||
scale: data.data.scale,
|
||||
csgscale: data.data.csgscale,
|
||||
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;
|
||||
|
||||
setWallItems((prevItems: any) => {
|
||||
|
|
|
@ -10,7 +10,7 @@ interface ModelData {
|
|||
description: string;
|
||||
filename: string;
|
||||
isArchieve: boolean;
|
||||
modelfileID: string;
|
||||
assetId: string;
|
||||
tags: string;
|
||||
thumbnail: string;
|
||||
uploadDate: number;
|
||||
|
@ -65,7 +65,7 @@ const CardsContainer: React.FC<ModelsProps> = ({ models }) => {
|
|||
onSelectCard={handleCardSelect}
|
||||
AssetID={assetDetail.AssetID}
|
||||
image={assetDetail.thumbnail}
|
||||
modelUrl={assetDetail.modelfileID}
|
||||
modelUrl={assetDetail.assetId}
|
||||
description={assetDetail.description}
|
||||
/>
|
||||
</React.Fragment>
|
||||
|
|
|
@ -10,7 +10,7 @@ interface ModelData {
|
|||
description: string;
|
||||
filename: string;
|
||||
isArchieve: boolean;
|
||||
modelfileID: string;
|
||||
assetId: string;
|
||||
tags: string;
|
||||
thumbnail: string;
|
||||
uploadDate: number;
|
||||
|
|
|
@ -10,7 +10,7 @@ interface ModelData {
|
|||
description: string;
|
||||
filename: string;
|
||||
isArchieve: boolean;
|
||||
modelfileID: string;
|
||||
assetId: string;
|
||||
tags: string;
|
||||
thumbnail: string;
|
||||
uploadDate: number;
|
||||
|
|
|
@ -158,7 +158,7 @@ const CopyPasteControls = ({
|
|||
const newFloorItem: Types.FloorItemType = {
|
||||
modelUuid: THREE.MathUtils.generateUUID(),
|
||||
modelName: obj.userData.modelName,
|
||||
modelfileID: obj.userData.assetId,
|
||||
assetId: obj.userData.assetId,
|
||||
position: [worldPosition.x, worldPosition.y, worldPosition.z],
|
||||
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z, },
|
||||
isLocked: false,
|
||||
|
@ -352,7 +352,7 @@ const CopyPasteControls = ({
|
|||
organization,
|
||||
modelUuid: newFloorItem.modelUuid,
|
||||
modelName: newFloorItem.modelName,
|
||||
modelfileID: newFloorItem.modelfileID,
|
||||
assetId: newFloorItem.assetId,
|
||||
position: newFloorItem.position,
|
||||
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
|
||||
isLocked: false,
|
||||
|
@ -368,7 +368,7 @@ const CopyPasteControls = ({
|
|||
|
||||
obj.userData = {
|
||||
name: newFloorItem.modelName,
|
||||
modelId: newFloorItem.modelfileID,
|
||||
modelId: newFloorItem.assetId,
|
||||
modelUuid: newFloorItem.modelUuid,
|
||||
eventData: JSON.parse(JSON.stringify(eventData))
|
||||
};
|
||||
|
@ -376,7 +376,7 @@ const CopyPasteControls = ({
|
|||
const asset: Asset = {
|
||||
modelUuid: data.modelUuid,
|
||||
modelName: data.modelName,
|
||||
assetId: data.modelfileID,
|
||||
assetId: data.assetId,
|
||||
position: data.position,
|
||||
rotation: [data.rotation.x, data.rotation.y, data.rotation.z],
|
||||
isLocked: data.isLocked,
|
||||
|
@ -409,7 +409,7 @@ const CopyPasteControls = ({
|
|||
organization,
|
||||
modelUuid: newFloorItem.modelUuid,
|
||||
modelName: newFloorItem.modelName,
|
||||
modelfileID: newFloorItem.modelfileID,
|
||||
assetId: newFloorItem.assetId,
|
||||
position: newFloorItem.position,
|
||||
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
|
||||
isLocked: false,
|
||||
|
@ -425,7 +425,7 @@ const CopyPasteControls = ({
|
|||
const asset: Asset = {
|
||||
modelUuid: data.modelUuid,
|
||||
modelName: data.modelName,
|
||||
assetId: data.modelfileID,
|
||||
assetId: data.assetId,
|
||||
position: data.position,
|
||||
rotation: [data.rotation.x, data.rotation.y, data.rotation.z],
|
||||
isLocked: data.isLocked,
|
||||
|
|
|
@ -133,7 +133,7 @@ const DuplicationControls = ({
|
|||
const newFloorItem: Types.FloorItemType = {
|
||||
modelUuid: THREE.MathUtils.generateUUID(),
|
||||
modelName: obj.userData.modelName,
|
||||
modelfileID: obj.userData.assetId,
|
||||
assetId: obj.userData.assetId,
|
||||
position: [worldPosition.x, worldPosition.y, worldPosition.z],
|
||||
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z, },
|
||||
isLocked: false,
|
||||
|
@ -327,7 +327,7 @@ const DuplicationControls = ({
|
|||
organization,
|
||||
modelUuid: newFloorItem.modelUuid,
|
||||
modelName: newFloorItem.modelName,
|
||||
modelfileID: newFloorItem.modelfileID,
|
||||
assetId: newFloorItem.assetId,
|
||||
position: newFloorItem.position,
|
||||
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
|
||||
isLocked: false,
|
||||
|
@ -344,7 +344,7 @@ const DuplicationControls = ({
|
|||
const asset: Asset = {
|
||||
modelUuid: data.modelUuid,
|
||||
modelName: data.modelName,
|
||||
assetId: data.modelfileID,
|
||||
assetId: data.assetId,
|
||||
position: data.position,
|
||||
rotation: [data.rotation.x, data.rotation.y, data.rotation.z],
|
||||
isLocked: data.isLocked,
|
||||
|
@ -378,7 +378,7 @@ const DuplicationControls = ({
|
|||
organization,
|
||||
modelUuid: newFloorItem.modelUuid,
|
||||
modelName: newFloorItem.modelName,
|
||||
modelfileID: newFloorItem.modelfileID,
|
||||
assetId: newFloorItem.assetId,
|
||||
position: newFloorItem.position,
|
||||
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
|
||||
isLocked: false,
|
||||
|
@ -394,7 +394,7 @@ const DuplicationControls = ({
|
|||
const asset: Asset = {
|
||||
modelUuid: data.modelUuid,
|
||||
modelName: data.modelName,
|
||||
assetId: data.modelfileID,
|
||||
assetId: data.assetId,
|
||||
position: data.position,
|
||||
rotation: [data.rotation.x, data.rotation.y, data.rotation.z],
|
||||
isLocked: data.isLocked,
|
||||
|
|
|
@ -237,7 +237,7 @@ function MoveControls({
|
|||
const newFloorItem: Types.FloorItemType = {
|
||||
modelUuid: obj.userData.modelUuid,
|
||||
modelName: obj.userData.modelName,
|
||||
modelfileID: obj.userData.assetId,
|
||||
assetId: obj.userData.assetId,
|
||||
position: [worldPosition.x, worldPosition.y, worldPosition.z],
|
||||
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
|
||||
isLocked: false,
|
||||
|
@ -304,7 +304,7 @@ function MoveControls({
|
|||
organization,
|
||||
modelUuid: newFloorItem.modelUuid,
|
||||
modelName: newFloorItem.modelName,
|
||||
modelfileID: newFloorItem.modelfileID,
|
||||
assetId: newFloorItem.assetId,
|
||||
position: newFloorItem.position,
|
||||
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
|
||||
isLocked: false,
|
||||
|
|
|
@ -203,7 +203,7 @@ function RotateControls({
|
|||
const newFloorItem: Types.FloorItemType = {
|
||||
modelUuid: obj.userData.modelUuid,
|
||||
modelName: obj.userData.modelName,
|
||||
modelfileID: obj.userData.assetId,
|
||||
assetId: obj.userData.assetId,
|
||||
position: [worldPosition.x, worldPosition.y, worldPosition.z],
|
||||
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
|
||||
isLocked: false,
|
||||
|
@ -263,7 +263,7 @@ function RotateControls({
|
|||
organization,
|
||||
modelUuid: newFloorItem.modelUuid,
|
||||
modelName: newFloorItem.modelName,
|
||||
modelfileID: newFloorItem.modelfileID,
|
||||
assetId: newFloorItem.assetId,
|
||||
position: newFloorItem.position,
|
||||
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
|
||||
isLocked: false,
|
||||
|
|
|
@ -3,7 +3,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
|||
import { SelectionBox } from "three/examples/jsm/interactive/SelectionBox";
|
||||
import { SelectionHelper } from "./selectionHelper";
|
||||
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 { deleteFloorItem } from '../../../../services/factoryBuilder/assest/floorAsset/deleteFloorItemApi';
|
||||
import * as Types from "../../../../types/world/worldTypes";
|
||||
|
@ -33,6 +33,7 @@ const SelectionControls: React.FC = () => {
|
|||
const { socket } = useSocketStore();
|
||||
const { removeAsset } = useAssetsStore();
|
||||
const selectionBox = useMemo(() => new SelectionBox(camera, scene), [camera, scene]);
|
||||
const { toolMode } = useToolMode();
|
||||
const { projectId } = useParams();
|
||||
|
||||
const isDragging = useRef(false);
|
||||
|
@ -173,7 +174,7 @@ const SelectionControls: React.FC = () => {
|
|||
rightClickMoved.current = false;
|
||||
};
|
||||
|
||||
if (!toggleView && activeModule === "builder") {
|
||||
if (!toggleView && activeModule === "builder" && toolMode === 'cursor') {
|
||||
helper.enabled = true;
|
||||
canvasElement.addEventListener("pointermove", onPointerMove);
|
||||
canvasElement.addEventListener("pointerup", onPointerUp);
|
||||
|
@ -194,7 +195,7 @@ const SelectionControls: React.FC = () => {
|
|||
helper.enabled = false;
|
||||
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(() => {
|
||||
if (activeModule !== "builder") {
|
||||
|
|
|
@ -124,7 +124,7 @@ export default function TransformControl() {
|
|||
organization,
|
||||
modelUuid: asset.modelUuid,
|
||||
modelName: asset.modelName,
|
||||
modelfileID: asset.assetId,
|
||||
assetId: asset.assetId,
|
||||
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 },
|
||||
isLocked: false,
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import * as THREE from "three";
|
||||
import { useMemo, useRef, useState } from "react";
|
||||
import { useThree } from "@react-three/fiber";
|
||||
import { useDeleteTool } from "../../../../store/builder/store";
|
||||
import { useToolMode } from "../../../../store/builder/store";
|
||||
|
||||
interface ConnectionLine {
|
||||
id: string;
|
||||
|
@ -14,7 +14,7 @@ export function Arrows({ connections }: { readonly connections: ConnectionLine[]
|
|||
const [hoveredLineKey, setHoveredLineKey] = useState<string | null>(null);
|
||||
const groupRef = useRef<THREE.Group>(null);
|
||||
const { scene } = useThree();
|
||||
const { deleteTool } = useDeleteTool();
|
||||
const { toolMode } = useToolMode();
|
||||
|
||||
const getWorldPositionFromScene = (uuid: string): THREE.Vector3 | null => {
|
||||
const obj = scene.getObjectByProperty("uuid", uuid);
|
||||
|
@ -61,7 +61,7 @@ export function Arrows({ connections }: { readonly connections: ConnectionLine[]
|
|||
onPointerOut={() => setHoveredLineKey(null)}
|
||||
>
|
||||
<meshStandardMaterial
|
||||
color={deleteTool && hoveredLineKey === key ? "red" : "#42a5f5"}
|
||||
color={toolMode === '2D-Delete' && hoveredLineKey === key ? "red" : "#42a5f5"}
|
||||
/>
|
||||
</mesh>
|
||||
<mesh
|
||||
|
@ -72,7 +72,7 @@ export function Arrows({ connections }: { readonly connections: ConnectionLine[]
|
|||
onPointerOut={() => setHoveredLineKey(null)}
|
||||
>
|
||||
<meshStandardMaterial
|
||||
color={deleteTool && hoveredLineKey === key ? "red" : "#42a5f5"}
|
||||
color={toolMode === '2D-Delete' && hoveredLineKey === key ? "red" : "#42a5f5"}
|
||||
/>
|
||||
</mesh>
|
||||
</group>
|
||||
|
|
|
@ -11,6 +11,7 @@ import { usePlayButtonStore } from "../../../../../store/usePlayButtonStore";
|
|||
import { upsertProductOrEventApi } from "../../../../../services/simulation/products/UpsertProductOrEventApi";
|
||||
import { useProductContext } from "../../../products/productContext";
|
||||
import { useParams } from "react-router-dom";
|
||||
import { useToolMode } from "../../../../../store/builder/store";
|
||||
|
||||
function PointsCreator() {
|
||||
const { gl, raycaster, scene, pointer, camera } = useThree();
|
||||
|
@ -26,7 +27,7 @@ function PointsCreator() {
|
|||
const { selectedEventSphere, setSelectedEventSphere, clearSelectedEventSphere, } = useSelectedEventSphere();
|
||||
const { setSelectedEventData, clearSelectedEventData } = useSelectedEventData();
|
||||
const { isPlaying } = usePlayButtonStore();
|
||||
|
||||
const { toolMode } = useToolMode();
|
||||
const { projectId } = useParams();
|
||||
|
||||
const updateBackend = (
|
||||
|
@ -204,9 +205,11 @@ function PointsCreator() {
|
|||
ref={(el) => (sphereRefs.current[point.uuid] = el!)}
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
if (toolMode === 'cursor') {
|
||||
setSelectedEventSphere(
|
||||
sphereRefs.current[point.uuid]
|
||||
);
|
||||
}
|
||||
}}
|
||||
key={`${index}-${point.uuid}`}
|
||||
position={new THREE.Vector3(...point.position)}
|
||||
|
@ -235,9 +238,11 @@ function PointsCreator() {
|
|||
ref={(el) => (sphereRefs.current[point.uuid] = el!)}
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
if (toolMode === 'cursor') {
|
||||
setSelectedEventSphere(
|
||||
sphereRefs.current[point.uuid]
|
||||
);
|
||||
}
|
||||
}}
|
||||
position={new THREE.Vector3(...point.position)}
|
||||
userData={{
|
||||
|
@ -264,9 +269,11 @@ function PointsCreator() {
|
|||
ref={(el) => (sphereRefs.current[point.uuid] = el!)}
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
if (toolMode === 'cursor') {
|
||||
setSelectedEventSphere(
|
||||
sphereRefs.current[point.uuid]
|
||||
);
|
||||
}
|
||||
}}
|
||||
position={new THREE.Vector3(...point.position)}
|
||||
userData={{
|
||||
|
@ -293,9 +300,11 @@ function PointsCreator() {
|
|||
ref={(el) => (sphereRefs.current[point.uuid] = el!)}
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
if (toolMode === 'cursor') {
|
||||
setSelectedEventSphere(
|
||||
sphereRefs.current[point.uuid]
|
||||
);
|
||||
}
|
||||
}}
|
||||
position={new THREE.Vector3(...point.position)}
|
||||
userData={{
|
||||
|
@ -322,9 +331,11 @@ function PointsCreator() {
|
|||
ref={(el) => (sphereRefs.current[point.uuid] = el!)}
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
if (toolMode === 'cursor') {
|
||||
setSelectedEventSphere(
|
||||
sphereRefs.current[point.uuid]
|
||||
);
|
||||
}
|
||||
}}
|
||||
position={new THREE.Vector3(...point.position)}
|
||||
userData={{
|
||||
|
|
|
@ -8,11 +8,11 @@ import { useEventsStore } from "../../../../store/simulation/useEventsStore";
|
|||
import { handleAddEventToProduct } from "../points/functions/handleAddEventToProduct";
|
||||
import { QuadraticBezierLine } from "@react-three/drei";
|
||||
import { upsertProductOrEventApi } from "../../../../services/simulation/products/UpsertProductOrEventApi";
|
||||
import { useDeleteTool } from "../../../../store/builder/store";
|
||||
import { usePlayButtonStore } from "../../../../store/usePlayButtonStore";
|
||||
import { ArrowOnQuadraticBezier, Arrows } from "../arrows/arrows";
|
||||
import { useProductContext } from "../../products/productContext";
|
||||
import { useParams } from "react-router-dom";
|
||||
import { useToolMode } from "../../../../store/builder/store";
|
||||
|
||||
interface ConnectionLine {
|
||||
id: string;
|
||||
|
@ -32,7 +32,7 @@ function TriggerConnector() {
|
|||
const groupRefs = useRef<Record<string, any>>({});
|
||||
const [helperlineColor, setHelperLineColor] = useState<string>("red");
|
||||
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 { selectedAction } = useSelectedAction();
|
||||
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("mouseup", onMouseUp);
|
||||
canvasElement.addEventListener("mousemove", onMouseMove);
|
||||
|
@ -360,7 +360,7 @@ function TriggerConnector() {
|
|||
canvasElement.removeEventListener('contextmenu', handleRightClick);
|
||||
};
|
||||
|
||||
}, [gl, subModule, selectedProduct, firstSelectedPoint, deleteTool, selectedAction]);
|
||||
}, [gl, subModule, selectedProduct, firstSelectedPoint, toolMode, selectedAction]);
|
||||
|
||||
useFrame(() => {
|
||||
if (firstSelectedPoint) {
|
||||
|
@ -477,15 +477,15 @@ function TriggerConnector() {
|
|||
start={startPoint.toArray()}
|
||||
end={endPoint.toArray()}
|
||||
mid={midPoint.toArray()}
|
||||
color={deleteTool && hoveredLineKey === connection.id ? "red" : "#42a5f5"}
|
||||
color={toolMode === '3D-Delete' && hoveredLineKey === connection.id ? "red" : "#42a5f5"}
|
||||
lineWidth={4}
|
||||
dashed={deleteTool && hoveredLineKey === connection.id ? false : true}
|
||||
dashed={toolMode === '3D-Delete' && hoveredLineKey === connection.id ? false : true}
|
||||
dashSize={0.75}
|
||||
dashScale={20}
|
||||
onPointerOver={() => setHoveredLineKey(connection.id)}
|
||||
onPointerOut={() => setHoveredLineKey(null)}
|
||||
onClick={() => {
|
||||
if (deleteTool) {
|
||||
if (toolMode === '3D-Delete') {
|
||||
setHoveredLineKey(null);
|
||||
setCurrentLine(null);
|
||||
removeConnection(connection);
|
||||
|
|
|
@ -46,7 +46,7 @@ function RoboticArmInstance({ armBot }: { readonly armBot: ArmBotStatus }) {
|
|||
const animationFrameIdRef = 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() {
|
||||
startTime = performance.now();
|
||||
|
@ -73,7 +73,7 @@ function RoboticArmInstance({ armBot }: { readonly armBot: ArmBotStatus }) {
|
|||
removeLastStorageMaterial(previousModel.modelUuid);
|
||||
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 {
|
||||
setIsVisible(armBot.currentAction.materialId, false);
|
||||
}
|
||||
|
@ -105,13 +105,13 @@ function RoboticArmInstance({ armBot }: { readonly armBot: ArmBotStatus }) {
|
|||
removeCurrentAction(armBot.modelUuid)
|
||||
}
|
||||
|
||||
if (lastRemoved.current) {
|
||||
if (lastRemoved.current.type === 'transfer') {
|
||||
setIsPaused(lastRemoved.current.materialId, true)
|
||||
} else {
|
||||
setIsPaused(lastRemoved.current.materialId, false)
|
||||
}
|
||||
}
|
||||
// if (lastRemoved.current) {
|
||||
// if (lastRemoved.current.type === 'transfer') {
|
||||
// setIsPaused(lastRemoved.current.materialId, true)
|
||||
// } else {
|
||||
// setIsPaused(lastRemoved.current.materialId, false)
|
||||
// }
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -15,7 +15,6 @@ function Simulator() {
|
|||
|
||||
useEffect(() => {
|
||||
if (!isPlaying || isReset || !selectedProduct.productUuid) return;
|
||||
console.log('selectedProduct: ', selectedProduct);
|
||||
|
||||
const product = getProductById(selectedProduct.productUuid);
|
||||
if (!product) return;
|
||||
|
|
|
@ -604,6 +604,7 @@ export function useTriggerHandler() {
|
|||
modelUuid: action.triggers[0]?.triggeredAsset?.triggeredModel.modelUuid,
|
||||
pointUuid: action.triggers[0]?.triggeredAsset?.triggeredPoint?.pointUuid,
|
||||
})
|
||||
setIsPaused(material.materialId, false); // New
|
||||
handleAction(action, material.materialId);
|
||||
}
|
||||
} else {
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
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 {
|
||||
const response = await fetch(
|
||||
`${url_Backend_dwinzo}/api/V1/floorAssets/${projectId}`,
|
||||
|
|
|
@ -4,7 +4,7 @@ export const setFloorItemApi = async (
|
|||
modelUuid?: string,
|
||||
modelName?: string,
|
||||
projectId?: string,
|
||||
modelfileID?: string,
|
||||
assetId?: string,
|
||||
position?: Object,
|
||||
rotation?: Object,
|
||||
isLocked?: boolean,
|
||||
|
@ -18,7 +18,7 @@ export const setFloorItemApi = async (
|
|||
projectId,
|
||||
position,
|
||||
rotation,
|
||||
modelfileID,
|
||||
assetId,
|
||||
isLocked,
|
||||
isVisible,
|
||||
};
|
||||
|
|
|
@ -21,7 +21,6 @@ export const getWallItems = async (organization: string,projectId?:string) => {
|
|||
}
|
||||
|
||||
const result = await response.json();
|
||||
// console.log('result: ', result);
|
||||
return result;
|
||||
} catch (error) {
|
||||
echo.error("Failed to get wall items");
|
||||
|
|
|
@ -13,14 +13,14 @@ onmessage = async (event) => {
|
|||
const { floorItems } = event.data;
|
||||
|
||||
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) {
|
||||
if(item.modelfileID === null || item.modelfileID === undefined) {
|
||||
continue; // Skip items without a valid modelfileID
|
||||
if(item.assetId === null || item.assetId === undefined) {
|
||||
continue; // Skip items without a valid assetId
|
||||
}
|
||||
const modelID = item.modelfileID;
|
||||
const modelID = item.assetId;
|
||||
const indexedDBModel = await retrieveGLTF(modelID);
|
||||
|
||||
let modelBlob;
|
||||
|
|
|
@ -197,10 +197,10 @@ export const useMenuVisible = create<any>((set: any) => ({
|
|||
setMenuVisible: (x: any) => set(() => ({ menuVisible: x })),
|
||||
}));
|
||||
|
||||
export const useDeleteTool = create<any>((set: any) => ({
|
||||
deleteTool: false,
|
||||
setDeleteTool: (x: any) => set(() => ({ deleteTool: x })),
|
||||
}));
|
||||
// export const useDeleteTool = create<any>((set: any) => ({
|
||||
// deleteTool: false,
|
||||
// setDeleteTool: (x: any) => set(() => ({ deleteTool: x })),
|
||||
// }));
|
||||
|
||||
export const useToolMode = create<any>((set: any) => ({
|
||||
toolMode: null,
|
||||
|
@ -222,10 +222,10 @@ export const useMovePoint = create<any>((set: any) => ({
|
|||
setMovePoint: (x: any) => set(() => ({ movePoint: x })),
|
||||
}));
|
||||
|
||||
export const useDeletePointOrLine = create<any>((set: any) => ({
|
||||
deletePointOrLine: false,
|
||||
setDeletePointOrLine: (x: any) => set(() => ({ deletePointOrLine: x })),
|
||||
}));
|
||||
// export const useDeletePointOrLine = create<any>((set: any) => ({
|
||||
// deletePointOrLine: false,
|
||||
// setDeletePointOrLine: (x: any) => set(() => ({ deletePointOrLine: x })),
|
||||
// }));
|
||||
|
||||
export const useWallItems = create<any>((set: any) => ({
|
||||
wallItems: [],
|
||||
|
@ -626,11 +626,12 @@ interface CompareStore {
|
|||
}
|
||||
|
||||
export const useCompareStore = create<CompareStore>((set) => ({
|
||||
comparePopUp: true,
|
||||
comparePopUp: false,
|
||||
setComparePopUp: (value) => set({ comparePopUp: value }),
|
||||
toggleComparePopUp: () =>
|
||||
set((state) => ({ comparePopUp: !state.comparePopUp })),
|
||||
}));
|
||||
|
||||
// Save state store
|
||||
interface SaveVersionStore {
|
||||
isVersionSaved: boolean;
|
||||
|
|
|
@ -463,6 +463,7 @@
|
|||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
|
||||
.layer-wrapper {
|
||||
display: flex;
|
||||
|
@ -472,6 +473,12 @@
|
|||
justify-content: end;
|
||||
}
|
||||
}
|
||||
|
||||
.chart {
|
||||
width: 60%;
|
||||
height: 70%;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
|
||||
.chart {
|
||||
|
@ -484,6 +491,8 @@
|
|||
}
|
||||
|
||||
.cycle-time-container {
|
||||
position: relative;
|
||||
|
||||
.cycle-main {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
@ -519,6 +528,14 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.chart {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 10px;
|
||||
width: 60%;
|
||||
height: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
.overallDowntime-container {
|
||||
|
|
|
@ -144,7 +144,7 @@
|
|||
|
||||
&.active {
|
||||
background: var(--background-color-button);
|
||||
color: var(--text-color);
|
||||
color: var(--text-button-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -193,7 +193,7 @@ export type FloorItemType = {
|
|||
modelName: string;
|
||||
position: [number, number, number];
|
||||
rotation: { x: number; y: number; z: number };
|
||||
modelfileID: string;
|
||||
assetId: string;
|
||||
isLocked: boolean;
|
||||
isVisible: boolean;
|
||||
eventData?: {
|
||||
|
@ -224,7 +224,7 @@ interface WallItem {
|
|||
type: "fixed-move" | "free-move" | undefined;
|
||||
model?: THREE.Group;
|
||||
modelUuid?: string;
|
||||
modelfileID: string;
|
||||
assetId: string;
|
||||
modelName?: string;
|
||||
scale?: [number, number, number];
|
||||
csgscale?: [number, number, number];
|
||||
|
|
|
@ -5,7 +5,6 @@ import {
|
|||
useActiveSubTool,
|
||||
useActiveTool,
|
||||
useAddAction,
|
||||
useDeleteTool,
|
||||
useRenameModeStore,
|
||||
useSaveVersion,
|
||||
useSelectedFloorItem,
|
||||
|
@ -32,7 +31,6 @@ const KeyPressListener: React.FC = () => {
|
|||
const { setToolMode } = useToolMode();
|
||||
const { isPlaying, setIsPlaying } = usePlayButtonStore();
|
||||
const { toggleView, setToggleView } = useToggleView();
|
||||
const { setDeleteTool } = useDeleteTool();
|
||||
const { setAddAction } = useAddAction();
|
||||
const { setSelectedWallItem } = useSelectedWallItem();
|
||||
const { setActiveTool } = useActiveTool();
|
||||
|
@ -60,7 +58,6 @@ const KeyPressListener: React.FC = () => {
|
|||
};
|
||||
const module = modules[keyCombination];
|
||||
if (module && !toggleView) {
|
||||
console.log("hi");
|
||||
setActiveTool("cursor");
|
||||
setActiveSubTool("cursor");
|
||||
if (module === "market") setToggleUI(false, false);
|
||||
|
@ -91,7 +88,6 @@ const KeyPressListener: React.FC = () => {
|
|||
setToggleUI(toggleTo2D, toggleTo2D);
|
||||
if (toggleTo2D) {
|
||||
setSelectedWallItem(null);
|
||||
setDeleteTool(false);
|
||||
setAddAction(null);
|
||||
}
|
||||
setActiveTool("cursor");
|
||||
|
|
Loading…
Reference in New Issue