@inweb/markup 26.4.0 → 26.4.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/dist/markup.js +561 -126
  2. package/dist/markup.js.map +1 -1
  3. package/dist/markup.min.js +1 -1
  4. package/dist/markup.module.js +672 -138
  5. package/dist/markup.module.js.map +1 -1
  6. package/lib/markup/IMarkupArrow.d.ts +8 -8
  7. package/lib/markup/IMarkupCloud.d.ts +12 -5
  8. package/lib/markup/IMarkupEllipse.d.ts +4 -4
  9. package/lib/markup/IMarkupImage.d.ts +3 -3
  10. package/lib/markup/IMarkupLine.d.ts +2 -2
  11. package/lib/markup/IMarkupObject.d.ts +4 -0
  12. package/lib/markup/IMarkupRectangle.d.ts +10 -3
  13. package/lib/markup/IMarkupText.d.ts +3 -3
  14. package/lib/markup/Konva/KonvaArrow.d.ts +4 -1
  15. package/lib/markup/Konva/KonvaCloud.d.ts +4 -1
  16. package/lib/markup/Konva/KonvaEllipse.d.ts +4 -1
  17. package/lib/markup/Konva/KonvaImage.d.ts +4 -1
  18. package/lib/markup/Konva/KonvaLine.d.ts +4 -1
  19. package/lib/markup/Konva/KonvaMarkup.d.ts +2 -2
  20. package/lib/markup/Konva/KonvaRectangle.d.ts +4 -1
  21. package/lib/markup/Konva/KonvaText.d.ts +4 -1
  22. package/package.json +3 -3
  23. package/src/markup/IMarkupArrow.ts +8 -8
  24. package/src/markup/IMarkupCloud.ts +10 -5
  25. package/src/markup/IMarkupEllipse.ts +4 -4
  26. package/src/markup/IMarkupImage.ts +3 -3
  27. package/src/markup/IMarkupLine.ts +2 -2
  28. package/src/markup/IMarkupObject.ts +5 -0
  29. package/src/markup/IMarkupRectangle.ts +8 -3
  30. package/src/markup/IMarkupText.ts +3 -3
  31. package/src/markup/Konva/KonvaArrow.ts +49 -4
  32. package/src/markup/Konva/KonvaCloud.ts +110 -11
  33. package/src/markup/Konva/KonvaEllipse.ts +102 -2
  34. package/src/markup/Konva/KonvaImage.ts +60 -2
  35. package/src/markup/Konva/KonvaLine.ts +97 -3
  36. package/src/markup/Konva/KonvaMarkup.ts +182 -166
  37. package/src/markup/Konva/KonvaRectangle.ts +103 -4
  38. package/src/markup/Konva/KonvaText.ts +61 -2
@@ -1,5 +1,30 @@
1
+ ///////////////////////////////////////////////////////////////////////////////
2
+ // Copyright (C) 2002-2025, Open Design Alliance (the "Alliance").
3
+ // All rights reserved.
4
+ //
5
+ // This software and its documentation and related materials are owned by
6
+ // the Alliance. The software may only be incorporated into application
7
+ // programs owned by members of the Alliance, subject to a signed
8
+ // Membership Agreement and Supplemental Software License Agreement with the
9
+ // Alliance. The structure and organization of this software are the valuable
10
+ // trade secrets of the Alliance and its suppliers. The software is also
11
+ // protected by copyright law and international treaty provisions. Application
12
+ // programs incorporating this software must include the following statement
13
+ // with their copyright notices:
14
+ //
15
+ // This application incorporates Open Design Alliance software pursuant to a
16
+ // license agreement with Open Design Alliance.
17
+ // Open Design Alliance Copyright (C) 2002-2025 by Open Design Alliance.
18
+ // All rights reserved.
19
+ //
20
+ // By use of this software, its documentation or related materials, you
21
+ // acknowledge and accept the above terms.
22
+ ///////////////////////////////////////////////////////////////////////////////
23
+
1
24
  import Konva from "konva";
2
25
  import { IMarkupLine, IMarkupLineParams, MarkupLineType } from "../IMarkupLine";
26
+ import { IWorldTransform } from "../IWorldTransform";
27
+ import { WorldTransform } from "../WorldTransform";
3
28
 
4
29
  const LineTypeSpecs = new Map<string, number[]>([
5
30
  ["solid", []],
@@ -9,10 +34,24 @@ const LineTypeSpecs = new Map<string, number[]>([
9
34
 
10
35
  export class KonvaLine implements IMarkupLine {
11
36
  private _ref: Konva.Line;
37
+ private _worldTransformer: IWorldTransform;
38
+
39
+ constructor(params: IMarkupLineParams, ref = null, worldTransformer = new WorldTransform()) {
40
+ this._worldTransformer = worldTransformer;
12
41
 
13
- constructor(params: IMarkupLineParams, ref = null) {
14
42
  if (ref) {
15
43
  this._ref = ref;
44
+ let wcsPoints = this._ref.getAttr("wcsPoints");
45
+ if (!wcsPoints) {
46
+ wcsPoints = [];
47
+ let points = this._ref.points();
48
+ let wcsPoint;
49
+ for (let i = 0; i < points.length; i += 2) {
50
+ wcsPoint = this._worldTransformer.screenToWorld({ x: points[i], y: points[i + 1] });
51
+ wcsPoints.push({ x: wcsPoint.x, y: wcsPoint.y, z: wcsPoint.z });
52
+ }
53
+ this._ref.setAttr("wcsPoints", wcsPoints);
54
+ }
16
55
  return;
17
56
  }
18
57
 
@@ -24,7 +63,12 @@ export class KonvaLine implements IMarkupLine {
24
63
  ];
25
64
 
26
65
  const konvaPoints = [];
27
- params.points.forEach((point) => konvaPoints.push(point.x, point.y));
66
+ const wcsPoints = [];
67
+ params.points.forEach((point) => {
68
+ konvaPoints.push(point.x, point.y);
69
+ let wcsPoint = this._worldTransformer.screenToWorld({ x: point.x, y: point.y });
70
+ wcsPoints.push({ x: wcsPoint.x, y: wcsPoint.y, z: wcsPoint.z });
71
+ });
28
72
 
29
73
  this._ref = new Konva.Line({
30
74
  stroke: params.color ?? "#ff0000",
@@ -38,12 +82,42 @@ export class KonvaLine implements IMarkupLine {
38
82
  dash: LineTypeSpecs.get(params.type) || [],
39
83
  });
40
84
 
85
+ this._ref.setAttr("wcsPoints", wcsPoints);
86
+
41
87
  this._ref.on("transform", (e) => {
42
88
  const attrs = e.target.attrs;
43
89
 
44
90
  if (attrs.rotation !== this._ref.rotation()) this._ref.rotation(attrs.rotation);
45
91
  });
46
92
 
93
+ this._ref.on("transformend", (e) => {
94
+ const absoluteTransform = this._ref.getAbsoluteTransform();
95
+
96
+ let wcsPoints = [];
97
+ let points = this._ref.points();
98
+ let wcsPoint;
99
+ for (let i = 0; i < points.length; i += 2) {
100
+ const position = absoluteTransform.point({ x: points[i], y: points[i + 1] });
101
+ wcsPoint = this._worldTransformer.screenToWorld({ x: position.x, y: position.y });
102
+ wcsPoints.push({ x: wcsPoint.x, y: wcsPoint.y, z: wcsPoint.z });
103
+ }
104
+ this._ref.setAttr("wcsPoints", wcsPoints);
105
+ });
106
+
107
+ this._ref.on("dragend", (e) => {
108
+ const absoluteTransform = this._ref.getAbsoluteTransform();
109
+
110
+ let wcsPoints = [];
111
+ let points = this._ref.points();
112
+ let wcsPoint;
113
+ for (let i = 0; i < points.length; i += 2) {
114
+ const position = absoluteTransform.point({ x: points[i], y: points[i + 1] });
115
+ wcsPoint = this._worldTransformer.screenToWorld({ x: position.x, y: position.y });
116
+ wcsPoints.push({ x: wcsPoint.x, y: wcsPoint.y, z: wcsPoint.z });
117
+ }
118
+ this._ref.setAttr("wcsPoints", wcsPoints);
119
+ });
120
+
47
121
  this._ref.id(this._ref._id.toString());
48
122
  }
49
123
 
@@ -87,7 +161,7 @@ export class KonvaLine implements IMarkupLine {
87
161
  this._ref.zIndex(zIndex);
88
162
  }
89
163
 
90
- delete() {
164
+ delete(): void {
91
165
  this._ref.destroy();
92
166
  this._ref = null;
93
167
  }
@@ -128,10 +202,30 @@ export class KonvaLine implements IMarkupLine {
128
202
 
129
203
  addPoints(points: [{ x: number; y: number }]) {
130
204
  let newPoints = this._ref.points();
205
+ let wcsPoints = this._ref.getAttr("wcsPoints");
131
206
  points.forEach((point) => {
132
207
  newPoints = newPoints.concat([point.x, point.y]);
208
+ let wcsPoint = this._worldTransformer.screenToWorld(point);
209
+ wcsPoints.push(wcsPoint);
133
210
  });
134
211
 
135
212
  this._ref.points(newPoints);
136
213
  }
214
+
215
+ updateScreenCoordinates(): void {
216
+ let wcsPoints = this._ref.getAttr("wcsPoints");
217
+ let points = [];
218
+ let invert = this._ref.getAbsoluteTransform().copy();
219
+ invert = invert.invert();
220
+ wcsPoints.forEach((point) => {
221
+ let screenPoint = this._worldTransformer.worldToScreen(point);
222
+ screenPoint = invert.point({ x: screenPoint.x, y: screenPoint.y });
223
+ points.push(screenPoint.x);
224
+ points.push(screenPoint.y);
225
+ });
226
+
227
+ this._ref.points([]);
228
+ this._ref.points(points);
229
+ this._ref.clearCache();
230
+ }
137
231
  }