fix: remove broken Room view, simplify to Overhead/Isometric
- Remove ROOM_FOCUS preset (wasn't rendering correctly) - Keep Overhead and Isometric views which work well - FocusTarget now zooms within current preset - Text navigation provides room selection
This commit is contained in:
fullsizemalt
parent
6d107c637b
commit
c282943ec3
2 changed files with 17 additions and 30 deletions
|
|
@ -1,7 +1,7 @@
|
|||
import { useEffect, useRef } from 'react';
|
||||
import { CameraControls } from '@react-three/drei';
|
||||
|
||||
export type CameraPreset = 'OVERHEAD' | 'ISOMETRIC' | 'ROOM_FOCUS';
|
||||
export type CameraPreset = 'OVERHEAD' | 'ISOMETRIC';
|
||||
|
||||
interface CameraPresetsProps {
|
||||
preset: CameraPreset;
|
||||
|
|
@ -18,13 +18,15 @@ const getPresetConfig = (
|
|||
floorHeight: number,
|
||||
focusTarget?: { x: number; z: number } | null
|
||||
) => {
|
||||
const centerX = 0;
|
||||
const centerZ = 0;
|
||||
const maxDim = Math.max(floorWidth, floorHeight);
|
||||
|
||||
// If we have a focus target, use it as center, otherwise use floor center
|
||||
const centerX = focusTarget?.x ?? 0;
|
||||
const centerZ = focusTarget?.z ?? 0;
|
||||
|
||||
switch (preset) {
|
||||
case 'OVERHEAD':
|
||||
// Top-down view - looking straight down at full floor
|
||||
// Top-down view - looking straight down
|
||||
return {
|
||||
position: [centerX, maxDim * 1.2, centerZ + 0.1] as [number, number, number],
|
||||
target: [centerX, 0, centerZ] as [number, number, number],
|
||||
|
|
@ -32,27 +34,16 @@ const getPresetConfig = (
|
|||
|
||||
case 'ISOMETRIC':
|
||||
// 3/4 isometric view - classic strategy game angle
|
||||
const isoDistance = maxDim * 0.8;
|
||||
const isoDistance = focusTarget ? 15 : maxDim * 0.8;
|
||||
return {
|
||||
position: [centerX + isoDistance, isoDistance * 0.7, centerZ + isoDistance] as [number, number, number],
|
||||
position: [centerX + isoDistance * 0.7, isoDistance * 0.6, centerZ + isoDistance * 0.7] as [number, number, number],
|
||||
target: [centerX, 0, centerZ] as [number, number, number],
|
||||
};
|
||||
|
||||
case 'ROOM_FOCUS':
|
||||
// Focus on a specific room - position camera above looking down at room
|
||||
const fx = focusTarget?.x ?? centerX;
|
||||
const fz = focusTarget?.z ?? centerZ;
|
||||
// Use a zoomed-in overhead-ish view centered on the room
|
||||
// Height of 12 gives good room-level visibility
|
||||
return {
|
||||
position: [fx + 4, 12, fz + 4] as [number, number, number],
|
||||
target: [fx, 0, fz] as [number, number, number],
|
||||
};
|
||||
|
||||
default:
|
||||
return {
|
||||
position: [centerX + 40, 30, centerZ + 40] as [number, number, number],
|
||||
target: [centerX, 0, centerZ] as [number, number, number],
|
||||
position: [0, 30, 40] as [number, number, number],
|
||||
target: [0, 0, 0] as [number, number, number],
|
||||
};
|
||||
}
|
||||
};
|
||||
|
|
@ -108,9 +99,9 @@ export function CameraPresets({
|
|||
// Polar angle limits (don't go below floor)
|
||||
minPolarAngle={0.1}
|
||||
maxPolarAngle={Math.PI / 2.1}
|
||||
// Enable panning for room exploration
|
||||
// Enable panning for exploration
|
||||
dollySpeed={1}
|
||||
truckSpeed={preset === 'ROOM_FOCUS' ? 1 : 0.5}
|
||||
truckSpeed={0.8}
|
||||
// Smooth damping
|
||||
smoothTime={0.25}
|
||||
makeDefault
|
||||
|
|
@ -118,7 +109,7 @@ export function CameraPresets({
|
|||
);
|
||||
}
|
||||
|
||||
// UI Component for preset selector buttons
|
||||
// UI Component for preset selector buttons - just two options now
|
||||
interface CameraPresetSelectorProps {
|
||||
current: CameraPreset;
|
||||
onChange: (preset: CameraPreset) => void;
|
||||
|
|
@ -128,7 +119,6 @@ export function CameraPresetSelector({ current, onChange }: CameraPresetSelector
|
|||
const presets: { id: CameraPreset; label: string; icon: string }[] = [
|
||||
{ id: 'OVERHEAD', label: 'Overhead', icon: '⬇️' },
|
||||
{ id: 'ISOMETRIC', label: 'Isometric', icon: '📐' },
|
||||
{ id: 'ROOM_FOCUS', label: 'Room', icon: '🔍' },
|
||||
];
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -90,7 +90,7 @@ export default function Facility3DViewerPage() {
|
|||
const plant: PlantPosition = { ...match, x, y, z };
|
||||
setSelectedPlant(plant);
|
||||
setFocusTarget({ x, z });
|
||||
setCameraPreset('ROOM_FOCUS');
|
||||
setCameraPreset('ISOMETRIC');
|
||||
setBeaconPosition([x, y, z]);
|
||||
setHighlightedTags([targetedPlantTag]);
|
||||
setDimMode(true);
|
||||
|
|
@ -150,7 +150,7 @@ export default function Facility3DViewerPage() {
|
|||
const x = (room.posX + room.width / 2) * SCALE - (floorData.floor.width * SCALE / 2);
|
||||
const z = (room.posY + room.height / 2) * SCALE - (floorData.floor.height * SCALE / 2);
|
||||
setFocusTarget({ x, z });
|
||||
setCameraPreset('ROOM_FOCUS');
|
||||
setCameraPreset('ISOMETRIC');
|
||||
// Clear search state when navigating by room
|
||||
setBeaconPosition(null);
|
||||
setHighlightedTags([]);
|
||||
|
|
@ -194,7 +194,7 @@ export default function Facility3DViewerPage() {
|
|||
const y = 0.4 + (result.position.tier * 0.6);
|
||||
|
||||
setFocusTarget({ x, z });
|
||||
setCameraPreset('ROOM_FOCUS');
|
||||
setCameraPreset('ISOMETRIC');
|
||||
setBeaconPosition([x, y, z]);
|
||||
setHighlightedTags([result.label]);
|
||||
setDimMode(true);
|
||||
|
|
@ -277,9 +277,6 @@ export default function Facility3DViewerPage() {
|
|||
current={cameraPreset}
|
||||
onChange={(preset) => {
|
||||
setCameraPreset(preset);
|
||||
if (preset !== 'ROOM_FOCUS') {
|
||||
setFocusTarget(null);
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -355,7 +352,7 @@ export default function Facility3DViewerPage() {
|
|||
const y = 0.4 + (plant.tier * 0.6);
|
||||
|
||||
setFocusTarget({ x, z });
|
||||
setCameraPreset('ROOM_FOCUS');
|
||||
setCameraPreset('ISOMETRIC');
|
||||
setBeaconPosition([x, y, z]);
|
||||
setDimMode(false);
|
||||
setHighlightedTags([plant.plant?.tagNumber || '']);
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue