Mark/Kimi_Agent_Brother_10_Digitizing_App

Fork 0

Editor's right panel doesn't show the total path area, density-weighted thread usage estimate, or expected stitch time — users have to mentally compute these from the stitch count and density values #261

New issue

Closed

opened 2026-10-04 03:38:08 +00:00 by Mark · 1 comment

Mark commented

2026-10-04 03:38:08 +00:00

Owner

Finding

The editor's right panel (Path Properties section) shows:

Path length
Total Nodes
Stitch type
Density

But it doesn't show:

Path area (in mm²) — important for fabric coverage estimates
Thread usage estimate (in meters) — for thread purchase decisions
Estimated stitch time (in minutes) — for production planning

grep -rn 'pathArea\|threadUsage\|stitchTime' src/components/editor/ returns 0.

A user designing a quilt block wants to know:

"How much thread will this take?" (1.5 meters? 5 meters?)
"How long will the machine take?" (10 minutes? 30 minutes?)
"How much fabric will be covered?" (50 cm²? 200 cm²?)

Currently, they have to mentally integrate the density × length × fill ratio. Not realistic.

Where

Path Properties section: src/components/editor/EditorRightPanel.tsx (line ~440)
The data is in path.nodes and the density
No area: grep -rn 'pathArea' src/components/editor/ returns 0

Suggested fix shape

Add a "Path Statistics" section to the editor's right panel:

<SectionHeader title="Path Statistics" isOpen={openSections.stats} onToggle={() => toggleSection('stats')} />
{openSections.stats && (
  <div className="space-y-1 text-[12px]">
    <div className="flex justify-between">
      <span>Path area</span>
      <span>{calculatePathAreaMm2(selectedPath)} mm²</span>
    </div>
    <div className="flex justify-between">
      <span>Thread usage</span>
      <span>~{estimateThreadUsageMeters(selectedPath, density)} m</span>
    </div>
    <div className="flex justify-between">
      <span>Stitch time</span>
      <span>~{estimateStitchTimeMinutes(selectedPath)} min</span>
    </div>
    <div className="flex justify-between">
      <span>Covers fabric</span>
      <span>~{calculatePathAreaMm2(selectedPath) * 0.7}%</span>  // of the 4x4 hoop
    </div>
  </div>
)}

The calculations:

Path area: polygonAreaMm2(selectedPath.nodes) (shoelace formula)
Thread usage: (length_mm / spacing_mm) * stitch_length_per_loop_mm — depends on density and stitch type
Stitch time: (stitch_count / stitches_per_minute) * 60 — assumes 600-1000 stitches/min on a Brother machine
Fabric coverage: (path_area / hoop_area) * 100

These are estimates, not exact. The UI should say "~1.5m" not "1.5m".

The same calculations can be shown for the design as a whole (sum across all paths), giving a single number for the whole design.

Severity

Low. The user can roughly estimate. Power users with production workflows notice.

Discovered by

Gap analysis (2026-10-02) of editor path statistics.

The Workspace's "Total stitches" is shown (per #171); the editor's "Path Properties" is the per-path version.
The "Bottoms Thread Bar" shows thread stops; the editor's per-path thread usage is a deeper dive.
The Help page documents thread coverage estimates in the export section; the editor's UI surfaces them earlier.

## Finding The editor's right panel (Path Properties section) shows: - Path length - Total Nodes - Stitch type - Density But it doesn't show: - Path area (in mm²) — important for fabric coverage estimates - Thread usage estimate (in meters) — for thread purchase decisions - Estimated stitch time (in minutes) — for production planning `grep -rn 'pathArea\|threadUsage\|stitchTime' src/components/editor/` returns 0. A user designing a quilt block wants to know: - "How much thread will this take?" (1.5 meters? 5 meters?) - "How long will the machine take?" (10 minutes? 30 minutes?) - "How much fabric will be covered?" (50 cm²? 200 cm²?) Currently, they have to mentally integrate the density × length × fill ratio. Not realistic. ## Where - Path Properties section: `src/components/editor/EditorRightPanel.tsx` (line ~440) - The data is in `path.nodes` and the density - No area: `grep -rn 'pathArea' src/components/editor/` returns 0 ## Suggested fix shape Add a "Path Statistics" section to the editor's right panel: ```tsx <SectionHeader title="Path Statistics" isOpen={openSections.stats} onToggle={() => toggleSection('stats')} /> {openSections.stats && ( <div className="space-y-1 text-[12px]"> <div className="flex justify-between"> <span>Path area</span> <span>{calculatePathAreaMm2(selectedPath)} mm²</span> </div> <div className="flex justify-between"> <span>Thread usage</span> <span>~{estimateThreadUsageMeters(selectedPath, density)} m</span> </div> <div className="flex justify-between"> <span>Stitch time</span> <span>~{estimateStitchTimeMinutes(selectedPath)} min</span> </div> <div className="flex justify-between"> <span>Covers fabric</span> <span>~{calculatePathAreaMm2(selectedPath) * 0.7}%</span> // of the 4x4 hoop </div> </div> )} ``` The calculations: - **Path area**: `polygonAreaMm2(selectedPath.nodes)` (shoelace formula) - **Thread usage**: `(length_mm / spacing_mm) * stitch_length_per_loop_mm` — depends on density and stitch type - **Stitch time**: `(stitch_count / stitches_per_minute) * 60` — assumes 600-1000 stitches/min on a Brother machine - **Fabric coverage**: `(path_area / hoop_area) * 100` These are estimates, not exact. The UI should say "~1.5m" not "1.5m". The same calculations can be shown for the design as a whole (sum across all paths), giving a single number for the whole design. ## Severity Low. The user can roughly estimate. Power users with production workflows notice. ## Discovered by Gap analysis (2026-10-02) of editor path statistics. ## Related - The Workspace's "Total stitches" is shown (per #171); the editor's "Path Properties" is the per-path version. - The "Bottoms Thread Bar" shows thread stops; the editor's per-path thread usage is a deeper dive. - The Help page documents thread coverage estimates in the export section; the editor's UI surfaces them earlier.

Mark added the

feature-request

triage-approved

labels

2026-10-04 03:38:08 +00:00

Mark referenced this issue

2026-10-04 03:56:43 +00:00

Editor's Path Properties has a 'Path length' display but no 'perimeter' or 'area' — user wanting to know how big the path is (in mm²) has to mentally integrate the path's nodes #355

Mark referenced this issue

2026-10-04 03:57:02 +00:00

Editor's 'Path Length' display shows total path length in mm but not the 'stitch count estimate' — user wanting to know how many stitches a path will produce has to compute from density #357

Mark referenced this issue from a commit

2026-10-04 11:32:55 +00:00

fix(#261): Editor right panel — Path Statistics (area, thread, time, coverage)

Mark commented

2026-10-04 11:33:15 +00:00

Author

Owner

Closed by fix(#261) at 3428a22 (push 154dc6e..3428a22). The right panel now exposes a Path Statistics subsection directly under Path Info with four derived estimates:

Path area — shoelace formula over the polyline (mm²)
Thread usage — density-weighted stitch count × 0.018 m/stitch
Stitch time — density-weighted stitch count / 800 stitches/min
Covers fabric — path area / HOOP_SIZE × 100%

All three numeric estimates prefixed "" to flag the planning-estimate framing. HOOP_SIZE flows through from ./constants so the coverage row stays in sync with the canvas hoop. 11 new tests at src/pages/issue-261.test.tsx pin the math + the "" framing. Verified locally: 618/618 vitest pass, tsc -b clean, eslint clean.

Closed by fix(#261) at 3428a22 (push 154dc6e..3428a22). The right panel now exposes a Path Statistics subsection directly under Path Info with four derived estimates: - **Path area** — shoelace formula over the polyline (mm²) - **Thread usage** — density-weighted stitch count × 0.018 m/stitch - **Stitch time** — density-weighted stitch count / 800 stitches/min - **Covers fabric** — path area / HOOP_SIZE × 100% All three numeric estimates prefixed "~" to flag the planning-estimate framing. HOOP_SIZE flows through from ./constants so the coverage row stays in sync with the canvas hoop. 11 new tests at src/pages/issue-261.test.tsx pin the math + the "~" framing. Verified locally: 618/618 vitest pass, tsc -b clean, eslint clean.

Mark closed this issue

2026-10-04 11:33:18 +00:00

Mark referenced this issue

2026-10-04 14:30:31 +00:00

Gallery's design card has no 'drag handle' to reorder within a folder — user wanting to put a design at the top of a folder has to drag it to no particular drop position, no visual indication of where it'll land #278

Mark referenced this issue from a commit

2026-10-05 12:28:37 +00:00

feat(#355): Perimeter row in Path Statistics for closed paths

Mark referenced this issue

2026-10-05 12:46:14 +00:00

Editor's Path Properties has a 'Path length' display but no 'perimeter' or 'area' — user wanting to know how big the path is (in mm²) has to mentally integrate the path's nodes #355