43 lines
1.6 KiB
JavaScript
43 lines
1.6 KiB
JavaScript
import { useContext, useMemo } from 'react';
|
|
import './LocList.css';
|
|
import SceneryContext from '../../contexts/SceneryContext';
|
|
import ClickableLocation from './ClickableLocation';
|
|
|
|
export default function LocList(props) {
|
|
const { scenery } = useContext(SceneryContext);
|
|
|
|
const signalBoxes = useMemo(() => {
|
|
if (!scenery?.signalBoxes) return null;
|
|
return scenery.signalBoxes.map(signalBox => {
|
|
const pos = signalBox.pos.toSVGCoords();
|
|
const rot = -signalBox.getFinalRotation();
|
|
const name = signalBox.getPrintableSignalBoxName();
|
|
return (
|
|
<ClickableLocation name={name} pos={pos} rot={rot} key={signalBox.id} />
|
|
);
|
|
});
|
|
}, [scenery?.signalBoxes]);
|
|
|
|
const spawnPoints = useMemo(() => {
|
|
if (!scenery?.spawnPoints) return null;
|
|
return scenery.spawnPoints.map(trackObject => {
|
|
const pos = trackObject.pos.toSVGCoords();
|
|
const isSignal = trackObject.type === 'Signal';
|
|
const name = trackObject.spawn_info.name || (isSignal ? trackObject.getPrintableSignalName() : trackObject.getPrintableSpawnPointName());
|
|
return (
|
|
<ClickableLocation name={name} pos={pos} key={trackObject.id} />
|
|
)
|
|
});
|
|
}, [scenery?.spawnPoints]);
|
|
|
|
return (
|
|
<div className="loclist">
|
|
<div className="loclist-section">
|
|
{ signalBoxes }
|
|
</div>
|
|
<div className="loclist-section">
|
|
{ spawnPoints }
|
|
</div>
|
|
</div>
|
|
);
|
|
} |