Surfaces Openings and Connections

Surfaces, Openings and Connections

A surface is the unit on which material is applied. The planner lets you turn raw geometry into named, editable surfaces, punch holes (openings) through them, split them along arbitrary lines, and tie neighbouring surfaces together with connections that drive how material wraps from one to another.

Feature line from the README: 🧩 Named surfaces, openings, and multi-surface connections.

Surfaces

Creating a surface

Use the Surface tool (F):

1. Activate the tool.
2. Click inside an already-drawn rectangle or polygon to promote it, or draw a new outline directly. The resulting outline is registered as a surface entity with a unique id, a default name (Surface 1, Surface 2…), and an editable polygon boundary.
3. Open the Properties panel to rename, assign a material and pick a placement pattern.

Surface properties

For the currently selected surface you can edit:

• Name — free-form, used in the legend, the cut list and the PDF export.
• Material — picks an entry from the material library.
• Placement pattern — selects a saved pattern; the active pattern's settings can be tweaked inline via a collapsible "Pattern settings" section.
• Show name / Show dimensions / Show area — three independent toggles that control overlay labels rendered on the canvas.
• Edge rules — per-edge overlap configuration (see Edge Overlap Visualization).
• Delete surface — removes the surface and all dependent layouts.

The Surface List in the bottom panel mirrors the same data and lets you jump between surfaces quickly.

Openings

Openings carve windows, sockets, ducts or any other hole out of a parent surface. The placement engine flows material around every opening so the cut list and visualization automatically respect them.

Creating an opening

Select a surface, then activate the Opening tool (O):

1. Drag a rectangle (the most common case), or click vertices to build a polygonal opening.
2. The opening is subtracted from the parent surface and shown with a distinct outline on the canvas.
3. Open the Properties panel to fine-tune size, position, label and visibility.

You can have any number of openings per surface; nested or overlapping openings are merged geometrically before the layout is computed.

Splitting a surface

The Split surface tool (X) divides one surface into two along a cut line:

1. Click the surface to split.
2. Click a start point on one edge, then an end point on another edge.
3. Two independent surfaces are produced. Each keeps its own name, material, pattern and edge rules — useful when a wall changes finish half-way.

The cut also leaves behind a connection (see below) so material continuity across the split is still respected.

Multi-surface connections

A connection is a directed link between two edges that belong to two different surfaces. Connections power three things:

1. Material continuity — the layout engine can flow material across the shared edge instead of stopping at it.
2. Physical overlap — when one side is configured as a donor, its material is rendered partially over the other side (see Edge Overlap Visualization).
3. Cut-list awareness — pieces that cross a connection are split once for cutting, but accounted for in the right place.

Creating a connection

Use the Connection tool (C):

1. Activate the tool, then click the first edge (surface A).
2. Click the matching edge on a different surface (surface B).
3. A dialog appears where you choose:
   • The connection type (inside corner, outside corner, butt joint…),
   • Wrap behaviour and direction,
   • Overlap distance, donor surface and visualization opacity.
4. Confirm to create the connection. The new entity is editable from the Properties panel and visible on the canvas as a coloured marker between the two edges.

Editing connections

• ConnectionList in the bottom panel lists every connection with its participating surfaces.
• ConnectionProperties in the right-hand panel exposes all dialog fields so you can tweak after the fact.

Where this lives in the codebase

• Surface tool & layer — src/features/surfaces/SurfaceTool.tsx, SurfaceLayer.tsx
• Surface properties — src/features/surfaces/SurfaceProperties.tsx, SurfaceList.tsx
• Openings — src/features/drawingTools/OpeningTool.tsx, src/features/surfaces/OpeningProperties.tsx, src/features/surfaces/OpeningRenderer.tsx
• Split surface — src/features/surfaces/SplitSurfaceTool.tsx, SplitSurfaceToolPanel.tsx
• Connections — src/features/drawingTools/ConnectionTool.tsx, src/features/surfaces/SurfaceConnectionDialog.tsx, ConnectionProperties.tsx, ConnectionVisualizer.tsx

Related pages

• 2D Drawing Tools
• Material Library
• Placement Patterns
• Edge Overlap Visualization