johnruina/furniture
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Give entrance its own dedicated section separate from objects

Browse Source
This commit is contained in:
plus_one
2026-10-17 21:36:14 -04:00
parent 1ecac34502
commit 73bdecef2b
2 changed files with 48 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/ControlPanel.tsx
+47 -51
View File
@@ -284,64 +284,60 @@ export function ControlPanel({
<div className="section">
<div className="section-title">Scene</div>
<div className="row">
<button onClick={placeEntrance} style={{ flex: 1 }}>
<button onClick={createObject} style={{ width: '100%' }}>
Create Object
</button>
</div>
<div className="section">
<div className="section-title">Entrance</div>
{state.entrance ? (
<>
<div className="grid-2">
<label className="field">
<span>X</span>
<NumberField value={state.entrance.x} width="100%" onChange={(v) => setEntrance({ x: v })} />
</label>
<label className="field">
<span>Y</span>
<NumberField value={state.entrance.y} width="100%" onChange={(v) => setEntrance({ y: v })} />
</label>
<label className="field">
<span>Width</span>
<NumberField
value={state.entrance.width ?? 20}
min={10}
width="100%"
onChange={(v) => setEntrance({ width: v })}
/>
</label>
<label className="field">
<span>Height</span>
<NumberField
value={state.entrance.height ?? 20}
min={10}
width="100%"
onChange={(v) => setEntrance({ height: v })}
/>
</label>
</div>
<button
style={{ marginTop: 8, width: '100%' }}
onClick={() => onStateChange({ ...state, entrance: null })}
>
Remove Entrance
</button>
</>
) : (
<button onClick={placeEntrance} style={{ width: '100%' }}>
Place Entrance
</button>
<button onClick={createObject} style={{ flex: 1 }}>
Create Object
</button>
</div>
)}
</div>
<div className="section">
<div className="section-title">Objects</div>
<div className="obj-list">{objects.map(renderObjectCard)}</div>
{state.entrance && (
<div
className={`obj-card ${selectedId === '__entrance__' ? 'selected' : ''}`}
style={{ marginTop: 6 }}
>
<div className="obj-head" onClick={() => onSelect('__entrance__')}>
<span className="obj-swatch" style={{ background: '#3fbf7f' }} />
<span className="obj-name">Entrance</span>
<span className="obj-badge">fixed</span>
</div>
{selectedId === '__entrance__' && (
<div className="obj-body">
<div className="grid-2">
<label className="field">
<span>X</span>
<NumberField value={state.entrance.x} width="100%" onChange={(v) => setEntrance({ x: v })} />
</label>
<label className="field">
<span>Y</span>
<NumberField value={state.entrance.y} width="100%" onChange={(v) => setEntrance({ y: v })} />
</label>
<label className="field">
<span>Width</span>
<NumberField
value={state.entrance.width ?? 20}
min={10}
width="100%"
onChange={(v) => setEntrance({ width: v })}
/>
</label>
<label className="field">
<span>Height</span>
<NumberField
value={state.entrance.height ?? 20}
min={10}
width="100%"
onChange={(v) => setEntrance({ height: v })}
/>
</label>
</div>
</div>
)}
</div>
)}
</div>
</>
)}