morgan/editor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add garage door types and animated door controls

Browse Source
This commit is contained in:
sudhir
2026-05-05 14:20:41 +05:30
parent 1490d280d4
commit 6df4b4895c
5 changed files with 805 additions and 236 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/editor/src/components/editor/first-person-controls.tsx
+4 -1
View File
@@ -166,7 +166,10 @@ export const FirstPersonControls = () => {
node.doorType === 'folding' ||
node.doorType === 'pocket' ||
node.doorType === 'barn' ||
node.doorType === 'sliding'
node.doorType === 'sliding' ||
node.doorType === 'garage-sectional' ||
node.doorType === 'garage-rollup' ||
node.doorType === 'garage-tiltup'
) {
const currentOpenAmount = node.operationState ?? 0
updateDoorOpenState(doorId, {
packages/editor/src/components/editor/floorplan-panel.tsx
+77
View File
@@ -4820,6 +4820,23 @@ const FloorplanGeometryLayer = memo(function FloorplanGeometryLayer({
}
const slidingFixedPoints = slidingPanelPoints(slidingFixedCenter, doorCubeSize * 0.34)
const slidingActivePoints = slidingPanelPoints(slidingActiveCenter, doorCubeSize * 0.68)
const isGarageSectionalDoor = opening.doorType === 'garage-sectional'
const isGarageRollupDoor = opening.doorType === 'garage-rollup'
const isGarageTiltupDoor = opening.doorType === 'garage-tiltup'
const garagePanelCount = Math.max(3, Math.min(12, opening.garagePanelCount ?? 4))
const garagePanelLines = Array.from({ length: garagePanelCount - 1 }, (_, index) => {
const t = (index + 1) / garagePanelCount
return {
start: {
x: svgP1.x + (svgP2.x - svgP1.x) * t,
y: svgP1.y + (svgP2.y - svgP1.y) * t,
},
end: {
x: svgP1.x + (svgP2.x - svgP1.x) * t + px * swingSign * doorCubeSize * 0.78,
y: svgP1.y + (svgP2.y - svgP1.y) * t + py * swingSign * doorCubeSize * 0.78,
},
}
})
const isDoubleSwingDoor = opening.doorType === 'double' || opening.doorType === 'french'
const doubleLeafPlans = isDoubleSwingDoor
? (
@@ -5215,6 +5232,66 @@ const FloorplanGeometryLayer = memo(function FloorplanGeometryLayer({
vectorEffect="non-scaling-stroke"
/>
</>
) : isGarageSectionalDoor || isGarageRollupDoor || isGarageTiltupDoor ? (
<>
<line
stroke={doorStroke}
strokeLinecap="round"
strokeWidth={isSelected || isSelectionHighlighted ? '1.8' : '1.25'}
vectorEffect="non-scaling-stroke"
x1={svgP1.x}
x2={svgP2.x}
y1={svgP1.y}
y2={svgP2.y}
/>
<line
stroke={doorSoftStroke}
strokeDasharray="0.12 0.08"
strokeLinecap="round"
strokeWidth="1"
vectorEffect="non-scaling-stroke"
x1={svgP1.x + px * swingSign * doorCubeSize * 0.78}
x2={svgP2.x + px * swingSign * doorCubeSize * 0.78}
y1={svgP1.y + py * swingSign * doorCubeSize * 0.78}
y2={svgP2.y + py * swingSign * doorCubeSize * 0.78}
/>
{isGarageRollupDoor ? (
<circle
cx={(svgP1.x + svgP2.x) / 2 + px * swingSign * doorCubeSize * 0.78}
cy={(svgP1.y + svgP2.y) / 2 + py * swingSign * doorCubeSize * 0.78}
fill="none"
r={doorCubeSize * 0.22}
stroke={doorSoftStroke}
strokeWidth="0.9"
vectorEffect="non-scaling-stroke"
/>
) : isGarageTiltupDoor ? (
<line
stroke={doorSoftStroke}
strokeLinecap="round"
strokeWidth="1"
vectorEffect="non-scaling-stroke"
x1={svgP1.x + px * swingSign * doorCubeSize * 0.18}
x2={svgP2.x + px * swingSign * doorCubeSize * 0.78}
y1={svgP1.y + py * swingSign * doorCubeSize * 0.18}
y2={svgP2.y + py * swingSign * doorCubeSize * 0.78}
/>
) : (
garagePanelLines.map((line, index) => (
<line
key={`${opening.id}:garage-section:${index}`}
stroke={doorSoftStroke}
strokeLinecap="round"
strokeWidth="0.8"
vectorEffect="non-scaling-stroke"
x1={line.start.x}
x2={line.end.x}
y1={line.start.y}
y2={line.end.y}
/>
))
)}
</>
) : isDoubleSwingDoor ? (
<>
{doubleLeafPlans.map((leaf) =>
packages/editor/src/components/ui/panels/door-panel.tsx
+115 -5
View File
@@ -37,6 +37,16 @@ const doorTypeOptions = [
available: boolean
}[]
const garageDoorTypeOptions = [
{ label: 'Sectional', value: 'garage-sectional', available: true },
{ label: 'Roll-up', value: 'garage-rollup', available: true },
{ label: 'Tilt-up', value: 'garage-tiltup', available: true },
] satisfies {
label: string
value: DoorNode['doorType']
available: boolean
}[]
const frenchDoorSegments: DoorNode['segments'] = [
{
type: 'glass',
@@ -328,7 +338,13 @@ export function DoorPanel() {
const doorType = node.doorType ?? 'hinged'
const isSwingDoor = doorType === 'hinged' || doorType === 'double' || doorType === 'french'
const isSlidingDoor = doorType === 'pocket' || doorType === 'barn' || doorType === 'sliding'
const isGarageDoor = node.doorCategory === 'garage' || doorType.startsWith('garage-')
const isSectionalGarageDoor = doorType === 'garage-sectional'
const isRollupGarageDoor = doorType === 'garage-rollup'
const isTiltupGarageDoor = doorType === 'garage-tiltup'
const typeMode = isOpening ? 'opening' : isGarageDoor ? 'garage' : 'door'
const supportsHandleSide = isSwingDoor
const maxDoorWidth = isGarageDoor ? 6 : 3
const setOpeningTopRadius = (index: number, value: number, commit = false) => {
const next = [...openingTopRadii] as [number, number]
@@ -427,11 +443,60 @@ export function DoorPanel() {
}
}
if (nextDoorType === 'garage-sectional') {
return {
doorCategory: 'garage',
doorType: nextDoorType,
leafCount: 1,
...dimensionUpdates,
handle: false,
threshold: false,
trackStyle: 'overhead',
operationState: 0,
garagePanelCount: Math.max(3, Math.min(8, node.garagePanelCount ?? 4)),
contentPadding: [0.04, 0.04],
segments: foldingDoorSegments,
}
}
if (nextDoorType === 'garage-rollup') {
return {
doorCategory: 'garage',
doorType: nextDoorType,
leafCount: 1,
...dimensionUpdates,
handle: false,
threshold: false,
trackStyle: 'overhead',
operationState: 0,
garagePanelCount: 4,
contentPadding: [0.04, 0.04],
segments: foldingDoorSegments,
}
}
if (nextDoorType === 'garage-tiltup') {
return {
doorCategory: 'garage',
doorType: nextDoorType,
leafCount: 1,
...dimensionUpdates,
handle: false,
threshold: false,
trackStyle: 'overhead',
operationState: 0,
garagePanelCount: 4,
contentPadding: [0.04, 0.04],
segments: foldingDoorSegments,
}
}
return {
doorCategory: 'interior',
doorType: nextDoorType,
leafCount: 1,
...dimensionUpdates,
threshold: true,
}
}
@@ -478,19 +543,28 @@ export function DoorPanel() {
archHeight,
openingRevealRadius,
}
: { openingKind: v },
: v === 'garage'
? {
openingKind: 'door',
...getDoorTypeUpdates(isGarageDoor ? doorType : 'garage-sectional'),
}
: {
openingKind: 'door',
...(isGarageDoor ? getDoorTypeUpdates('hinged') : {}),
},
)
}
options={[
{ label: 'Door', value: 'door' },
{ label: 'Opening', value: 'opening' },
{ label: 'Garage', value: 'garage' },
]}
value={node.openingKind}
value={typeMode}
/>
</div>
{!isOpening && (
<div className="grid grid-cols-2 gap-1.5 px-1 pt-1">
{doorTypeOptions.map((option) => {
{(isGarageDoor ? garageDoorTypeOptions : doorTypeOptions).map((option) => {
const isSelected = doorType === option.value
return (
<button
@@ -604,10 +678,38 @@ export function DoorPanel() {
</PanelSection>
)}
{(isSectionalGarageDoor || isRollupGarageDoor || isTiltupGarageDoor) && !isOpening && (
<PanelSection title="Garage">
<SliderControl
label="Open"
max={100}
min={0}
onChange={(v) => handleUpdate({ operationState: v / 100 })}
precision={0}
restoreOnCommit={false}
step={5}
unit="%"
value={Math.round((node.operationState ?? 0) * 100)}
/>
{isSectionalGarageDoor && (
<SliderControl
label="Panels"
max={8}
min={3}
onChange={(v) => handleUpdate({ garagePanelCount: Math.round(v) })}
precision={0}
restoreOnCommit={false}
step={1}
value={node.garagePanelCount ?? 4}
/>
)}
</PanelSection>
)}
<PanelSection title="Dimensions">
<SliderControl
label="Width"
max={3}
max={maxDoorWidth}
min={0.5}
onChange={(v) => handleUpdate({ width: v })}
precision={2}
@@ -752,6 +854,7 @@ export function DoorPanel() {
/>
</PanelSection>
{!isGarageDoor && (
<PanelSection title="Content Padding">
<SliderControl
label="Horizontal"
@@ -774,6 +877,7 @@ export function DoorPanel() {
value={Math.round(node.contentPadding[1] * 1000) / 1000}
/>
</PanelSection>
)}
{isSwingDoor && (
<PanelSection title="Swing">
@@ -832,6 +936,7 @@ export function DoorPanel() {
</PanelSection>
)}
{!isGarageDoor && (
<PanelSection title="Handle">
{isSwingDoor && (
<ToggleControl
@@ -870,6 +975,7 @@ export function DoorPanel() {
</div>
)}
</PanelSection>
)}
{isSwingDoor && (
<PanelSection title="Hardware">
@@ -900,6 +1006,7 @@ export function DoorPanel() {
</PanelSection>
)}
{!isGarageDoor && (
<PanelSection title="Segments">
{node.segments.map((seg, i) => {
const numCols = seg.columnRatios.length
@@ -913,7 +1020,9 @@ export function DoorPanel() {
<SegmentedControl
onChange={(t) => {
const updated = node.segments.map((s, idx) => (idx === i ? { ...s, type: t } : s))
const updated = node.segments.map((s, idx) =>
idx === i ? { ...s, type: t } : s,
)
handleUpdate({ segments: updated })
}}
options={[
@@ -1049,6 +1158,7 @@ export function DoorPanel() {
)}
</div>
</PanelSection>
)}
</>
)}
packages/editor/src/hooks/use-keyboard.ts
+51 -8
View File
@@ -6,6 +6,8 @@ import { sfxEmitter } from '../lib/sfx-bus'
import useEditor from '../store/use-editor'
const DOOR_SWING_OPEN_ANGLE = Math.PI / 2
const DOOR_TOGGLE_ANIMATION_MS = 520
const activeDoorAnimations = new Map<AnyNodeId, number>()
function updateDoorOpenState(
doorId: AnyNodeId,
@@ -18,6 +20,36 @@ function updateDoorOpenState(
if (node?.parentId) scene.dirtyNodes.add(node.parentId as AnyNodeId)
}
function animateDoorOpenState(
doorId: AnyNodeId,
field: 'operationState' | 'swingAngle',
from: number,
to: number,
) {
const existingFrame = activeDoorAnimations.get(doorId)
if (existingFrame !== undefined) {
window.cancelAnimationFrame(existingFrame)
}
const startedAt = performance.now()
const ease = (value: number) => value * value * (3 - 2 * value)
const tick = (now: number) => {
const progress = Math.min(1, (now - startedAt) / DOOR_TOGGLE_ANIMATION_MS)
const value = from + (to - from) * ease(progress)
updateDoorOpenState(doorId, { [field]: value })
if (progress < 1) {
activeDoorAnimations.set(doorId, window.requestAnimationFrame(tick))
} else {
activeDoorAnimations.delete(doorId)
updateDoorOpenState(doorId, { [field]: to })
}
}
activeDoorAnimations.set(doorId, window.requestAnimationFrame(tick))
}
// Tools call this in their onCancel handler when they have an active mid-action to cancel,
// so that the global Escape handler knows not to also switch to select mode.
let _toolCancelConsumed = false
@@ -169,18 +201,26 @@ export const useKeyboard = ({
node.doorType === 'folding' ||
node.doorType === 'pocket' ||
node.doorType === 'barn' ||
node.doorType === 'sliding'
node.doorType === 'sliding' ||
node.doorType === 'garage-sectional' ||
node.doorType === 'garage-rollup' ||
node.doorType === 'garage-tiltup'
) {
const currentOpenAmount = node.operationState ?? 0
updateDoorOpenState(node.id, {
operationState: currentOpenAmount >= 0.5 ? 0 : 1,
})
animateDoorOpenState(
node.id,
'operationState',
currentOpenAmount,
currentOpenAmount >= 0.5 ? 0 : 1,
)
} else {
const currentSwingAngle = node.swingAngle ?? 0
updateDoorOpenState(node.id, {
swingAngle:
animateDoorOpenState(
node.id,
'swingAngle',
currentSwingAngle,
currentSwingAngle >= DOOR_SWING_OPEN_ANGLE / 2 ? 0 : DOOR_SWING_OPEN_ANGLE,
})
)
}
sfxEmitter.emit('sfx:item-rotate')
}
@@ -212,7 +252,10 @@ export const useKeyboard = ({
node.doorType === 'folding' ||
node.doorType === 'pocket' ||
node.doorType === 'barn' ||
node.doorType === 'sliding'
node.doorType === 'sliding' ||
node.doorType === 'garage-sectional' ||
node.doorType === 'garage-rollup' ||
node.doorType === 'garage-tiltup'
? { operationState: 0 }
: { swingAngle: 0 },
)
packages/viewer/src/systems/door/door-system.tsx
+338 -2
View File
@@ -68,6 +68,23 @@ function addRotatedBox(
parent.add(m)
}
function addBoxWithRotation(
parent: THREE.Object3D,
material: THREE.Material,
w: number,
h: number,
d: number,
x: number,
y: number,
z: number,
rotation: [number, number, number],
) {
const m = new THREE.Mesh(new THREE.BoxGeometry(w, h, d), material)
m.position.set(x, y, z)
m.rotation.set(rotation[0], rotation[1], rotation[2])
parent.add(m)
}
function disposeObject(object: THREE.Object3D) {
object.traverse((child) => {
if (child instanceof THREE.Mesh) child.geometry.dispose()
@@ -484,7 +501,7 @@ function addPocketDoor(
contentPadding: DoorNode['contentPadding']
},
) {
const openAmount = Math.max(0, Math.min(1, operationState))
const openAmount = Math.max(0, Math.min(1, operationState)) * 0.88
const slideSign = slideDirection === 'right' ? 1 : -1
const leafWidth = insideWidth
const leafCenterX = slideSign * insideWidth * openAmount
@@ -775,6 +792,293 @@ function addSlidingDoor(
)
}
function addGarageSectionalDoor(
mesh: THREE.Mesh,
{
insideWidth,
leafHeight,
leafCenterY,
leafDepth,
frameThickness,
frameDepth,
operationState,
garagePanelCount,
}: {
insideWidth: number
leafHeight: number
leafCenterY: number
leafDepth: number
frameThickness: number
frameDepth: number
operationState: number
garagePanelCount: number
},
) {
const openAmount = Math.max(0, Math.min(1, operationState))
const panelCount = Math.max(3, Math.min(12, Math.round(garagePanelCount)))
const panelHeight = leafHeight / panelCount
const panelGap = Math.min(0.012, panelHeight * 0.08)
const travelDepth = Math.max(leafHeight, 1.4)
const curveRadius = panelHeight * 0.58
const curveLength = (Math.PI / 2) * curveRadius
const travel = openAmount * ((panelCount - 1) * panelHeight + curveLength + panelHeight * 0.65)
const overheadY = leafCenterY + leafHeight / 2 - panelHeight / 2
const railY = leafCenterY + leafHeight / 2 - 0.04
const railZ = -travelDepth / 2
addBox(
mesh,
revealMaterial,
0.035,
Math.max(0.04, frameThickness * 0.75),
travelDepth,
-insideWidth / 2 + 0.035,
railY,
railZ,
)
addBox(
mesh,
revealMaterial,
0.035,
Math.max(0.04, frameThickness * 0.75),
travelDepth,
insideWidth / 2 - 0.035,
railY,
railZ,
)
for (let index = 0; index < panelCount; index++) {
const orderFromTop = panelCount - 1 - index
const pathPosition = travel - orderFromTop * panelHeight
let y = overheadY + pathPosition
let z = 0
let rotationX = 0
if (pathPosition > 0 && pathPosition <= curveLength) {
const theta = pathPosition / curveRadius
rotationX = -theta
y = overheadY + curveRadius * Math.sin(theta)
z = -curveRadius * (1 - Math.cos(theta))
} else if (pathPosition > curveLength) {
rotationX = -Math.PI / 2
y = overheadY + curveRadius
z = -(curveRadius + pathPosition - curveLength)
}
const revealOffset = (panelHeight - panelGap) * 0.22
const trimDepth = 0.01
const trimFaceOffset = leafDepth / 2 + trimDepth + 0.006
const addSectionalTrim = (localY: number) => {
addBoxWithRotation(
mesh,
revealMaterial,
insideWidth - 0.16,
0.012,
trimDepth,
0,
y + localY * Math.cos(rotationX) - trimFaceOffset * Math.sin(rotationX),
z + localY * Math.sin(rotationX) + trimFaceOffset * Math.cos(rotationX),
[rotationX, 0, 0],
)
}
addBoxWithRotation(
mesh,
baseMaterial,
insideWidth,
Math.max(0.04, panelHeight - panelGap),
leafDepth,
0,
y,
z,
[rotationX, 0, 0],
)
addSectionalTrim(revealOffset)
addSectionalTrim(-revealOffset)
}
addBox(mesh, revealMaterial, insideWidth, 0.032, Math.max(frameDepth * 0.36, 0.03), 0, railY, 0)
}
function addGarageRollupDoor(
mesh: THREE.Mesh,
{
insideWidth,
leafHeight,
leafCenterY,
leafDepth,
frameThickness,
frameDepth,
operationState,
}: {
insideWidth: number
leafHeight: number
leafCenterY: number
leafDepth: number
frameThickness: number
frameDepth: number
operationState: number
},
) {
const openAmount = Math.max(0, Math.min(1, operationState))
const slatHeight = Math.max(0.055, Math.min(0.11, leafHeight / 22))
const visibleHeight = leafHeight * (1 - openAmount)
const visibleSlatCount = Math.ceil(visibleHeight / slatHeight)
const topY = leafCenterY + leafHeight / 2
const curtainCenterY = topY - visibleHeight / 2
const drumMaxRadius = Math.max(0.12, Math.min(0.22, leafHeight * 0.075))
const drumY = topY + drumMaxRadius * 0.12
const drumZ = -frameDepth / 2 - drumMaxRadius * 0.72
addBox(
mesh,
revealMaterial,
0.032,
leafHeight,
Math.max(frameDepth * 0.48, 0.035),
-insideWidth / 2 + 0.03,
leafCenterY,
0,
)
addBox(
mesh,
revealMaterial,
0.032,
leafHeight,
Math.max(frameDepth * 0.48, 0.035),
insideWidth / 2 - 0.03,
leafCenterY,
0,
)
if (visibleHeight > 0.01) {
addBox(mesh, baseMaterial, insideWidth, visibleHeight, leafDepth, 0, curtainCenterY, 0)
for (let index = 0; index < visibleSlatCount; index++) {
const y = topY - Math.min(visibleHeight, index * slatHeight)
addBox(mesh, revealMaterial, insideWidth - 0.08, 0.01, 0.012, 0, y, leafDepth / 2 + 0.012)
}
addBox(
mesh,
revealMaterial,
insideWidth - 0.04,
0.028,
leafDepth + 0.018,
0,
topY - visibleHeight,
leafDepth / 2 + 0.004,
)
}
const drum = new THREE.Mesh(
new THREE.CylinderGeometry(drumMaxRadius, drumMaxRadius, insideWidth + frameThickness, 36),
baseMaterial,
)
drum.position.set(0, drumY, drumZ)
drum.rotation.z = Math.PI / 2
mesh.add(drum)
addBox(
mesh,
revealMaterial,
insideWidth + frameThickness,
0.026,
Math.max(frameDepth * 0.52, 0.04),
0,
topY + 0.02,
0,
)
}
function addGarageTiltupDoor(
mesh: THREE.Mesh,
{
insideWidth,
leafHeight,
leafCenterY,
leafDepth,
frameThickness,
frameDepth,
operationState,
}: {
insideWidth: number
leafHeight: number
leafCenterY: number
leafDepth: number
frameThickness: number
frameDepth: number
operationState: number
},
) {
const openAmount = Math.max(0, Math.min(1, operationState))
const angle = (Math.PI / 2) * openAmount
const hingeY = leafCenterY + leafHeight / 2
const panelCenterY = hingeY - Math.cos(angle) * (leafHeight / 2)
const panelCenterZ = -Math.sin(angle) * (leafHeight / 2)
const railLength = Math.max(leafHeight * 0.72, 1.2)
const railY = hingeY - frameThickness * 0.35
const railZ = -railLength / 2
addBox(
mesh,
revealMaterial,
0.03,
Math.max(frameThickness * 0.7, 0.035),
railLength,
-insideWidth / 2 + 0.04,
railY,
railZ,
)
addBox(
mesh,
revealMaterial,
0.03,
Math.max(frameThickness * 0.7, 0.035),
railLength,
insideWidth / 2 - 0.04,
railY,
railZ,
)
addBoxWithRotation(
mesh,
baseMaterial,
insideWidth,
leafHeight,
leafDepth,
0,
panelCenterY,
panelCenterZ,
[-angle, 0, 0],
)
const insetWidth = Math.max(0.1, insideWidth - 0.22)
const insetHeight = Math.max(0.1, leafHeight - 0.28)
const trimDepth = 0.012
const trimFaceOffset = leafDepth / 2 + trimDepth + 0.006
const addTiltupTrim = (localX: number, localY: number, trimWidth: number, trimHeight: number) => {
addBoxWithRotation(
mesh,
revealMaterial,
trimWidth,
trimHeight,
trimDepth,
localX,
panelCenterY + localY * Math.cos(angle) + trimFaceOffset * Math.sin(angle),
panelCenterZ - localY * Math.sin(angle) + trimFaceOffset * Math.cos(angle),
[-angle, 0, 0],
)
}
addTiltupTrim(0, insetHeight / 2, insetWidth, 0.018)
addTiltupTrim(0, -insetHeight / 2, insetWidth, 0.018)
addTiltupTrim(-insetWidth / 2, 0, 0.018, insetHeight)
addTiltupTrim(insetWidth / 2, 0, 0.018, insetHeight)
addBox(mesh, revealMaterial, insideWidth, 0.026, Math.max(frameDepth * 0.4, 0.035), 0, hingeY, 0)
}
function updateDoorMesh(node: DoorNode, mesh: THREE.Mesh) {
// Root mesh is an invisible hitbox; all visuals live in child meshes
mesh.geometry.dispose()
@@ -815,6 +1119,7 @@ function updateDoorMesh(node: DoorNode, mesh: THREE.Mesh) {
operationState = 0,
leafCount = 1,
slideDirection = 'left',
garagePanelCount = 4,
} = node
const clampedSwingAngle = Math.max(0, Math.min(Math.PI / 2, swingAngle))
@@ -878,7 +1183,38 @@ function updateDoorMesh(node: DoorNode, mesh: THREE.Mesh) {
)
}
if (doorType === 'folding') {
if (doorType === 'garage-sectional') {
addGarageSectionalDoor(mesh, {
insideWidth,
leafHeight: leafH,
leafCenterY,
leafDepth,
frameThickness,
frameDepth,
operationState,
garagePanelCount,
})
} else if (doorType === 'garage-rollup') {
addGarageRollupDoor(mesh, {
insideWidth,
leafHeight: leafH,
leafCenterY,
leafDepth,
frameThickness,
frameDepth,
operationState,
})
} else if (doorType === 'garage-tiltup') {
addGarageTiltupDoor(mesh, {
insideWidth,
leafHeight: leafH,
leafCenterY,
leafDepth,
frameThickness,
frameDepth,
operationState,
})
} else if (doorType === 'folding') {
addFoldingDoor(mesh, {
insideWidth,
leafHeight: leafH,