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

assets added based on categoryin builder

Browse Source
This commit is contained in:
Poovizhi99
2025-03-31 12:07:25 +05:30
parent 988d7c92db
commit e1200f52d0
10 changed files with 543 additions and 478 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
app/.env
View File

@@ -8,7 +8,8 @@ REACT_APP_SERVER_SOCKET_API_BASE_URL=185.100.212.76:8000
REACT_APP_SERVER_REST_API_BASE_URL=185.100.212.76:5000 REACT_APP_SERVER_REST_API_BASE_URL=185.100.212.76:5000
# Base URL for the server marketplace API. # Base URL for the server marketplace API.
REACT_APP_SERVER_MARKETPLACE_URL=185.100.212.76:50011 # REACT_APP_SERVER_MARKETPLACE_URL=185.100.212.76:50011
REACT_APP_SERVER_MARKETPLACE_URL=192.168.0.111:3501
# base url for IoT socket server # base url for IoT socket server
REACT_APP_IOT_SOCKET_SERVER_URL =185.100.212.76:5010 REACT_APP_IOT_SOCKET_SERVER_URL =185.100.212.76:5010

81
app/src/components/layout/sidebarLeft/Assets.tsx
View File

@@ -1,13 +1,29 @@
import React, { useState } from "react"; import React, { useEffect, useState } from "react";
import Search from "../../ui/inputs/Search"; import Search from "../../ui/inputs/Search";
import vehicle from "../../../assets/image/vehicles.png"; import vehicle from "../../../assets/image/vehicles.png";
import workStation from "../../../assets/image/workStation.png"; import workStation from "../../../assets/image/workStation.png";
import machines from "../../../assets/image/machines.png"; import machines from "../../../assets/image/machines.png";
import feneration from "../../../assets/image/feneration.png"; import feneration from "../../../assets/image/feneration.png";
import worker from "../../../assets/image/worker.png"; import worker from "../../../assets/image/worker.png";
import { getCategoryAsset } from "../../../services/factoryBuilder/assest/assets/getCategoryAsset";
interface AssetProp {
filename: string;
thumbnail: string;
category: string;
description: string;
tags: string;
url: String;
uploadDate: number;
isArchieve: boolean;
animated: boolean;
price: number;
CreatedBy: String;
}
const Assets: React.FC = () => { const Assets: React.FC = () => {
const [searchValue, setSearchValue] = useState<string>(""); const [searchValue, setSearchValue] = useState<string>("");
const [selectedCategory, setSelectedCategory] = useState<string | null>(null); const [selectedCategory, setSelectedCategory] = useState<string | null>(null);
const [filteredAsset, setFilteredAsset] = useState<AssetProp[]>([]);
const handleSearchChange = (value: string) => { const handleSearchChange = (value: string) => {
setSearchValue(value); setSearchValue(value);
@@ -34,56 +50,18 @@ const Assets: React.FC = () => {
categoryImage: feneration, categoryImage: feneration,
}, },
{ {
assetName: "Forklift",
assetImage: "",
category: "Vehicles", category: "Vehicles",
categoryImage: vehicle, categoryImage: vehicle,
}, },
{ {
assetName: "AGV",
assetImage: "",
category: "Vehicles",
categoryImage: vehicle,
},
{
assetName: "Pallet",
assetImage: "",
category: "Workstation", category: "Workstation",
categoryImage: workStation, categoryImage: workStation,
}, },
{ {
assetName: "Controller",
assetImage: "",
category: "Workstation",
categoryImage: workStation,
},
{
assetName: "Conveyor",
assetImage: "",
category: "Workstation",
categoryImage: workStation,
},
{
assetName: "VMC",
assetImage: "",
category: "Machines", category: "Machines",
categoryImage: machines, categoryImage: machines,
}, },
{ {
assetName: "CMC",
assetImage: "",
category: "Machines",
categoryImage: machines,
},
{
assetName: "Male Worker",
assetImage: "",
category: "Workers",
categoryImage: worker,
},
{
assetName: "Female Worker",
assetImage: "",
category: "Workers", category: "Workers",
categoryImage: worker, categoryImage: worker,
}, },
@@ -94,12 +72,13 @@ const Assets: React.FC = () => {
new Set(categoryList.map((asset) => asset.category)) new Set(categoryList.map((asset) => asset.category))
); );
// Filter assets based on the selected category const fetchCategoryAssets = async (asset: any) => {
const filteredAssets = try {
selectedCategory !== null setSelectedCategory(asset);
? categoryList.filter((asset) => asset.category === selectedCategory) const res = await getCategoryAsset(asset);
: []; setFilteredAsset(res);
} catch (error) {}
};
return ( return (
<div className="assets-container"> <div className="assets-container">
<Search onChange={handleSearchChange} /> <Search onChange={handleSearchChange} />
@@ -118,14 +97,15 @@ const Assets: React.FC = () => {
</div> </div>
<h2>{selectedCategory}</h2> <h2>{selectedCategory}</h2>
<div className="assets-container"> <div className="assets-container">
{filteredAssets.map((asset, index) => ( {filteredAsset &&
filteredAsset?.map((asset: any, index: number) => (
<div key={index} className="assets"> <div key={index} className="assets">
<img <img
src={asset.assetImage} src={asset.thumbnail}
alt={asset.assetName} alt={asset.filename}
className="asset-image" className="asset-image"
/> />
<div className="asset-name">{asset.assetName}</div> <div className="asset-name">{asset.filename}</div>
</div> </div>
))} ))}
</div> </div>
@@ -142,7 +122,7 @@ const Assets: React.FC = () => {
<div <div
key={index} key={index}
className="category" className="category"
onClick={() => setSelectedCategory(category)} onClick={() => fetchCategoryAssets(category)}
> >
<img <img
src={categoryInfo?.categoryImage || ""} src={categoryInfo?.categoryImage || ""}
@@ -161,4 +141,3 @@ const Assets: React.FC = () => {
}; };
export default Assets; export default Assets;

9
app/src/components/layout/sidebarRight/analysis/RenderAnalysisInputs.tsx
View File

@@ -27,7 +27,14 @@ const RenderAnalysisInputs: React.FC<InputRendererProps> = ({
); );
} }
if (preset.type === "range") { if (preset.type === "range") {
return <InputRange key={index} label={preset.inputs.label} />; return (
<InputRange
key={index}
label={preset.inputs.label}
min={0}
max={0}
/>
);
} }
return null; return null;
})} })}

17
app/src/components/layout/sidebarRight/properties/AssetProperties.tsx
View File

@@ -17,12 +17,6 @@ const AssetProperties: React.FC = () => {
const [userData, setUserData] = useState<UserData[]>([]); // State to track user data const [userData, setUserData] = useState<UserData[]>([]); // State to track user data
const [nextId, setNextId] = useState(1); // Unique ID for new entries const [nextId, setNextId] = useState(1); // Unique ID for new entries
const { selectedFloorItem } = useselectedFloorItem(); const { selectedFloorItem } = useselectedFloorItem();
let xValue = selectedFloorItem.position.x;
let zValue = selectedFloorItem.position.z;
let rotationRad = selectedFloorItem.rotation.y;
let rotationDeg = THREE.MathUtils.radToDeg(rotationRad);
// useEffect(() => {}, [selectedFloorItem]);
// Function to handle adding new user data // Function to handle adding new user data
const handleAddUserData = () => { const handleAddUserData = () => {
const newUserData: UserData = { const newUserData: UserData = {
@@ -59,10 +53,15 @@ const AssetProperties: React.FC = () => {
<PositionInput <PositionInput
onChange={() => {}} onChange={() => {}}
value1={xValue.toFixed(5)} value1={selectedFloorItem.position.x.toFixed(5)}
value2={zValue.toFixed(5)} value2={selectedFloorItem.position.z.toFixed(5)}
/>
<RotationInput
onChange={() => {}}
value={parseFloat(
THREE.MathUtils.radToDeg(selectedFloorItem.rotation.y).toFixed(5)
)}
/> />
<RotationInput onChange={() => {}} value={rotationDeg} />
<div className="split"></div> <div className="split"></div>

21
app/src/components/layout/sidebarRight/properties/GlobalProperties.tsx
View File

@@ -16,7 +16,7 @@ import {
useWallVisibility, useWallVisibility,
} from "../../../../store/store"; } from "../../../../store/store";
import { setEnvironment } from "../../../../services/factoryBuilder/environment/setEnvironment"; import { setEnvironment } from "../../../../services/factoryBuilder/environment/setEnvironment";
import * as CONSTANTS from "../../../../types/world/worldConstants";
const GlobalProperties: React.FC = () => { const GlobalProperties: React.FC = () => {
const { toggleView, setToggleView } = useToggleView(); const { toggleView, setToggleView } = useToggleView();
const { selectedWallItem, setSelectedWallItem } = useSelectedWallItem(); const { selectedWallItem, setSelectedWallItem } = useSelectedWallItem();
@@ -29,18 +29,20 @@ const GlobalProperties: React.FC = () => {
const { renderDistance, setRenderDistance } = useRenderDistance(); const { renderDistance, setRenderDistance } = useRenderDistance();
const { socket } = useSocketStore(); const { socket } = useSocketStore();
const [limitDistance, setLimitDistance] = useState(false); const [limitDistance, setLimitDistance] = useState(false);
const [distance, setDistance] = useState<number>(5); const [distance, setDistance] = useState<number>(30);
const [limitGridDistance, setLimitGridDistance] = useState(false); const [limitGridDistance, setLimitGridDistance] = useState(false);
const [gridDistance, setGridDistance] = useState<number>(5); const [gridDistance, setGridDistance] = useState<number>(5);
function optimizeScene() { function optimizeScene() {
setLimitDistance(true); setLimitDistance(true);
setDistance(5); setDistance(30);
} }
function updateDistance(value: number) { function updateDistance(value: number) {
console.log("value: ", value);
setDistance(value); setDistance(value);
setRenderDistance(value);
} }
function updateGridDistance(value: number) { function updateGridDistance(value: number) {
@@ -134,6 +136,15 @@ const GlobalProperties: React.FC = () => {
} }
}; };
// function changeRenderDistance(e: any) {
// if (parseInt(e.target.value) < 20) {
// setRenderDistance(20);
// } else if (parseInt(e.target.value) > 75) {
// setRenderDistance(75);
// } else {
// setRenderDistance(parseInt(e.target.value));
// }
// }
return ( return (
<div className="global-properties-container"> <div className="global-properties-container">
<div className="header">Environment</div> <div className="header">Environment</div>
@@ -169,7 +180,7 @@ const GlobalProperties: React.FC = () => {
/> />
<div className="split"></div> <div className="split"></div>
{/* //visibleEdgeColor={CONSTANTS.outlineConfig.assetDeleteColor} */}
<InputToggle <InputToggle
inputKey="4" inputKey="4"
label="Limit Render Distance" label="Limit Render Distance"
@@ -183,6 +194,8 @@ const GlobalProperties: React.FC = () => {
disabled={!limitDistance} disabled={!limitDistance}
value={distance} value={distance}
key={"5"} key={"5"}
min={CONSTANTS.distanceConfig.minDistance}
max={CONSTANTS.distanceConfig.maxDistance}
onChange={(value: number) => updateDistance(value)} onChange={(value: number) => updateDistance(value)}
/> />

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

@@ -62,9 +62,15 @@ const Tools: React.FC = () => {
// Reset activeTool whenever activeModule changes // Reset activeTool whenever activeModule changes
useEffect(() => { useEffect(() => {
setToggleUI(localStorage.getItem('navBarUi') ? localStorage.getItem('navBarUi') === 'true' : true) setToggleUI(
localStorage.getItem("navBarUi")
? localStorage.getItem("navBarUi") === "true"
: true
);
}, []); }, []);
useEffect(() => {
console.log("activeModule", activeModule);
}, [activeModule]);
useEffect(() => { useEffect(() => {
setActiveTool(activeSubTool); setActiveTool(activeSubTool);
setActiveSubTool(activeSubTool); setActiveSubTool(activeSubTool);
@@ -80,7 +86,11 @@ const Tools: React.FC = () => {
} else { } else {
setToggleView(false); setToggleView(false);
} }
setToggleUI(localStorage.getItem('navBarUi') ? localStorage.getItem('navBarUi') === 'true' : true) setToggleUI(
localStorage.getItem("navBarUi")
? localStorage.getItem("navBarUi") === "true"
: true
);
setToggleThreeD(!toggleThreeD); setToggleThreeD(!toggleThreeD);
setActiveSubTool("cursor"); setActiveSubTool("cursor");
setActiveTool("cursor"); setActiveTool("cursor");
@@ -202,7 +212,8 @@ const Tools: React.FC = () => {
<div className="activeDropicon"> <div className="activeDropicon">
{activeSubTool == "cursor" && ( {activeSubTool == "cursor" && (
<div <div
className={`tool-button ${activeTool === "cursor" ? "active" : "" className={`tool-button ${
activeTool === "cursor" ? "active" : ""
}`} }`}
onClick={() => { onClick={() => {
setActiveTool("cursor"); setActiveTool("cursor");
@@ -213,7 +224,8 @@ const Tools: React.FC = () => {
)} )}
{activeSubTool == "free-hand" && ( {activeSubTool == "free-hand" && (
<div <div
className={`tool-button ${activeTool === "free-hand" ? "active" : "" className={`tool-button ${
activeTool === "free-hand" ? "active" : ""
}`} }`}
onClick={() => { onClick={() => {
setActiveTool("free-hand"); setActiveTool("free-hand");
@@ -224,7 +236,8 @@ const Tools: React.FC = () => {
)} )}
{activeSubTool == "delete" && ( {activeSubTool == "delete" && (
<div <div
className={`tool-button ${activeTool === "delete" ? "active" : "" className={`tool-button ${
activeTool === "delete" ? "active" : ""
}`} }`}
onClick={() => { onClick={() => {
setActiveTool("delete"); setActiveTool("delete");
@@ -297,7 +310,8 @@ const Tools: React.FC = () => {
<div className="split"></div> <div className="split"></div>
<div className="draw-tools"> <div className="draw-tools">
<div <div
className={`tool-button ${activeTool === "draw-wall" ? "active" : "" className={`tool-button ${
activeTool === "draw-wall" ? "active" : ""
}`} }`}
onClick={() => { onClick={() => {
setActiveTool("draw-wall"); setActiveTool("draw-wall");
@@ -307,7 +321,8 @@ const Tools: React.FC = () => {
<WallIcon isActive={activeTool === "draw-wall"} /> <WallIcon isActive={activeTool === "draw-wall"} />
</div> </div>
<div <div
className={`tool-button ${activeTool === "draw-zone" ? "active" : "" className={`tool-button ${
activeTool === "draw-zone" ? "active" : ""
}`} }`}
onClick={() => { onClick={() => {
setActiveTool("draw-zone"); setActiveTool("draw-zone");
@@ -317,7 +332,8 @@ const Tools: React.FC = () => {
<ZoneIcon isActive={activeTool === "draw-zone"} /> <ZoneIcon isActive={activeTool === "draw-zone"} />
</div> </div>
<div <div
className={`tool-button ${activeTool === "draw-aisle" ? "active" : "" className={`tool-button ${
activeTool === "draw-aisle" ? "active" : ""
}`} }`}
onClick={() => { onClick={() => {
setActiveTool("draw-aisle"); setActiveTool("draw-aisle");
@@ -327,7 +343,8 @@ const Tools: React.FC = () => {
<AsileIcon isActive={activeTool === "draw-aisle"} /> <AsileIcon isActive={activeTool === "draw-aisle"} />
</div> </div>
<div <div
className={`tool-button ${activeTool === "draw-floor" ? "active" : "" className={`tool-button ${
activeTool === "draw-floor" ? "active" : ""
}`} }`}
onClick={() => { onClick={() => {
setActiveTool("draw-floor"); setActiveTool("draw-floor");
@@ -344,7 +361,8 @@ const Tools: React.FC = () => {
<div className="split"></div> <div className="split"></div>
<div className="draw-tools"> <div className="draw-tools">
<div <div
className={`tool-button ${activeTool === "measure" ? "active" : "" className={`tool-button ${
activeTool === "measure" ? "active" : ""
}`} }`}
onClick={() => { onClick={() => {
setActiveTool("measure"); setActiveTool("measure");
@@ -361,7 +379,8 @@ const Tools: React.FC = () => {
<div className="split"></div> <div className="split"></div>
<div className="draw-tools"> <div className="draw-tools">
<div <div
className={`tool-button ${activeTool === "pen" ? "active" : "" className={`tool-button ${
activeTool === "pen" ? "active" : ""
}`} }`}
onClick={() => { onClick={() => {
setActiveTool("pen"); setActiveTool("pen");
@@ -394,7 +413,8 @@ const Tools: React.FC = () => {
<div className="split"></div> <div className="split"></div>
<div className="general-options"> <div className="general-options">
<div <div
className={`tool-button ${activeTool === "comment" ? "active" : "" className={`tool-button ${
activeTool === "comment" ? "active" : ""
}`} }`}
onClick={() => { onClick={() => {
setActiveTool("comment"); setActiveTool("comment");
@@ -404,7 +424,8 @@ const Tools: React.FC = () => {
</div> </div>
{toggleThreeD && ( {toggleThreeD && (
<div <div
className={`tool-button ${activeTool === "play" ? "active" : "" className={`tool-button ${
activeTool === "play" ? "active" : ""
}`} }`}
onClick={() => { onClick={() => {
setIsPlaying(!isPlaying); setIsPlaying(!isPlaying);
@@ -416,7 +437,8 @@ const Tools: React.FC = () => {
</div> </div>
<div className="split"></div> <div className="split"></div>
<div <div
className={`toggle-threed-button${toggleThreeD ? " toggled" : "" className={`toggle-threed-button${
toggleThreeD ? " toggled" : ""
}`} }`}
onClick={toggleSwitch} onClick={toggleSwitch}
> >

7
app/src/components/ui/inputs/InputRange.tsx
View File

@@ -1,5 +1,5 @@
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import * as CONSTANTS from "../../../types/world/worldConstants";
interface InputToggleProps { interface InputToggleProps {
label: string; // Represents the toggle state (on/off) label: string; // Represents the toggle state (on/off)
min?: number; min?: number;
@@ -14,8 +14,8 @@ const InputRange: React.FC<InputToggleProps> = ({
label, label,
onClick, onClick,
onChange, onChange,
min = 0, min,
max = 10, max,
disabled, disabled,
value = 5, value = 5,
}) => { }) => {
@@ -23,6 +23,7 @@ const InputRange: React.FC<InputToggleProps> = ({
function handleChange(e: React.ChangeEvent<HTMLInputElement>) { function handleChange(e: React.ChangeEvent<HTMLInputElement>) {
const newValue = parseInt(e.target.value); // Parse the value to an integer const newValue = parseInt(e.target.value); // Parse the value to an integer
setRangeValue(newValue); // Update the local state setRangeValue(newValue); // Update the local state
if (onChange) { if (onChange) {

60
app/src/modules/scene/postProcessing/postProcessing.tsx
View File

@@ -1,9 +1,16 @@
import * as THREE from 'three' import * as THREE from "three";
import { EffectComposer, N8AO, Outline } from '@react-three/postprocessing' import { EffectComposer, N8AO, Outline } from "@react-three/postprocessing";
import { BlendFunction } from 'postprocessing' import { BlendFunction } from "postprocessing";
import { useDeletableFloorItem, useSelectedActionSphere, useSelectedPath, useSelectedWallItem, useselectedFloorItem } from '../../../store/store'; import {
import * as Types from '../../../types/world/worldTypes' useDeletableFloorItem,
import * as CONSTANTS from '../../../types/world/worldConstants'; useSelectedActionSphere,
useSelectedPath,
useSelectedWallItem,
useselectedFloorItem,
} from "../../../store/store";
import * as Types from "../../../types/world/worldTypes";
import * as CONSTANTS from "../../../types/world/worldConstants";
import { useEffect } from "react";
export default function PostProcessing() { export default function PostProcessing() {
const { deletableFloorItem, setDeletableFloorItem } = useDeletableFloorItem(); const { deletableFloorItem, setDeletableFloorItem } = useDeletableFloorItem();
@@ -14,7 +21,7 @@ export default function PostProcessing() {
function flattenChildren(children: any[]) { function flattenChildren(children: any[]) {
const allChildren: any[] = []; const allChildren: any[] = [];
children.forEach(child => { children.forEach((child) => {
allChildren.push(child); allChildren.push(child);
if (child.children && child.children.length > 0) { if (child.children && child.children.length > 0) {
allChildren.push(...flattenChildren(child.children)); allChildren.push(...flattenChildren(child.children));
@@ -26,8 +33,16 @@ export default function PostProcessing() {
return ( return (
<> <>
<EffectComposer autoClear={false}> <EffectComposer autoClear={false}>
<N8AO color="black" aoRadius={20} intensity={7} distanceFalloff={4} aoSamples={32} denoiseRadius={6} denoiseSamples={16} /> <N8AO
{deletableFloorItem && color="black"
aoRadius={20}
intensity={7}
distanceFalloff={4}
aoSamples={32}
denoiseRadius={6}
denoiseSamples={16}
/>
{deletableFloorItem && (
<Outline <Outline
selection={flattenChildren(deletableFloorItem.children)} selection={flattenChildren(deletableFloorItem.children)}
selectionLayer={10} selectionLayer={10}
@@ -41,14 +56,12 @@ export default function PostProcessing() {
blur={true} blur={true}
xRay={true} xRay={true}
/> />
} )}
{selectedWallItem && {selectedWallItem && (
<Outline <Outline
selection={ selection={selectedWallItem.children[1].children[0].children.filter(
selectedWallItem.children[1].children[0].children.filter(
(child: Types.Mesh) => child.name !== "CSG_REF" (child: Types.Mesh) => child.name !== "CSG_REF"
) )}
}
selectionLayer={10} selectionLayer={10}
width={3000} width={3000}
blendFunction={BlendFunction.ALPHA} blendFunction={BlendFunction.ALPHA}
@@ -59,8 +72,9 @@ export default function PostProcessing() {
hiddenEdgeColor={CONSTANTS.outlineConfig.assetSelectColor} hiddenEdgeColor={CONSTANTS.outlineConfig.assetSelectColor}
blur={true} blur={true}
xRay={true} xRay={true}
/>} />
{selectedFloorItem && )}
{selectedFloorItem && (
<Outline <Outline
selection={flattenChildren(selectedFloorItem.children)} selection={flattenChildren(selectedFloorItem.children)}
selectionLayer={10} selectionLayer={10}
@@ -74,8 +88,8 @@ export default function PostProcessing() {
blur={true} blur={true}
xRay={true} xRay={true}
/> />
} )}
{selectedActionSphere && {selectedActionSphere && (
<Outline <Outline
selection={[selectedActionSphere.point]} selection={[selectedActionSphere.point]}
selectionLayer={10} selectionLayer={10}
@@ -89,8 +103,8 @@ export default function PostProcessing() {
blur={true} blur={true}
xRay={true} xRay={true}
/> />
} )}
{selectedPath && {selectedPath && (
<Outline <Outline
selection={flattenChildren(selectedPath.group.children)} selection={flattenChildren(selectedPath.group.children)}
selectionLayer={10} selectionLayer={10}
@@ -104,8 +118,8 @@ export default function PostProcessing() {
blur={true} blur={true}
xRay={true} xRay={true}
/> />
} )}
</EffectComposer> </EffectComposer>
</> </>
) );
} }

23
app/src/services/factoryBuilder/assest/assets/getCategoryAsset.ts Normal file
View File

@@ -0,0 +1,23 @@
let BackEnd_url = `http://${process.env.REACT_APP_SERVER_MARKETPLACE_URL}`;
export const getCategoryAsset = async (categoryName: any) => {
console.log("categoryName:api ", categoryName);
try {
const response = await fetch(
`${BackEnd_url}/api/v2/getCatagoryAssets/${categoryName}`,
{
method: "GET",
headers: {
"Content-Type": "application/json",
},
// body: JSON.stringify({ filename }),
}
);
const result = await response.json();
console.log("result: ", result);
return result;
} catch (error: any) {
// console.error("Error fetching category:", error.message);
throw new Error(error.message);
}
};

116
app/src/types/world/worldConstants.ts
View File

@@ -56,7 +56,6 @@ export type ThreeDimension = {
rightMouse: number; rightMouse: number;
}; };
export type GridConfig = { export type GridConfig = {
size: number; size: number;
divisions: number; divisions: number;
@@ -65,7 +64,7 @@ export type GridConfig = {
position2D: [x: number, y: number, z: number]; position2D: [x: number, y: number, z: number];
position3D: [x: number, y: number, z: number]; position3D: [x: number, y: number, z: number];
} };
export type PlaneConfig = { export type PlaneConfig = {
position2D: [x: number, y: number, z: number]; position2D: [x: number, y: number, z: number];
@@ -75,27 +74,27 @@ export type PlaneConfig = {
width: number; width: number;
height: number; height: number;
color: string; color: string;
} };
export type ShadowConfig = { export type ShadowConfig = {
shadowOffset: number, shadowOffset: number;
shadowmapSizewidth: number, shadowmapSizewidth: number;
shadowmapSizeheight: number, shadowmapSizeheight: number;
shadowcamerafar: number, shadowcamerafar: number;
shadowcameranear: number, shadowcameranear: number;
shadowcameratop: number, shadowcameratop: number;
shadowcamerabottom: number, shadowcamerabottom: number;
shadowcameraleft: number, shadowcameraleft: number;
shadowcameraright: number, shadowcameraright: number;
shadowbias: number, shadowbias: number;
shadownormalBias: number, shadownormalBias: number;
shadowMaterialPosition: [x: number, y: number, z: number], shadowMaterialPosition: [x: number, y: number, z: number];
shadowMaterialRotation: [x: number, y: number, z: number], shadowMaterialRotation: [x: number, y: number, z: number];
shadowMaterialOpacity: number, shadowMaterialOpacity: number;
} };
export type SkyConfig = { export type SkyConfig = {
defaultTurbidity: number; defaultTurbidity: number;
@@ -105,12 +104,12 @@ export type SkyConfig = {
mieCoefficient: number; mieCoefficient: number;
mieDirectionalG: number; mieDirectionalG: number;
skyDistance: number; skyDistance: number;
} };
export type AssetConfig = { export type AssetConfig = {
defaultScaleBeforeGsap: [number, number, number]; defaultScaleBeforeGsap: [number, number, number];
defaultScaleAfterGsap: [number, number, number]; defaultScaleAfterGsap: [number, number, number];
} };
export type PointConfig = { export type PointConfig = {
defaultInnerColor: string; defaultInnerColor: string;
@@ -124,7 +123,7 @@ export type PointConfig = {
zoneOuterColor: string; zoneOuterColor: string;
snappingThreshold: number; snappingThreshold: number;
} };
export type LineConfig = { export type LineConfig = {
tubularSegments: number; tubularSegments: number;
@@ -146,50 +145,52 @@ export type LineConfig = {
aisleColor: string; aisleColor: string;
zoneColor: string; zoneColor: string;
helperColor: string; helperColor: string;
} };
export type WallConfig = { export type WallConfig = {
defaultColor: string; defaultColor: string;
height: number; height: number;
width: number; width: number;
} };
export type FloorConfig = { export type FloorConfig = {
defaultColor: string; defaultColor: string;
height: number; height: number;
textureScale: number; textureScale: number;
} };
export type RoofConfig = { export type RoofConfig = {
defaultColor: string; defaultColor: string;
height: number; height: number;
} };
export type AisleConfig = { export type AisleConfig = {
width: number; width: number;
height: number; height: number;
defaultColor: number; defaultColor: number;
} };
export type ZoneConfig = { export type ZoneConfig = {
defaultColor: string; defaultColor: string;
color: string; color: string;
} };
export type ColumnConfig = { export type ColumnConfig = {
defaultColor: string; defaultColor: string;
} };
export type OutlineConfig = { export type OutlineConfig = {
assetSelectColor: number; assetSelectColor: number;
assetDeleteColor: number; assetDeleteColor: number;
} };
export type DistanceConfig = {
minDistance: number;
maxDistance: number;
};
export const firstPersonControls: Controls = { export const firstPersonControls: Controls = {
azimuthRotateSpeed: 0.3, // Speed of rotation around the azimuth axis azimuthRotateSpeed: 0.3, // Speed of rotation around the azimuth axis
@@ -261,7 +262,7 @@ export const gridConfig: GridConfig = {
position2D: [0, 0.1, 0], // Position of the grid in 2D view position2D: [0, 0.1, 0], // Position of the grid in 2D view
position3D: [0, -0.5, 0], // Position of the grid in 3D view position3D: [0, -0.5, 0], // Position of the grid in 3D view
} };
export const planeConfig: PlaneConfig = { export const planeConfig: PlaneConfig = {
position2D: [0, -0.5, 0], // Position of the plane position2D: [0, -0.5, 0], // Position of the plane
@@ -270,8 +271,8 @@ export const planeConfig: PlaneConfig = {
width: 300, // Width of the plane width: 300, // Width of the plane
height: 300, // Height of the plane height: 300, // Height of the plane
color: "#f3f3f3" // Color of the plane color: "#f3f3f3", // Color of the plane
} };
export const shadowConfig: ShadowConfig = { export const shadowConfig: ShadowConfig = {
shadowOffset: 50, // Offset of the shadow shadowOffset: 50, // Offset of the shadow
@@ -292,8 +293,8 @@ export const shadowConfig: ShadowConfig = {
shadowMaterialPosition: [0, 0.01, 0], // Position of the shadow material shadowMaterialPosition: [0, 0.01, 0], // Position of the shadow material
shadowMaterialRotation: [-Math.PI / 2, 0, 0], // Rotation of the shadow material shadowMaterialRotation: [-Math.PI / 2, 0, 0], // Rotation of the shadow material
shadowMaterialOpacity: 0.1 // Opacity of the shadow material shadowMaterialOpacity: 0.1, // Opacity of the shadow material
} };
export const skyConfig: SkyConfig = { export const skyConfig: SkyConfig = {
defaultTurbidity: 10.0, // Default turbidity of the sky defaultTurbidity: 10.0, // Default turbidity of the sky
@@ -302,13 +303,13 @@ export const skyConfig: SkyConfig = {
defaultRayleigh: 1.9, // Default Rayleigh scattering coefficient defaultRayleigh: 1.9, // Default Rayleigh scattering coefficient
mieCoefficient: 0.1, // Mie scattering coefficient mieCoefficient: 0.1, // Mie scattering coefficient
mieDirectionalG: 1.0, // Mie directional G mieDirectionalG: 1.0, // Mie directional G
skyDistance: 2000 // Distance of the sky skyDistance: 2000, // Distance of the sky
} };
export const assetConfig: AssetConfig = { export const assetConfig: AssetConfig = {
defaultScaleBeforeGsap: [0.1, 0.1, 0.1], // Default scale of the assets defaultScaleBeforeGsap: [0.1, 0.1, 0.1], // Default scale of the assets
defaultScaleAfterGsap: [1, 1, 1] // Default scale of the assets defaultScaleAfterGsap: [1, 1, 1], // Default scale of the assets
} };
export const pointConfig: PointConfig = { export const pointConfig: PointConfig = {
defaultInnerColor: "#ffffff", // Default inner color of the points defaultInnerColor: "#ffffff", // Default inner color of the points
@@ -322,7 +323,7 @@ export const pointConfig: PointConfig = {
zoneOuterColor: "#007BFF", // Outer color of the zone points zoneOuterColor: "#007BFF", // Outer color of the zone points
snappingThreshold: 1, // Threshold for snapping snappingThreshold: 1, // Threshold for snapping
} };
export const lineConfig: LineConfig = { export const lineConfig: LineConfig = {
tubularSegments: 64, // Number of tubular segments tubularSegments: 64, // Number of tubular segments
@@ -343,42 +344,47 @@ export const lineConfig: LineConfig = {
floorColor: "#808080", // Color of the floor lines floorColor: "#808080", // Color of the floor lines
aisleColor: "#FBBC05", // Color of the aisle lines aisleColor: "#FBBC05", // Color of the aisle lines
zoneColor: "#007BFF", // Color of the zone lines zoneColor: "#007BFF", // Color of the zone lines
helperColor: "#C164FF" // Color of the helper lines helperColor: "#C164FF", // Color of the helper lines
} };
export const wallConfig: WallConfig = { export const wallConfig: WallConfig = {
defaultColor: "white", // Default color of the walls defaultColor: "white", // Default color of the walls
height: 7, // Height of the walls height: 7, // Height of the walls
width: 0.05, // Width of the walls width: 0.05, // Width of the walls
} };
export const floorConfig: FloorConfig = { export const floorConfig: FloorConfig = {
defaultColor: "grey", // Default color of the floors defaultColor: "grey", // Default color of the floors
height: 0.1, // Height of the floors height: 0.1, // Height of the floors
textureScale: 0.1, // Scale of the floor texture textureScale: 0.1, // Scale of the floor texture
} };
export const roofConfig: RoofConfig = { export const roofConfig: RoofConfig = {
defaultColor: "grey", // Default color of the roofs defaultColor: "grey", // Default color of the roofs
height: 0.1 // Height of the roofs height: 0.1, // Height of the roofs
} };
export const aisleConfig: AisleConfig = { export const aisleConfig: AisleConfig = {
width: 0.1, // Width of the aisles width: 0.1, // Width of the aisles
height: 0.01, // Height of the aisles height: 0.01, // Height of the aisles
defaultColor: 0xffff00 // Default color of the aisles defaultColor: 0xffff00, // Default color of the aisles
} };
export const zoneConfig: ZoneConfig = { export const zoneConfig: ZoneConfig = {
defaultColor: "black", // Default color of the zones defaultColor: "black", // Default color of the zones
color: "blue" // Color of the zones color: "blue", // Color of the zones
} };
export const columnConfig: ColumnConfig = { export const columnConfig: ColumnConfig = {
defaultColor: "White", // Default color of the columns defaultColor: "White", // Default color of the columns
} };
export const outlineConfig: OutlineConfig = { export const outlineConfig: OutlineConfig = {
assetSelectColor: 0x0054fE, // Color of the selected assets assetSelectColor: 0x0054fe, // Color of the selected assets
assetDeleteColor: 0xFF0000 // Color of the deleted assets assetDeleteColor: 0xff0000, // Color of the deleted assets
} };
export const distanceConfig: DistanceConfig = {
minDistance: 20,
maxDistance: 75,
};