kitchen-simulator 1.0.0-clark.70 → 1.0.0-clark.71

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 (25) hide show
  1. package/es/catalog/factories/wall-factory.js +8 -8
  2. package/es/catalog/utils/item-loader.js +8 -2
  3. package/es/class/line.js +27 -12
  4. package/es/components/viewer2d/grids/grid-streak.js +1 -1
  5. package/es/components/viewer2d/item.js +10 -5
  6. package/es/components/viewer2d/line.js +315 -243
  7. package/es/components/viewer2d/ruler.js +16 -36
  8. package/es/components/viewer2d/rulerDist.js +18 -32
  9. package/es/components/viewer2d/viewer2d.js +18 -7
  10. package/es/constants.js +6 -0
  11. package/es/models.js +4 -4
  12. package/es/shared-style.js +4 -4
  13. package/lib/catalog/factories/wall-factory.js +8 -8
  14. package/lib/catalog/utils/item-loader.js +8 -2
  15. package/lib/class/line.js +27 -12
  16. package/lib/components/viewer2d/grids/grid-streak.js +1 -1
  17. package/lib/components/viewer2d/item.js +10 -5
  18. package/lib/components/viewer2d/line.js +315 -242
  19. package/lib/components/viewer2d/ruler.js +15 -35
  20. package/lib/components/viewer2d/rulerDist.js +18 -32
  21. package/lib/components/viewer2d/viewer2d.js +18 -7
  22. package/lib/constants.js +10 -4
  23. package/lib/models.js +4 -4
  24. package/lib/shared-style.js +4 -4
  25. package/package.json +1 -1
package/es/components/viewer2d/line.js CHANGED
@@ -1,13 +1,17 @@
1
+ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
2
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
3
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
1
4
  import React from 'react';
2
5
  import PropTypes from 'prop-types';
3
6
  import { GeometryUtils } from "../../utils/export";
4
7
  import Ruler from "./ruler";
5
- import { BASE_CABINET_LAYOUTPOS, LINE_THICKNESS, MODE_DRAGGING_LINE, MODE_DRAWING_LINE, WALL_CABINET_LAYOUTPOS, MAX_ANGLE_SCALE } from "../../constants";
8
+ import { BASE_CABINET_LAYOUTPOS, LINE_THICKNESS, MODE_DRAGGING_LINE, MODE_DRAWING_LINE, WALL_CABINET_LAYOUTPOS, MAX_ANGLE_SCALE, ROOM_SHAPE_MEASUREMENT_LINE_COLOR, ROOM_ELEMENT_MEASUREMENT_LINE_COLOR, BASE_ITEM_MEASUREMENT_LINE_COLOR, WALL_ITEM_MEASUREMENT_LINE_COLOR, DISTANCE_MEASUREMENT_LINE_COLOR, DASH_LINE_COLOR, TALL_CABINET_LAYOUTPOS } from "../../constants";
6
9
  import * as Three from 'three';
7
10
  import { isEmpty } from "./utils";
8
11
  var STYLE = {
9
- stroke: 'rgb(77, 77, 77)',
10
- strokeWidth: '1px'
12
+ stroke: '#78909C',
13
+ strokeWidth: '1px',
14
+ strokeDasharray: '4 8'
11
15
  };
12
16
  var STYLE_ANGLE = {
13
17
  stroke: 'rgb(77, 77, 77)',
@@ -23,6 +27,39 @@ var STYLE_TEXT = {
23
27
  fontWeight: 'middle',
24
28
  fontFamily: "'Courier New', Courier, monospace"
25
29
  };
30
+ export var STYLE_ROOM_SHAPE = {
31
+ stroke: ROOM_SHAPE_MEASUREMENT_LINE_COLOR,
32
+ strokeWidth: '2px'
33
+ };
34
+ var STYLE_DASH = {
35
+ stroke: DASH_LINE_COLOR,
36
+ strokeDasharray: '4 4',
37
+ strokeWidth: '2px',
38
+ strokeLinecap: 'round'
39
+ };
40
+ var STYLE_ROOM_ELEMENT = {
41
+ fill: ROOM_ELEMENT_MEASUREMENT_LINE_COLOR,
42
+ stroke: ROOM_ELEMENT_MEASUREMENT_LINE_COLOR,
43
+ strokeWidth: '2px'
44
+ };
45
+ var STYLE_BASE_ITEM = {
46
+ fill: BASE_ITEM_MEASUREMENT_LINE_COLOR,
47
+ stroke: BASE_ITEM_MEASUREMENT_LINE_COLOR,
48
+ strokeWidth: '2px'
49
+ };
50
+ var STYLE_WALL_ITEM = {
51
+ fill: WALL_ITEM_MEASUREMENT_LINE_COLOR,
52
+ stroke: WALL_ITEM_MEASUREMENT_LINE_COLOR,
53
+ strokeWidth: '2px'
54
+ };
55
+ var STYLE_DISTANCE = {
56
+ fill: DISTANCE_MEASUREMENT_LINE_COLOR,
57
+ stroke: DISTANCE_MEASUREMENT_LINE_COLOR,
58
+ strokeWidth: '2px'
59
+ };
60
+ var selectStyle = function selectStyle(element, style) {
61
+ return element.iFlag ? style : STYLE_DISTANCE;
62
+ };
26
63
  export function compareVertices(v0, v1) {
27
64
  return v0.x === v1.x ? v0.y - v1.y : v0.x - v1.x;
28
65
  }
@@ -47,9 +84,27 @@ export default function Line(_ref) {
47
84
  y1 = vertex0.y;
48
85
  var x2 = vertex1.x,
49
86
  y2 = vertex1.y;
87
+ var l2 = {
88
+ x: x1,
89
+ y: y1
90
+ };
91
+ var l3 = {
92
+ x: x2,
93
+ y: y2
94
+ };
95
+ var isSnapped = function isSnapped(itemRect) {
96
+ var r0 = itemRect.rect[0];
97
+ var r1 = itemRect.rect[1];
98
+ var r2 = itemRect.rect[2];
99
+ var r3 = itemRect.rect[3];
100
+ var delta23 = GeometryUtils.verticesDistance(l2, r3) + GeometryUtils.verticesDistance(r3, r2) + GeometryUtils.verticesDistance(r2, l3) - GeometryUtils.verticesDistance(l3, l2);
101
+ if (delta23 < 0.1) {
102
+ return true;
103
+ } else {
104
+ return false;
105
+ }
106
+ };
50
107
  var relatedvertice0x, relatedvertice0y, relatedvertice1x, relatedvertice1y;
51
- // relatedvertice0x = relatedVertice.point.x;
52
- // relatedvertice0y = relatedVertice.point.y;
53
108
  line.relatedVertices.forEach(function (relatedVertice) {
54
109
  if (relatedVertice.index == undefined) relatedVertice = relatedVertice.toJSON();
55
110
  if (relatedVertice.index == 0) {
@@ -62,17 +117,19 @@ export default function Line(_ref) {
62
117
  });
63
118
  var thickness = LINE_THICKNESS;
64
119
  var half_thickness = thickness / 2;
65
- // if (compareVertices(vertex0, vertex1) >= 0 && vertex0.x !== vertex1.x) {
66
- // ({ x: x1, y: y1 } = vertex1);
67
- // ({ x: x2, y: y2 } = vertex0);
68
- // }
69
-
120
+ var STEP = 20;
70
121
  var length = GeometryUtils.pointsDistance(x1, y1, x2, y2);
71
122
  // let length = GeometryUtils.pointsDistance(relatedvertice0x,relatedvertice0y,relatedvertice1x,relatedvertice1y);
72
123
  var rightHoleLength, leftHoleLength, holeLength;
73
124
  var angle = GeometryUtils.angleBetweenTwoPointsAndOrigin(x1, y1, x2, y2);
74
- var baseSpace = 20;
75
- var base_item = GeometryUtils.getAllItemSpecified(scene, catalog, BASE_CABINET_LAYOUTPOS);
125
+ // wall cabinet
126
+ var wallSpace = STEP;
127
+ var wall_item = GeometryUtils.getAllItemSpecified(scene, catalog, [WALL_CABINET_LAYOUTPOS, TALL_CABINET_LAYOUTPOS]);
128
+ var wallRuler = [];
129
+ var wall_posArray = [];
130
+ if (wall_item.cur) {
131
+ wall_item.others.push(wall_item.cur);
132
+ }
76
133
  // let relatedLines = [];
77
134
  var angleVertices = [];
78
135
  var layerID = state.getIn(['scene', 'selectedLayer']);
@@ -134,124 +191,108 @@ export default function Line(_ref) {
134
191
  });
135
192
  }
136
193
  }
137
- var l2 = {
138
- x: x1,
139
- y: y1
140
- };
141
- var l3 = {
142
- x: x2,
143
- y: y2
144
- };
145
- var isSnapped = function isSnapped(itemRect) {
146
- var r0 = itemRect.rect[0];
147
- var r1 = itemRect.rect[1];
148
- var r2 = itemRect.rect[2];
149
- var r3 = itemRect.rect[3];
150
- var tverArray = [l2, l3, r2, r3].sort(function (_ref2, _ref3) {
151
- var x1 = _ref2.x,
152
- y1 = _ref2.y;
153
- var x2 = _ref3.x,
154
- y2 = _ref3.y;
155
- return x1 === x2 ? y1 - y2 : x1 - x2;
156
- });
157
- var delta23 = GeometryUtils.verticesDistance(tverArray[0], tverArray[1]) + GeometryUtils.verticesDistance(tverArray[1], tverArray[2]) + GeometryUtils.verticesDistance(tverArray[2], tverArray[3]) - GeometryUtils.verticesDistance(tverArray[0], tverArray[3]);
158
- if (delta23 < 0.1) {
159
- return true;
160
- } else {
161
- return false;
162
- }
163
- };
164
- // base cabinet
165
- var baseRuler = [];
166
- var base_posArray = [];
167
- if (base_item.cur) {
168
- base_item.others.push(base_item.cur);
169
- }
170
- base_item.others.forEach(function (itemRect) {
171
- var r2 = itemRect.rect[2];
172
- var r3 = itemRect.rect[3];
194
+ if (Math.sin(angle) === 0 || GeometryUtils.almostEqual(y1, y2)) wall_item.others.sort(function (a, b) {
195
+ return a.pos.x - b.pos.x;
196
+ });else wall_item.others.sort(function (a, b) {
197
+ return a.pos.y - b.pos.y;
198
+ });
199
+ wall_posArray.push(_objectSpread(_objectSpread({}, l2), {}, {
200
+ iFlag: false
201
+ }));
202
+ wall_item.others.forEach(function (itemRect) {
203
+ var r2 = l2 > l3 ? itemRect.rect[2] : itemRect.rect[3];
204
+ var r3 = l2 > l3 ? itemRect.rect[3] : itemRect.rect[2];
173
205
  if (isSnapped(itemRect)) {
174
- base_posArray.push(r2);
175
- base_posArray.push(r3);
206
+ wall_posArray.push(_objectSpread(_objectSpread({}, r2), {}, {
207
+ iFlag: itemRect.itemInfo.id
208
+ }));
209
+ wall_posArray.push(_objectSpread(_objectSpread({}, r3), {}, {
210
+ iFlag: itemRect.itemInfo.id
211
+ }));
176
212
  }
177
213
  });
178
- base_posArray.push(l2);
179
- base_posArray.push(l3);
180
- var base_posAndwidth = [];
181
- if (Math.abs(angle) === 0 || Math.abs(angle) === 180 || GeometryUtils.almostEqual(y1, y2)) {
182
- base_posArray.sort(function (a, b) {
214
+ wall_posArray.push(_objectSpread(_objectSpread({}, l3), {}, {
215
+ iFlag: false
216
+ }));
217
+ var wall_posAndwidth = [];
218
+ if (Math.sin(angle) === 0 || GeometryUtils.almostEqual(y1, y2)) {
219
+ wall_posArray.sort(function (a, b) {
183
220
  return a.x - b.x;
184
221
  });
185
- if (base_posArray.length > 2) {
186
- for (var index = 0; index < base_posArray.length - 1; index++) {
187
- var element = base_posArray[index];
188
- base_posAndwidth.push({
222
+ if (wall_posArray.length > 2) {
223
+ for (var index = 0; index < wall_posArray.length - 1; index++) {
224
+ var element = wall_posArray[index];
225
+ wall_posAndwidth.push({
189
226
  pos: element,
190
- length: base_posArray[index + 1].x - element.x
227
+ length: wall_posArray[index + 1].x - element.x,
228
+ iFlag: wall_posArray[index + 1].iFlag === element.iFlag ? true : false
191
229
  });
192
230
  }
193
231
  }
194
232
  } else {
195
- base_posArray.sort(function (a, b) {
233
+ wall_posArray.sort(function (a, b) {
196
234
  return a.y - b.y;
197
235
  });
198
- if (base_posArray.length > 2) {
199
- for (var _index = 0; _index < base_posArray.length - 1; _index++) {
200
- var _element = base_posArray[_index];
201
- base_posAndwidth.push({
236
+ if (wall_posArray.length > 2) {
237
+ for (var _index = 0; _index < wall_posArray.length - 1; _index++) {
238
+ var _element = wall_posArray[_index];
239
+ wall_posAndwidth.push({
202
240
  pos: _element,
203
- length: Math.abs((base_posArray[_index + 1].y - _element.y) / Math.sin(angle / 180 * Math.PI))
241
+ length: Math.abs((wall_posArray[_index + 1].y - _element.y) / Math.sin(angle / 180 * Math.PI)),
242
+ iFlag: wall_posArray[_index + 1].iFlag === _element.iFlag ? true : false
204
243
  });
205
244
  }
206
245
  }
207
246
  }
208
- if (!showBaseCabinetMeasure || base_posArray.length <= 2) {
209
- baseSpace -= 20;
247
+ if (!showWallCabinetMeasure || wall_posArray.length <= 2) {
248
+ wallSpace = 0;
210
249
  }
211
- baseRuler = base_posAndwidth.map(function (pAw) {
250
+ wallRuler = wall_posAndwidth.map(function (pAw) {
212
251
  if (pAw.length > 1) {
213
- if (Math.abs(angle) === 0 || Math.abs(angle) === 180 || GeometryUtils.almostEqual(y1, y2)) {
252
+ if (Math.sin(angle) === 0 || GeometryUtils.almostEqual(y1, y2)) {
214
253
  if (x1 - x2 > 0) {
215
254
  return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
216
255
  x1: pAw.pos.x + pAw.length,
217
256
  y1: pAw.pos.y,
218
257
  x2: pAw.pos.x + pAw.length,
219
- y2: pAw.pos.y - thickness / 2 - baseSpace,
220
- style: STYLE
258
+ y2: pAw.pos.y - thickness / 2 - wallSpace,
259
+ style: STYLE_DASH
221
260
  }), /*#__PURE__*/React.createElement(Ruler, {
222
261
  key: 4,
223
262
  layer: layer,
224
263
  unit: scene.unit,
225
264
  rulerUnit: scene.rulerUnit,
226
265
  length: pAw.length,
227
- transform: "translate(".concat(pAw.pos.x, ", ").concat(pAw.pos.y - thickness / 2 - baseSpace, " ) rotate(").concat(angle + 180, ", 0, 0)")
266
+ transform: "translate(".concat(pAw.pos.x, ", ").concat(pAw.pos.y - thickness / 2 - wallSpace, " ) rotate(").concat(angle + 180, ", 0, 0)"),
267
+ style: selectStyle(pAw, STYLE_WALL_ITEM)
228
268
  }), /*#__PURE__*/React.createElement("line", {
229
269
  x1: pAw.pos.x,
230
270
  y1: pAw.pos.y,
231
271
  x2: pAw.pos.x,
232
- y2: pAw.pos.y - thickness / 2 - baseSpace,
233
- style: STYLE
272
+ y2: pAw.pos.y - thickness / 2 - wallSpace,
273
+ style: STYLE_DASH
234
274
  }));
235
275
  } else {
236
276
  return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
237
277
  x1: pAw.pos.x + pAw.length,
238
278
  y1: pAw.pos.y,
239
279
  x2: pAw.pos.x + pAw.length,
240
- y2: pAw.pos.y + thickness / 2 + baseSpace,
241
- style: STYLE
280
+ y2: pAw.pos.y + thickness / 2 + wallSpace,
281
+ style: STYLE_DASH
242
282
  }), /*#__PURE__*/React.createElement(Ruler, {
243
283
  key: 4,
244
284
  layer: layer,
245
285
  unit: scene.unit,
246
286
  rulerUnit: scene.rulerUnit,
247
287
  length: pAw.length,
248
- transform: "translate(".concat(pAw.pos.x, ", ").concat(pAw.pos.y + thickness / 2 + baseSpace, " ) rotate(").concat(angle, ", 0, 0)")
288
+ transform: "translate(".concat(pAw.pos.x, ", ").concat(pAw.pos.y + thickness / 2 + wallSpace, " ) rotate(").concat(angle, ", 0, 0)"),
289
+ style: selectStyle(pAw, STYLE_WALL_ITEM)
249
290
  }), /*#__PURE__*/React.createElement("line", {
250
291
  x1: pAw.pos.x,
251
292
  y1: pAw.pos.y,
252
293
  x2: pAw.pos.x,
253
- y2: pAw.pos.y + thickness / 2 + baseSpace,
254
- style: STYLE
294
+ y2: pAw.pos.y + thickness / 2 + wallSpace,
295
+ style: STYLE_DASH
255
296
  }));
256
297
  }
257
298
  } else {
@@ -260,43 +301,45 @@ export default function Line(_ref) {
260
301
  return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
261
302
  x1: pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI),
262
303
  y1: pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI),
263
- x2: pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
264
- y2: pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
265
- style: STYLE
304
+ x2: pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
305
+ y2: pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
306
+ style: STYLE_DASH
266
307
  }), /*#__PURE__*/React.createElement(Ruler, {
267
308
  key: 5,
268
309
  layer: layer,
269
310
  unit: scene.unit,
270
311
  rulerUnit: scene.rulerUnit,
271
312
  length: pAw.length,
272
- transform: "translate(".concat(pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0)")
313
+ transform: "translate(".concat(pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0)"),
314
+ style: selectStyle(pAw, STYLE_WALL_ITEM)
273
315
  }), /*#__PURE__*/React.createElement("line", {
274
316
  x1: pAw.pos.x,
275
317
  y1: pAw.pos.y,
276
- x2: pAw.pos.x - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
277
- y2: pAw.pos.y + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
278
- style: STYLE
318
+ x2: pAw.pos.x - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
319
+ y2: pAw.pos.y + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
320
+ style: STYLE_DASH
279
321
  }));
280
322
  } else {
281
323
  return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
282
324
  x1: pAw.pos.x,
283
325
  y1: pAw.pos.y,
284
- x2: pAw.pos.x - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
285
- y2: pAw.pos.y + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
286
- style: STYLE
326
+ x2: pAw.pos.x - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
327
+ y2: pAw.pos.y + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
328
+ style: STYLE_DASH
287
329
  }), /*#__PURE__*/React.createElement(Ruler, {
288
330
  key: 5,
289
331
  layer: layer,
290
332
  unit: scene.unit,
291
333
  rulerUnit: scene.rulerUnit,
292
334
  length: pAw.length,
293
- transform: "translate(".concat(pAw.pos.x - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0) scale(-1, -1)")
335
+ transform: "translate(".concat(pAw.pos.x - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0) scale(-1, -1)"),
336
+ style: selectStyle(pAw, STYLE_WALL_ITEM)
294
337
  }), /*#__PURE__*/React.createElement("line", {
295
338
  x1: pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI),
296
339
  y1: pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI),
297
- x2: pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
298
- y2: pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
299
- style: STYLE
340
+ x2: pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
341
+ y2: pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
342
+ style: STYLE_DASH
300
343
  }));
301
344
  }
302
345
  } else {
@@ -304,185 +347,164 @@ export default function Line(_ref) {
304
347
  return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
305
348
  x1: pAw.pos.x,
306
349
  y1: pAw.pos.y,
307
- x2: pAw.pos.x - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
308
- y2: pAw.pos.y + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
309
- style: STYLE
350
+ x2: pAw.pos.x - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
351
+ y2: pAw.pos.y + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
352
+ style: STYLE_DASH
310
353
  }), /*#__PURE__*/React.createElement(Ruler, {
311
354
  key: 5,
312
355
  layer: layer,
313
356
  unit: scene.unit,
314
357
  rulerUnit: scene.rulerUnit,
315
358
  length: pAw.length,
316
- transform: "translate(".concat(pAw.pos.x - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0)")
359
+ transform: "translate(".concat(pAw.pos.x - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0)"),
360
+ style: selectStyle(pAw, STYLE_WALL_ITEM)
317
361
  }), /*#__PURE__*/React.createElement("line", {
318
362
  x1: pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI),
319
363
  y1: pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI),
320
- x2: pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
321
- y2: pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
322
- style: STYLE
364
+ x2: pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
365
+ y2: pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
366
+ style: STYLE_DASH
323
367
  }));
324
368
  } else {
325
369
  return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
326
370
  x1: pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI),
327
371
  y1: pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI),
328
- x2: pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
329
- y2: pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
330
- style: STYLE
372
+ x2: pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
373
+ y2: pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
374
+ style: STYLE_DASH
331
375
  }), /*#__PURE__*/React.createElement(Ruler, {
332
376
  key: 5,
333
377
  layer: layer,
334
378
  unit: scene.unit,
335
379
  rulerUnit: scene.rulerUnit,
336
380
  length: pAw.length,
337
- transform: "translate(".concat(pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0) scale(-1, -1)")
381
+ transform: "translate(".concat(pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0) scale(-1, -1)"),
382
+ style: selectStyle(pAw, STYLE_WALL_ITEM)
338
383
  }), /*#__PURE__*/React.createElement("line", {
339
384
  x1: pAw.pos.x,
340
385
  y1: pAw.pos.y,
341
- x2: pAw.pos.x - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
342
- y2: pAw.pos.y + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
343
- style: STYLE
386
+ x2: pAw.pos.x - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
387
+ y2: pAw.pos.y + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
388
+ style: STYLE_DASH
344
389
  }));
345
390
  }
346
391
  }
347
392
  }
348
393
  }
349
394
  });
350
- var doorSpace = baseSpace + 20;
351
- var renderedHoles = line.holes.map(function (holeID) {
352
- var hole = layer.holes.get(holeID);
353
- if (hole === undefined) {
354
- return '';
355
- }
356
- var startAt = length * hole.offset;
357
- var renderedHole = catalog.getElement(hole.type).render2D(hole, layer, scene);
358
- return /*#__PURE__*/React.createElement("g", {
359
- key: holeID,
360
- transform: "translate(".concat(startAt, ", 3.5)"),
361
- "data-element-root": true,
362
- "data-prototype": hole.prototype,
363
- "data-id": hole.id,
364
- "data-selected": hole.selected,
365
- "data-layer": layer.id
366
- }, renderedHole);
367
- });
368
- var renderedLine = catalog.getElement(line.type).render2D(line, layer, scene, state);
369
- var holeTemp = [];
370
- var renderedRuler = [];
371
- var renderedAllRuler = [];
372
- if (!line.holes.size || !showWindowDoorMeasure) {
373
- doorSpace -= 20;
374
- }
375
- var allRuler = [0],
376
- holeData = [];
377
- var lineHoles = line.holes.sortBy(function (holeID) {
378
- var hole = layer.holes.get(holeID);
379
- return !hole ? 0 : hole.offset;
380
- });
381
- lineHoles.forEach(function (holeID) {
382
- var hole = layer.holes.get(holeID);
383
- if (hole !== undefined) {
384
- var startAt = length * hole.offset;
385
- var holeWidth = hole.properties.toJS().width.length;
386
- allRuler.push(startAt - holeWidth / 2);
387
- allRuler.push(startAt + holeWidth / 2);
388
- holeData["".concat(startAt - holeWidth / 2, "_").concat(startAt + holeWidth / 2)] = holeID;
389
- }
390
- });
391
- allRuler.push(length);
392
395
 
393
- // wall cabinet
394
- var wallSpace = doorSpace + 20;
395
- var wall_item = GeometryUtils.getAllItemSpecified(scene, catalog, WALL_CABINET_LAYOUTPOS);
396
- var wallRuler = [];
397
- var wall_posArray = [];
398
- if (wall_item.cur) {
399
- wall_item.others.push(wall_item.cur);
396
+ //base cabinet
397
+ var baseSpace = wallSpace + STEP;
398
+ var base_item = GeometryUtils.getAllItemSpecified(scene, catalog, BASE_CABINET_LAYOUTPOS);
399
+
400
+ // base cabinet
401
+ var baseRuler = [];
402
+ var base_posArray = [];
403
+ if (base_item.cur) {
404
+ base_item.others.push(base_item.cur);
400
405
  }
401
- wall_item.others.forEach(function (itemRect) {
402
- var r2 = itemRect.rect[2];
403
- var r3 = itemRect.rect[3];
406
+ if (Math.sin(angle) === 0 || GeometryUtils.almostEqual(y1, y2)) base_item.others.sort(function (a, b) {
407
+ return a.pos.x - b.pos.x;
408
+ });else base_item.others.sort(function (a, b) {
409
+ return a.pos.y - b.pos.y;
410
+ });
411
+ base_posArray.push(_objectSpread(_objectSpread({}, l2), {}, {
412
+ iFlag: false
413
+ }));
414
+ base_item.others.forEach(function (itemRect) {
415
+ var r2 = l2 > l3 ? itemRect.rect[2] : itemRect.rect[3];
416
+ var r3 = l2 > l3 ? itemRect.rect[3] : itemRect.rect[2];
404
417
  if (isSnapped(itemRect)) {
405
- wall_posArray.push(r2);
406
- wall_posArray.push(r3);
418
+ base_posArray.push(_objectSpread(_objectSpread({}, r2), {}, {
419
+ iFlag: itemRect.itemInfo.id
420
+ }));
421
+ base_posArray.push(_objectSpread(_objectSpread({}, r3), {}, {
422
+ iFlag: itemRect.itemInfo.id
423
+ }));
407
424
  }
408
425
  });
409
- wall_posArray.push(l2);
410
- wall_posArray.push(l3);
411
- var wall_posAndwidth = [];
412
- if (Math.abs(angle) === 0 || Math.abs(angle) === 180 || GeometryUtils.almostEqual(y1, y2)) {
413
- wall_posArray.sort(function (a, b) {
426
+ base_posArray.push(_objectSpread(_objectSpread({}, l3), {}, {
427
+ iFlag: false
428
+ }));
429
+ var base_posAndwidth = [];
430
+ if (Math.sin(angle) === 0 || GeometryUtils.almostEqual(y1, y2)) {
431
+ base_posArray.sort(function (a, b) {
414
432
  return a.x - b.x;
415
433
  });
416
- if (wall_posArray.length > 2) {
417
- for (var _index2 = 0; _index2 < wall_posArray.length - 1; _index2++) {
418
- var _element2 = wall_posArray[_index2];
419
- wall_posAndwidth.push({
434
+ if (base_posArray.length > 2) {
435
+ for (var _index2 = 0; _index2 < base_posArray.length - 1; _index2++) {
436
+ var _element2 = base_posArray[_index2];
437
+ base_posAndwidth.push({
420
438
  pos: _element2,
421
- length: wall_posArray[_index2 + 1].x - _element2.x
439
+ length: base_posArray[_index2 + 1].x - _element2.x,
440
+ iFlag: base_posArray[_index2 + 1].iFlag === _element2.iFlag ? true : false
422
441
  });
423
442
  }
424
443
  }
425
444
  } else {
426
- wall_posArray.sort(function (a, b) {
445
+ base_posArray.sort(function (a, b) {
427
446
  return a.y - b.y;
428
447
  });
429
- if (wall_posArray.length > 2) {
430
- for (var _index3 = 0; _index3 < wall_posArray.length - 1; _index3++) {
431
- var _element3 = wall_posArray[_index3];
432
- wall_posAndwidth.push({
448
+ if (base_posArray.length > 2) {
449
+ for (var _index3 = 0; _index3 < base_posArray.length - 1; _index3++) {
450
+ var _element3 = base_posArray[_index3];
451
+ base_posAndwidth.push({
433
452
  pos: _element3,
434
- length: Math.abs((wall_posArray[_index3 + 1].y - _element3.y) / Math.sin(angle / 180 * Math.PI))
453
+ length: Math.abs((base_posArray[_index3 + 1].y - _element3.y) / Math.sin(angle / 180 * Math.PI)),
454
+ iFlag: base_posArray[_index3 + 1].iFlag === _element3.iFlag ? true : false
435
455
  });
436
456
  }
437
457
  }
438
458
  }
439
- if (!showWallCabinetMeasure || wall_posArray.length <= 2) {
440
- wallSpace -= 20;
459
+ if (!showBaseCabinetMeasure || base_posArray.length <= 2) {
460
+ baseSpace -= STEP;
441
461
  }
442
- wallRuler = wall_posAndwidth.map(function (pAw) {
462
+ baseRuler = base_posAndwidth.map(function (pAw) {
443
463
  if (pAw.length > 1) {
444
- if (Math.abs(angle) === 0 || Math.abs(angle) === 180 || GeometryUtils.almostEqual(y1, y2)) {
464
+ if (Math.sin(angle) === 0 || GeometryUtils.almostEqual(y1, y2)) {
445
465
  if (x1 - x2 > 0) {
446
466
  return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
447
467
  x1: pAw.pos.x + pAw.length,
448
468
  y1: pAw.pos.y,
449
469
  x2: pAw.pos.x + pAw.length,
450
- y2: pAw.pos.y - thickness / 2 - wallSpace,
451
- style: STYLE
470
+ y2: pAw.pos.y - thickness / 2 - baseSpace,
471
+ style: STYLE_DASH
452
472
  }), /*#__PURE__*/React.createElement(Ruler, {
453
473
  key: 4,
454
474
  layer: layer,
455
475
  unit: scene.unit,
456
476
  rulerUnit: scene.rulerUnit,
457
477
  length: pAw.length,
458
- transform: "translate(".concat(pAw.pos.x, ", ").concat(pAw.pos.y - thickness / 2 - wallSpace, " ) rotate(").concat(angle + 180, ", 0, 0)")
478
+ transform: "translate(".concat(pAw.pos.x, ", ").concat(pAw.pos.y - thickness / 2 - baseSpace, " ) rotate(").concat(angle + 180, ", 0, 0)"),
479
+ style: selectStyle(pAw, STYLE_BASE_ITEM)
459
480
  }), /*#__PURE__*/React.createElement("line", {
460
481
  x1: pAw.pos.x,
461
482
  y1: pAw.pos.y,
462
483
  x2: pAw.pos.x,
463
- y2: pAw.pos.y - thickness / 2 - wallSpace,
464
- style: STYLE
484
+ y2: pAw.pos.y - thickness / 2 - baseSpace,
485
+ style: STYLE_DASH
465
486
  }));
466
487
  } else {
467
488
  return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
468
489
  x1: pAw.pos.x + pAw.length,
469
490
  y1: pAw.pos.y,
470
491
  x2: pAw.pos.x + pAw.length,
471
- y2: pAw.pos.y + thickness / 2 + wallSpace,
472
- style: STYLE
492
+ y2: pAw.pos.y + thickness / 2 + baseSpace,
493
+ style: STYLE_DASH
473
494
  }), /*#__PURE__*/React.createElement(Ruler, {
474
495
  key: 4,
475
496
  layer: layer,
476
497
  unit: scene.unit,
477
498
  rulerUnit: scene.rulerUnit,
478
499
  length: pAw.length,
479
- transform: "translate(".concat(pAw.pos.x, ", ").concat(pAw.pos.y + thickness / 2 + wallSpace, " ) rotate(").concat(angle, ", 0, 0)")
500
+ transform: "translate(".concat(pAw.pos.x, ", ").concat(pAw.pos.y + thickness / 2 + baseSpace, " ) rotate(").concat(angle, ", 0, 0)"),
501
+ style: selectStyle(pAw, STYLE_BASE_ITEM)
480
502
  }), /*#__PURE__*/React.createElement("line", {
481
503
  x1: pAw.pos.x,
482
504
  y1: pAw.pos.y,
483
505
  x2: pAw.pos.x,
484
- y2: pAw.pos.y + thickness / 2 + wallSpace,
485
- style: STYLE
506
+ y2: pAw.pos.y + thickness / 2 + baseSpace,
507
+ style: STYLE_DASH
486
508
  }));
487
509
  }
488
510
  } else {
@@ -491,43 +513,45 @@ export default function Line(_ref) {
491
513
  return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
492
514
  x1: pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI),
493
515
  y1: pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI),
494
- x2: pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
495
- y2: pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
496
- style: STYLE
516
+ x2: pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
517
+ y2: pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
518
+ style: STYLE_DASH
497
519
  }), /*#__PURE__*/React.createElement(Ruler, {
498
520
  key: 5,
499
521
  layer: layer,
500
522
  unit: scene.unit,
501
523
  rulerUnit: scene.rulerUnit,
502
524
  length: pAw.length,
503
- transform: "translate(".concat(pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0)")
525
+ transform: "translate(".concat(pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0)"),
526
+ style: selectStyle(pAw, STYLE_BASE_ITEM)
504
527
  }), /*#__PURE__*/React.createElement("line", {
505
528
  x1: pAw.pos.x,
506
529
  y1: pAw.pos.y,
507
- x2: pAw.pos.x - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
508
- y2: pAw.pos.y + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
509
- style: STYLE
530
+ x2: pAw.pos.x - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
531
+ y2: pAw.pos.y + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
532
+ style: STYLE_DASH
510
533
  }));
511
534
  } else {
512
535
  return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
513
536
  x1: pAw.pos.x,
514
537
  y1: pAw.pos.y,
515
- x2: pAw.pos.x - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
516
- y2: pAw.pos.y + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
517
- style: STYLE
538
+ x2: pAw.pos.x - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
539
+ y2: pAw.pos.y + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
540
+ style: STYLE_DASH
518
541
  }), /*#__PURE__*/React.createElement(Ruler, {
519
542
  key: 5,
520
543
  layer: layer,
521
544
  unit: scene.unit,
522
545
  rulerUnit: scene.rulerUnit,
523
546
  length: pAw.length,
524
- transform: "translate(".concat(pAw.pos.x - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0) scale(-1, -1)")
547
+ transform: "translate(".concat(pAw.pos.x - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0) scale(-1, -1)"),
548
+ style: selectStyle(pAw, STYLE_BASE_ITEM)
525
549
  }), /*#__PURE__*/React.createElement("line", {
526
550
  x1: pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI),
527
551
  y1: pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI),
528
- x2: pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
529
- y2: pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
530
- style: STYLE
552
+ x2: pAw.pos.x - pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
553
+ y2: pAw.pos.y - pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
554
+ style: STYLE_DASH
531
555
  }));
532
556
  }
533
557
  } else {
@@ -535,95 +559,141 @@ export default function Line(_ref) {
535
559
  return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
536
560
  x1: pAw.pos.x,
537
561
  y1: pAw.pos.y,
538
- x2: pAw.pos.x - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
539
- y2: pAw.pos.y + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
540
- style: STYLE
562
+ x2: pAw.pos.x - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
563
+ y2: pAw.pos.y + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
564
+ style: STYLE_DASH
541
565
  }), /*#__PURE__*/React.createElement(Ruler, {
542
566
  key: 5,
543
567
  layer: layer,
544
568
  unit: scene.unit,
545
569
  rulerUnit: scene.rulerUnit,
546
570
  length: pAw.length,
547
- transform: "translate(".concat(pAw.pos.x - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0)")
571
+ transform: "translate(".concat(pAw.pos.x - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0)"),
572
+ style: selectStyle(pAw, STYLE_BASE_ITEM)
548
573
  }), /*#__PURE__*/React.createElement("line", {
549
574
  x1: pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI),
550
575
  y1: pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI),
551
- x2: pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
552
- y2: pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
553
- style: STYLE
576
+ x2: pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
577
+ y2: pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
578
+ style: STYLE_DASH
554
579
  }));
555
580
  } else {
556
581
  return /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
557
582
  x1: pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI),
558
583
  y1: pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI),
559
- x2: pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
560
- y2: pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
561
- style: STYLE
584
+ x2: pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
585
+ y2: pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
586
+ style: STYLE_DASH
562
587
  }), /*#__PURE__*/React.createElement(Ruler, {
563
588
  key: 5,
564
589
  layer: layer,
565
590
  unit: scene.unit,
566
591
  rulerUnit: scene.rulerUnit,
567
592
  length: pAw.length,
568
- transform: "translate(".concat(pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0) scale(-1, -1)")
593
+ transform: "translate(".concat(pAw.pos.x + pAw.length * Math.cos(angle / 180 * Math.PI) - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI), ", ").concat(pAw.pos.y + pAw.length * Math.sin(angle / 180 * Math.PI) + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI), " ) rotate(").concat(angle, ", 0, 0) scale(-1, -1)"),
594
+ style: selectStyle(pAw, STYLE_BASE_ITEM)
569
595
  }), /*#__PURE__*/React.createElement("line", {
570
596
  x1: pAw.pos.x,
571
597
  y1: pAw.pos.y,
572
- x2: pAw.pos.x - (thickness / 2 + wallSpace) * Math.sin(angle / 180 * Math.PI),
573
- y2: pAw.pos.y + (thickness / 2 + wallSpace) * Math.cos(angle / 180 * Math.PI),
574
- style: STYLE
598
+ x2: pAw.pos.x - (thickness / 2 + baseSpace) * Math.sin(angle / 180 * Math.PI),
599
+ y2: pAw.pos.y + (thickness / 2 + baseSpace) * Math.cos(angle / 180 * Math.PI),
600
+ style: STYLE_DASH
575
601
  }));
576
602
  }
577
603
  }
578
604
  }
579
605
  }
580
606
  });
581
- var lineSpace = wallSpace + 20;
607
+ var doorSpace = baseSpace + STEP;
608
+ var renderedHoles = line.holes.map(function (holeID) {
609
+ var hole = layer.holes.get(holeID);
610
+ if (hole === undefined) {
611
+ return '';
612
+ }
613
+ var startAt = length * hole.offset;
614
+ var renderedHole = catalog.getElement(hole.type).render2D(hole, layer, scene);
615
+ return /*#__PURE__*/React.createElement("g", {
616
+ key: holeID,
617
+ transform: "translate(".concat(startAt, ", 3.5)"),
618
+ "data-element-root": true,
619
+ "data-prototype": hole.prototype,
620
+ "data-id": hole.id,
621
+ "data-selected": hole.selected,
622
+ "data-layer": layer.id
623
+ }, renderedHole);
624
+ });
625
+ var renderedLine = catalog.getElement(line.type).render2D(line, layer, scene, state);
626
+ var holeTemp = [];
627
+ var renderedRuler = [];
628
+ var renderedAllRuler = [];
629
+ if (!line.holes.size || !showWindowDoorMeasure) {
630
+ doorSpace -= STEP;
631
+ }
632
+ var allRuler = [0],
633
+ holeData = [];
634
+ var lineHoles = line.holes.sortBy(function (holeID) {
635
+ var hole = layer.holes.get(holeID);
636
+ return !hole ? 0 : hole.offset;
637
+ });
638
+ lineHoles.forEach(function (holeID) {
639
+ var hole = layer.holes.get(holeID);
640
+ if (hole !== undefined) {
641
+ var startAt = length * hole.offset;
642
+ var holeWidth = hole.properties.toJS().width.length;
643
+ allRuler.push(startAt - holeWidth / 2);
644
+ allRuler.push(startAt + holeWidth / 2);
645
+ holeData["".concat(startAt - holeWidth / 2, "_").concat(startAt + holeWidth / 2)] = holeID;
646
+ }
647
+ });
648
+ allRuler.push(length);
649
+ var lineSpace = doorSpace + STEP;
582
650
  //the space from the dimensioning line to the top
583
- var lineSpacedimension1 = 5;
651
+ var lineSpacedimension1 = 4;
584
652
  //the space from the dimensioning line to the bottom
585
- var lineSpacedimension2 = 15;
653
+ var lineSpacedimension2 = 14;
586
654
  if (compareVertices(vertex0, vertex1) >= 0 && vertex0.x !== vertex1.x) {
587
655
  renderedRuler.push(/*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
588
656
  x1: length,
589
- y1: half_thickness + lineSpace + lineSpacedimension1,
657
+ y1: lineSpace + lineSpacedimension1,
590
658
  x2: length,
591
- y2: half_thickness + lineSpacedimension2,
592
- style: STYLE
659
+ y2: lineSpace + lineSpacedimension2,
660
+ style: STYLE_ROOM_SHAPE
593
661
  }), /*#__PURE__*/React.createElement(Ruler, {
594
662
  key: 0,
595
663
  layer: layer,
596
664
  unit: scene.unit,
597
665
  rulerUnit: scene.rulerUnit,
598
666
  length: length,
599
- transform: "translate(".concat(length, ", ").concat(half_thickness + lineSpace, ") scale(-1, -1)")
667
+ transform: "translate(".concat(length, ", ").concat(half_thickness + lineSpace, ") scale(-1, -1)"),
668
+ style: STYLE_ROOM_SHAPE
600
669
  }), /*#__PURE__*/React.createElement("line", {
601
670
  x1: 0,
602
- y1: half_thickness + lineSpace + lineSpacedimension1,
671
+ y1: lineSpace + lineSpacedimension1,
603
672
  x2: 0,
604
- y2: half_thickness + lineSpacedimension2,
605
- style: STYLE
673
+ y2: lineSpace + lineSpacedimension2,
674
+ style: STYLE_ROOM_SHAPE
606
675
  })));
607
676
  } else {
608
677
  renderedRuler.push(/*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
609
678
  x1: 0,
610
- y1: half_thickness + lineSpace + lineSpacedimension1,
679
+ y1: lineSpace + lineSpacedimension1,
611
680
  x2: 0,
612
- y2: half_thickness + lineSpacedimension2,
613
- style: STYLE
681
+ y2: lineSpace + lineSpacedimension2,
682
+ style: STYLE_ROOM_SHAPE
614
683
  }), /*#__PURE__*/React.createElement(Ruler, {
615
684
  key: 0,
616
685
  layer: layer,
617
686
  unit: scene.unit,
618
687
  rulerUnit: scene.rulerUnit,
619
688
  length: length,
620
- transform: "translate(0, ".concat(half_thickness + lineSpace, ")")
689
+ transform: "translate(0, ".concat(half_thickness + lineSpace, ")"),
690
+ style: STYLE_ROOM_SHAPE
621
691
  }), /*#__PURE__*/React.createElement("line", {
622
692
  x1: length,
623
- y1: half_thickness + lineSpace + lineSpacedimension1,
693
+ y1: lineSpace + lineSpacedimension1,
624
694
  x2: length,
625
- y2: half_thickness + lineSpacedimension2,
626
- style: STYLE
695
+ y2: lineSpace + lineSpacedimension2,
696
+ style: STYLE_ROOM_SHAPE
627
697
  })));
628
698
  }
629
699
  allRuler.sort(function (a, b) {
@@ -659,20 +729,21 @@ export default function Line(_ref) {
659
729
  y1: half_thickness,
660
730
  x2: allRuler[index],
661
731
  y2: half_thickness + doorSpace,
662
- style: STYLE
732
+ style: STYLE_DASH
663
733
  }), /*#__PURE__*/React.createElement(Ruler, {
664
734
  key: "allRuler_".concat(index),
665
735
  layer: layer,
666
736
  unit: scene.unit,
667
737
  rulerUnit: scene.rulerUnit,
668
738
  length: element,
669
- transform: "translate(".concat(allRuler[index] + element, ", ").concat(half_thickness + doorSpace, " ) scale(-1, -1)")
739
+ transform: "translate(".concat(allRuler[index] + element, ", ").concat(half_thickness + doorSpace, " ) scale(-1, -1)"),
740
+ style: STYLE_ROOM_ELEMENT
670
741
  }), /*#__PURE__*/React.createElement("line", {
671
742
  x1: allRuler[index] + element,
672
743
  y1: half_thickness,
673
744
  x2: allRuler[index] + element,
674
745
  y2: half_thickness + doorSpace,
675
- style: STYLE
746
+ style: STYLE_DASH
676
747
  })));
677
748
  } else {
678
749
  renderedAllRuler.push(/*#__PURE__*/React.createElement("g", {
@@ -682,20 +753,21 @@ export default function Line(_ref) {
682
753
  y1: half_thickness,
683
754
  x2: allRuler[index],
684
755
  y2: half_thickness + doorSpace,
685
- style: STYLE
756
+ style: STYLE_DASH
686
757
  }), /*#__PURE__*/React.createElement(Ruler, {
687
758
  key: "allRuler_".concat(index),
688
759
  layer: layer,
689
760
  unit: scene.unit,
690
761
  rulerUnit: scene.rulerUnit,
691
762
  length: element,
692
- transform: "translate(".concat(allRuler[index], ", ").concat(half_thickness + doorSpace, " )")
763
+ transform: "translate(".concat(allRuler[index], ", ").concat(half_thickness + doorSpace, " )"),
764
+ style: STYLE_ROOM_ELEMENT
693
765
  }), /*#__PURE__*/React.createElement("line", {
694
766
  x1: allRuler[index] + element,
695
767
  y1: half_thickness,
696
768
  x2: allRuler[index] + element,
697
769
  y2: half_thickness + doorSpace,
698
- style: STYLE
770
+ style: STYLE_DASH
699
771
  })));
700
772
  }
701
773
  }