kitchen-simulator 3.1.12 → 3.1.14

package/es/LiteKitchenConfigurator.js

@@ -7,7 +7,7 @@ import _createClass from "@babel/runtime/helpers/esm/createClass";
 import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
-var _excluded = ["width", "height", "state", "stateExtractor"];
+var _excluded = ["width", "height", "state", "stateExtractor", "measurementUnit"];
 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; }
 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; }
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
@@ -362,6 +362,7 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
         height = _this$props2.height,
         state = _this$props2.state,
         stateExtractor = _this$props2.stateExtractor,
+        measurementUnit = _this$props2.measurementUnit,
         props = _objectWithoutProperties(_this$props2, _excluded);
       var _this$state = this.state,
         savePopupVisible = _this$state.savePopupVisible,
@@ -404,6 +405,9 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
       extractedState = extractedState.merge({
         viewer2D: _viewer2D
       });
+
+      // set the measurement unit after project setup
+      if (measurementUnit) this.props.viewer2DActions.updateCeilHeightUnit(measurementUnit);
       return /*#__PURE__*/React.createElement("section", null, /*#__PURE__*/React.createElement("div", {
         style: _objectSpread(_objectSpread({}, wrapperStyle), {}, {
           height: height,

package/es/catalog/holes/window-clear/planner-element.js

@@ -4,12 +4,12 @@ import { loadGLTF, scaleObject } from "../../utils/load-obj";
 import { OBJTYPE_MESH } from "../../../constants";
 var cached3DWindow = null;
 export default {
-  name: 'Clear Window',
+  name: 'Window',
   prototype: 'holes',
   info: {
     title: 'Clear',
     tag: ['window'],
-    description: 'Clear Window',
+    description: 'Window',
     image: '/assets/img/svg/window/Clear.svg',
     url: '/assets/gltf/window_clear.gltf'
   },

package/es/class/line.js

@@ -485,7 +485,7 @@ var Line = /*#__PURE__*/function () {
       var v_a = layer.vertices.get(line.vertices.get(0));
       var v_b = layer.vertices.get(line.vertices.get(1));
       var distance = GeometryUtils.pointsDistance(v_a.x, v_a.y, v_b.x, v_b.y);
-      var _length = convert(distance).from('cm').to('in');
+      var _length = convert(distance).from('cm').to(layer.unit);
       payload.length = _length;
       if (onInternalEvent) onInternalEvent({
         type: INTERNAL_EVENT_START_DRAW_WALL,

package/es/components/viewer2d/item.js

@@ -238,25 +238,38 @@ export default function Item(_ref, _ref2) {
    */
   var getDistant = function getDistant(x, y, rotRad) {
     var center_h = 3 * height / 8;
-    var center_x = x;
+    var center_x = x; // middle of front line of cabinet rect
     var center_y = y;
-    var center_x1 = x - center_h * Math.sin(rotRad);
+    var center_x1 = x - center_h * Math.sin(rotRad); // center point of cabinet rect
     var center_y1 = y + center_h * Math.cos(rotRad);
     var PointArray = [];
-    curiteminfo.rectCenterPoint.forEach(function (centerpoint) {
-      var comparelength = [];
+    var _loop = function _loop(i) {
+      var centerpoint = curiteminfo.rectCenterPoint[i];
+      // [rectCenterPoint] has four middle points of cabinet rect edges
+      var comparelength = []; // distance array from rectCenterPoint[i] to other lines(walls, other cabinet rect edges)
       var a;
-      var RectLineFuction;
+      var RectLineFuction; // normal line of cabinet rect edge
       if (centerpoint[1] === 180 || centerpoint[1] === 0) RectLineFuction = GeometryUtils.linePassingThroughTwoPoints(centerpoint[0].x, centerpoint[0].y, center_x1, center_y1);else RectLineFuction = GeometryUtils.linePassingThroughTwoPoints(centerpoint[0].x, centerpoint[0].y, center_x, center_y);
       allRect.forEach(function (linerect) {
+        // calc distance to all other lines
         var p0 = GeometryUtils.clone_point(linerect.rect[2]);
         var p1 = GeometryUtils.clone_point(linerect.rect[3]);
-        var lineFunction = {};
+        var lineFunction = {}; // other line function
         if (p0.x !== p1.x || p0.y !== p1.y) lineFunction = GeometryUtils.linePassingThroughTwoPoints(p0.x, p0.y, p1.x, p1.y);
+        // intersection between normal line and other line
         var coordinatePoint = GeometryUtils.twoLinesIntersection(lineFunction.a, lineFunction.b, lineFunction.c, RectLineFuction.a, RectLineFuction.b, RectLineFuction.c);
         if (coordinatePoint !== undefined) {
-          if (GeometryUtils.pointsDistance(p0.x, p0.y, p1.x, p1.y) > GeometryUtils.pointsDistance(p0.x, p0.y, coordinatePoint.x, coordinatePoint.y) && GeometryUtils.pointsDistance(p0.x, p0.y, p1.x, p1.y) > GeometryUtils.pointsDistance(p1.x, p1.y, coordinatePoint.x, coordinatePoint.y)) {
-            if (GeometryUtils.pointsDistance(coordinatePoint.x, coordinatePoint.y, center_x, center_y) > GeometryUtils.pointsDistance(centerpoint[0].x, centerpoint[0].y, coordinatePoint.x, coordinatePoint.y)) {
+          if (
+          // intersection point is on the other line
+          GeometryUtils.pointsDistance(p0.x, p0.y, p1.x, p1.y) > GeometryUtils.pointsDistance(p0.x, p0.y, coordinatePoint.x, coordinatePoint.y) && GeometryUtils.pointsDistance(p0.x, p0.y, p1.x, p1.y) > GeometryUtils.pointsDistance(p1.x, p1.y, coordinatePoint.x, coordinatePoint.y)) {
+            // check the intersection point is outside direction of edge
+            var isOutside = true;
+            for (var j = 0; j < curiteminfo.rectCenterPoint.length; j++) {
+              if (j === i) continue;
+              var otherCenterPoint = curiteminfo.rectCenterPoint[j];
+              if (GeometryUtils.isPointOnLineSegment(centerpoint[0].x, centerpoint[0].y, coordinatePoint.x, coordinatePoint.y, otherCenterPoint[0].x, otherCenterPoint[0].y)) isOutside = false;
+            }
+            if (isOutside && GeometryUtils.pointsDistance(coordinatePoint.x, coordinatePoint.y, center_x, center_y) > GeometryUtils.pointsDistance(centerpoint[0].x, centerpoint[0].y, coordinatePoint.x, coordinatePoint.y)) {
               comparelength.push(GeometryUtils.pointsDistance(centerpoint[0].x, centerpoint[0].y, coordinatePoint.x, coordinatePoint.y));
               a = Math.min.apply(null, comparelength);
             }
@@ -264,7 +277,10 @@ export default function Item(_ref, _ref2) {
         }
       });
       PointArray.push([a, centerpoint[1]]);
-    });
+    };
+    for (var i = 0; i < curiteminfo.rectCenterPoint.length; i++) {
+      _loop(i);
+    }
     return {
       PointArray: PointArray
     };

package/es/components/viewer2d/utils.js

@@ -187,7 +187,7 @@ export var areaPolygon = function areaPolygon(points) {
 };
 export var isWarningItem = function isWarningItem(item) {
   var _item$toJS$doorStyle;
-  return !(item !== null && item !== void 0 && (_item$toJS$doorStyle = item.toJS().doorStyle) !== null && _item$toJS$doorStyle !== void 0 && (_item$toJS$doorStyle = _item$toJS$doorStyle.doorStyles) !== null && _item$toJS$doorStyle !== void 0 && (_item$toJS$doorStyle = _item$toJS$doorStyle.cds) !== null && _item$toJS$doorStyle !== void 0 && _item$toJS$doorStyle.filter(function (cd) {
+  if (item.category === 'cabinet') return !(item !== null && item !== void 0 && (_item$toJS$doorStyle = item.toJS().doorStyle) !== null && _item$toJS$doorStyle !== void 0 && (_item$toJS$doorStyle = _item$toJS$doorStyle.doorStyles) !== null && _item$toJS$doorStyle !== void 0 && (_item$toJS$doorStyle = _item$toJS$doorStyle.cds) !== null && _item$toJS$doorStyle !== void 0 && _item$toJS$doorStyle.filter(function (cd) {
     return cd.itemID == (item === null || item === void 0 ? void 0 : item.getIn(['itemID']));
-  }).length) > 0;
+  }).length) > 0;else return false;
 };

package/es/components/viewer2d/viewer2d.js

@@ -1258,7 +1258,7 @@ export default function Viewer2D(_ref, _ref2) {
           var v_a = layer.vertices.get(_currentObject.vertices.get(0));
           var v_b = layer.vertices.get(_currentObject.vertices.get(1));
           var distance = GeometryUtils.pointsDistance(v_a.x, v_a.y, v_b.x, v_b.y);
-          var _length3 = convert(distance).from('cm').to('in');
+          var _length3 = convert(distance).from('cm').to(layer.unit);
           payload.length = _length3;
           //////////////////////////////////////
         } else if (((_currentObject5 = _currentObject) === null || _currentObject5 === void 0 ? void 0 : _currentObject5.prototype) === 'items') {

package/es/components/viewer3d/viewer3d.js

@@ -1194,7 +1194,7 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
             var v_a = layer.vertices.get(evtElement.vertices.get(0));
             var v_b = layer.vertices.get(evtElement.vertices.get(1));
             var distance = GeometryUtils.pointsDistance(v_a.x, v_a.y, v_b.x, v_b.y);
-            var _length = convert(distance).from('cm').to('in');
+            var _length = convert(distance).from('cm').to(layer.unit);
             payload.length = _length;
             //////////////////////////////////////
           } else if ((evtElement === null || evtElement === void 0 ? void 0 : evtElement.prototype) === 'items') {
@@ -1386,7 +1386,7 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
           altitude = convert(altitude).from(unit).to(_this2.props.state.scene.unit);
         }
         scene3D.remove(angleObj);
-        // scene3D.remove(toolObj);
+        scene3D.remove(toolObj);
         if (!_this2.props.downloadFlag && !_this2.props.state.mode.includes('ING')) {
           _this2.props.setToolbar('');
         }
@@ -1460,7 +1460,8 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
             });
           });
           var intersects = raycaster.intersectObjects(meshes, true);
-          var _i10;
+          var _i10; // index of warning object in intersects
+
           if (intersects.length > 0 && !isNaN(intersects[0].distance)) {
             for (_i10 = 0; _i10 < intersects.length; _i10++) {
               if (intersects[_i10].object.name === 'warningObj') break;
@@ -1488,6 +1489,19 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
             }
           }
           gridMatrix.copy(gridPlane.matrixWorld).invert();
+          var addItemToolObj = function addItemToolObj() {
+            var _intersects$_i;
+            var selectedItem = planData.sceneGraph.layers[selectedObject.layerID].items[selectedObject.itemID];
+            if (isUndefined(selectedItem)) return;
+            selectedElement = _this2.props.state.scene.layers.get(selectedObject.layerID).items.get(selectedObject.itemID);
+            var itemPos = selectedItem.position.clone();
+            if (((_intersects$_i = intersects[_i10]) === null || _intersects$_i === void 0 || (_intersects$_i = _intersects$_i.object) === null || _intersects$_i === void 0 || (_intersects$_i = _intersects$_i.parent) === null || _intersects$_i === void 0 || (_intersects$_i = _intersects$_i.parent) === null || _intersects$_i === void 0 || (_intersects$_i = _intersects$_i.userData) === null || _intersects$_i === void 0 ? void 0 : _intersects$_i.itemId) === selectedItem.userData.itemId) {
+              toolObj.position.set(intersects[_i10].point.x, intersects[_i10].point.y, intersects[_i10].point.z);
+            } else {
+              toolObj.position.set(planData.plan.position.x + itemPos.x, selectedElement.category === 'lighting' ? -planData.plan.position.y - selectedElement.properties.get('height').get('length') : planData.plan.position.y + selectedItem.children[0].position.y, planData.plan.position.z + itemPos.z);
+            }
+            scene3D.add(toolObj);
+          };
           if (Math.abs(mouse.x - _this2.lastMousePosition.x) <= 0.02 && Math.abs(mouse.y - _this2.lastMousePosition.y) <= 0.02 || bMove) {
             if (intersects.length > 0 && !isNaN(intersects[0].distance)) {
               if (intersects[_i10] === undefined) {
@@ -1511,16 +1525,7 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
                 isSelected = true;
                 setTimeout(function () {
                   getDistances(layer);
-                  var selectedItem = planData.sceneGraph.layers[selectedObject.layerID].items[selectedObject.itemID];
-                  if (isUndefined(selectedItem)) return;
-                  selectedElement = _this2.props.state.scene.layers.get(selectedObject.layerID).items.get(selectedObject.itemID);
-                  var itemPos = selectedItem.position.clone();
-                  if (intersects[_i10].object.parent && intersects[_i10].object.parent.parent.userData.itemId === selectedItem.userData.itemId) {
-                    toolObj.position.set(intersects[_i10].point.x, intersects[_i10].point.y, intersects[_i10].point.z);
-                  } else {
-                    toolObj.position.set(planData.plan.position.x + itemPos.x, selectedElement.category === 'lighting' ? -planData.plan.position.y - selectedElement.properties.get('height').get('length') : planData.plan.position.y + selectedItem.children[0].position.y, planData.plan.position.z + itemPos.z);
-                  }
-                  scene3D.add(toolObj);
+                  addItemToolObj();
                   _this2.setState({
                     toolObj: toolObj
                   });
@@ -1543,7 +1548,6 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
                     case 'holeID' in selectedObject:
                       elementID = selectedObject.holeID;
                       elementPrototype = 'holes';
-                      scene3D.remove(toolObj);
                       if (_this2.props.state.mode === MODE_DRAGGING_HOLE_3D) {
                         actions.holesActions.endDraggingHole3D(sPoint.x, sPoint.y);
                       }
@@ -1551,12 +1555,10 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
                     case 'lineID' in selectedObject:
                       elementID = selectedObject.lineID;
                       elementPrototype = 'lines';
-                      scene3D.remove(toolObj);
                       break;
                     case 'areaID' in selectedObject:
                       elementID = selectedObject.areaID;
                       elementPrototype = 'areas';
-                      scene3D.remove(toolObj);
                       break;
                     default:
                       break;
@@ -1566,24 +1568,22 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
                 isSelected = false;
               }
             } else {
-              // isSelected = false;
-              // this.context.projectActions.unselectAll();
-              switch (true) {
-                case 'holeID' in selectedObject:
-                  actions.holesActions.endDraggingHole3D(sPoint.x, sPoint.y);
-                  break;
-                default:
-                  _this2.context.itemsActions.removeReplacingSupport();
-                  break;
+              var selectedItem = planData.sceneGraph.layers[selectedObject.layerID].items[selectedObject.itemID];
+              if (bMove && !isEmpty(selectedItem)) {
+                addItemToolObj();
+              } else {
+                isSelected = false;
+                _this2.context.projectActions.unselectAll();
+                switch (true) {
+                  case 'holeID' in selectedObject:
+                    actions.holesActions.endDraggingHole3D(sPoint.x, sPoint.y);
+                    break;
+                  default:
+                    _this2.context.itemsActions.removeReplacingSupport();
+                    break;
+                }
               }
             }
-            var selectedItem = planData.sceneGraph.layers[selectedObject.layerID].items[selectedObject.itemID];
-            if (selectedItem) {
-              selectedElement = _this2.props.state.scene.layers.get(selectedObject.layerID).items.get(selectedObject.itemID);
-              var itemPos = selectedItem.position.clone();
-              toolObj.position.set(planData.plan.position.x + itemPos.x, selectedElement.category === 'lighting' ? -planData.plan.position.y - selectedElement.properties.get('height').get('length') : planData.plan.position.y + selectedItem.children[0].position.y, planData.plan.position.z + itemPos.z);
-              scene3D.add(toolObj);
-            }
             bMove = false;
             bRotate = false;
             bMoveUP = false;
@@ -1602,35 +1602,15 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
             }
             getPoint(event, alti);
             if (bRotate) {
-              var _intersects$_i;
-              var _selectedItem = planData.sceneGraph.layers[selectedObject.layerID].items[selectedObject.itemID];
-              if (isUndefined(_selectedItem)) return;
-              selectedElement = _this2.props.state.scene.layers.get(selectedObject.layerID).items.get(selectedObject.itemID);
-              var _itemPos = _selectedItem.position.clone();
-              if (((_intersects$_i = intersects[_i10]) === null || _intersects$_i === void 0 || (_intersects$_i = _intersects$_i.object) === null || _intersects$_i === void 0 || (_intersects$_i = _intersects$_i.parent) === null || _intersects$_i === void 0 || (_intersects$_i = _intersects$_i.parent) === null || _intersects$_i === void 0 || (_intersects$_i = _intersects$_i.userData) === null || _intersects$_i === void 0 ? void 0 : _intersects$_i.itemId) === _selectedItem.userData.itemId) {
-                toolObj.position.set(intersects[_i10].point.x, intersects[_i10].point.y, intersects[_i10].point.z);
-              } else {
-                toolObj.position.set(planData.plan.position.x + _itemPos.x, selectedElement.category === 'lighting' ? -planData.plan.position.y - selectedElement.properties.get('height').get('length') : planData.plan.position.y + _selectedItem.children[0].position.y, planData.plan.position.z + _itemPos.z);
-              }
-              scene3D.add(toolObj);
+              addItemToolObj();
               _this2.setState({
                 toolObj: toolObj
               });
               _this2.context.itemsActions.endRotatingItem3D(Point.x, Point.y);
               bRotate = false;
-            }
-            if (bMove) {
+            } else if (bMove) {
               bMove = false;
-              var _selectedItem2 = planData.sceneGraph.layers[selectedObject.layerID].items[selectedObject.itemID];
-              if (isUndefined(_selectedItem2)) return;
-              selectedElement = _this2.props.state.scene.layers.get(selectedObject.layerID).items.get(selectedObject.itemID);
-              var _itemPos2 = _selectedItem2.position.clone();
-              if (intersects[_i10].object.parent.parent.userData.itemId === _selectedItem2.userData.itemId) {
-                toolObj.position.set(intersects[_i10].point.x, intersects[_i10].point.y, intersects[_i10].point.z);
-              } else {
-                toolObj.position.set(planData.plan.position.x + _itemPos2.x, selectedElement.category === 'lighting' ? -planData.plan.position.y - selectedElement.properties.get('height').get('length') : planData.plan.position.y + _selectedItem2.children[0].position.y, planData.plan.position.z + _itemPos2.z);
-              }
-              scene3D.add(toolObj);
+              addItemToolObj();
               _this2.setState({
                 toolObj: toolObj
               });
@@ -1650,7 +1630,7 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
                 _item3D.position.z = targetPoint.z;
                 _item3D.visible = true;
               }
-            }
+            } else {}
             if (bMoveUP) {
               bMoveUP = false;
             }

package/es/constants.js

@@ -66,6 +66,7 @@ export var CHANGE_WALL_LENGTH_MEASURE = 'CHANGE_WALL_LENGTH_MEASURE';
 export var CHANGE_BASE_CABINET_MEASURE = 'CHANGE_BASE_CABINET_MEASURE';
 export var CHANGE_WALL_CABINET_MEASURE = 'CHANGE_WALL_CABINET_MEASURE';
 export var CHANGE_WINDOW_DOOR_MEASURE = 'CHANGE_WINDOW_DOOR_MEASURE';
+export var CHANGE_MEASUREMENT_UNIT = 'CHANGE_MEASUREMENT_UNIT';
 
 //ACTIONS viewer3D
 export var SELECT_TOOL_3D_VIEW = 'SELECT_TOOL_3D_VIEW';
@@ -650,10 +651,11 @@ export var PROJECT_SETTING_OPTION = {
   CHANGE_WALL_LENGTH_MEASURE: CHANGE_WALL_LENGTH_MEASURE,
   CHANGE_BASE_CABINET_MEASURE: CHANGE_BASE_CABINET_MEASURE,
   CHANGE_WALL_CABINET_MEASURE: CHANGE_WALL_CABINET_MEASURE,
-  CHANGE_WINDOW_DOOR_MEASURE: CHANGE_WINDOW_DOOR_MEASURE
+  CHANGE_WINDOW_DOOR_MEASURE: CHANGE_WINDOW_DOOR_MEASURE,
+  CHANGE_MEASUREMENT_UNIT: CHANGE_MEASUREMENT_UNIT
 };
 export var HOLE_NAMES = {
-  WINDOW_CLEAR: 'Clear Window',
+  WINDOW_CLEAR: 'Window',
   WINDOW_CROSS: 'Cross Window',
   WINDOW_DOUBLE_HUNG: 'Double Hung Window',
   WINDOW_VERTICAL: 'window-vertical',
@@ -739,6 +741,7 @@ export var EXTERNAL_EVENT_UPDATE_ATTRIBUTE = 'EXTERNAL_EVENT_UPDATE_ATTRIBUTE';
 export var EXTERNAL_EVENT_UPDATE_PROPERTY = 'EXTERNAL_EVENT_UPDATE_PROPERTY'; // update the element's property (flip_doorhandle, open_doors...) in the property window
 export var EXTERNAL_EVENT_REPLACE_CABINET = 'EXTERNAL_EVENT_REPLACE_CABINET';
 export var EXTERNAL_EVENT_SET_FINISHING = 'EXTERNAL_EVENT_SET_FINISHING'; // set finishing(wallColor, floorStyle, doorHandle, backsplash, counterTop)
+export var EXTERNAL_EVENT_ROTATE_PAN = 'EXTERNAL_EVENT_ROTATE_PAN'; // external event for rotate pan
 
 // internal event type
 export var INTERNAL_EVENT_UNSELECT_ALL = 'INTERNAL_EVENT_UNSELECT_ALL';

package/es/devLiteRenderer.js

@@ -7,6 +7,7 @@ import ContainerDimensions from "react-container-dimensions";
 import projectItemsCatalog from "./mocks/projectItemsCatalog.json";
 import mockProps from "./mocks/mockProps.json";
 import cabinetPaylod from "./mocks/cabinetPayload2.json";
+import cabinetW0940Payload from "./mocks/cabinetPayload.json";
 import appliancePaylod from "./mocks/appliancePayload.json";
 import doorStylePaylod2 from "./mocks/doorStylePayload2.json";
 import roomShapePayload from "./mocks/roomShapePayload.json";
@@ -19,7 +20,7 @@ import replaceCabinetPayload from "./mocks/replaceCabinetPayload.json";
 import ReactDOM from "react-dom";
 import LiteRenderer from "./LiteRenderer";
 import { Button } from "antd";
-import { LEFT, RIGHT, TOP, BOTTOM, EXTERNAL_EVENT_ADD_ITEM, EXTERNAL_EVENT_ADD_WALL, EXTERNAL_EVENT_TOGGLE_TO_3D, EXTERNAL_EVENT_TOGGLE_TO_2D, EXTERNAL_EVENT_TOGGLE_TO_ELEVATION, EXTERNAL_EVENT_MOVE_PAN, EXTERNAL_EVENT_NEW_PROJECT, EXTERNAL_EVENT_CHANGE_DOORSTYLE, EXTERNAL_EVENT_ADD_ROOM_SHAPE, EXTERNAL_EVENT_ZOOM_IN, EXTERNAL_EVENT_ZOOM_OUT, EXTERNAL_EVENT_UNDO, EXTERNAL_EVENT_REDO, EXTERNAL_EVENT_SET_MOLDING, EXTERNAL_EVENT_PROJECT_SETTING, PROJECT_SETTING_OPTION, EXTERNAL_EVENT_SYNC_SCENE, EXTERNAL_EVENT_UPDATE_ATTRIBUTE, BACK_DIST_ANG, ATT_ITEM_POS, ATT_ITEM_ROTATION, ATT_LINE_LENGTH, EXTERNAL_EVENT_UPDATE_PROPERTY, PROP_FLIP_DOOR_HANDLE, PROP_OPEN_DOORS, EXTERNAL_EVENT_LOAD_PROJECT, INTERNAL_EVENT_ITEMS_CATALOG, EXTERNAL_EVENT_ADD_HOLE, HOLE_NAMES, EXTERNAL_EVENT_CENTERING_2D, PROP_ALTITUDE, EXTERNAL_EVENT_DUPLICATE_ELEMENT, ELEMENT_ITEM, EXTERNAL_EVENT_DELETE_ELEMENT, PROP_RESIZE_WIDTH, EXTERNAL_EVENT_REPLACE_CABINET, EXTERNAL_EVENT_SET_FINISHING, FINISHING_TYPE } from "./constants";
+import { LEFT, RIGHT, TOP, BOTTOM, EXTERNAL_EVENT_ADD_ITEM, EXTERNAL_EVENT_ADD_WALL, EXTERNAL_EVENT_TOGGLE_TO_3D, EXTERNAL_EVENT_TOGGLE_TO_2D, EXTERNAL_EVENT_TOGGLE_TO_ELEVATION, EXTERNAL_EVENT_MOVE_PAN, EXTERNAL_EVENT_NEW_PROJECT, EXTERNAL_EVENT_CHANGE_DOORSTYLE, EXTERNAL_EVENT_ADD_ROOM_SHAPE, EXTERNAL_EVENT_ZOOM_IN, EXTERNAL_EVENT_ZOOM_OUT, EXTERNAL_EVENT_UNDO, EXTERNAL_EVENT_REDO, EXTERNAL_EVENT_SET_MOLDING, EXTERNAL_EVENT_PROJECT_SETTING, PROJECT_SETTING_OPTION, EXTERNAL_EVENT_SYNC_SCENE, EXTERNAL_EVENT_UPDATE_ATTRIBUTE, BACK_DIST_ANG, ATT_ITEM_POS, ATT_ITEM_ROTATION, ATT_LINE_LENGTH, EXTERNAL_EVENT_UPDATE_PROPERTY, PROP_FLIP_DOOR_HANDLE, PROP_OPEN_DOORS, EXTERNAL_EVENT_LOAD_PROJECT, INTERNAL_EVENT_ITEMS_CATALOG, EXTERNAL_EVENT_ADD_HOLE, HOLE_NAMES, EXTERNAL_EVENT_CENTERING_2D, PROP_ALTITUDE, EXTERNAL_EVENT_DUPLICATE_ELEMENT, ELEMENT_ITEM, EXTERNAL_EVENT_DELETE_ELEMENT, PROP_RESIZE_WIDTH, EXTERNAL_EVENT_REPLACE_CABINET, EXTERNAL_EVENT_SET_FINISHING, FINISHING_TYPE, EXTERNAL_EVENT_ROTATE_PAN } from "./constants";
 import { convert } from "./utils/convert-units-lite";
 
 // --- renderer props ---
@@ -214,6 +215,15 @@ function WorkSpace(props) {
       setExternalEvent(evt);
     }
   }, "Add B12 Cabinet"), /*#__PURE__*/React.createElement(Button, {
+    actionType: "danger",
+    onClick: function onClick() {
+      var evt = {
+        type: EXTERNAL_EVENT_ADD_ITEM,
+        payload: cabinetW0940Payload
+      };
+      setExternalEvent(evt);
+    }
+  }, "Add W0930 Cabinet"), /*#__PURE__*/React.createElement(Button, {
     actionType: "danger",
     onClick: function onClick() {
       var evt = {
@@ -679,7 +689,71 @@ function WorkSpace(props) {
       };
       setExternalEvent(evt);
     }
-  }, "random width")), /*#__PURE__*/React.createElement(LiteRenderer, {
+  }, "random width"), /*#__PURE__*/React.createElement(Button, {
+    actionType: "primary",
+    onClick: function onClick() {
+      var evt = {
+        type: EXTERNAL_EVENT_ROTATE_PAN,
+        payload: {
+          rotateType: RIGHT
+        }
+      };
+      setExternalEvent(evt);
+    }
+  }, /*#__PURE__*/React.createElement("img", {
+    src: "/assets/img/svg/bottombar/spin-right.svg"
+  })), /*#__PURE__*/React.createElement(Button, {
+    actionType: "primary",
+    onClick: function onClick() {
+      var evt = {
+        type: EXTERNAL_EVENT_ROTATE_PAN,
+        payload: {
+          rotateType: LEFT
+        }
+      };
+      setExternalEvent(evt);
+    }
+  }, /*#__PURE__*/React.createElement("img", {
+    src: "/assets/img/svg/bottombar/spin-left.svg"
+  })), /*#__PURE__*/React.createElement(Button, {
+    actionType: "primary",
+    onClick: function onClick() {
+      var evt = {
+        type: EXTERNAL_EVENT_ROTATE_PAN,
+        payload: {
+          rotateType: TOP
+        }
+      };
+      setExternalEvent(evt);
+    }
+  }, /*#__PURE__*/React.createElement("img", {
+    src: "/assets/img/svg/bottombar/spin-up.svg"
+  })), /*#__PURE__*/React.createElement(Button, {
+    actionType: "primary",
+    onClick: function onClick() {
+      var evt = {
+        type: EXTERNAL_EVENT_ROTATE_PAN,
+        payload: {
+          rotateType: BOTTOM
+        }
+      };
+      setExternalEvent(evt);
+    }
+  }, /*#__PURE__*/React.createElement("img", {
+    src: "/assets/img/svg/bottombar/spin-down.svg"
+  })), /*#__PURE__*/React.createElement(Button, {
+    actionType: "danger",
+    onClick: function onClick() {
+      var evt = {
+        type: EXTERNAL_EVENT_PROJECT_SETTING,
+        payload: {
+          option: PROJECT_SETTING_OPTION.CHANGE_MEASUREMENT_UNIT,
+          value: "cm"
+        }
+      };
+      setExternalEvent(evt);
+    }
+  }, "Setting-MeasurementUnit-'cm'")), /*#__PURE__*/React.createElement(LiteRenderer, {
     width: props.width,
     height: props.height,
     configData: mockProps.configData,

package/es/utils/geometry.js

@@ -2481,7 +2481,7 @@ function getAllItems2(curItem, layer) {
       height: height
     };
     if (curItem.get('id') !== item.id) {
-      var detectObjectsAtSameAltitudeFlag = item.layoutpos === 'Base' ? item.properties.getIn(['altitude', '_length']) <= curItem.get('properties').getIn(['altitude', '_length']) + tempHeight.get('_length') : item.properties.getIn(['altitude', '_length']) + item.properties.getIn(['height', '_length']) >= curItem.get('properties').getIn(['altitude', '_length']);
+      var detectObjectsAtSameAltitudeFlag = curItem.get('layoutpos') === 'Base' ? item.properties.getIn(['altitude', '_length']) <= curItem.get('properties').getIn(['altitude', '_length']) + tempHeight.get('_length') : item.properties.getIn(['altitude', '_length']) + item.properties.getIn(['height', '_length']) >= curItem.get('properties').getIn(['altitude', '_length']);
       if (detectObjectsAtSameAltitudeFlag) {
         var x = val.pos.x;
         var y = val.pos.y;
@@ -2531,9 +2531,9 @@ export function calcDistancesFromItemToWalls(curItem, layer) {
     height = convert(curItem.info.sizeinfo.depth).from('in').to('cm');
   }
   var center_h = 3 * height / 8;
-  var center_x = x;
+  var center_x = x; // middle of front line of cabinet rect
   var center_y = y;
-  var center_x1 = x - center_h * Math.sin(rotRad);
+  var center_x1 = x - center_h * Math.sin(rotRad); // center point of cabinet rect
   var center_y1 = y + center_h * Math.cos(rotRad);
   var PointArray = [];
   var itemInfo = {
@@ -2552,20 +2552,33 @@ export function calcDistancesFromItemToWalls(curItem, layer) {
   var allLines = getAllLines(layer);
   var allLineRects = buildRectFromLines(layer, allLines);
   var allRect = allLineRects.concat(allItemRect.others);
-  curiteminfo.rectCenterPoint.forEach(function (centerpoint) {
-    var comparelength = [];
+  var _loop = function _loop(i) {
+    // [rectCenterPoint] has four middle points of cabinet rect edges
+    var centerpoint = curiteminfo.rectCenterPoint[i];
+    var comparelength = []; // distance array from rectCenterPoint[i] to other lines(walls, other cabinet rect edges)
     var a;
-    var RectLineFuction;
+    var RectLineFuction; // normal line of cabinet rect edge
     if (centerpoint[1] === 180 || centerpoint[1] === 0) RectLineFuction = linePassingThroughTwoPoints(centerpoint[0].x, centerpoint[0].y, center_x1, center_y1);else RectLineFuction = linePassingThroughTwoPoints(centerpoint[0].x, centerpoint[0].y, center_x, center_y);
     allRect.forEach(function (linerect) {
+      // calc distance to all other lines
       var p0 = clone_point(linerect.rect[2]);
       var p1 = clone_point(linerect.rect[3]);
-      var lineFunction = {};
+      var lineFunction = {}; // other line function
       if (p0.x !== p1.x || p0.y !== p1.y) lineFunction = linePassingThroughTwoPoints(p0.x, p0.y, p1.x, p1.y);
+      // intersection between normal line and other line
       var coordinatePoint = twoLinesIntersection(lineFunction.a, lineFunction.b, lineFunction.c, RectLineFuction.a, RectLineFuction.b, RectLineFuction.c);
       if (coordinatePoint !== undefined) {
-        if (pointsDistance(p0.x, p0.y, p1.x, p1.y) > pointsDistance(p0.x, p0.y, coordinatePoint.x, coordinatePoint.y) && pointsDistance(p0.x, p0.y, p1.x, p1.y) > pointsDistance(p1.x, p1.y, coordinatePoint.x, coordinatePoint.y)) {
-          if (pointsDistance(coordinatePoint.x, coordinatePoint.y, center_x, center_y) > pointsDistance(centerpoint[0].x, centerpoint[0].y, coordinatePoint.x, coordinatePoint.y)) {
+        if (
+        // intersection point is on the other line
+        pointsDistance(p0.x, p0.y, p1.x, p1.y) > pointsDistance(p0.x, p0.y, coordinatePoint.x, coordinatePoint.y) && pointsDistance(p0.x, p0.y, p1.x, p1.y) > pointsDistance(p1.x, p1.y, coordinatePoint.x, coordinatePoint.y)) {
+          // check the intersection point is outside direction of edge
+          var isOutside = true;
+          for (var j = 0; j < curiteminfo.rectCenterPoint.length; j++) {
+            if (j === i) continue;
+            var otherCenterPoint = curiteminfo.rectCenterPoint[j];
+            if (isPointOnLineSegment(centerpoint[0].x, centerpoint[0].y, coordinatePoint.x, coordinatePoint.y, otherCenterPoint[0].x, otherCenterPoint[0].y)) isOutside = false;
+          }
+          if (isOutside && pointsDistance(coordinatePoint.x, coordinatePoint.y, center_x, center_y) > pointsDistance(centerpoint[0].x, centerpoint[0].y, coordinatePoint.x, coordinatePoint.y)) {
             comparelength.push(pointsDistance(centerpoint[0].x, centerpoint[0].y, coordinatePoint.x, coordinatePoint.y));
             a = Math.min.apply(null, comparelength);
           }
@@ -2573,7 +2586,10 @@ export function calcDistancesFromItemToWalls(curItem, layer) {
       }
     });
     PointArray.push([a, centerpoint[1]]);
-  });
+  };
+  for (var i = 0; i < curiteminfo.rectCenterPoint.length; i++) {
+    _loop(i);
+  }
   PointArray.forEach(function (pointElement, index) {
     if (pointElement[0] == undefined) PointArray[index][0] = 0;
   });