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

updated

Browse Source
This commit is contained in:
Vishnu
2025-06-23 09:37:53 +05:30
parent 2fbdf8ab61
commit 54b02541c1
278 changed files with 10134 additions and 7904 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
app/src/modules/builder/wall/Instances/instance/wall.tsx
View File

@@ -2,26 +2,29 @@ import * as THREE from 'three';
import { useMemo, useRef, useState } from 'react';
import * as Constants from '../../../../../types/world/worldConstants';
import insideMaterial from '../../../../../assets/textures/floor/wall-tex.png';
import outsideMaterial from '../../../../../assets/textures/floor/factory wall texture.jpg';
import useWallGeometry from './helpers/useWallGeometry';
import defaultMaterial from '../../../../../assets/textures/floor/wall-tex.png';
import material1 from '../../../../../assets/textures/floor/factory wall texture.jpg';
import { useWallStore } from '../../../../../store/builder/useWallStore';
import { useWallClassification } from './helpers/useWallClassification';
import { useFrame, useThree } from '@react-three/fiber';
import { useWallVisibility } from '../../../../../store/builder/store';
import { Decal } from '@react-three/drei';
import { Base } from '@react-three/csg';
import { Decal, PivotControls } from '@react-three/drei';
import { Base, Geometry, Subtraction } from '@react-three/csg';
function Wall({ wall }: { readonly wall: Wall }) {
const { walls } = useWallStore();
const { getWallType } = useWallClassification(walls);
const { getWallType, isWallFlipped } = useWallClassification(walls);
const wallType = getWallType(wall);
const [startPoint, endPoint] = wall.points;
const [visible, setVisible] = useState(true);
const { wallVisibility } = useWallVisibility();
const meshRef = useRef<any>();
const { camera } = useThree();
const wallFlipped = isWallFlipped(wall);
const [rawStart, rawEnd] = wall.points;
const [startPoint, endPoint] = wallFlipped ? [rawStart, rawEnd] : [rawEnd, rawStart];
const startX = startPoint.position[0];
const startZ = startPoint.position[2];
const endX = endPoint.position[0];
@@ -36,13 +39,13 @@ function Wall({ wall }: { readonly wall: Wall }) {
const textureLoader = new THREE.TextureLoader();
const [insideWallTexture, outsideWallTexture] = useMemo(() => {
const inside = textureLoader.load(insideMaterial);
const [defaultWallTexture, material1WallTexture] = useMemo(() => {
const inside = textureLoader.load(defaultMaterial);
inside.wrapS = inside.wrapT = THREE.RepeatWrapping;
inside.repeat.set(wallLength / 10, wall.wallHeight / 10);
inside.colorSpace = THREE.SRGBColorSpace;
const outside = textureLoader.load(outsideMaterial);
const outside = textureLoader.load(material1);
outside.wrapS = outside.wrapT = THREE.RepeatWrapping;
outside.repeat.set(wallLength / 10, wall.wallHeight / 10);
outside.colorSpace = THREE.SRGBColorSpace;
@@ -51,29 +54,25 @@ function Wall({ wall }: { readonly wall: Wall }) {
}, [wallLength, wall.wallHeight]);
const materials = useMemo(() => {
const frontMaterial = insideWallTexture;
const backMaterial = outsideWallTexture;
return [
new THREE.MeshStandardMaterial({ color: Constants.wallConfig.defaultColor, side: THREE.DoubleSide, visible: visible }), // Left
new THREE.MeshStandardMaterial({ color: Constants.wallConfig.defaultColor, side: THREE.DoubleSide, visible: visible }), // Right
new THREE.MeshStandardMaterial({ color: Constants.wallConfig.defaultColor, side: THREE.DoubleSide, visible: visible }), // Top
new THREE.MeshStandardMaterial({ color: Constants.wallConfig.defaultColor, side: THREE.DoubleSide, visible: visible }), // Bottom
new THREE.MeshStandardMaterial({
color: Constants.wallConfig.defaultColor,
side: THREE.DoubleSide,
map: frontMaterial
map: wall.insideMaterial === 'Default Material' ? defaultWallTexture : material1WallTexture,
}),
new THREE.MeshStandardMaterial({
color: Constants.wallConfig.defaultColor,
side: THREE.DoubleSide,
map: backMaterial
map: wall.outsideMaterial === 'Default Material`' ? defaultWallTexture : material1WallTexture,
}),
new THREE.MeshStandardMaterial({ color: Constants.wallConfig.defaultColor, side: THREE.DoubleSide }), // Left
new THREE.MeshStandardMaterial({ color: Constants.wallConfig.defaultColor, side: THREE.DoubleSide }), // Right
new THREE.MeshStandardMaterial({ color: Constants.wallConfig.defaultColor, side: THREE.DoubleSide }), // Top
new THREE.MeshStandardMaterial({ color: Constants.wallConfig.defaultColor, side: THREE.DoubleSide }) // Bottom
];
}, [insideWallTexture, outsideWallTexture, wall]);
}, [defaultWallTexture, material1WallTexture, wall]);
const geometry = useWallGeometry(wallLength, wall.wallHeight, wall.wallThickness);
const geometry = useMemo(() => new THREE.BoxGeometry(wallLength, wall.wallHeight, wall.wallThickness), [wallLength, wall.wallHeight, wall.wallThickness]);
useFrame(() => {
if (!meshRef.current) return;
@@ -83,6 +82,7 @@ function Wall({ wall }: { readonly wall: Wall }) {
if (!wallVisibility && wallType.type === 'room') {
meshRef.current.getWorldDirection(v);
camera.getWorldDirection(u);
if (!u || !v) return;
setVisible((2 * v.dot(u)) <= 0.1);
} else {
@@ -91,16 +91,19 @@ function Wall({ wall }: { readonly wall: Wall }) {
})
return (
<group
<mesh
name={`Wall-${wall.wallUuid}`}
key={wall.wallUuid}
userData={wall}
position={[centerX, centerY, centerZ]}
rotation={[0, -angle, 0]}
visible={visible}
>
<Base ref={meshRef} geometry={geometry} visible>
<Base
ref={meshRef}
geometry={geometry}
position={[centerX, centerY, centerZ]}
rotation={[0, -angle, 0]}
>
{materials.map((material, index) => (
<primitive key={index} object={material} attach={`material-${index}`} />
<primitive key={index} visible={visible} object={material} attach={`material-${index}`} />
))}
{wall.decals.map((decal) => {
@@ -112,7 +115,7 @@ function Wall({ wall }: { readonly wall: Wall }) {
scale={[decal.decalScale, decal.decalScale, 0.001]}
>
<meshBasicMaterial
map={outsideWallTexture}
map={material1WallTexture}
side={THREE.DoubleSide}
polygonOffset
polygonOffsetFactor={-1}
@@ -121,7 +124,7 @@ function Wall({ wall }: { readonly wall: Wall }) {
)
})}
</Base>
</group>
</mesh>
);
}