46 lines
1.5 KiB
TypeScript
46 lines
1.5 KiB
TypeScript
import { useEffect, useState } from "react";
|
|
import { Canvas } from "@react-three/fiber";
|
|
import { useParams } from "react-router-dom";
|
|
import VirtualTourWrapper from "../components/virtualTour/VirtualTourWrapper";
|
|
import { IAppartmentComplex } from "../types/apartmentSphere";
|
|
import VirtualTourTopPanel from "../components/virtualTour/VirtualTourTopPanel";
|
|
import ButtomPanelCompassVirtualTour from "../components/virtualTour/ButtomPanelCompassVirualTour";
|
|
import VirtualTourSidebar from "../components/virtualTour/VirtualTourSidebar";
|
|
import _appartment from "../data/appartments.json";
|
|
|
|
const appartments = _appartment as IAppartmentComplex[];
|
|
const defaultApartment = appartments[0];
|
|
|
|
const VirtualTour = () => {
|
|
const [currentAppartment, setCurrentAppartment] =
|
|
useState<null | IAppartmentComplex>(null);
|
|
|
|
const { appartmentTypeId } = useParams();
|
|
|
|
useEffect(() => {
|
|
const _currentAppartment = appartments.find(
|
|
(app) => app.id === appartmentTypeId
|
|
);
|
|
if (_currentAppartment) {
|
|
setCurrentAppartment(_currentAppartment);
|
|
} else {
|
|
setCurrentAppartment(defaultApartment);
|
|
}
|
|
}, [appartmentTypeId]);
|
|
|
|
return (
|
|
<div className="overflow-hidden h-screen w-screen">
|
|
<VirtualTourTopPanel />
|
|
<VirtualTourSidebar currentAppartment={currentAppartment} />
|
|
<Canvas>
|
|
{currentAppartment && (
|
|
<VirtualTourWrapper appartment={currentAppartment} />
|
|
)}
|
|
</Canvas>
|
|
<ButtomPanelCompassVirtualTour />
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default VirtualTour;
|