Files
Aislo/B07_DesignDetail/openwebcad/src/tools/draw/basic-draw-tools.ts
T
eomsangdon ea9d9685be feat(B07): CAD를 AutoCAD 명령 체계로 재구성한다 (조사표 1·2·3·5절)
저장소 사고로 잃은 4개 커밋(38eb7cd4·b8a11756·281528bf·f60b488d)의 작업물을
하나로 다시 담았다. 내용은 동일하다.

■ 구조
- commands/: 명령 정의(id·AutoCAD 별칭·글리프·도구/즉시실행)를 단일 소스로 두고
  리본·명령행·단축키가 모두 이 레지스트리를 읽는다. tools/tool.consts.ts 폐지.
- ribbon/: 탭→패널→명령 데이터(ribbon.config.ts)와 범용 렌더러 분리.
  AutoCAD 배치(홈·삽입·주석·뷰·출력)와 패널 확장(▾)을 따른다.
- tools/factories/sequence-tool.ts: 점·숫자·문자·객체·선택 단계를 선언하면
  xstate 머신을 만들어 주는 공장. 명령당 170줄 보일러플레이트 제거.
- helpers/geometry/: 3점 호·정다각형·타원·스플라인·구름형·평행이동·해치 스캔선·
  점렬 샘플링 등 상태 없는 순수 함수.
- Toolbar 483줄을 QuickAccessBar/Ribbon/InspectorPanel/StatusBar/CommandLine/
  ViewControls/PropertiesEditor/QuickProperties로 분해.

■ 명령 (조사표 기준)
- 1절 그리기 21건, 2절 수정 27건, 3절 도면층·특성·그룹·유틸리티 39건 전부 반영.
- 5절 주석 34건 중 26건 반영(문자·치수 16종·지시선·표·구름형·주석 축척).
- HatchEntity 추가(solid·pattern·cross·gradient) + JSON 왕복, Layer에 색·선가중치·
  선종류·동결·투명도 필드 추가, 그리기 루프가 동결·숨김·투명도를 반영.

■ 화면 실측에서 고친 결함
- 명령행 포커스 상태에서 ENTER가 도구로 가지 않던 문제
- 명령행 문자 입력이 접두사가 같은 명령으로 실행되던 문제
- 명령이 끝나도 입력을 계속 먹던 문제(점 입력 명령만 반복, 나머지는 선택 도구 복귀)
- 시퀀스 단계 인덱스 오사용 9건 + 단계 값 종류 검사 추가
- 해치 내부를 클릭해도 선택되지 않던 문제

미반영 8건(맞춤법 검사·꺾기 치수·치수 끊기/재연관/검사 치수·기하공차·지시선 수집·
축척 리스트 편집)은 조사표 `반영` 열과 PLAN.md에 사유를 적었다.
2026-08-30 01:34:13 +09:00

150 lines
5.7 KiB
TypeScript

/** 그리기 명령 — 폴리선·호·다각형·타원·스플라인·점 (조사표 1절) */
import { CircleEntity } from '../../entities/CircleEntity';
import type { Entity } from '../../entities/Entity';
import {
arcThroughThreePoints,
ellipsePoints,
regularPolygonPoints,
splinePoints,
} from '../../helpers/geometry/shape-points';
import { addEntities, getActiveLayerId } from '../../state';
import { Tool } from '../../tools';
import { arcEntity, lineEntity, pointEntity, polyLineEntity, styled } from '../factories/entity-factory';
import { createSequenceTool } from '../factories/sequence-tool';
export const plineToolStateMachine = createSequenceTool({
tool: Tool.PLINE,
steps: [
{ kind: 'point', instructions: '폴리선의 시작점을 지정하십시오.' },
{ kind: 'point', instructions: '다음 점을 지정하십시오. ENTER로 종료합니다.' },
],
repeatLastStep: true,
preview: (input) => {
const preview = polyLineEntity([...input.points(), input.cursor]);
return preview ? [preview] : [];
},
commit: (input) => {
const polyline = polyLineEntity(input.points());
if (polyline) addEntities([polyline], true);
},
});
export const arcToolStateMachine = createSequenceTool({
tool: Tool.ARC,
steps: [
{ kind: 'point', instructions: '호의 시작점을 지정하십시오.' },
{ kind: 'point', instructions: '호가 지나갈 두 번째 점을 지정하십시오.' },
{ kind: 'point', instructions: '호의 끝점을 지정하십시오.' },
],
preview: (input) => {
const points = input.points();
if (points.length === 1) return [lineEntity(points[0], input.cursor)];
if (points.length === 2) {
const definition = arcThroughThreePoints(points[0], points[1], input.cursor);
return definition ? [arcEntity(definition)] : [lineEntity(points[0], input.cursor)];
}
return [];
},
commit: (input) => {
const [start, through, end] = input.points();
const definition = arcThroughThreePoints(start, through, end);
// 세 점이 일직선이면 호가 성립하지 않으므로 선으로 대체한다
addEntities([definition ? arcEntity(definition) : lineEntity(start, end)], true);
},
});
export const polygonToolStateMachine = createSequenceTool({
tool: Tool.POLYGON,
steps: [
{ kind: 'number', instructions: '면의 수를 입력하십시오 <6>.', defaultValue: 6 },
{ kind: 'point', instructions: '다각형의 중심을 지정하십시오.' },
{ kind: 'point', instructions: '꼭짓점을 지정하십시오 (중심에서의 반지름).' },
],
preview: (input) => {
const points = input.points();
if (points.length !== 1) return [];
const polygon = polyLineEntity(regularPolygonPoints(points[0], input.cursor, input.number(0)));
return polygon ? [polygon] : [];
},
commit: (input) => {
const [center, vertex] = input.points();
const polygon = polyLineEntity(regularPolygonPoints(center, vertex, input.number(0)));
if (polygon) addEntities([polygon], true);
},
});
export const ellipseToolStateMachine = createSequenceTool({
tool: Tool.ELLIPSE,
steps: [
{ kind: 'point', instructions: '타원의 중심을 지정하십시오.' },
{ kind: 'point', instructions: '장축의 끝점을 지정하십시오.' },
{ kind: 'point', instructions: '단축 거리를 지정하십시오.' },
],
preview: (input) => {
const points = input.points();
if (points.length === 1) return [lineEntity(points[0], input.cursor)];
if (points.length === 2) {
const minor = points[0].distanceTo(input.cursor)[0];
const ellipse = polyLineEntity(ellipsePoints(points[0], points[1], minor));
return ellipse ? [ellipse] : [];
}
return [];
},
commit: (input) => {
const [center, majorPoint, minorPoint] = input.points();
const minorRadius = center.distanceTo(minorPoint)[0];
const ellipse = polyLineEntity(ellipsePoints(center, majorPoint, minorRadius));
if (ellipse) addEntities([ellipse], true);
},
});
export const splineToolStateMachine = createSequenceTool({
tool: Tool.SPLINE,
steps: [
{ kind: 'point', instructions: '스플라인의 첫 점을 지정하십시오.' },
{ kind: 'point', instructions: '다음 점을 지정하십시오. ENTER로 종료합니다.' },
],
repeatLastStep: true,
preview: (input) => {
const preview = polyLineEntity(splinePoints([...input.points(), input.cursor]));
return preview ? [preview] : [];
},
commit: (input) => {
const spline = polyLineEntity(splinePoints(input.points()));
if (spline) addEntities([spline], true);
},
});
export const pointToolStateMachine = createSequenceTool({
tool: Tool.POINT,
steps: [{ kind: 'point', instructions: '점의 위치를 지정하십시오.' }],
preview: (input) => [pointEntity(input.cursor)],
commit: (input) => {
addEntities([pointEntity(input.point(0))], true);
},
});
/** 도넛 — 안쪽·바깥쪽 지름을 받아 동심원 두 개를 놓는다 */
export const donutToolStateMachine = createSequenceTool({
tool: Tool.DONUT,
steps: [
{ kind: 'number', instructions: '도넛의 내부 지름을 입력하십시오 <1>.', defaultValue: 1 },
{ kind: 'number', instructions: '도넛의 외부 지름을 입력하십시오 <2>.', defaultValue: 2 },
{ kind: 'point', instructions: '도넛의 중심을 지정하십시오.' },
],
preview: (input) => donutEntities(input.number(0), input.number(1), input.cursor),
commit: (input) => {
addEntities(donutEntities(input.number(0), input.number(1), input.point(2)), true);
},
});
function donutEntities(innerDiameter: number, outerDiameter: number, center: Parameters<typeof pointEntity>[0]): Entity[] {
const circles: Entity[] = [];
for (const diameter of [innerDiameter, outerDiameter]) {
if (diameter > 0) {
circles.push(styled(new CircleEntity(getActiveLayerId(), center, diameter / 2)));
}
}
return circles;
}