feat: doors and windows on roof-segment wall faces

Openings now host on the walls a roof segment generates — the base walls under the roof and the coplanar gable/shed/gambrel end faces, so a window can sit in a gable pediment. - core: roof-segment-walls.ts models the four vertical faces as 2D frames (u along face, v height) with convex profile polygons that mirror the wall volume getRoofSegmentBrushes builds; rect-in-profile clamping and anchored resize limits via half-plane algebra. - schemas: optional roofSegmentId on door/window; position is the segment-local wall mid-plane center, rotation[1] the face yaw. - cut: reuses capabilities.roofAccessory.buildCut; new cutScope: 'wall' subtracts from the wall brush only. cascadesViaHostSegment keeps the roof-merge loop from consuming door/window dirty marks (their own systems cascade via parentId). - tools: roof:* handlers in door/window tool + move-tool (the Build-tab preset path), with roofSegmentId cleared/restored across every roof<->wall re-anchor and revert; shared hit resolver normalizes normals through world space (merged mesh vs painted segment frames). - fix: RoofSystem no longer rebuilds per-segment CSG in accessory-reveal mode — the uncut rebuild used to draw over the merged shell's fresh opening until deselect. - fix: the walkthrough collider world now prunes by renderer-effective visibility; stale uncut segment CSG inside the hidden segments-wrapper blocked the player at openings the merged shell had cut through. Known gap: painted segments render per-segment CSG without accessory cuts (pre-existing, also affects skylight/dormer). Twice Codex-reviewed; details in private-editor plans/editor-roof-wall-openings.md. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-06-10 00:39:13 -04:00
parent 1487328ec7
commit bdfee058bd
22 changed files with 1771 additions and 48 deletions
@@ -2,9 +2,12 @@ import type {
  AnyNodeId,
  HandleDescriptor,
  NodeDefinition,
+  RoofSegmentNode,
  WallNode,
  WindowNode as WindowNodeType,
 } from '@pascal-app/core'
+import { readRoofFaceHeightMax, readRoofFaceWidthMax } from '../shared/roof-opening-host'
+import { buildRoofWallOpeningCut } from '../shared/roof-wall-opening-cut'
 import { buildWindowFloorplan } from './floorplan'
 import { windowWidthAffordance } from './floorplan-affordances'
 import { windowFloorplanMoveTarget } from './floorplan-move'
@@ -36,7 +39,13 @@ function windowWidthHandle(side: 'left' | 'right'): HandleDescriptor<WindowNodeT
    axis: 'x',
    anchor: side === 'right' ? 'min' : 'max',
    min: MIN_WINDOW_WIDTH,
-    max: (n, scene) => readWallLength(n, scene),
+    max: (n, scene) => {
+      // Roof-hosted windows clamp against the face profile (the
+      // wall-based limits read Infinity when wallId is unset).
+      const roofMax = readRoofFaceWidthMax(n, scene, sign)
+      if (roofMax !== null) return Math.max(MIN_WINDOW_WIDTH, roofMax)
+      return readWallLength(n, scene)
+    },
    currentValue: (n) => n.width,
    apply: (initial, newWidth) => {
      const rotY = initial.rotation[1]
@@ -73,6 +82,8 @@ function windowHeightHandle(edge: 'top' | 'bottom'): HandleDescriptor<WindowNode
    anchor: edge === 'top' ? 'min' : 'max',
    min: MIN_WINDOW_HEIGHT,
    max: (n, scene) => {
+      const roofMax = readRoofFaceHeightMax(n, scene, sign)
+      if (roofMax !== null) return Math.max(MIN_WINDOW_HEIGHT, roofMax)
      // Maximum: distance from the anchored edge to the wall's allowed Y
      // bounds. Top arrow caps at wall.height - bottom; bottom arrow caps
      // at top (positive Y room above the floor).
@@ -139,9 +150,18 @@ export const windowDefinition: NodeDefinition<typeof WindowNode> = {
    duplicable: true,
    deletable: true,
    wallOpeningPlacement: true,
-    // `wallId` is re-derived from the wall under the cursor at preset
-    // placement time — see the door capability for the same pattern.
-    hostRefFields: ['wallId'],
+    // Windows also host on roof-segment wall faces (base walls under the
+    // roof, gable ends) — same wiring as door; see the door capability
+    // for why `cascadesViaHostSegment` is required.
+    roofAccessory: {
+      buildCut: (node, hostSegment) =>
+        buildRoofWallOpeningCut(node as WindowNodeType, hostSegment as RoofSegmentNode),
+      cutScope: 'wall',
+      cascadesViaHostSegment: true,
+    },
+    // `wallId` / `roofSegmentId` are re-derived from the surface under
+    // the cursor at preset placement time — see door for the pattern.
+    hostRefFields: ['wallId', 'roofSegmentId'],
  },

  parametrics: windowParametrics,
@@ -8,6 +8,10 @@ import {
 } from '@pascal-app/core'
 import { snapToHalf } from '@pascal-app/editor'
 import { createFloorplanCursorResolver } from '../shared/floorplan-cursor'
+import {
+  getRoofHostedOpeningLevelId,
+  getRoofHostedOpeningPlanPoint,
+} from '../shared/roof-opening-host'
 import {
  findClosestWallInPlan,
  projectWallLocalPointToPlan,
@@ -29,7 +33,12 @@ import { clampToWall, hasWallChildOverlap } from './window-math'

 export const windowFloorplanMoveTarget: FloorplanMoveTarget<WindowNode> = ({ node }) => {
  const startLevelId = (() => {
-    const wall = useScene.getState().nodes[node.parentId as AnyNodeId]
+    // Wall-hosted: the wall's parent is the level. Roof-hosted: walk
+    // segment → roof → level.
+    const nodes = useScene.getState().nodes
+    const roofLevelId = getRoofHostedOpeningLevelId(node, nodes)
+    if (roofLevelId) return roofLevelId
+    const wall = nodes[node.parentId as AnyNodeId]
    return wall ? (wall.parentId as AnyNodeId | null) : null
  })()
  const originalWall = node.parentId
@@ -39,7 +48,10 @@ export const windowFloorplanMoveTarget: FloorplanMoveTarget<WindowNode> = ({ nod
    original:
      originalWall?.type === 'wall'
        ? projectWallLocalPointToPlan(originalWall, node.position[0])
-        : [node.position[0], 0],
+        : (getRoofHostedOpeningPlanPoint(node, useScene.getState().nodes) ?? [
+            node.position[0],
+            0,
+          ]),
    metadata: node.metadata,
  })

@@ -56,6 +68,7 @@ export const windowFloorplanMoveTarget: FloorplanMoveTarget<WindowNode> = ({ nod
    side: WindowNode['side']
    parentId: string
    wallId: string
+    roofSegmentId: undefined
  } | null = null

  const session: FloorplanMoveTargetSession = {
@@ -93,6 +106,9 @@ export const windowFloorplanMoveTarget: FloorplanMoveTarget<WindowNode> = ({ nod
        side: hit.side,
        parentId: hit.wall.id,
        wallId: hit.wall.id,
+        // Re-anchoring to a wall ends any roof-segment hosting; the
+        // overlay's snapshot restores it if the move is reverted.
+        roofSegmentId: undefined,
      }

      useScene.getState().updateNodes([
@@ -1,8 +1,12 @@
 import {
  type AnyNodeId,
+  clampRectToRoofWallFace,
  collectAlignmentAnchors,
  emitter,
  isCurvedWall,
+  type RoofEvent,
+  type RoofNode,
+  roofWallFaceLocalToSegment,
  sceneRegistry,
  spatialGridManager,
  useLiveTransforms,
@@ -23,8 +27,9 @@ import {
 } from '@pascal-app/editor'
 import { useViewer } from '@pascal-app/viewer'
 import { useCallback, useEffect, useMemo, useRef } from 'react'
-import { BoxGeometry, EdgesGeometry, type Group } from 'three'
+import { BoxGeometry, EdgesGeometry, type Group, Vector3 } from 'three'
 import { LineBasicNodeMaterial } from 'three/webgpu'
+import { hasRoofFaceChildOverlap, resolveRoofWallHit } from '../shared/roof-wall-hit'
 import { resolveWallSlideAlignment } from '../shared/wall-opening-alignment'
 import { clampToWall, hasWallChildOverlap, wallLocalToWorld } from './window-math'

@@ -35,6 +40,8 @@ const edgeMaterial = new LineBasicNodeMaterial({
  depthWrite: false,
 })

+const roofCursorPoint = new Vector3()
+
 /**
 * Move/duplicate tool for WindowNodes — wall-only, same guardrails as WindowTool.
 *
@@ -70,6 +77,10 @@ const MoveWindowTool: React.FC<{ node: WindowNode }> = ({ node: movingWindowNode
      side: movingWindowNode.side,
      parentId: movingWindowNode.parentId,
      wallId: movingWindowNode.wallId,
+      // Windows can be hosted on a roof-segment wall face. Moving onto a
+      // wall re-anchors as wall-hosted (roofSegmentId cleared); reverts
+      // must restore the roof host.
+      roofSegmentId: movingWindowNode.roofSegmentId,
      metadata: movingWindowNode.metadata,
    }

@@ -230,6 +241,7 @@ const MoveWindowTool: React.FC<{ node: WindowNode }> = ({ node: movingWindowNode
          side: target.side,
          parentId: target.wallId,
          wallId: target.wallId,
+          roofSegmentId: undefined,
        })
        markWallDirty(currentWallId)
        currentWallId = target.wallId
@@ -315,6 +327,7 @@ const MoveWindowTool: React.FC<{ node: WindowNode }> = ({ node: movingWindowNode
          side: target.side,
          wallId: target.wallId,
          parentId: target.wallId,
+          roofSegmentId: undefined,
        })
        useScene.getState().createNode(node, target.wallId as AnyNodeId)
        placedId = node.id
@@ -327,6 +340,7 @@ const MoveWindowTool: React.FC<{ node: WindowNode }> = ({ node: movingWindowNode
          side: original.side,
          parentId: original.parentId,
          wallId: original.wallId,
+          roofSegmentId: original.roofSegmentId,
          metadata: original.metadata,
        })
        useScene.temporal.getState().resume()
@@ -337,6 +351,7 @@ const MoveWindowTool: React.FC<{ node: WindowNode }> = ({ node: movingWindowNode
          side: target.side,
          parentId: target.wallId,
          wallId: target.wallId,
+          roofSegmentId: undefined,
          metadata: {},
        })

@@ -374,6 +389,188 @@ const MoveWindowTool: React.FC<{ node: WindowNode }> = ({ node: movingWindowNode
        side: original.side,
        parentId: original.parentId,
        wallId: original.wallId,
+        roofSegmentId: original.roofSegmentId,
+      })
+      if (original.parentId) markWallDirty(original.parentId)
+    }
+
+    // ── Roof-segment wall faces ─────────────────────────────────────
+    // Mirrors the wall flow for the segments' vertical wall faces (base
+    // walls under the roof + coplanar gable ends — a window can sit in
+    // the gable pediment). This is also the placement path preset tiles
+    // take (`metadata.isNew` clones).
+
+    const worldToBuildingLocal = (point: Vector3): [number, number, number] => {
+      const buildingId = useViewer.getState().selection.buildingId
+      const buildingObj = buildingId ? sceneRegistry.nodes.get(buildingId as AnyNodeId) : undefined
+      if (buildingObj) buildingObj.worldToLocal(point)
+      return [point.x, point.y, point.z]
+    }
+
+    const resolveRoofMoveTarget = (event: RoofEvent) => {
+      const hit = resolveRoofWallHit(
+        event.node as RoofNode,
+        event.position,
+        event.normal,
+        event.object,
+      )
+      if (!hit) return null
+      // Free vertical placement (0.5m grid like walls); the clamp
+      // projects the window inside the face profile, sliding it down
+      // under the gable slopes when needed.
+      const clamped = clampRectToRoofWallFace(
+        hit.face,
+        hit.u,
+        snapToHalf(hit.v),
+        movingWindowNode.width,
+        movingWindowNode.height,
+      )
+      if (!clamped) return null
+      const position = roofWallFaceLocalToSegment(
+        hit.segment,
+        hit.face.id,
+        clamped.u,
+        clamped.v,
+        (hit.segment.wallThickness ?? 0.1) / 2,
+      )
+      const valid = !hasRoofFaceChildOverlap(
+        hit.segment,
+        hit.face,
+        clamped.u,
+        clamped.v,
+        movingWindowNode.width,
+        movingWindowNode.height,
+        movingWindowNode.id,
+      )
+      return { hit, position, yaw: hit.face.yaw, valid, roof: event.node as RoofNode }
+    }
+
+    const updateRoofCursor = (target: NonNullable<ReturnType<typeof resolveRoofMoveTarget>>) => {
+      const segObj = sceneRegistry.nodes.get(target.hit.segment.id as AnyNodeId)
+      if (!segObj) return
+      segObj.updateWorldMatrix(true, false)
+      roofCursorPoint.set(target.position[0], target.position[1], target.position[2])
+      segObj.localToWorld(roofCursorPoint)
+      updateCursor(
+        worldToBuildingLocal(roofCursorPoint),
+        (target.roof.rotation ?? 0) + (target.hit.segment.rotation ?? 0) + target.yaw,
+        target.valid,
+      )
+    }
+
+    const onRoofHover = (event: RoofEvent) => {
+      const target = resolveRoofMoveTarget(event)
+      if (!target) return
+      // Wall-frame drag anchor / live transform don't apply on a roof face.
+      dragAnchor = null
+      lastTarget = null
+      useLiveTransforms.getState().clear(movingWindowNode.id)
+      if (currentWallId !== target.hit.segment.id) {
+        useScene.getState().updateNode(movingWindowNode.id, {
+          position: target.position,
+          rotation: [0, target.yaw, 0],
+          side: 'front',
+          parentId: target.hit.segment.id,
+          wallId: undefined,
+          roofSegmentId: target.hit.segment.id,
+        })
+        markWallDirty(currentWallId)
+        currentWallId = target.hit.segment.id
+      } else {
+        useScene.getState().updateNode(movingWindowNode.id, {
+          position: target.position,
+          rotation: [0, target.yaw, 0],
+        })
+      }
+      updateRoofCursor(target)
+      event.stopPropagation()
+    }
+
+    const onRoofClick = (event: RoofEvent) => {
+      const target = resolveRoofMoveTarget(event)
+      if (!target?.valid) return
+      const segmentId = target.hit.segment.id
+
+      let placedId: string
+
+      if (isNew) {
+        useScene.getState().deleteNode(movingWindowNode.id)
+        useScene.temporal.getState().resume()
+
+        const cloned = structuredClone(movingWindowNode) as any
+        delete cloned.id
+        if (cloned.metadata && typeof cloned.metadata === 'object') {
+          delete cloned.metadata.isNew
+          delete cloned.metadata.isTransient
+        }
+
+        const node = WindowNode.parse({
+          ...cloned,
+          position: target.position,
+          rotation: [0, target.yaw, 0],
+          side: 'front',
+          wallId: undefined,
+          roofSegmentId: segmentId,
+          parentId: segmentId,
+        })
+        useScene.getState().createNode(node, segmentId as AnyNodeId)
+        placedId = node.id
+      } else {
+        useScene.getState().updateNode(movingWindowNode.id, {
+          position: original.position,
+          rotation: original.rotation,
+          side: original.side,
+          parentId: original.parentId,
+          wallId: original.wallId,
+          roofSegmentId: original.roofSegmentId,
+          metadata: original.metadata,
+        })
+        useScene.temporal.getState().resume()
+
+        useScene.getState().updateNode(movingWindowNode.id, {
+          position: target.position,
+          rotation: [0, target.yaw, 0],
+          side: 'front',
+          parentId: segmentId,
+          wallId: undefined,
+          roofSegmentId: segmentId,
+          metadata: {},
+        })
+
+        if (original.parentId && original.parentId !== segmentId) {
+          markWallDirty(original.parentId)
+        }
+        placedId = movingWindowNode.id
+      }
+
+      markWallDirty(segmentId)
+      useLiveTransforms.getState().clear(movingWindowNode.id)
+      useScene.temporal.getState().pause()
+
+      triggerSFX('sfx:structure-build')
+      hideCursor()
+      useViewer.getState().setSelection({ selectedIds: [placedId] })
+      exitMoveMode()
+      event.stopPropagation()
+    }
+
+    const onRoofLeave = () => {
+      hideCursor()
+      useLiveTransforms.getState().clear(movingWindowNode.id)
+      dragAnchor = null
+      lastTarget = null
+      if (isNew) return
+      if (currentWallId && currentWallId !== original.parentId) {
+        markWallDirty(currentWallId)
+      }
+      currentWallId = original.parentId
+      useScene.getState().updateNode(movingWindowNode.id, {
+        position: original.position,
+        rotation: original.rotation,
+        side: original.side,
+        parentId: original.parentId,
+        wallId: original.wallId,
+        roofSegmentId: original.roofSegmentId,
      })
      if (original.parentId) markWallDirty(original.parentId)
    }
@@ -390,6 +587,7 @@ const MoveWindowTool: React.FC<{ node: WindowNode }> = ({ node: movingWindowNode
          side: original.side,
          parentId: original.parentId,
          wallId: original.wallId,
+          roofSegmentId: original.roofSegmentId,
          metadata: original.metadata,
        })
        if (original.parentId) markWallDirty(original.parentId)
@@ -403,6 +601,10 @@ const MoveWindowTool: React.FC<{ node: WindowNode }> = ({ node: movingWindowNode
    emitter.on('wall:move', onWallMove)
    emitter.on('wall:click', onWallClick)
    emitter.on('wall:leave', onWallLeave)
+    emitter.on('roof:enter', onRoofHover)
+    emitter.on('roof:move', onRoofHover)
+    emitter.on('roof:click', onRoofClick)
+    emitter.on('roof:leave', onRoofLeave)
    emitter.on('tool:cancel', onCancel)

    return () => {
@@ -422,6 +624,7 @@ const MoveWindowTool: React.FC<{ node: WindowNode }> = ({ node: movingWindowNode
            side: original.side,
            parentId: original.parentId,
            wallId: original.wallId,
+            roofSegmentId: original.roofSegmentId,
            metadata: original.metadata,
          })
          if (original.parentId) markWallDirty(original.parentId)
@@ -434,6 +637,10 @@ const MoveWindowTool: React.FC<{ node: WindowNode }> = ({ node: movingWindowNode
      emitter.off('wall:move', onWallMove)
      emitter.off('wall:click', onWallClick)
      emitter.off('wall:leave', onWallLeave)
+      emitter.off('roof:enter', onRoofHover)
+      emitter.off('roof:move', onRoofHover)
+      emitter.off('roof:click', onRoofClick)
+      emitter.off('roof:leave', onRoofLeave)
      emitter.off('tool:cancel', onCancel)
    }
  }, [movingWindowNode, exitMoveMode])
@@ -1,6 +1,12 @@
 'use client'

-import { useRegistry, useScene, type WindowNode } from '@pascal-app/core'
+import {
+  type AnyNodeId,
+  type RoofSegmentNode,
+  useRegistry,
+  useScene,
+  type WindowNode,
+} from '@pascal-app/core'
 import {
  createMaterial,
  DEFAULT_WINDOW_MATERIAL,
@@ -33,7 +39,17 @@ export const WindowRenderer = ({ node }: { node: WindowNode }) => {
    node.material?.texture,
  ])

-  return (
+  // Roof-hosted windows mount under the roof's `roof-elements` group (roof
+  // frame), so the host segment's transform is applied here — wall-hosted
+  // windows get it for free from the wall mesh they're nested in.
+  const segment = useScene((state) =>
+    node.roofSegmentId
+      ? (state.nodes[node.roofSegmentId as AnyNodeId] as RoofSegmentNode | undefined)
+      : undefined,
+  )
+  if (node.roofSegmentId && segment?.type !== 'roof-segment') return null
+
+  const mesh = (
    <mesh
      material={material}
      position={node.position}
@@ -45,6 +61,13 @@ export const WindowRenderer = ({ node }: { node: WindowNode }) => {
      <boxGeometry args={[0, 0, 0]} />
    </mesh>
  )
+
+  if (!segment) return mesh
+  return (
+    <group position={segment.position} rotation-y={segment.rotation}>
+      {mesh}
+    </group>
+  )
 }

 export default WindowRenderer
@@ -1,8 +1,12 @@
 import {
  type AnyNodeId,
+  clampRectToRoofWallFace,
  collectAlignmentAnchors,
  emitter,
  isCurvedWall,
+  type RoofEvent,
+  type RoofNode,
+  roofWallFaceLocalToSegment,
  sceneRegistry,
  spatialGridManager,
  useScene,
@@ -21,8 +25,9 @@ import {
 } from '@pascal-app/editor'
 import { useViewer } from '@pascal-app/viewer'
 import { useEffect, useRef } from 'react'
-import { BoxGeometry, EdgesGeometry, type Group, type LineSegments } from 'three'
+import { BoxGeometry, EdgesGeometry, type Group, type LineSegments, Vector3 } from 'three'
 import { LineBasicNodeMaterial } from 'three/webgpu'
+import { hasRoofFaceChildOverlap, resolveRoofWallHit } from '../shared/roof-wall-hit'
 import { resolveWallSlideAlignment } from '../shared/wall-opening-alignment'
 import { clampToWall, hasWallChildOverlap, wallLocalToWorld } from './window-math'

@@ -34,8 +39,12 @@ const edgeMaterial = new LineBasicNodeMaterial({
  depthWrite: false,
 })

+const roofCursorPoint = new Vector3()
+
 /**
- * Window tool — places WindowNodes on walls only.
+ * Window tool — places WindowNodes on walls and on roof-segment wall
+ * faces (the generated base walls under a roof, including coplanar gable
+ * ends — a window can sit in the gable pediment).
 * Shows a rectangle cursor (green = valid, red = invalid) matching window dimensions.
 */
 const WindowTool: React.FC = () => {
@@ -223,6 +232,8 @@ const WindowTool: React.FC = () => {
            side,
            parentId: event.node.id,
            wallId: event.node.id,
+            // The draft may arrive from a roof-segment face hover.
+            roofSegmentId: undefined,
          })
        }
      }
@@ -343,6 +354,164 @@ const WindowTool: React.FC = () => {
      hideCursor()
    }

+    // ── Roof-segment wall faces ─────────────────────────────────────
+    // The merged roof mesh emits `roof:*`; hits are resolved against the
+    // segments' vertical wall faces (base walls + coplanar gable ends),
+    // so a window can sit anywhere inside the face profile — including
+    // the gable pediment triangle.
+
+    const worldToBuildingLocal = (point: Vector3): [number, number, number] => {
+      // The tool's cursor group renders in the building's local frame —
+      // same conversion as the roof accessory tools (e.g. SkylightTool).
+      const buildingId = useViewer.getState().selection.buildingId
+      const buildingObj = buildingId ? sceneRegistry.nodes.get(buildingId as AnyNodeId) : undefined
+      if (buildingObj) buildingObj.worldToLocal(point)
+      return [point.x, point.y, point.z]
+    }
+
+    const resolveRoofTarget = (event: RoofEvent) => {
+      const hit = resolveRoofWallHit(
+        event.node as RoofNode,
+        event.position,
+        event.normal,
+        event.object,
+      )
+      if (!hit) return null
+      const width = draftRef.current?.width ?? 1.5
+      const height = draftRef.current?.height ?? 1.5
+      // Free vertical placement (snapped to the 0.5m grid like walls);
+      // the clamp projects the window inside the face profile, sliding
+      // it down under the gable slopes when needed.
+      const clamped = clampRectToRoofWallFace(hit.face, hit.u, snapToHalf(hit.v), width, height)
+      if (!clamped) return null
+      const position = roofWallFaceLocalToSegment(
+        hit.segment,
+        hit.face.id,
+        clamped.u,
+        clamped.v,
+        (hit.segment.wallThickness ?? 0.1) / 2,
+      )
+      const valid = !hasRoofFaceChildOverlap(
+        hit.segment,
+        hit.face,
+        clamped.u,
+        clamped.v,
+        width,
+        height,
+        draftRef.current?.id,
+      )
+      return { hit, position, yaw: hit.face.yaw, valid }
+    }
+
+    const updateRoofCursor = (
+      target: NonNullable<ReturnType<typeof resolveRoofTarget>>,
+      roof: RoofNode,
+    ) => {
+      const segObj = sceneRegistry.nodes.get(target.hit.segment.id as AnyNodeId)
+      if (!segObj) return
+      segObj.updateWorldMatrix(true, false)
+      roofCursorPoint.set(target.position[0], target.position[1], target.position[2])
+      segObj.localToWorld(roofCursorPoint)
+      updateCursor(
+        worldToBuildingLocal(roofCursorPoint),
+        (roof.rotation ?? 0) + (target.hit.segment.rotation ?? 0) + target.yaw,
+        target.valid,
+      )
+    }
+
+    const onRoofHover = (event: RoofEvent) => {
+      const target = resolveRoofTarget(event)
+      if (!target) {
+        // On the roof but not over a placeable wall face (slope, soffit,
+        // or a face the window cannot fit on).
+        if (draftRef.current?.roofSegmentId) {
+          destroyDraft()
+          hideCursor()
+        }
+        return
+      }
+      const { hit, position, yaw } = target
+
+      if (draftRef.current && draftRef.current.parentId !== hit.segment.id) destroyDraft()
+      if (draftRef.current) {
+        useScene.getState().updateNode(draftRef.current.id, {
+          position,
+          rotation: [0, yaw, 0],
+        })
+      } else {
+        const node = WindowNode.parse({
+          position,
+          rotation: [0, yaw, 0],
+          side: 'front',
+          roofSegmentId: hit.segment.id,
+          parentId: hit.segment.id,
+          metadata: { isTransient: true },
+        })
+        useScene.getState().createNode(node, hit.segment.id as AnyNodeId)
+        draftRef.current = node
+      }
+      updateRoofCursor(target, event.node as RoofNode)
+      event.stopPropagation()
+    }
+
+    const onRoofClick = (event: RoofEvent) => {
+      if (!draftRef.current?.roofSegmentId) return
+      const target = resolveRoofTarget(event)
+      if (!target?.valid) return
+      const { hit, position, yaw } = target
+
+      const draft = draftRef.current
+      draftRef.current = null
+
+      useScene.getState().deleteNode(draft.id)
+      useScene.temporal.getState().resume()
+
+      const state = useScene.getState()
+      const windowCount = Object.values(state.nodes).filter(
+        (n) => n.type === 'window' && (n as WindowNode).roofSegmentId !== undefined,
+      ).length
+
+      const node = WindowNode.parse({
+        name: `Window ${windowCount + 1}`,
+        position,
+        rotation: [0, yaw, 0],
+        side: 'front',
+        roofSegmentId: hit.segment.id,
+        parentId: hit.segment.id,
+        width: draft.width,
+        height: draft.height,
+        windowType: draft.windowType,
+        operationState: draft.operationState,
+        awningDirection: draft.awningDirection,
+        casementStyle: draft.casementStyle,
+        hingesSide: draft.hingesSide,
+        frameThickness: draft.frameThickness,
+        frameDepth: draft.frameDepth,
+        columnRatios: draft.columnRatios,
+        rowRatios: draft.rowRatios,
+        columnDividerThickness: draft.columnDividerThickness,
+        rowDividerThickness: draft.rowDividerThickness,
+        sill: draft.sill,
+        sillDepth: draft.sillDepth,
+        sillThickness: draft.sillThickness,
+      })
+
+      useScene.getState().createNode(node, hit.segment.id as AnyNodeId)
+      // Rebuild the segment (and the merged roof) so the wall brush
+      // picks up the new opening cut.
+      useScene.getState().dirtyNodes.add(hit.segment.id as AnyNodeId)
+      useViewer.getState().setSelection({ selectedIds: [node.id] })
+      useScene.temporal.getState().pause()
+      triggerSFX('sfx:structure-build')
+      event.stopPropagation()
+    }
+
+    const onRoofLeave = () => {
+      if (!draftRef.current?.roofSegmentId) return
+      destroyDraft()
+      hideCursor()
+    }
+
    const onCancel = () => {
      destroyDraft()
      hideCursor()
@@ -352,6 +521,10 @@ const WindowTool: React.FC = () => {
    emitter.on('wall:move', onWallMove)
    emitter.on('wall:click', onWallClick)
    emitter.on('wall:leave', onWallLeave)
+    emitter.on('roof:enter', onRoofHover)
+    emitter.on('roof:move', onRoofHover)
+    emitter.on('roof:click', onRoofClick)
+    emitter.on('roof:leave', onRoofLeave)
    emitter.on('tool:cancel', onCancel)

    return () => {
@@ -363,6 +536,10 @@ const WindowTool: React.FC = () => {
      emitter.off('wall:move', onWallMove)
      emitter.off('wall:click', onWallClick)
      emitter.off('wall:leave', onWallLeave)
+      emitter.off('roof:enter', onRoofHover)
+      emitter.off('roof:move', onRoofHover)
+      emitter.off('roof:click', onRoofClick)
+      emitter.off('roof:leave', onRoofLeave)
      emitter.off('tool:cancel', onCancel)
    }
  }, [])