This commit is contained in:
2026-07-19 19:18:14 +09:00
parent ef0dab9bc3
commit 6ec8fca60e
23 changed files with 1130 additions and 790 deletions
@@ -1,15 +1,20 @@
import {Arc, type Box, Line, Point, type Segment} from '@flatten-js/core';
import {uniqWith} from 'es-toolkit';
import {type Shape, type SnapPoint, SnapPointType, type StartAndEndpointEntity} from '../App.types';
import type {DrawController} from '../drawControllers/DrawController.ts';
import {getExportColor} from '../helpers/get-export-color';
import {isPointEqual} from '../helpers/is-point-equal';
import {mirrorPointOverAxis} from '../helpers/mirror-point-over-axis.ts';
import {scalePoint} from '../helpers/scale-point';
import {sortPointsOnArc} from '../helpers/sort-points-on-arc';
import {getActiveLayerId, isEntityHighlighted, isEntitySelected} from '../state.ts';
import {type Entity, EntityName, type JsonEntity} from './Entity';
import type {LineEntity} from './LineEntity.ts';
import { Arc, type Box, Line, Point, type Segment } from '@flatten-js/core';
import { uniqWith } from 'es-toolkit';
import {
type Shape,
type SnapPoint,
SnapPointType,
type StartAndEndpointEntity,
} from '../App.types';
import type { DrawController } from '../drawControllers/DrawController.ts';
import { getExportColor } from '../helpers/get-export-color';
import { isPointEqual } from '../helpers/is-point-equal';
import { mirrorPointOverAxis } from '../helpers/mirror-point-over-axis.ts';
import { scalePoint } from '../helpers/scale-point';
import { sortPointsOnArc } from '../helpers/sort-points-on-arc';
import { getActiveLayerId, isEntityHighlighted, isEntitySelected } from '../state.ts';
import { type Entity, EntityName, type JsonEntity } from './Entity';
import type { LineEntity } from './LineEntity.ts';
export class ArcEntity implements Entity, StartAndEndpointEntity {
public id: string = crypto.randomUUID();
@@ -211,6 +216,7 @@ export class ArcEntity implements Entity, StartAndEndpointEntity {
type: EntityName.Arc,
lineColor: this.lineColor,
lineWidth: this.lineWidth,
lineDash: this.lineDash,
layerId: this.layerId,
shapeData: {
center: { x: this.arc.center.x, y: this.arc.center.y },
@@ -248,6 +254,7 @@ export class ArcEntity implements Entity, StartAndEndpointEntity {
arcEntity.id = jsonEntity.id;
arcEntity.lineColor = jsonEntity.lineColor;
arcEntity.lineWidth = jsonEntity.lineWidth;
arcEntity.lineDash = jsonEntity.lineDash;
return arcEntity;
}
@@ -1,12 +1,12 @@
import {Box, Point, Segment} from '@flatten-js/core';
import {max, min} from 'es-toolkit/compat';
import type {Shape, SnapPoint} from '../App.types';
import type {DrawController} from '../drawControllers/DrawController';
import {mirrorPointOverAxis} from '../helpers/mirror-point-over-axis.ts';
import {scalePoint} from '../helpers/scale-point';
import {getActiveLayerId} from '../state.ts';
import {type Entity, EntityName, type JsonEntity} from './Entity';
import type {LineEntity} from './LineEntity.ts';
import { Box, Point, Segment } from '@flatten-js/core';
import { max, min } from 'es-toolkit/compat';
import type { Shape, SnapPoint } from '../App.types';
import type { DrawController } from '../drawControllers/DrawController';
import { mirrorPointOverAxis } from '../helpers/mirror-point-over-axis.ts';
import { scalePoint } from '../helpers/scale-point';
import { getActiveLayerId } from '../state.ts';
import { type Entity, EntityName, type JsonEntity } from './Entity';
import type { LineEntity } from './LineEntity.ts';
export class ArrowHeadEntity implements Entity {
public id: string = crypto.randomUUID();
@@ -138,6 +138,7 @@ export class ArrowHeadEntity implements Entity {
type: EntityName.ArrowHead,
lineColor: this.lineColor,
lineWidth: this.lineWidth,
lineDash: this.lineDash,
layerId: this.layerId,
shapeData: {
p1: { x: this.p1.x, y: this.p1.y },
@@ -160,6 +161,7 @@ export class ArrowHeadEntity implements Entity {
lineEntity.id = jsonEntity.id;
lineEntity.lineColor = jsonEntity.lineColor;
lineEntity.lineWidth = jsonEntity.lineWidth;
lineEntity.lineDash = jsonEntity.lineDash ?? [];
return lineEntity;
}
}
@@ -1,12 +1,12 @@
import {type Box, Circle, Point, type Segment} from '@flatten-js/core';
import {type Shape, type SnapPoint, SnapPointType} from '../App.types';
import type {DrawController} from '../drawControllers/DrawController';
import {getExportColor} from '../helpers/get-export-color';
import {mirrorPointOverAxis} from '../helpers/mirror-point-over-axis.ts';
import {scalePoint} from '../helpers/scale-point';
import {getActiveLayerId, isEntityHighlighted, isEntitySelected} from '../state.ts';
import {type Entity, EntityName, type JsonEntity} from './Entity';
import type {LineEntity} from './LineEntity.ts';
import { type Box, Circle, Point, type Segment } from '@flatten-js/core';
import { type Shape, type SnapPoint, SnapPointType } from '../App.types';
import type { DrawController } from '../drawControllers/DrawController';
import { getExportColor } from '../helpers/get-export-color';
import { mirrorPointOverAxis } from '../helpers/mirror-point-over-axis.ts';
import { scalePoint } from '../helpers/scale-point';
import { getActiveLayerId, isEntityHighlighted, isEntitySelected } from '../state.ts';
import { type Entity, EntityName, type JsonEntity } from './Entity';
import type { LineEntity } from './LineEntity.ts';
export class CircleEntity implements Entity {
public id: string = crypto.randomUUID();
@@ -168,6 +168,7 @@ export class CircleEntity implements Entity {
type: EntityName.Circle,
lineColor: this.lineColor,
lineWidth: this.lineWidth,
lineDash: this.lineDash,
layerId: this.layerId,
shapeData: {
center: { x: this.circle.center.x, y: this.circle.center.y },
@@ -186,6 +187,7 @@ export class CircleEntity implements Entity {
circleEntity.id = jsonEntity.id;
circleEntity.lineColor = jsonEntity.lineColor;
circleEntity.lineWidth = jsonEntity.lineWidth;
circleEntity.lineDash = jsonEntity.lineDash;
return circleEntity;
}
@@ -1,14 +1,14 @@
import type {Box, Point, Segment} from '@flatten-js/core';
import type {Shape, SnapPoint} from '../App.types';
import type {DrawController} from '../drawControllers/DrawController.ts';
import type {ArcJsonData} from './ArcEntity';
import type {ArrowHeadJsonData} from './ArrowHeadEntity.ts';
import type {CircleJsonData} from './CircleEntity';
import type {ImageJsonData} from './ImageEntity';
import type {LineEntity, LineJsonData} from './LineEntity';
import type {PointJsonData} from './PointEntity';
import type {RectangleJsonData} from './RectangleEntity';
import type {TextJsonData} from './TextEntity.ts';
import type { Box, Point, Segment } from '@flatten-js/core';
import type { Shape, SnapPoint } from '../App.types';
import type { DrawController } from '../drawControllers/DrawController.ts';
import type { ArcJsonData } from './ArcEntity';
import type { ArrowHeadJsonData } from './ArrowHeadEntity.ts';
import type { CircleJsonData } from './CircleEntity';
import type { ImageJsonData } from './ImageEntity';
import type { LineEntity, LineJsonData } from './LineEntity';
import type { PointJsonData } from './PointEntity';
import type { RectangleJsonData } from './RectangleEntity';
import type { TextJsonData } from './TextEntity.ts';
export interface Entity {
// Random uuid generated when the Entity is created
@@ -74,6 +74,7 @@ export interface JsonEntity<TShapeJsonData = ShapeJsonData> {
type: EntityName;
lineColor: string;
lineWidth: number;
lineDash?: number[];
layerId: string;
shapeData: TShapeJsonData | null;
children?: JsonEntity<ShapeJsonData>[];
@@ -1,16 +1,16 @@
import type * as Flatten from '@flatten-js/core';
import {type Box, Point, Polygon, Relations, type Segment, Vector} from '@flatten-js/core';
import {type Shape, type SnapPoint, SnapPointType} from '../App.types';
import type {DrawController} from '../drawControllers/DrawController.ts';
import {twoPointBoxToPolygon} from '../helpers/box-to-polygon';
import {getExportColor} from '../helpers/get-export-color';
import {mirrorAngleOverAxis} from '../helpers/mirror-angle-over-axis.ts';
import {mirrorPointOverAxis} from '../helpers/mirror-point-over-axis.ts';
import {polygonToSegments} from '../helpers/polygon-to-segments';
import {scalePoint} from '../helpers/scale-point';
import {getActiveLayerId, isEntityHighlighted, isEntitySelected} from '../state.ts';
import {type Entity, EntityName, type JsonEntity} from './Entity';
import type {LineEntity} from './LineEntity.ts';
import { type Box, Point, Polygon, Relations, type Segment, Vector } from '@flatten-js/core';
import { type Shape, type SnapPoint, SnapPointType } from '../App.types';
import type { DrawController } from '../drawControllers/DrawController.ts';
import { twoPointBoxToPolygon } from '../helpers/box-to-polygon';
import { getExportColor } from '../helpers/get-export-color';
import { mirrorAngleOverAxis } from '../helpers/mirror-angle-over-axis.ts';
import { mirrorPointOverAxis } from '../helpers/mirror-point-over-axis.ts';
import { polygonToSegments } from '../helpers/polygon-to-segments';
import { scalePoint } from '../helpers/scale-point';
import { getActiveLayerId, isEntityHighlighted, isEntitySelected } from '../state.ts';
import { type Entity, EntityName, type JsonEntity } from './Entity';
import type { LineEntity } from './LineEntity.ts';
export class ImageEntity implements Entity {
public id: string = crypto.randomUUID();
@@ -213,6 +213,7 @@ export class ImageEntity implements Entity {
type: EntityName.Image,
lineColor: this.lineColor,
lineWidth: this.lineWidth,
lineDash: this.lineDash,
layerId: this.layerId,
shapeData: {
points: this.polygon.vertices.map((vertex) => ({
@@ -241,6 +242,7 @@ export class ImageEntity implements Entity {
rectangleEntity.id = jsonEntity.id;
rectangleEntity.lineColor = jsonEntity.lineColor;
rectangleEntity.lineWidth = jsonEntity.lineWidth;
rectangleEntity.lineDash = jsonEntity.lineDash;
return rectangleEntity;
}
}
@@ -1,15 +1,20 @@
import {type Box, Point, Segment} from '@flatten-js/core';
import {sortBy, uniqWith} from 'es-toolkit';
import {type Shape, type SnapPoint, SnapPointType, type StartAndEndpointEntity} from '../App.types';
import type {DrawController} from '../drawControllers/DrawController';
import {pointDistance} from '../helpers/distance-between-points';
import {getAngleWithXAxis} from '../helpers/get-angle-with-x-axis.ts';
import {getExportColor} from '../helpers/get-export-color';
import {isPointEqual} from '../helpers/is-point-equal';
import {mirrorPointOverAxis} from '../helpers/mirror-point-over-axis.ts';
import {scalePoint} from '../helpers/scale-point';
import {getActiveLayerId, isEntityHighlighted, isEntitySelected} from '../state.ts';
import {type Entity, EntityName, type JsonEntity} from './Entity';
import { type Box, Point, Segment } from '@flatten-js/core';
import { sortBy, uniqWith } from 'es-toolkit';
import {
type Shape,
type SnapPoint,
SnapPointType,
type StartAndEndpointEntity,
} from '../App.types';
import type { DrawController } from '../drawControllers/DrawController';
import { pointDistance } from '../helpers/distance-between-points';
import { getAngleWithXAxis } from '../helpers/get-angle-with-x-axis.ts';
import { getExportColor } from '../helpers/get-export-color';
import { isPointEqual } from '../helpers/is-point-equal';
import { mirrorPointOverAxis } from '../helpers/mirror-point-over-axis.ts';
import { scalePoint } from '../helpers/scale-point';
import { getActiveLayerId, isEntityHighlighted, isEntitySelected } from '../state.ts';
import { type Entity, EntityName, type JsonEntity } from './Entity';
export class LineEntity implements Entity, StartAndEndpointEntity {
public id: string = crypto.randomUUID();
@@ -174,6 +179,7 @@ export class LineEntity implements Entity, StartAndEndpointEntity {
type: EntityName.Line,
lineColor: this.lineColor,
lineWidth: this.lineWidth,
lineDash: this.lineDash,
layerId: this.layerId,
shapeData: {
startPoint: {
@@ -202,6 +208,7 @@ export class LineEntity implements Entity, StartAndEndpointEntity {
lineEntity.id = jsonEntity.id;
lineEntity.lineColor = jsonEntity.lineColor;
lineEntity.lineWidth = jsonEntity.lineWidth;
lineEntity.lineDash = jsonEntity.lineDash;
return lineEntity;
}
@@ -1,6 +1,6 @@
import {Box, Line, Point, Segment, Vector} from '@flatten-js/core';
import {minBy, round} from 'es-toolkit';
import {max, min} from 'es-toolkit/compat';
import { Box, Line, Point, Segment, Vector } from '@flatten-js/core';
import { minBy, round } from 'es-toolkit';
import { max, min } from 'es-toolkit/compat';
import {
ARROW_HEAD_LENGTH,
ARROW_HEAD_WIDTH,
@@ -12,15 +12,32 @@ import {
MEASUREMENT_ORIGIN_MARGIN,
TO_RADIANS,
} from '../App.consts';
import type {Shape, SnapPoint} from '../App.types';
import type {DrawController} from '../drawControllers/DrawController';
import {pointDistance} from '../helpers/distance-between-points';
import {isPointEqual} from '../helpers/is-point-equal';
import {mirrorPointOverAxis} from '../helpers/mirror-point-over-axis.ts';
import {scalePoint} from '../helpers/scale-point';
import {getActiveLayerId, isEntityHighlighted, isEntitySelected} from '../state.ts';
import {type Entity, EntityName, type JsonEntity} from './Entity';
import type {LineEntity} from './LineEntity.ts';
import type { Shape, SnapPoint } from '../App.types';
import type { DrawController } from '../drawControllers/DrawController';
import { pointDistance } from '../helpers/distance-between-points';
import { isPointEqual } from '../helpers/is-point-equal';
import { mirrorPointOverAxis } from '../helpers/mirror-point-over-axis.ts';
import { scalePoint } from '../helpers/scale-point';
import {
getActiveLayerId,
getScreenCanvasDrawController,
isEntityHighlighted,
isEntitySelected,
} from '../state.ts';
import { type Entity, EntityName, type JsonEntity } from './Entity';
import type { LineEntity } from './LineEntity.ts';
/**
* 치수 상수는 화면 픽셀 기준이므로 현재 줌 배율(px/world)로 나눠 세계좌표 길이로 바꾼다.
* 컨트롤러가 아직 없는 환경(단위 테스트 등)에서는 1을 반환해 상수를 그대로 쓴다.
*/
function annotationWorldFactor(): number {
try {
return getScreenCanvasDrawController().getScreenScale() || 1;
} catch {
return 1;
}
}
export class MeasurementEntity implements Entity {
public id: string = crypto.randomUUID();
@@ -77,30 +94,41 @@ export class MeasurementEntity implements Entity {
.clone()
.translate(vectorPerpendicularFromLineTowardsOffsetPoint);
// Screen-pixel constants are converted to world units so annotation size stays zoom-independent
const worldFactor = annotationWorldFactor();
// Start of the perpendicular lines
const offsetStartPointMargin = this.startPoint
.clone()
.translate(
vectorPerpendicularFromLineTowardsOffsetPointUnit.multiply(MEASUREMENT_ORIGIN_MARGIN)
vectorPerpendicularFromLineTowardsOffsetPointUnit.multiply(
MEASUREMENT_ORIGIN_MARGIN / worldFactor
)
);
const offsetEndPointMargin = this.endPoint
.clone()
.translate(
vectorPerpendicularFromLineTowardsOffsetPointUnit.multiply(MEASUREMENT_ORIGIN_MARGIN)
vectorPerpendicularFromLineTowardsOffsetPointUnit.multiply(
MEASUREMENT_ORIGIN_MARGIN / worldFactor
)
);
// End of the perpendicular lines
const offsetStartPointExtend = offsetStartPoint
.clone()
.translate(
vectorPerpendicularFromLineTowardsOffsetPointUnit.multiply(MEASUREMENT_EXTENSION_LENGTH)
vectorPerpendicularFromLineTowardsOffsetPointUnit.multiply(
MEASUREMENT_EXTENSION_LENGTH / worldFactor
)
);
const offsetEndPointExtend = offsetEndPoint
.clone()
.translate(
vectorPerpendicularFromLineTowardsOffsetPointUnit.multiply(MEASUREMENT_EXTENSION_LENGTH)
vectorPerpendicularFromLineTowardsOffsetPointUnit.multiply(
MEASUREMENT_EXTENSION_LENGTH / worldFactor
)
);
// Location for label
@@ -108,8 +136,8 @@ export class MeasurementEntity implements Entity {
(offsetStartPoint.x + offsetEndPoint.x) / 2,
(offsetStartPoint.y + offsetEndPoint.y) / 2
);
const textHeight = MEASUREMENT_FONT_SIZE;
const totalOffset = MEASUREMENT_LABEL_OFFSET + textHeight / 2;
const textHeight = MEASUREMENT_FONT_SIZE / worldFactor;
const totalOffset = MEASUREMENT_LABEL_OFFSET / worldFactor + textHeight / 2;
const midpointMeasurementLineOffset = midpointMeasurementLine
.clone()
.translate(vectorPerpendicularFromLineTowardsOffsetPointUnit.multiply(totalOffset));
@@ -163,20 +191,21 @@ export class MeasurementEntity implements Entity {
isHighlighted: boolean,
isSelected: boolean
): void => {
const screenScale = drawController.getScreenScale();
// Arrow heads keep a constant on-screen size: divide pixel constants by zoom (px/world)
const worldFactor = drawController.getScreenScale() || 1;
const vectorFromEndToStart = new Vector(endPoint, startPoint);
const vectorFromEndToStartUnit = vectorFromEndToStart.normalize();
const baseOfArrow = endPoint
.clone()
.translate(vectorFromEndToStartUnit.multiply(ARROW_HEAD_LENGTH * screenScale));
.translate(vectorFromEndToStartUnit.multiply(ARROW_HEAD_LENGTH / worldFactor));
const perpendicularVector1 = vectorFromEndToStartUnit.rotate(90 * TO_RADIANS);
const perpendicularVector2 = vectorFromEndToStartUnit.rotate(-90 * TO_RADIANS);
const leftCornerOfArrow = baseOfArrow
.clone()
.translate(perpendicularVector1.multiply(ARROW_HEAD_WIDTH * screenScale));
.translate(perpendicularVector1.multiply(ARROW_HEAD_WIDTH / worldFactor));
const rightCornerOfArrow = baseOfArrow
.clone()
.translate(perpendicularVector2.multiply(ARROW_HEAD_WIDTH * screenScale));
.translate(perpendicularVector2.multiply(ARROW_HEAD_WIDTH / worldFactor));
drawController.setLineStyles(
isHighlighted,
@@ -268,7 +297,7 @@ export class MeasurementEntity implements Entity {
drawController.drawText(distance, midpointMeasurementLineOffset, {
textAlign: 'center',
textDirection: finalTextDirection,
fontSize: MEASUREMENT_FONT_SIZE,
fontSize: MEASUREMENT_FONT_SIZE / (drawController.getScreenScale() || 1),
textColor: this.lineColor,
});
}
@@ -374,9 +403,10 @@ export class MeasurementEntity implements Entity {
const distance = String(
round(pointDistance(this.startPoint, this.endPoint), MEASUREMENT_DECIMAL_PLACES)
);
const textHeight = MEASUREMENT_FONT_SIZE;
const worldFactor = annotationWorldFactor();
const textHeight = MEASUREMENT_FONT_SIZE / worldFactor;
// Estimate width: textString.length * fontSize * aspectRatioFactor
const textWidth = distance.length * MEASUREMENT_FONT_SIZE * 0.6;
const textWidth = (distance.length * MEASUREMENT_FONT_SIZE * 0.6) / worldFactor;
const { midpointMeasurementLineOffset, normalUnit } = drawPoints;
@@ -532,6 +562,7 @@ export class MeasurementEntity implements Entity {
type: EntityName.Measurement,
lineColor: this.lineColor,
lineWidth: this.lineWidth,
lineDash: this.lineDash,
layerId: this.layerId,
shapeData: {
startPoint: { x: this.startPoint.x, y: this.startPoint.y },
@@ -565,6 +596,7 @@ export class MeasurementEntity implements Entity {
measurementEntity.id = jsonEntity.id;
measurementEntity.lineColor = jsonEntity.lineColor;
measurementEntity.lineWidth = jsonEntity.lineWidth;
measurementEntity.lineDash = jsonEntity.lineDash;
return measurementEntity;
}
}
@@ -1,13 +1,13 @@
import type * as Flatten from '@flatten-js/core';
import {Box, Point, type Segment} from '@flatten-js/core';
import {type Shape, type SnapPoint, SnapPointType} from '../App.types';
import type {DrawController} from '../drawControllers/DrawController';
import {getExportColor} from '../helpers/get-export-color';
import {mirrorPointOverAxis} from '../helpers/mirror-point-over-axis.ts';
import {scalePoint} from '../helpers/scale-point';
import {getActiveLayerId, isEntityHighlighted, isEntitySelected} from '../state.ts';
import {type Entity, EntityName, type JsonEntity} from './Entity';
import type {LineEntity} from './LineEntity.ts';
import { Box, Point, type Segment } from '@flatten-js/core';
import { type Shape, type SnapPoint, SnapPointType } from '../App.types';
import type { DrawController } from '../drawControllers/DrawController';
import { getExportColor } from '../helpers/get-export-color';
import { mirrorPointOverAxis } from '../helpers/mirror-point-over-axis.ts';
import { scalePoint } from '../helpers/scale-point';
import { getActiveLayerId, isEntityHighlighted, isEntitySelected } from '../state.ts';
import { type Entity, EntityName, type JsonEntity } from './Entity';
import type { LineEntity } from './LineEntity.ts';
export class PointEntity implements Entity {
public id: string = crypto.randomUUID();
@@ -124,6 +124,7 @@ export class PointEntity implements Entity {
type: EntityName.Point,
lineColor: this.lineColor,
lineWidth: this.lineWidth,
lineDash: this.lineDash,
layerId: this.layerId,
shapeData: {
point: {
@@ -143,6 +144,7 @@ export class PointEntity implements Entity {
lineEntity.id = jsonEntity.id;
lineEntity.lineColor = jsonEntity.lineColor;
lineEntity.lineWidth = jsonEntity.lineWidth;
lineEntity.lineDash = jsonEntity.lineDash;
return lineEntity;
}
}
@@ -1,14 +1,14 @@
import type * as Flatten from '@flatten-js/core';
import {Box, type Point, type Segment} from '@flatten-js/core';
import {mapLimit} from 'blend-promise-utils';
import {compact, maxBy} from 'es-toolkit';
import {minBy} from 'es-toolkit/compat';
import type {Shape, SnapPoint} from '../App.types';
import type {DrawController} from '../drawControllers/DrawController';
import {getActiveLayerId, isEntityHighlighted, isEntitySelected} from '../state.ts';
import {ArcEntity, type ArcJsonData} from './ArcEntity.ts';
import {type Entity, EntityName, type JsonEntity} from './Entity';
import {LineEntity, type LineJsonData} from './LineEntity.ts';
import { Box, type Point, type Segment } from '@flatten-js/core';
import { mapLimit } from 'blend-promise-utils';
import { compact, maxBy } from 'es-toolkit';
import { minBy } from 'es-toolkit/compat';
import type { Shape, SnapPoint } from '../App.types';
import type { DrawController } from '../drawControllers/DrawController';
import { getActiveLayerId, isEntityHighlighted, isEntitySelected } from '../state.ts';
import { ArcEntity, type ArcJsonData } from './ArcEntity.ts';
import { type Entity, EntityName, type JsonEntity } from './Entity';
import { LineEntity, type LineJsonData } from './LineEntity.ts';
export class PolyLineEntity implements Entity {
public id: string = crypto.randomUUID();
@@ -133,6 +133,7 @@ export class PolyLineEntity implements Entity {
type: EntityName.PolyLine,
lineColor: this.lineColor,
lineWidth: this.lineWidth,
lineDash: this.lineDash,
layerId: this.layerId,
shapeData: null,
children: compact(await mapLimit(this.entities, 20, (entity) => entity.toJson())),
@@ -178,6 +179,7 @@ export class PolyLineEntity implements Entity {
polyLineEntity.id = jsonEntity.id;
polyLineEntity.lineColor = jsonEntity.lineColor;
polyLineEntity.lineWidth = jsonEntity.lineWidth;
polyLineEntity.lineDash = jsonEntity.lineDash;
return polyLineEntity;
}
}
@@ -1,15 +1,15 @@
import type * as Flatten from '@flatten-js/core';
import {type Box, Point, Polygon, Relations, type Segment, Vector} from '@flatten-js/core';
import {type Shape, type SnapPoint, SnapPointType} from '../App.types';
import type {DrawController} from '../drawControllers/DrawController';
import {twoPointBoxToPolygon} from '../helpers/box-to-polygon';
import {getExportColor} from '../helpers/get-export-color';
import {mirrorPointOverAxis} from '../helpers/mirror-point-over-axis.ts';
import {polygonToSegments} from '../helpers/polygon-to-segments';
import {scalePoint} from '../helpers/scale-point';
import {getActiveLayerId, isEntityHighlighted, isEntitySelected} from '../state.ts';
import {type Entity, EntityName, type JsonEntity} from './Entity';
import type {LineEntity} from './LineEntity.ts';
import { type Box, Point, Polygon, Relations, type Segment, Vector } from '@flatten-js/core';
import { type Shape, type SnapPoint, SnapPointType } from '../App.types';
import type { DrawController } from '../drawControllers/DrawController';
import { twoPointBoxToPolygon } from '../helpers/box-to-polygon';
import { getExportColor } from '../helpers/get-export-color';
import { mirrorPointOverAxis } from '../helpers/mirror-point-over-axis.ts';
import { polygonToSegments } from '../helpers/polygon-to-segments';
import { scalePoint } from '../helpers/scale-point';
import { getActiveLayerId, isEntityHighlighted, isEntitySelected } from '../state.ts';
import { type Entity, EntityName, type JsonEntity } from './Entity';
import type { LineEntity } from './LineEntity.ts';
export class RectangleEntity implements Entity {
public id: string = crypto.randomUUID();
@@ -176,6 +176,7 @@ export class RectangleEntity implements Entity {
type: EntityName.Rectangle,
lineColor: this.lineColor,
lineWidth: this.lineWidth,
lineDash: this.lineDash,
layerId: this.layerId,
shapeData: {
points: this.polygon.vertices.map((vertex) => ({
@@ -202,6 +203,7 @@ export class RectangleEntity implements Entity {
rectangleEntity.id = jsonEntity.id;
rectangleEntity.lineColor = jsonEntity.lineColor;
rectangleEntity.lineWidth = jsonEntity.lineWidth;
rectangleEntity.lineDash = jsonEntity.lineDash;
return rectangleEntity;
}
}
@@ -1,12 +1,12 @@
import {Box, Point, type Segment, Vector} from '@flatten-js/core';
import {cloneDeep} from 'es-toolkit/compat';
import type {Shape, SnapPoint} from '../App.types';
import {DEFAULT_TEXT_OPTIONS, type DrawController} from '../drawControllers/DrawController';
import {mirrorPointOverAxis} from '../helpers/mirror-point-over-axis.ts';
import {scalePoint} from '../helpers/scale-point.ts';
import {getActiveLayerId, isEntityHighlighted, isEntitySelected} from '../state.ts';
import {type Entity, EntityName, type JsonEntity} from './Entity';
import type {LineEntity} from './LineEntity.ts';
import { Box, Point, type Segment, Vector } from '@flatten-js/core';
import { cloneDeep } from 'es-toolkit/compat';
import type { Shape, SnapPoint } from '../App.types';
import { DEFAULT_TEXT_OPTIONS, type DrawController } from '../drawControllers/DrawController';
import { mirrorPointOverAxis } from '../helpers/mirror-point-over-axis.ts';
import { scalePoint } from '../helpers/scale-point.ts';
import { getActiveLayerId, isEntityHighlighted, isEntitySelected } from '../state.ts';
import { type Entity, EntityName, type JsonEntity } from './Entity';
import type { LineEntity } from './LineEntity.ts';
export interface TextOptions {
textDirection: Vector;
@@ -101,6 +101,14 @@ export class TextEntity implements Entity {
);
}
public getTextOptions(): TextOptions {
return this.options;
}
public setTextOptions(newOptions: Partial<Omit<TextOptions, 'textDirection'>>): void {
Object.assign(this.options, newOptions);
}
public getShape(): Shape | null {
return null; // TODO see why we need to get the shape out of an entity
}
@@ -141,6 +149,7 @@ export class TextEntity implements Entity {
type: EntityName.Text,
lineColor: this.lineColor,
lineWidth: this.lineWidth,
lineDash: this.lineDash,
layerId: this.layerId,
shapeData: {
label: this.label,
@@ -181,6 +190,7 @@ export class TextEntity implements Entity {
textEntity.id = jsonEntity.id;
textEntity.lineColor = jsonEntity.lineColor;
textEntity.lineWidth = jsonEntity.lineWidth;
textEntity.lineDash = jsonEntity.lineDash ?? [];
return textEntity;
}
}