Merge remote-tracking branch 'origin/simulation-agv' into simulation
This commit is contained in:
commit
b71fdbddbb
3
app/.env
3
app/.env
|
|
@ -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
|
||||
|
||||
# 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
|
||||
REACT_APP_IOT_SOCKET_SERVER_URL =185.100.212.76:5010
|
||||
|
|
|
|||
|
|
@ -1,105 +1,95 @@
|
|||
import React, { useState } from "react";
|
||||
import React, { useEffect, useMemo, useState } from "react";
|
||||
import Search from "../../ui/inputs/Search";
|
||||
import vehicle from "../../../assets/image/vehicles.png";
|
||||
import workStation from "../../../assets/image/workStation.png";
|
||||
import machines from "../../../assets/image/machines.png";
|
||||
import feneration from "../../../assets/image/feneration.png";
|
||||
import worker from "../../../assets/image/worker.png";
|
||||
import { getCategoryAsset } from "../../../services/factoryBuilder/assest/assets/getCategoryAsset";
|
||||
import arch from "../../../assets/gltf-glb/arch.glb";
|
||||
import door from "../../../assets/gltf-glb/door.glb";
|
||||
import window from "../../../assets/gltf-glb/window.glb";
|
||||
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 [searchValue, setSearchValue] = useState<string>("");
|
||||
const [selectedCategory, setSelectedCategory] = useState<string | null>(null);
|
||||
const [filteredAsset, setFilteredAsset] = useState<AssetProp[]>([]);
|
||||
|
||||
const handleSearchChange = (value: string) => {
|
||||
setSearchValue(value);
|
||||
setSelectedCategory(null); // Reset selected category when search changes
|
||||
};
|
||||
|
||||
const categoryList = [
|
||||
{
|
||||
assetName: "Doors",
|
||||
assetImage: "",
|
||||
category: "Feneration",
|
||||
categoryImage: feneration,
|
||||
},
|
||||
{
|
||||
assetName: "Windows",
|
||||
assetImage: "",
|
||||
category: "Feneration",
|
||||
categoryImage: feneration,
|
||||
},
|
||||
{
|
||||
assetName: "Pillars",
|
||||
assetImage: "",
|
||||
category: "Feneration",
|
||||
categoryImage: feneration,
|
||||
},
|
||||
{
|
||||
assetName: "Forklift",
|
||||
assetImage: "",
|
||||
category: "Vehicles",
|
||||
categoryImage: vehicle,
|
||||
},
|
||||
{
|
||||
assetName: "AGV",
|
||||
assetImage: "",
|
||||
category: "Vehicles",
|
||||
categoryImage: vehicle,
|
||||
},
|
||||
{
|
||||
assetName: "Pallet",
|
||||
assetImage: "",
|
||||
category: "Workstation",
|
||||
categoryImage: workStation,
|
||||
},
|
||||
{
|
||||
assetName: "Controller",
|
||||
assetImage: "",
|
||||
category: "Workstation",
|
||||
categoryImage: workStation,
|
||||
},
|
||||
{
|
||||
assetName: "Conveyor",
|
||||
assetImage: "",
|
||||
category: "Workstation",
|
||||
categoryImage: workStation,
|
||||
},
|
||||
{
|
||||
assetName: "VMC",
|
||||
assetImage: "",
|
||||
category: "Machines",
|
||||
categoryImage: machines,
|
||||
},
|
||||
{
|
||||
assetName: "CMC",
|
||||
assetImage: "",
|
||||
category: "Machines",
|
||||
categoryImage: machines,
|
||||
},
|
||||
{
|
||||
assetName: "Male Worker",
|
||||
assetImage: "",
|
||||
category: "Workers",
|
||||
categoryImage: worker,
|
||||
},
|
||||
{
|
||||
assetName: "Female Worker",
|
||||
assetImage: "",
|
||||
category: "Workers",
|
||||
categoryImage: worker,
|
||||
},
|
||||
];
|
||||
|
||||
// Get unique categories
|
||||
const uniqueCategories = Array.from(
|
||||
new Set(categoryList.map((asset) => asset.category))
|
||||
const categoryList = useMemo(
|
||||
() => [
|
||||
{
|
||||
assetName: "Doors",
|
||||
assetImage: "",
|
||||
category: "Feneration",
|
||||
categoryImage: feneration,
|
||||
},
|
||||
{
|
||||
assetName: "Windows",
|
||||
assetImage: "",
|
||||
category: "Feneration",
|
||||
categoryImage: feneration,
|
||||
},
|
||||
{
|
||||
assetName: "Pillars",
|
||||
assetImage: "",
|
||||
category: "Feneration",
|
||||
categoryImage: feneration,
|
||||
},
|
||||
{ category: "Vehicles", categoryImage: vehicle },
|
||||
{ category: "Workstation", categoryImage: workStation },
|
||||
{ category: "Machines", categoryImage: machines },
|
||||
{ category: "Workers", categoryImage: worker },
|
||||
],
|
||||
[]
|
||||
);
|
||||
|
||||
// Filter assets based on the selected category
|
||||
const filteredAssets =
|
||||
selectedCategory !== null
|
||||
? categoryList.filter((asset) => asset.category === selectedCategory)
|
||||
: [];
|
||||
const fetchCategoryAssets = async (asset: any) => {
|
||||
setSelectedCategory(asset);
|
||||
if (asset === "Feneration") {
|
||||
const localAssets: AssetProp[] = [
|
||||
{
|
||||
filename: "arch",
|
||||
category: "Feneration",
|
||||
url: arch,
|
||||
},
|
||||
{
|
||||
filename: "door",
|
||||
category: "Feneration",
|
||||
url: door,
|
||||
},
|
||||
{
|
||||
filename: "window",
|
||||
category: "Feneration",
|
||||
url: window,
|
||||
},
|
||||
];
|
||||
setFilteredAsset(localAssets);
|
||||
} else {
|
||||
try {
|
||||
const res = await getCategoryAsset(asset);
|
||||
setFilteredAsset(res || []); // Ensure it's always an array
|
||||
} catch (error) {}
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {}, [filteredAsset]);
|
||||
return (
|
||||
<div className="assets-container">
|
||||
<Search onChange={handleSearchChange} />
|
||||
|
|
@ -118,23 +108,36 @@ const Assets: React.FC = () => {
|
|||
</div>
|
||||
<h2>{selectedCategory}</h2>
|
||||
<div className="assets-container">
|
||||
{filteredAssets.map((asset, index) => (
|
||||
<div key={index} className="assets">
|
||||
<img
|
||||
src={asset.assetImage}
|
||||
alt={asset.assetName}
|
||||
className="asset-image"
|
||||
/>
|
||||
<div className="asset-name">{asset.assetName}</div>
|
||||
</div>
|
||||
))}
|
||||
{filteredAsset &&
|
||||
filteredAsset?.map((asset: any, index: number) => (
|
||||
<div key={index} className="assets">
|
||||
{asset?.thumbnail && (
|
||||
<img
|
||||
src={asset?.thumbnail}
|
||||
alt={asset.filename}
|
||||
className="asset-image"
|
||||
/>
|
||||
)}
|
||||
<div className="asset-name">
|
||||
{asset.filename
|
||||
.split("_")
|
||||
.map(
|
||||
(word: any) =>
|
||||
word.charAt(0).toUpperCase() + word.slice(1)
|
||||
)
|
||||
.join(" ")}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="assets-wrapper">
|
||||
<h2>Categories</h2>
|
||||
<div className="categories-container">
|
||||
{uniqueCategories.map((category, index) => {
|
||||
{Array.from(
|
||||
new Set(categoryList.map((asset) => asset.category))
|
||||
).map((category, index) => {
|
||||
const categoryInfo = categoryList.find(
|
||||
(asset) => asset.category === category
|
||||
);
|
||||
|
|
@ -142,7 +145,7 @@ const Assets: React.FC = () => {
|
|||
<div
|
||||
key={index}
|
||||
className="category"
|
||||
onClick={() => setSelectedCategory(category)}
|
||||
onClick={() => fetchCategoryAssets(category)}
|
||||
>
|
||||
<img
|
||||
src={categoryInfo?.categoryImage || ""}
|
||||
|
|
@ -161,4 +164,3 @@ const Assets: React.FC = () => {
|
|||
};
|
||||
|
||||
export default Assets;
|
||||
|
||||
|
|
|
|||
|
|
@ -27,7 +27,14 @@ const RenderAnalysisInputs: React.FC<InputRendererProps> = ({
|
|||
);
|
||||
}
|
||||
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;
|
||||
})}
|
||||
|
|
|
|||
|
|
@ -17,12 +17,6 @@ const AssetProperties: React.FC = () => {
|
|||
const [userData, setUserData] = useState<UserData[]>([]); // State to track user data
|
||||
const [nextId, setNextId] = useState(1); // Unique ID for new entries
|
||||
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
|
||||
const handleAddUserData = () => {
|
||||
const newUserData: UserData = {
|
||||
|
|
@ -57,10 +51,15 @@ const AssetProperties: React.FC = () => {
|
|||
|
||||
<PositionInput
|
||||
onChange={() => {}}
|
||||
value1={xValue.toFixed(5)}
|
||||
value2={zValue.toFixed(5)}
|
||||
value1={selectedFloorItem.position.x.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>
|
||||
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ import {
|
|||
useWallVisibility,
|
||||
} from "../../../../store/store";
|
||||
import { setEnvironment } from "../../../../services/factoryBuilder/environment/setEnvironment";
|
||||
|
||||
import * as CONSTANTS from "../../../../types/world/worldConstants";
|
||||
const GlobalProperties: React.FC = () => {
|
||||
const { toggleView, setToggleView } = useToggleView();
|
||||
const { selectedWallItem, setSelectedWallItem } = useSelectedWallItem();
|
||||
|
|
@ -29,18 +29,20 @@ const GlobalProperties: React.FC = () => {
|
|||
const { renderDistance, setRenderDistance } = useRenderDistance();
|
||||
const { socket } = useSocketStore();
|
||||
const [limitDistance, setLimitDistance] = useState(false);
|
||||
const [distance, setDistance] = useState<number>(5);
|
||||
const [distance, setDistance] = useState<number>(30);
|
||||
|
||||
const [limitGridDistance, setLimitGridDistance] = useState(false);
|
||||
const [gridDistance, setGridDistance] = useState<number>(5);
|
||||
|
||||
function optimizeScene() {
|
||||
setLimitDistance(true);
|
||||
setDistance(5);
|
||||
setDistance(30);
|
||||
}
|
||||
|
||||
function updateDistance(value: number) {
|
||||
console.log("value: ", value);
|
||||
setDistance(value);
|
||||
setRenderDistance(value);
|
||||
}
|
||||
|
||||
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 (
|
||||
<div className="global-properties-container">
|
||||
<div className="header">Environment</div>
|
||||
|
|
@ -169,7 +180,7 @@ const GlobalProperties: React.FC = () => {
|
|||
/>
|
||||
|
||||
<div className="split"></div>
|
||||
|
||||
{/* //visibleEdgeColor={CONSTANTS.outlineConfig.assetDeleteColor} */}
|
||||
<InputToggle
|
||||
inputKey="4"
|
||||
label="Limit Render Distance"
|
||||
|
|
@ -183,6 +194,8 @@ const GlobalProperties: React.FC = () => {
|
|||
disabled={!limitDistance}
|
||||
value={distance}
|
||||
key={"5"}
|
||||
min={CONSTANTS.distanceConfig.minDistance}
|
||||
max={CONSTANTS.distanceConfig.maxDistance}
|
||||
onChange={(value: number) => updateDistance(value)}
|
||||
/>
|
||||
|
||||
|
|
|
|||
|
|
@ -68,7 +68,7 @@ const Tools: React.FC = () => {
|
|||
: true
|
||||
);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {}, [activeModule]);
|
||||
useEffect(() => {
|
||||
setActiveTool(activeSubTool);
|
||||
setActiveSubTool(activeSubTool);
|
||||
|
|
@ -433,28 +433,20 @@ const Tools: React.FC = () => {
|
|||
</div>
|
||||
)}
|
||||
</div>
|
||||
{activeModule === "builder" && (
|
||||
<>
|
||||
<div className="split"></div>
|
||||
<div
|
||||
className={`toggle-threed-button${
|
||||
toggleThreeD ? " toggled" : ""
|
||||
}`}
|
||||
onClick={toggleSwitch}
|
||||
>
|
||||
<div
|
||||
className={`toggle-option${!toggleThreeD ? " active" : ""}`}
|
||||
>
|
||||
2d
|
||||
</div>
|
||||
<div
|
||||
className={`toggle-option${toggleThreeD ? " active" : ""}`}
|
||||
>
|
||||
3d
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
<div className="split"></div>
|
||||
<div
|
||||
className={`toggle-threed-button${
|
||||
toggleThreeD ? " toggled" : ""
|
||||
}`}
|
||||
onClick={toggleSwitch}
|
||||
>
|
||||
<div className={`toggle-option${!toggleThreeD ? " active" : ""}`}>
|
||||
2d
|
||||
</div>
|
||||
<div className={`toggle-option${toggleThreeD ? " active" : ""}`}>
|
||||
3d
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import React, { useEffect, useState } from "react";
|
||||
|
||||
import * as CONSTANTS from "../../../types/world/worldConstants";
|
||||
interface InputToggleProps {
|
||||
label: string; // Represents the toggle state (on/off)
|
||||
min?: number;
|
||||
|
|
@ -14,8 +14,8 @@ const InputRange: React.FC<InputToggleProps> = ({
|
|||
label,
|
||||
onClick,
|
||||
onChange,
|
||||
min = 0,
|
||||
max = 10,
|
||||
min,
|
||||
max,
|
||||
disabled,
|
||||
value = 5,
|
||||
}) => {
|
||||
|
|
@ -23,6 +23,7 @@ const InputRange: React.FC<InputToggleProps> = ({
|
|||
|
||||
function handleChange(e: React.ChangeEvent<HTMLInputElement>) {
|
||||
const newValue = parseInt(e.target.value); // Parse the value to an integer
|
||||
|
||||
setRangeValue(newValue); // Update the local state
|
||||
|
||||
if (onChange) {
|
||||
|
|
|
|||
|
|
@ -94,7 +94,7 @@ const AssetPreview: React.FC<AssetPreviewProps> = ({
|
|||
<div className="asset-details">
|
||||
<div className="asset-name">{selectedCard.assetName}</div>
|
||||
<div className="asset-description">
|
||||
{`${selectedCard.assetName} is used in factories to improve efficiency and production speed It is designed to handle heavy workloads and perform repetitive tasks with precision. Many industries rely on this machine to manufacture products quickly and accurately. It reduces human effort and minimizes errors in the production process. Regular maintenance is required to keep the machine in good working condition.With advanced technology, this machine continues to enhance industrial operations and increase productivity.`}
|
||||
{`${selectedCard.description}`}
|
||||
</div>
|
||||
<div className="asset-review">
|
||||
<div className="asset-rating">
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@ interface ModelData {
|
|||
thumbnail: string;
|
||||
uploadDate: number;
|
||||
_id: string;
|
||||
price: number;
|
||||
}
|
||||
interface ModelsProps {
|
||||
models: ModelData[];
|
||||
|
|
@ -50,7 +51,7 @@ const CardsContainer: React.FC<ModelsProps> = ({ models }) => {
|
|||
key={assetDetail._id}
|
||||
assetName={assetDetail?.filename}
|
||||
uploadedOn={assetDetail.uploadDate}
|
||||
price={36500}
|
||||
price={assetDetail?.price}
|
||||
rating={4.5}
|
||||
views={800}
|
||||
onSelectCard={handleCardSelect}
|
||||
|
|
|
|||
|
|
@ -17,6 +17,7 @@ interface ModelData {
|
|||
thumbnail: string;
|
||||
uploadDate: number;
|
||||
_id: string;
|
||||
price: number;
|
||||
}
|
||||
interface ModelsProps {
|
||||
models: ModelData[];
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@ interface ModelData {
|
|||
thumbnail: string;
|
||||
uploadDate: number;
|
||||
_id: string;
|
||||
price: number;
|
||||
}
|
||||
const MarketPlace = () => {
|
||||
const [models, setModels] = useState<ModelData[]>([]);
|
||||
|
|
@ -24,6 +25,7 @@ const MarketPlace = () => {
|
|||
const filteredAssets = async () => {
|
||||
try {
|
||||
const filt = await getAssetImages("67d934ad0f42a1fdadb19aa6");
|
||||
|
||||
setModels(filt.items);
|
||||
setFilteredModels(filt.items);
|
||||
} catch {}
|
||||
|
|
|
|||
|
|
@ -1,111 +1,125 @@
|
|||
import * as THREE from 'three'
|
||||
import { EffectComposer, N8AO, Outline } from '@react-three/postprocessing'
|
||||
import { BlendFunction } from 'postprocessing'
|
||||
import { useDeletableFloorItem, useSelectedActionSphere, useSelectedPath, useSelectedWallItem, useselectedFloorItem } from '../../../store/store';
|
||||
import * as Types from '../../../types/world/worldTypes'
|
||||
import * as CONSTANTS from '../../../types/world/worldConstants';
|
||||
import * as THREE from "three";
|
||||
import { EffectComposer, N8AO, Outline } from "@react-three/postprocessing";
|
||||
import { BlendFunction } from "postprocessing";
|
||||
import {
|
||||
useDeletableFloorItem,
|
||||
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() {
|
||||
const { deletableFloorItem, setDeletableFloorItem } = useDeletableFloorItem();
|
||||
const { selectedWallItem, setSelectedWallItem } = useSelectedWallItem();
|
||||
const { selectedFloorItem, setselectedFloorItem } = useselectedFloorItem();
|
||||
const { selectedActionSphere } = useSelectedActionSphere();
|
||||
const { selectedPath } = useSelectedPath();
|
||||
const { deletableFloorItem, setDeletableFloorItem } = useDeletableFloorItem();
|
||||
const { selectedWallItem, setSelectedWallItem } = useSelectedWallItem();
|
||||
const { selectedFloorItem, setselectedFloorItem } = useselectedFloorItem();
|
||||
const { selectedActionSphere } = useSelectedActionSphere();
|
||||
const { selectedPath } = useSelectedPath();
|
||||
|
||||
function flattenChildren(children: any[]) {
|
||||
const allChildren: any[] = [];
|
||||
children.forEach(child => {
|
||||
allChildren.push(child);
|
||||
if (child.children && child.children.length > 0) {
|
||||
allChildren.push(...flattenChildren(child.children));
|
||||
}
|
||||
});
|
||||
return allChildren;
|
||||
}
|
||||
function flattenChildren(children: any[]) {
|
||||
const allChildren: any[] = [];
|
||||
children.forEach((child) => {
|
||||
allChildren.push(child);
|
||||
if (child.children && child.children.length > 0) {
|
||||
allChildren.push(...flattenChildren(child.children));
|
||||
}
|
||||
});
|
||||
return allChildren;
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<EffectComposer autoClear={false}>
|
||||
<N8AO color="black" aoRadius={20} intensity={7} distanceFalloff={4} aoSamples={32} denoiseRadius={6} denoiseSamples={16} />
|
||||
{deletableFloorItem &&
|
||||
<Outline
|
||||
selection={flattenChildren(deletableFloorItem.children)}
|
||||
selectionLayer={10}
|
||||
width={3000}
|
||||
blendFunction={BlendFunction.ALPHA}
|
||||
edgeStrength={5}
|
||||
resolutionScale={2}
|
||||
pulseSpeed={0}
|
||||
visibleEdgeColor={CONSTANTS.outlineConfig.assetDeleteColor}
|
||||
hiddenEdgeColor={CONSTANTS.outlineConfig.assetDeleteColor}
|
||||
blur={true}
|
||||
xRay={true}
|
||||
/>
|
||||
}
|
||||
{selectedWallItem &&
|
||||
<Outline
|
||||
selection={
|
||||
selectedWallItem.children[1].children[0].children.filter(
|
||||
(child: Types.Mesh) => child.name !== "CSG_REF"
|
||||
)
|
||||
}
|
||||
selectionLayer={10}
|
||||
width={3000}
|
||||
blendFunction={BlendFunction.ALPHA}
|
||||
edgeStrength={5}
|
||||
resolutionScale={2}
|
||||
pulseSpeed={0}
|
||||
visibleEdgeColor={CONSTANTS.outlineConfig.assetSelectColor}
|
||||
hiddenEdgeColor={CONSTANTS.outlineConfig.assetSelectColor}
|
||||
blur={true}
|
||||
xRay={true}
|
||||
/>}
|
||||
{selectedFloorItem &&
|
||||
<Outline
|
||||
selection={flattenChildren(selectedFloorItem.children)}
|
||||
selectionLayer={10}
|
||||
width={3000}
|
||||
blendFunction={BlendFunction.ALPHA}
|
||||
edgeStrength={5}
|
||||
resolutionScale={2}
|
||||
pulseSpeed={0}
|
||||
visibleEdgeColor={CONSTANTS.outlineConfig.assetSelectColor}
|
||||
hiddenEdgeColor={CONSTANTS.outlineConfig.assetSelectColor}
|
||||
blur={true}
|
||||
xRay={true}
|
||||
/>
|
||||
}
|
||||
{selectedActionSphere &&
|
||||
<Outline
|
||||
selection={[selectedActionSphere.point]}
|
||||
selectionLayer={10}
|
||||
width={750}
|
||||
blendFunction={BlendFunction.ALPHA}
|
||||
edgeStrength={15}
|
||||
resolutionScale={2}
|
||||
pulseSpeed={0}
|
||||
visibleEdgeColor={CONSTANTS.outlineConfig.assetSelectColor}
|
||||
hiddenEdgeColor={CONSTANTS.outlineConfig.assetSelectColor}
|
||||
blur={true}
|
||||
xRay={true}
|
||||
/>
|
||||
}
|
||||
{selectedPath &&
|
||||
<Outline
|
||||
selection={flattenChildren(selectedPath.group.children)}
|
||||
selectionLayer={10}
|
||||
width={750}
|
||||
blendFunction={BlendFunction.ALPHA}
|
||||
edgeStrength={15}
|
||||
resolutionScale={2}
|
||||
pulseSpeed={0}
|
||||
visibleEdgeColor={0x6f42c1}
|
||||
hiddenEdgeColor={0x6f42c1}
|
||||
blur={true}
|
||||
xRay={true}
|
||||
/>
|
||||
}
|
||||
</EffectComposer>
|
||||
</>
|
||||
)
|
||||
return (
|
||||
<>
|
||||
<EffectComposer autoClear={false}>
|
||||
<N8AO
|
||||
color="black"
|
||||
aoRadius={20}
|
||||
intensity={7}
|
||||
distanceFalloff={4}
|
||||
aoSamples={32}
|
||||
denoiseRadius={6}
|
||||
denoiseSamples={16}
|
||||
/>
|
||||
{deletableFloorItem && (
|
||||
<Outline
|
||||
selection={flattenChildren(deletableFloorItem.children)}
|
||||
selectionLayer={10}
|
||||
width={3000}
|
||||
blendFunction={BlendFunction.ALPHA}
|
||||
edgeStrength={5}
|
||||
resolutionScale={2}
|
||||
pulseSpeed={0}
|
||||
visibleEdgeColor={CONSTANTS.outlineConfig.assetDeleteColor}
|
||||
hiddenEdgeColor={CONSTANTS.outlineConfig.assetDeleteColor}
|
||||
blur={true}
|
||||
xRay={true}
|
||||
/>
|
||||
)}
|
||||
{selectedWallItem && (
|
||||
<Outline
|
||||
selection={selectedWallItem.children[1].children[0].children.filter(
|
||||
(child: Types.Mesh) => child.name !== "CSG_REF"
|
||||
)}
|
||||
selectionLayer={10}
|
||||
width={3000}
|
||||
blendFunction={BlendFunction.ALPHA}
|
||||
edgeStrength={5}
|
||||
resolutionScale={2}
|
||||
pulseSpeed={0}
|
||||
visibleEdgeColor={CONSTANTS.outlineConfig.assetSelectColor}
|
||||
hiddenEdgeColor={CONSTANTS.outlineConfig.assetSelectColor}
|
||||
blur={true}
|
||||
xRay={true}
|
||||
/>
|
||||
)}
|
||||
{selectedFloorItem && (
|
||||
<Outline
|
||||
selection={flattenChildren(selectedFloorItem.children)}
|
||||
selectionLayer={10}
|
||||
width={3000}
|
||||
blendFunction={BlendFunction.ALPHA}
|
||||
edgeStrength={5}
|
||||
resolutionScale={2}
|
||||
pulseSpeed={0}
|
||||
visibleEdgeColor={CONSTANTS.outlineConfig.assetSelectColor}
|
||||
hiddenEdgeColor={CONSTANTS.outlineConfig.assetSelectColor}
|
||||
blur={true}
|
||||
xRay={true}
|
||||
/>
|
||||
)}
|
||||
{selectedActionSphere && (
|
||||
<Outline
|
||||
selection={[selectedActionSphere.point]}
|
||||
selectionLayer={10}
|
||||
width={750}
|
||||
blendFunction={BlendFunction.ALPHA}
|
||||
edgeStrength={15}
|
||||
resolutionScale={2}
|
||||
pulseSpeed={0}
|
||||
visibleEdgeColor={CONSTANTS.outlineConfig.assetSelectColor}
|
||||
hiddenEdgeColor={CONSTANTS.outlineConfig.assetSelectColor}
|
||||
blur={true}
|
||||
xRay={true}
|
||||
/>
|
||||
)}
|
||||
{selectedPath && (
|
||||
<Outline
|
||||
selection={flattenChildren(selectedPath.group.children)}
|
||||
selectionLayer={10}
|
||||
width={750}
|
||||
blendFunction={BlendFunction.ALPHA}
|
||||
edgeStrength={15}
|
||||
resolutionScale={2}
|
||||
pulseSpeed={0}
|
||||
visibleEdgeColor={0x6f42c1}
|
||||
hiddenEdgeColor={0x6f42c1}
|
||||
blur={true}
|
||||
xRay={true}
|
||||
/>
|
||||
)}
|
||||
</EffectComposer>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
let BackEnd_url = `http://${process.env.REACT_APP_SERVER_MARKETPLACE_URL}`;
|
||||
export const getCategoryAsset = async (categoryName: any) => {
|
||||
try {
|
||||
const response = await fetch(
|
||||
`${BackEnd_url}/api/v2/getCatagoryAssets/${categoryName}`,
|
||||
{
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
const result = await response.json();
|
||||
return result;
|
||||
} catch (error: any) {
|
||||
throw new Error(error.message);
|
||||
}
|
||||
};
|
||||
|
|
@ -1029,10 +1029,14 @@
|
|||
}
|
||||
|
||||
.asset-image {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 5px;
|
||||
transform: translate(0, -50%);
|
||||
// top: 50%;
|
||||
// right: 5px;
|
||||
// transform: translate(0, -50%);
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,384 +1,390 @@
|
|||
export type Controls = {
|
||||
azimuthRotateSpeed: number;
|
||||
polarRotateSpeed: number;
|
||||
truckSpeed: number;
|
||||
minDistance: number;
|
||||
maxDistance: number;
|
||||
maxPolarAngle: number;
|
||||
leftMouse: number;
|
||||
forwardSpeed: number;
|
||||
backwardSpeed: number;
|
||||
leftSpeed: number;
|
||||
rightSpeed: number;
|
||||
azimuthRotateSpeed: number;
|
||||
polarRotateSpeed: number;
|
||||
truckSpeed: number;
|
||||
minDistance: number;
|
||||
maxDistance: number;
|
||||
maxPolarAngle: number;
|
||||
leftMouse: number;
|
||||
forwardSpeed: number;
|
||||
backwardSpeed: number;
|
||||
leftSpeed: number;
|
||||
rightSpeed: number;
|
||||
};
|
||||
|
||||
export type ThirdPersonControls = {
|
||||
azimuthRotateSpeed: number;
|
||||
polarRotateSpeed: number;
|
||||
truckSpeed: number;
|
||||
maxDistance: number;
|
||||
maxPolarAngle: number;
|
||||
minZoom: number;
|
||||
maxZoom: number;
|
||||
targetOffset: number;
|
||||
cameraHeight: number;
|
||||
leftMouse: number;
|
||||
rightMouse: number;
|
||||
wheelMouse: number;
|
||||
middleMouse: number;
|
||||
azimuthRotateSpeed: number;
|
||||
polarRotateSpeed: number;
|
||||
truckSpeed: number;
|
||||
maxDistance: number;
|
||||
maxPolarAngle: number;
|
||||
minZoom: number;
|
||||
maxZoom: number;
|
||||
targetOffset: number;
|
||||
cameraHeight: number;
|
||||
leftMouse: number;
|
||||
rightMouse: number;
|
||||
wheelMouse: number;
|
||||
middleMouse: number;
|
||||
};
|
||||
|
||||
export type ControlsTransition = {
|
||||
leftMouse: number;
|
||||
rightMouse: number;
|
||||
wheelMouse: number;
|
||||
middleMouse: number;
|
||||
leftMouse: number;
|
||||
rightMouse: number;
|
||||
wheelMouse: number;
|
||||
middleMouse: number;
|
||||
};
|
||||
|
||||
export type TwoDimension = {
|
||||
defaultPosition: [x: number, y: number, z: number];
|
||||
defaultTarget: [x: number, y: number, z: number];
|
||||
defaultAzimuth: number;
|
||||
minDistance: number;
|
||||
leftMouse: number;
|
||||
rightMouse: number;
|
||||
defaultPosition: [x: number, y: number, z: number];
|
||||
defaultTarget: [x: number, y: number, z: number];
|
||||
defaultAzimuth: number;
|
||||
minDistance: number;
|
||||
leftMouse: number;
|
||||
rightMouse: number;
|
||||
};
|
||||
|
||||
export type ThreeDimension = {
|
||||
defaultPosition: [x: number, y: number, z: number];
|
||||
defaultTarget: [x: number, y: number, z: number];
|
||||
defaultRotation: [x: number, y: number, z: number];
|
||||
defaultAzimuth: number;
|
||||
boundaryBottom: [x: number, y: number, z: number];
|
||||
boundaryTop: [x: number, y: number, z: number];
|
||||
minDistance: number;
|
||||
leftMouse: number;
|
||||
rightMouse: number;
|
||||
defaultPosition: [x: number, y: number, z: number];
|
||||
defaultTarget: [x: number, y: number, z: number];
|
||||
defaultRotation: [x: number, y: number, z: number];
|
||||
defaultAzimuth: number;
|
||||
boundaryBottom: [x: number, y: number, z: number];
|
||||
boundaryTop: [x: number, y: number, z: number];
|
||||
minDistance: number;
|
||||
leftMouse: number;
|
||||
rightMouse: number;
|
||||
};
|
||||
|
||||
|
||||
export type GridConfig = {
|
||||
size: number;
|
||||
divisions: number;
|
||||
primaryColor: string;
|
||||
secondaryColor: string;
|
||||
size: number;
|
||||
divisions: number;
|
||||
primaryColor: string;
|
||||
secondaryColor: string;
|
||||
|
||||
position2D: [x: number, y: number, z: number];
|
||||
position3D: [x: number, y: number, z: number];
|
||||
}
|
||||
position2D: [x: number, y: number, z: number];
|
||||
position3D: [x: number, y: number, z: number];
|
||||
};
|
||||
|
||||
export type PlaneConfig = {
|
||||
position2D: [x: number, y: number, z: number];
|
||||
position3D: [x: number, y: number, z: number];
|
||||
rotation: number;
|
||||
position2D: [x: number, y: number, z: number];
|
||||
position3D: [x: number, y: number, z: number];
|
||||
rotation: number;
|
||||
|
||||
width: number;
|
||||
height: number;
|
||||
color: string;
|
||||
}
|
||||
width: number;
|
||||
height: number;
|
||||
color: string;
|
||||
};
|
||||
|
||||
export type ShadowConfig = {
|
||||
shadowOffset: number,
|
||||
shadowOffset: number;
|
||||
|
||||
shadowmapSizewidth: number,
|
||||
shadowmapSizeheight: number,
|
||||
shadowcamerafar: number,
|
||||
shadowcameranear: number,
|
||||
shadowcameratop: number,
|
||||
shadowcamerabottom: number,
|
||||
shadowcameraleft: number,
|
||||
shadowcameraright: number,
|
||||
shadowbias: number,
|
||||
shadownormalBias: number,
|
||||
shadowmapSizewidth: number;
|
||||
shadowmapSizeheight: number;
|
||||
shadowcamerafar: number;
|
||||
shadowcameranear: number;
|
||||
shadowcameratop: number;
|
||||
shadowcamerabottom: number;
|
||||
shadowcameraleft: number;
|
||||
shadowcameraright: number;
|
||||
shadowbias: number;
|
||||
shadownormalBias: number;
|
||||
|
||||
shadowMaterialPosition: [x: number, y: number, z: number],
|
||||
shadowMaterialRotation: [x: number, y: number, z: number],
|
||||
shadowMaterialPosition: [x: number, y: number, z: number];
|
||||
shadowMaterialRotation: [x: number, y: number, z: number];
|
||||
|
||||
shadowMaterialOpacity: number,
|
||||
}
|
||||
shadowMaterialOpacity: number;
|
||||
};
|
||||
|
||||
export type SkyConfig = {
|
||||
defaultTurbidity: number;
|
||||
maxTurbidity: number;
|
||||
minTurbidity: number;
|
||||
defaultRayleigh: number;
|
||||
mieCoefficient: number;
|
||||
mieDirectionalG: number;
|
||||
skyDistance: number;
|
||||
}
|
||||
defaultTurbidity: number;
|
||||
maxTurbidity: number;
|
||||
minTurbidity: number;
|
||||
defaultRayleigh: number;
|
||||
mieCoefficient: number;
|
||||
mieDirectionalG: number;
|
||||
skyDistance: number;
|
||||
};
|
||||
|
||||
export type AssetConfig = {
|
||||
defaultScaleBeforeGsap: [number, number, number];
|
||||
defaultScaleAfterGsap: [number, number, number];
|
||||
}
|
||||
defaultScaleBeforeGsap: [number, number, number];
|
||||
defaultScaleAfterGsap: [number, number, number];
|
||||
};
|
||||
|
||||
export type PointConfig = {
|
||||
defaultInnerColor: string;
|
||||
defaultOuterColor: string;
|
||||
deleteColor: string;
|
||||
boxScale: [number, number, number];
|
||||
defaultInnerColor: string;
|
||||
defaultOuterColor: string;
|
||||
deleteColor: string;
|
||||
boxScale: [number, number, number];
|
||||
|
||||
wallOuterColor: string;
|
||||
floorOuterColor: string;
|
||||
aisleOuterColor: string;
|
||||
zoneOuterColor: string;
|
||||
wallOuterColor: string;
|
||||
floorOuterColor: string;
|
||||
aisleOuterColor: string;
|
||||
zoneOuterColor: string;
|
||||
|
||||
snappingThreshold: number;
|
||||
}
|
||||
snappingThreshold: number;
|
||||
};
|
||||
|
||||
export type LineConfig = {
|
||||
tubularSegments: number;
|
||||
radius: number;
|
||||
radialSegments: number;
|
||||
tubularSegments: number;
|
||||
radius: number;
|
||||
radialSegments: number;
|
||||
|
||||
wallName: string;
|
||||
floorName: string;
|
||||
aisleName: string;
|
||||
zoneName: string;
|
||||
referenceName: string;
|
||||
wallName: string;
|
||||
floorName: string;
|
||||
aisleName: string;
|
||||
zoneName: string;
|
||||
referenceName: string;
|
||||
|
||||
lineIntersectionPoints: number;
|
||||
lineIntersectionPoints: number;
|
||||
|
||||
defaultColor: string;
|
||||
defaultColor: string;
|
||||
|
||||
wallColor: string;
|
||||
floorColor: string;
|
||||
aisleColor: string;
|
||||
zoneColor: string;
|
||||
helperColor: string;
|
||||
}
|
||||
wallColor: string;
|
||||
floorColor: string;
|
||||
aisleColor: string;
|
||||
zoneColor: string;
|
||||
helperColor: string;
|
||||
};
|
||||
|
||||
export type WallConfig = {
|
||||
defaultColor: string;
|
||||
height: number;
|
||||
width: number;
|
||||
}
|
||||
defaultColor: string;
|
||||
height: number;
|
||||
width: number;
|
||||
};
|
||||
|
||||
export type FloorConfig = {
|
||||
defaultColor: string;
|
||||
height: number;
|
||||
defaultColor: string;
|
||||
height: number;
|
||||
|
||||
textureScale: number;
|
||||
}
|
||||
textureScale: number;
|
||||
};
|
||||
|
||||
export type RoofConfig = {
|
||||
defaultColor: string;
|
||||
height: number;
|
||||
}
|
||||
defaultColor: string;
|
||||
height: number;
|
||||
};
|
||||
|
||||
export type AisleConfig = {
|
||||
width: number;
|
||||
height: number;
|
||||
width: number;
|
||||
height: number;
|
||||
|
||||
defaultColor: number;
|
||||
}
|
||||
defaultColor: number;
|
||||
};
|
||||
|
||||
export type ZoneConfig = {
|
||||
defaultColor: string;
|
||||
defaultColor: string;
|
||||
|
||||
color: string;
|
||||
}
|
||||
color: string;
|
||||
};
|
||||
|
||||
export type ColumnConfig = {
|
||||
defaultColor: string;
|
||||
}
|
||||
defaultColor: string;
|
||||
};
|
||||
|
||||
export type OutlineConfig = {
|
||||
assetSelectColor: number;
|
||||
assetDeleteColor: number;
|
||||
}
|
||||
|
||||
|
||||
assetSelectColor: number;
|
||||
assetDeleteColor: number;
|
||||
};
|
||||
|
||||
export type DistanceConfig = {
|
||||
minDistance: number;
|
||||
maxDistance: number;
|
||||
};
|
||||
|
||||
export const firstPersonControls: Controls = {
|
||||
azimuthRotateSpeed: 0.3, // Speed of rotation around the azimuth axis
|
||||
polarRotateSpeed: 0.3, // Speed of rotation around the polar axis
|
||||
truckSpeed: 10, // Speed of truck movement
|
||||
minDistance: 0, // Minimum distance from the target
|
||||
maxDistance: 0, // Maximum distance from the target
|
||||
maxPolarAngle: Math.PI, // Maximum polar angle
|
||||
azimuthRotateSpeed: 0.3, // Speed of rotation around the azimuth axis
|
||||
polarRotateSpeed: 0.3, // Speed of rotation around the polar axis
|
||||
truckSpeed: 10, // Speed of truck movement
|
||||
minDistance: 0, // Minimum distance from the target
|
||||
maxDistance: 0, // Maximum distance from the target
|
||||
maxPolarAngle: Math.PI, // Maximum polar angle
|
||||
|
||||
leftMouse: 1, // Mouse button for rotation (ROTATE)
|
||||
leftMouse: 1, // Mouse button for rotation (ROTATE)
|
||||
|
||||
forwardSpeed: 0.3, // Speed of forward movement
|
||||
backwardSpeed: -0.3, // Speed of backward movement
|
||||
leftSpeed: -0.3, // Speed of left movement
|
||||
rightSpeed: 0.3, // Speed of right movement
|
||||
forwardSpeed: 0.3, // Speed of forward movement
|
||||
backwardSpeed: -0.3, // Speed of backward movement
|
||||
leftSpeed: -0.3, // Speed of left movement
|
||||
rightSpeed: 0.3, // Speed of right movement
|
||||
};
|
||||
|
||||
export const thirdPersonControls: ThirdPersonControls = {
|
||||
azimuthRotateSpeed: 1, // Speed of rotation around the azimuth axis
|
||||
polarRotateSpeed: 1, // Speed of rotation around the polar axis
|
||||
truckSpeed: 2, // Speed of truck movement
|
||||
maxDistance: 100, // Maximum distance from the target
|
||||
maxPolarAngle: Math.PI / 2 - 0.05, // Maximum polar angle
|
||||
minZoom: 6, // Minimum zoom level
|
||||
maxZoom: 21, // Maximum zoom level
|
||||
targetOffset: 20, // Offset of the target from the camera
|
||||
cameraHeight: 30, // Height of the camera
|
||||
leftMouse: 2, // Mouse button for panning
|
||||
rightMouse: 1, // Mouse button for rotation
|
||||
wheelMouse: 8, // Mouse button for zooming
|
||||
middleMouse: 8, // Mouse button for zooming
|
||||
azimuthRotateSpeed: 1, // Speed of rotation around the azimuth axis
|
||||
polarRotateSpeed: 1, // Speed of rotation around the polar axis
|
||||
truckSpeed: 2, // Speed of truck movement
|
||||
maxDistance: 100, // Maximum distance from the target
|
||||
maxPolarAngle: Math.PI / 2 - 0.05, // Maximum polar angle
|
||||
minZoom: 6, // Minimum zoom level
|
||||
maxZoom: 21, // Maximum zoom level
|
||||
targetOffset: 20, // Offset of the target from the camera
|
||||
cameraHeight: 30, // Height of the camera
|
||||
leftMouse: 2, // Mouse button for panning
|
||||
rightMouse: 1, // Mouse button for rotation
|
||||
wheelMouse: 8, // Mouse button for zooming
|
||||
middleMouse: 8, // Mouse button for zooming
|
||||
};
|
||||
|
||||
export const controlsTransition: ControlsTransition = {
|
||||
leftMouse: 0, // Mouse button for no action
|
||||
rightMouse: 0, // Mouse button for no action
|
||||
wheelMouse: 0, // Mouse button for no action
|
||||
middleMouse: 0, // Mouse button for no action
|
||||
leftMouse: 0, // Mouse button for no action
|
||||
rightMouse: 0, // Mouse button for no action
|
||||
wheelMouse: 0, // Mouse button for no action
|
||||
middleMouse: 0, // Mouse button for no action
|
||||
};
|
||||
|
||||
export const twoDimension: TwoDimension = {
|
||||
defaultPosition: [0, 100, 0], // Default position of the camera
|
||||
defaultTarget: [0, 0, 0], // Default target of the camera
|
||||
defaultAzimuth: 0, // Default azimuth of the camera
|
||||
minDistance: 25, // Minimum distance from the target
|
||||
leftMouse: 2, // Mouse button for panning
|
||||
rightMouse: 0, // Mouse button for no action
|
||||
defaultPosition: [0, 100, 0], // Default position of the camera
|
||||
defaultTarget: [0, 0, 0], // Default target of the camera
|
||||
defaultAzimuth: 0, // Default azimuth of the camera
|
||||
minDistance: 25, // Minimum distance from the target
|
||||
leftMouse: 2, // Mouse button for panning
|
||||
rightMouse: 0, // Mouse button for no action
|
||||
};
|
||||
|
||||
export const threeDimension: ThreeDimension = {
|
||||
defaultPosition: [0, 40, 30], // Default position of the camera
|
||||
defaultTarget: [0, 0, 0], // Default target of the camera
|
||||
defaultRotation: [0, 0, 0], // Default rotation of the camera
|
||||
defaultAzimuth: 0, // Default azimuth of the camera
|
||||
boundaryBottom: [-150, 0, -150], // Bottom boundary of the camera movement
|
||||
boundaryTop: [150, 100, 150], // Top boundary of the camera movement
|
||||
minDistance: 1, // Minimum distance from the target
|
||||
leftMouse: 2, // Mouse button for panning
|
||||
rightMouse: 1, // Mouse button for rotation
|
||||
defaultPosition: [0, 40, 30], // Default position of the camera
|
||||
defaultTarget: [0, 0, 0], // Default target of the camera
|
||||
defaultRotation: [0, 0, 0], // Default rotation of the camera
|
||||
defaultAzimuth: 0, // Default azimuth of the camera
|
||||
boundaryBottom: [-150, 0, -150], // Bottom boundary of the camera movement
|
||||
boundaryTop: [150, 100, 150], // Top boundary of the camera movement
|
||||
minDistance: 1, // Minimum distance from the target
|
||||
leftMouse: 2, // Mouse button for panning
|
||||
rightMouse: 1, // Mouse button for rotation
|
||||
};
|
||||
|
||||
export const camPositionUpdateInterval: number = 200; // Interval for updating the camera position
|
||||
|
||||
export const gridConfig: GridConfig = {
|
||||
size: 300, // Size of the grid
|
||||
divisions: 75, // Number of divisions in the grid
|
||||
primaryColor: "#d5d5d5", // Primary color of the grid
|
||||
secondaryColor: "#e3e3e3", // Secondary color of the grid
|
||||
size: 300, // Size of the grid
|
||||
divisions: 75, // Number of divisions in the grid
|
||||
primaryColor: "#d5d5d5", // Primary color of the grid
|
||||
secondaryColor: "#e3e3e3", // Secondary color of the grid
|
||||
|
||||
position2D: [0, 0.1, 0], // Position of the grid in 2D view
|
||||
position3D: [0, -0.5, 0], // Position of the grid in 3D 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
|
||||
};
|
||||
|
||||
export const planeConfig: PlaneConfig = {
|
||||
position2D: [0, -0.5, 0], // Position of the plane
|
||||
position3D: [0, -0.65, 0], // Position of the plane
|
||||
rotation: -Math.PI / 2, // Rotation of the plane
|
||||
position2D: [0, -0.5, 0], // Position of the plane
|
||||
position3D: [0, -0.65, 0], // Position of the plane
|
||||
rotation: -Math.PI / 2, // Rotation of the plane
|
||||
|
||||
width: 300, // Width of the plane
|
||||
height: 300, // Height of the plane
|
||||
color: "#f3f3f3" // Color of the plane
|
||||
}
|
||||
width: 300, // Width of the plane
|
||||
height: 300, // Height of the plane
|
||||
color: "#f3f3f3", // Color of the plane
|
||||
};
|
||||
|
||||
export const shadowConfig: ShadowConfig = {
|
||||
shadowOffset: 50, // Offset of the shadow
|
||||
shadowOffset: 50, // Offset of the shadow
|
||||
|
||||
shadowmapSizewidth: 1024, // Width of the shadow map
|
||||
shadowmapSizeheight: 1024, // Height of the shadow map
|
||||
// shadowmapSizewidth: 8192, // Width of the shadow map
|
||||
// shadowmapSizeheight: 8192, // Height of the shadow map
|
||||
shadowcamerafar: 70, // Far plane of the shadow camera
|
||||
shadowcameranear: 0.1, // Near plane of the shadow camera
|
||||
shadowcameratop: 30, // Top plane of the shadow camera
|
||||
shadowcamerabottom: -30, // Bottom plane of the shadow camera
|
||||
shadowcameraleft: -30, // Left plane of the shadow camera
|
||||
shadowcameraright: 30, // Right plane of the shadow camera
|
||||
shadowbias: -0.001, // Bias of the shadow
|
||||
shadownormalBias: 0.02, // Normal bias of the shadow
|
||||
shadowmapSizewidth: 1024, // Width of the shadow map
|
||||
shadowmapSizeheight: 1024, // Height of the shadow map
|
||||
// shadowmapSizewidth: 8192, // Width of the shadow map
|
||||
// shadowmapSizeheight: 8192, // Height of the shadow map
|
||||
shadowcamerafar: 70, // Far plane of the shadow camera
|
||||
shadowcameranear: 0.1, // Near plane of the shadow camera
|
||||
shadowcameratop: 30, // Top plane of the shadow camera
|
||||
shadowcamerabottom: -30, // Bottom plane of the shadow camera
|
||||
shadowcameraleft: -30, // Left plane of the shadow camera
|
||||
shadowcameraright: 30, // Right plane of the shadow camera
|
||||
shadowbias: -0.001, // Bias of the shadow
|
||||
shadownormalBias: 0.02, // Normal bias of the shadow
|
||||
|
||||
shadowMaterialPosition: [0, 0.01, 0], // Position of the shadow material
|
||||
shadowMaterialRotation: [-Math.PI / 2, 0, 0], // Rotation 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
|
||||
|
||||
shadowMaterialOpacity: 0.1 // Opacity of the shadow material
|
||||
}
|
||||
shadowMaterialOpacity: 0.1, // Opacity of the shadow material
|
||||
};
|
||||
|
||||
export const skyConfig: SkyConfig = {
|
||||
defaultTurbidity: 10.0, // Default turbidity of the sky
|
||||
maxTurbidity: 20.0, // Maximum turbidity of the sky
|
||||
minTurbidity: 0.0, // Minimum turbidity of the sky
|
||||
defaultRayleigh: 1.9, // Default Rayleigh scattering coefficient
|
||||
mieCoefficient: 0.1, // Mie scattering coefficient
|
||||
mieDirectionalG: 1.0, // Mie directional G
|
||||
skyDistance: 2000 // Distance of the sky
|
||||
}
|
||||
defaultTurbidity: 10.0, // Default turbidity of the sky
|
||||
maxTurbidity: 20.0, // Maximum turbidity of the sky
|
||||
minTurbidity: 0.0, // Minimum turbidity of the sky
|
||||
defaultRayleigh: 1.9, // Default Rayleigh scattering coefficient
|
||||
mieCoefficient: 0.1, // Mie scattering coefficient
|
||||
mieDirectionalG: 1.0, // Mie directional G
|
||||
skyDistance: 2000, // Distance of the sky
|
||||
};
|
||||
|
||||
export const assetConfig: AssetConfig = {
|
||||
defaultScaleBeforeGsap: [0.1, 0.1, 0.1], // Default scale of the assets
|
||||
defaultScaleAfterGsap: [1, 1, 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
|
||||
};
|
||||
|
||||
export const pointConfig: PointConfig = {
|
||||
defaultInnerColor: "#ffffff", // Default inner color of the points
|
||||
defaultOuterColor: "#ffffff", // Default outer color of the points
|
||||
deleteColor: "#ff0000", // Color of the points when deleting
|
||||
boxScale: [0.5, 0.5, 0.5], // Scale of the points
|
||||
defaultInnerColor: "#ffffff", // Default inner color of the points
|
||||
defaultOuterColor: "#ffffff", // Default outer color of the points
|
||||
deleteColor: "#ff0000", // Color of the points when deleting
|
||||
boxScale: [0.5, 0.5, 0.5], // Scale of the points
|
||||
|
||||
wallOuterColor: "#C7C7C7", // Outer color of the wall points
|
||||
floorOuterColor: "#808080", // Outer color of the floor points
|
||||
aisleOuterColor: "#FBBC05", // Outer color of the aisle points
|
||||
zoneOuterColor: "#007BFF", // Outer color of the zone points
|
||||
wallOuterColor: "#C7C7C7", // Outer color of the wall points
|
||||
floorOuterColor: "#808080", // Outer color of the floor points
|
||||
aisleOuterColor: "#FBBC05", // Outer color of the aisle points
|
||||
zoneOuterColor: "#007BFF", // Outer color of the zone points
|
||||
|
||||
snappingThreshold: 1, // Threshold for snapping
|
||||
}
|
||||
snappingThreshold: 1, // Threshold for snapping
|
||||
};
|
||||
|
||||
export const lineConfig: LineConfig = {
|
||||
tubularSegments: 64, // Number of tubular segments
|
||||
radius: 0.15, // Radius of the lines
|
||||
radialSegments: 8, // Number of radial segments
|
||||
tubularSegments: 64, // Number of tubular segments
|
||||
radius: 0.15, // Radius of the lines
|
||||
radialSegments: 8, // Number of radial segments
|
||||
|
||||
wallName: "WallLine", // Name of the wall lines
|
||||
floorName: "FloorLine", // Name of the floor lines
|
||||
aisleName: "AisleLine", // Name of the aisle lines
|
||||
zoneName: "ZoneLine", // Name of the zone lines
|
||||
referenceName: "ReferenceLine", // Name of the reference lines
|
||||
wallName: "WallLine", // Name of the wall lines
|
||||
floorName: "FloorLine", // Name of the floor lines
|
||||
aisleName: "AisleLine", // Name of the aisle lines
|
||||
zoneName: "ZoneLine", // Name of the zone lines
|
||||
referenceName: "ReferenceLine", // Name of the reference lines
|
||||
|
||||
lineIntersectionPoints: 300, // Number of intersection points
|
||||
lineIntersectionPoints: 300, // Number of intersection points
|
||||
|
||||
defaultColor: "#000000", // Default color of the lines
|
||||
defaultColor: "#000000", // Default color of the lines
|
||||
|
||||
wallColor: "#C7C7C7", // Color of the wall lines
|
||||
floorColor: "#808080", // Color of the floor lines
|
||||
aisleColor: "#FBBC05", // Color of the aisle lines
|
||||
zoneColor: "#007BFF", // Color of the zone lines
|
||||
helperColor: "#C164FF" // Color of the helper lines
|
||||
}
|
||||
wallColor: "#C7C7C7", // Color of the wall lines
|
||||
floorColor: "#808080", // Color of the floor lines
|
||||
aisleColor: "#FBBC05", // Color of the aisle lines
|
||||
zoneColor: "#007BFF", // Color of the zone lines
|
||||
helperColor: "#C164FF", // Color of the helper lines
|
||||
};
|
||||
|
||||
export const wallConfig: WallConfig = {
|
||||
defaultColor: "white", // Default color of the walls
|
||||
height: 7, // Height of the walls
|
||||
width: 0.05, // Width of the walls
|
||||
}
|
||||
defaultColor: "white", // Default color of the walls
|
||||
height: 7, // Height of the walls
|
||||
width: 0.05, // Width of the walls
|
||||
};
|
||||
|
||||
export const floorConfig: FloorConfig = {
|
||||
defaultColor: "grey", // Default color of the floors
|
||||
height: 0.1, // Height of the floors
|
||||
textureScale: 0.1, // Scale of the floor texture
|
||||
}
|
||||
defaultColor: "grey", // Default color of the floors
|
||||
height: 0.1, // Height of the floors
|
||||
textureScale: 0.1, // Scale of the floor texture
|
||||
};
|
||||
|
||||
export const roofConfig: RoofConfig = {
|
||||
defaultColor: "grey", // Default color of the roofs
|
||||
height: 0.1 // Height of the roofs
|
||||
}
|
||||
defaultColor: "grey", // Default color of the roofs
|
||||
height: 0.1, // Height of the roofs
|
||||
};
|
||||
|
||||
export const aisleConfig: AisleConfig = {
|
||||
width: 0.1, // Width of the aisles
|
||||
height: 0.01, // Height of the aisles
|
||||
defaultColor: 0xffff00 // Default color of the aisles
|
||||
}
|
||||
width: 0.1, // Width of the aisles
|
||||
height: 0.01, // Height of the aisles
|
||||
defaultColor: 0xffff00, // Default color of the aisles
|
||||
};
|
||||
|
||||
export const zoneConfig: ZoneConfig = {
|
||||
defaultColor: "black", // Default color of the zones
|
||||
color: "blue" // Color of the zones
|
||||
}
|
||||
defaultColor: "black", // Default color of the zones
|
||||
color: "blue", // Color of the zones
|
||||
};
|
||||
|
||||
export const columnConfig: ColumnConfig = {
|
||||
defaultColor: "White", // Default color of the columns
|
||||
}
|
||||
defaultColor: "White", // Default color of the columns
|
||||
};
|
||||
|
||||
export const outlineConfig: OutlineConfig = {
|
||||
assetSelectColor: 0x0054fE, // Color of the selected assets
|
||||
assetDeleteColor: 0xFF0000 // Color of the deleted assets
|
||||
}
|
||||
assetSelectColor: 0x0054fe, // Color of the selected assets
|
||||
assetDeleteColor: 0xff0000, // Color of the deleted assets
|
||||
};
|
||||
|
||||
export const distanceConfig: DistanceConfig = {
|
||||
minDistance: 20,
|
||||
maxDistance: 75,
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue