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

feat: Update pointer event handling in Model and WallAssetInstance components for improved interaction

Browse Source
This commit is contained in:
Jerald-Golden-B
2025-07-08 11:44:25 +05:30
parent 0e0f48ac02
commit 1b736dafce
2 changed files with 17 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -270,8 +270,8 @@ function Model({ asset }: { readonly asset: Asset }) {
} }
}, [activeTool, activeModule, deletableFloorItem]); }, [activeTool, activeModule, deletableFloorItem]);
const handlePointerOut = useCallback((asset: Asset) => { const handlePointerOut = useCallback((evt: ThreeEvent<MouseEvent>, asset: Asset) => {
if (activeTool === "delete" && deletableFloorItem && deletableFloorItem.uuid === asset.modelUuid) { if (evt.intersections.length === 0 && activeTool === "delete" && deletableFloorItem && deletableFloorItem.uuid === asset.modelUuid) {
setDeletableFloorItem(null); setDeletableFloorItem(null);
} }
}, [activeTool, deletableFloorItem]); }, [activeTool, deletableFloorItem]);
@@ -369,27 +369,27 @@ function Model({ asset }: { readonly asset: Asset }) {
visible={asset.isVisible} visible={asset.isVisible}
userData={asset} userData={asset}
onDoubleClick={(e) => { onDoubleClick={(e) => {
if (!toggleView) {
e.stopPropagation(); e.stopPropagation();
if (!toggleView) {
handleDblClick(asset); handleDblClick(asset);
} }
}} }}
onClick={(e) => { onClick={(e) => {
if (!toggleView) {
e.stopPropagation(); e.stopPropagation();
if (!toggleView) {
handleClick(asset); handleClick(asset);
} }
}} }}
onPointerEnter={(e) => { onPointerOver={(e) => {
if (!toggleView) {
e.stopPropagation(); e.stopPropagation();
if (!toggleView) {
handlePointerOver(asset); handlePointerOver(asset);
} }
}} }}
onPointerOut={(e) => { onPointerLeave={(e) => {
if (!toggleView) {
e.stopPropagation(); e.stopPropagation();
handlePointerOut(asset); if (!toggleView) {
handlePointerOut(e, asset);
} }
}} }}
onContextMenu={(e) => { onContextMenu={(e) => {

16
app/src/modules/builder/wallAsset/Instances/Instances/wallAssetInstance.tsx
View File

@@ -1,6 +1,6 @@
import * as THREE from 'three'; import * as THREE from 'three';
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { useThree } from '@react-three/fiber'; import { ThreeEvent, useThree } from '@react-three/fiber';
import { Base, Geometry, Subtraction } from '@react-three/csg'; import { Base, Geometry, Subtraction } from '@react-three/csg';
import { retrieveGLTF, storeGLTF } from '../../../../../utils/indexDB/idbUtils'; import { retrieveGLTF, storeGLTF } from '../../../../../utils/indexDB/idbUtils';
import { GLTF, GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader'; import { GLTF, GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';
@@ -14,8 +14,8 @@ import { useVersionContext } from '../../../version/versionContext';
import { getUserData } from '../../../../../functions/getUserData'; import { getUserData } from '../../../../../functions/getUserData';
import closestPointOnLineSegment from '../../../line/helpers/getClosestPointOnLineSegment'; import closestPointOnLineSegment from '../../../line/helpers/getClosestPointOnLineSegment';
import { upsertWallAssetApi } from '../../../../../services/factoryBuilder/asset/wallAsset/upsertWallAssetApi'; // import { upsertWallAssetApi } from '../../../../../services/factoryBuilder/asset/wallAsset/upsertWallAssetApi';
import { deleteWallAssetApi } from '../../../../../services/factoryBuilder/asset/wallAsset/deleteWallAssetApi'; // import { deleteWallAssetApi } from '../../../../../services/factoryBuilder/asset/wallAsset/deleteWallAssetApi';
function WallAssetInstance({ wallAsset }: { wallAsset: WallAsset }) { function WallAssetInstance({ wallAsset }: { wallAsset: WallAsset }) {
const url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_MARKETPLACE_URL}`; const url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_MARKETPLACE_URL}`;
@@ -219,8 +219,8 @@ function WallAssetInstance({ wallAsset }: { wallAsset: WallAsset }) {
} }
}, [activeTool, activeModule, deletableWallAsset]); }, [activeTool, activeModule, deletableWallAsset]);
const handlePointerOut = useCallback((wallAsset: WallAsset) => { const handlePointerOut = useCallback((evt: ThreeEvent<MouseEvent>, wallAsset: WallAsset) => {
if (activeTool === "delete" && deletableWallAsset && deletableWallAsset.userData.modelUuid === wallAsset.modelUuid) { if (evt.intersections.length === 0 && activeTool === "delete" && deletableWallAsset && deletableWallAsset.userData.modelUuid === wallAsset.modelUuid) {
setDeletableWallAsset(null); setDeletableWallAsset(null);
} }
}, [activeTool, deletableWallAsset]); }, [activeTool, deletableWallAsset]);
@@ -281,7 +281,7 @@ function WallAssetInstance({ wallAsset }: { wallAsset: WallAsset }) {
setSelectedWallAsset(null); setSelectedWallAsset(null);
} }
}} }}
onPointerEnter={(e) => { onPointerOver={(e) => {
if (!toggleView) { if (!toggleView) {
e.stopPropagation(); e.stopPropagation();
let currentObject = e.object as THREE.Object3D; let currentObject = e.object as THREE.Object3D;
@@ -294,10 +294,10 @@ function WallAssetInstance({ wallAsset }: { wallAsset: WallAsset }) {
handlePointerOver(wallAsset, currentObject); handlePointerOver(wallAsset, currentObject);
} }
}} }}
onPointerOut={(e) => { onPointerLeave={(e) => {
if (!toggleView) { if (!toggleView) {
e.stopPropagation(); e.stopPropagation();
handlePointerOut(wallAsset); handlePointerOut(e, wallAsset);
} }
}} }}
userData={wallAsset} userData={wallAsset}