kitchen-simulator 3.0.3 → 3.1.0-alpha.13

package/es/class/item.js

@@ -13,6 +13,7 @@ import { debugUtil } from "../utils/helper";
 import { isUndefined } from 'util';
 import { hasMoldingLayout } from "../utils/molding";
 import { getInstallationSuffix, isWarningItem } from "../components/viewer2d/utils";
+import { historyPush } from "../utils/history";
 var allItemRect;
 var allItemSnap;
 var allLines;
@@ -1148,6 +1149,7 @@ var Item = /*#__PURE__*/function () {
       for (var x in keys) {
         tmp[keys[x]] = doorStyle.doorStyles[keys[x]];
       }
+      doorStyle.cds = itemCDS;
       state = state.setIn(['scene', 'layers', state.scene.selectedLayer, 'doorStyle'], doorStyle);
       state = state.merge({
         doorStyle: doorStyle
@@ -1540,6 +1542,9 @@ var Item = /*#__PURE__*/function () {
           });
         }
       }
+      state = state.merge({
+        sceneHistory: historyPush(state.sceneHistory, state.scene)
+      });
       return {
         updatedState: state
       };
@@ -1662,6 +1667,9 @@ var Item = /*#__PURE__*/function () {
           updateSelectItemMolding();
         }
       }
+      state = state.merge({
+        sceneHistory: historyPush(state.sceneHistory, state.scene)
+      });
       return {
         updatedState: state
       };

package/es/class/line.js

@@ -5,8 +5,9 @@ import { fromJS, List, Map } from 'immutable';
 import { Group, Hole, Layer, Vertex } from "./export";
 import { GeometryUtils, history, IDBroker, NameGenerator, SnapSceneUtils, SnapUtils } from "../utils/export";
 import * as Three from 'three';
-import { END_DRAGGING_LINE, END_DRAGGING_VERTEX, END_DRAWING_LINE, EPSILON, MIN_ANGLE_DISALLOW_DRAW_WALL, MODE_DRAGGING_LINE, MODE_DRAWING_LINE, MODE_IDLE, MODE_WAITING_DRAWING_LINE, UNIT_ANGLE } from "../constants";
+import { END_DRAGGING_LINE, END_DRAGGING_VERTEX, END_DRAWING_LINE, EPSILON, INTERNAL_EVENT_START_DRAW_WALL, MIN_ANGLE_DISALLOW_DRAW_WALL, MODE_DRAGGING_LINE, MODE_DRAWING_LINE, MODE_IDLE, MODE_WAITING_DRAWING_LINE, UNIT_ANGLE } from "../constants";
 import { isEmpty } from "../utils/helper";
+import { convert } from "../utils/convert-units-lite";
 var timeGlobal = 0;
 var TimeRecorder = /*#__PURE__*/function () {
   function TimeRecorder(name) {
@@ -426,7 +427,7 @@ var Line = /*#__PURE__*/function () {
     }
   }, {
     key: "beginDrawingLine",
-    value: function beginDrawingLine(state, layerID, x, y) {
+    value: function beginDrawingLine(state, layerID, x, y, onInternalEvent) {
       // if end drawing by created area
       if (state.mode == MODE_IDLE) {
         return {
@@ -479,6 +480,17 @@ var Line = /*#__PURE__*/function () {
         activeSnapElement: snap ? snap.snap : null,
         drawingSupport: drawingSupport
       });
+      var layer = state.getIn(['scene', 'layers', layerID]);
+      var payload = line.toJS();
+      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(layer.unit);
+      payload.length = _length;
+      if (onInternalEvent) onInternalEvent({
+        type: INTERNAL_EVENT_START_DRAW_WALL,
+        value: payload
+      });
       return {
         updatedState: state
       };

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
     };
@@ -277,10 +293,18 @@ export default function Item(_ref, _ref2) {
   var cat = catalog.elements[catid];
   PointArray.forEach(function (pointElement, index) {
     if (pointElement[0] == undefined) PointArray[index][0] = 0;
-    if (pointElement[1] === -90 && cat.info.is_corner !== 1) {
-      PointArray[index][0] -= 4;
-    }
+    // if (pointElement[1] === -90 && cat.info.is_corner !== 1) {
+    //   PointArray[index][0] -= 4;
+    // }
+  });
+  var cnt = 0;
+  PointArray.forEach(function (pointElement) {
+    if (pointElement[0] == 0) cnt++;
   });
+  if (cnt == 4 || cnt == 3) {
+    PointArray[0][0] = 100;
+    PointArray[1][0] = 100;
+  }
   if (Array.isArray(PointArray)) {
     itemsActions.storeDistArray(layerID, id, 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

@@ -973,7 +973,7 @@ export default function Viewer2D(_ref, _ref2) {
               id: "ruler_numberInput",
               style: {
                 position: 'absolute',
-                left: bbox.left - (150 - bbox.width) / 2,
+                left: bbox.left - (200 - bbox.width) / 2,
                 top: bbox.top - (50 - bbox.height) / 2,
                 zIndex: 1000
               }
@@ -1005,7 +1005,7 @@ export default function Viewer2D(_ref, _ref2) {
               id: "ruler_numberInput",
               style: {
                 position: 'absolute',
-                left: bbox.left - (150 - bbox.width) / 2,
+                left: bbox.left - (200 - bbox.width) / 2,
                 top: bbox.top - (50 - bbox.height) / 2,
                 zIndex: 1000
               }
@@ -1038,7 +1038,7 @@ export default function Viewer2D(_ref, _ref2) {
               id: "ruler_numberInput",
               style: {
                 position: 'absolute',
-                left: bbox.left - (150 - bbox.width) / 2,
+                left: bbox.left - (200 - bbox.width) / 2,
                 top: bbox.top - (50 - bbox.height) / 2,
                 zIndex: 1000
               }
@@ -1071,7 +1071,7 @@ export default function Viewer2D(_ref, _ref2) {
               id: "ruler_numberInput",
               style: {
                 position: 'absolute',
-                left: bbox.left - (150 - bbox.width) / 2,
+                left: bbox.left - (200 - bbox.width) / 2,
                 top: bbox.top - (50 - bbox.height) / 2,
                 zIndex: 1000
               }
@@ -1104,7 +1104,7 @@ export default function Viewer2D(_ref, _ref2) {
               id: "ruler_numberInput",
               style: {
                 position: 'absolute',
-                left: bbox.left - (150 - bbox.width) / 2,
+                left: bbox.left - (200 - bbox.width) / 2,
                 top: bbox.top - (50 - bbox.height) / 2,
                 zIndex: 1000
               }
@@ -1137,7 +1137,7 @@ export default function Viewer2D(_ref, _ref2) {
               id: "ruler_numberInput",
               style: {
                 position: 'absolute',
-                left: bbox.left - (150 - bbox.width) / 2,
+                left: bbox.left - (200 - bbox.width) / 2,
                 top: bbox.top - (50 - bbox.height) / 2,
                 zIndex: 1000
               }
@@ -1169,7 +1169,7 @@ export default function Viewer2D(_ref, _ref2) {
               id: "ruler_numberInput",
               style: {
                 position: 'absolute',
-                left: bbox.left - (150 - bbox.width) / 2,
+                left: bbox.left - (200 - bbox.width) / 2,
                 top: bbox.top - (50 - bbox.height) / 2,
                 zIndex: 1000
               }
@@ -1199,7 +1199,7 @@ export default function Viewer2D(_ref, _ref2) {
         break;
       case constants.MODE_WAITING_DRAWING_LINE:
         setdrawStart(true);
-        linesActions.beginDrawingLine(layerID, x, y, state.snapMask);
+        linesActions.beginDrawingLine(layerID, x, y, state.snapMask, onInternalEvent);
         break;
       case constants.MODE_DRAWING_LINE:
         // Blocked 90 degree snap.
@@ -1213,7 +1213,7 @@ export default function Viewer2D(_ref, _ref2) {
         getConnectedLines();
         var endInfor = getEndPoint(vertices, x, y, 'END_DRAWIN_LINE');
         linesActions.endDrawingLine(endInfor.x, endInfor.y, state.snapMask);
-        linesActions.beginDrawingLine(layerID, endInfor.x, endInfor.y, state.snapMask);
+        linesActions.beginDrawingLine(layerID, endInfor.x, endInfor.y, state.snapMask, onInternalEvent);
         break;
       case constants.MODE_DRAWING_HOLE:
         holesActions.endDrawingHole(layerID, x, y);
@@ -1258,12 +1258,14 @@ 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') {
           // check this cabinet has warning box
           payload.isWarning = isWarningItem(_currentObject);
+          // check this item is available molding
+          payload.isMoldingAvailable = MoldingUtils.isEnableItemForMolding(layer, _currentObject);
           // check this item is snapped to wall
           payload.isAttachedWall = MoldingUtils.isAttachedWall(layer, _currentObject);
         }

package/es/components/viewer3d/viewer3d.js

@@ -1186,13 +1186,22 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
       };
       var sendInternalEvent = function sendInternalEvent(evtType, evtElement) {
         var pointArray = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
-        if (!isEmpty(evtType)) {
+        if (!isEmpty(evtType) && !isEmpty(evtElement)) {
           var _this2$props$onIntern, _this2$props;
           var payload = evtElement === null || evtElement === void 0 ? void 0 : evtElement.toJS();
-          if ((evtElement === null || evtElement === void 0 ? void 0 : evtElement.prototype) === 'items') {
+          if ((evtElement === null || evtElement === void 0 ? void 0 : evtElement.prototype) === 'lines') {
+            // caculating length of selected line//
+            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(layer.unit);
+            payload.length = _length;
+            //////////////////////////////////////
+          } else if ((evtElement === null || evtElement === void 0 ? void 0 : evtElement.prototype) === 'items') {
             // check this cabinet has warning box
             payload.isWarning = isWarningItem(evtElement);
-            // check this item is snapped to wall
+            // check this item is available molding
+            payload.isMoldingAvailable = MoldingUtils.isEnableItemForMolding(layer, evtElement); // check this item is snapped to wall
             payload.isAttachedWall = MoldingUtils.isAttachedWall(layer, evtElement);
             // update distArray
             if (pointArray) payload.distArray = pointArray;
@@ -1354,11 +1363,6 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
               if (selectedFlag || toolIntersects.length > 0 && !isElevationView(mode)) {
                 cameraControls.mouseButtons.left = CameraControls.ACTION.NONE;
                 selectedFlag = false;
-              } else {
-                isSelected = false;
-                _this2.context.projectActions.unselectAll();
-                scene3D.remove(toolObj);
-                _this2.context.itemsActions.removeReplacingSupport();
               }
             }
           } else {
@@ -1411,11 +1415,18 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
         }
         switch (_this2.props.state.mode) {
           case MODE_DRAGGING_ITEM_3D:
+          case MODE_DRAGGING_HOLE_3D:
             internalType = INTERNAL_EVENT_DRAG_ELEMENT;
             break;
           case MODE_ROTATING_ITEM_3D:
             internalType = INTERNAL_EVENT_ROTATE_ELEMENT;
             break;
+          case MODE_DRAWING_HOLE_3D:
+            internalType = INTERNAL_EVENT_DRAW_ELEMENT;
+            break;
+          case MODE_IDLE_3D:
+            internalType = INTERNAL_EVENT_SELECT_ELEMENT;
+            break;
         }
         if (_this2.props.state.mode == MODE_DRAGGING_ITEM_3D) {
           _this2.context.itemsActions.endDraggingItem3D();
@@ -1449,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;
@@ -1477,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) {
@@ -1500,36 +1525,17 @@ 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
                   });
                   // showItemButtons(layer.getIn(['items', selectedObject.itemID]), currentObject, event, camera, this.renderer);
-                  var pointArray = [],
-                    cnt = 0;
-                  pointArray.push([fVLine[0].userData.distance, 90]);
-                  pointArray.push([fVLine[1].userData.distance, -90]);
-                  pointArray.push([fVLine[2].userData.distance, 180]);
-                  pointArray.push([fVLine[3].userData.distance, 0]);
-                  pointArray.forEach(function (pointElement, index) {
-                    if (pointElement[0] == undefined) pointArray[index][0] = 0;
-                  });
-                  pointArray.forEach(function (pointElement) {
-                    if (pointElement[0] == 0) cnt++;
-                  });
-                  if (cnt == 4 || cnt == 3) {
-                    pointArray[0][0] = 100;
-                    pointArray[1][0] = 100;
-                  }
+                  var pointArray = [];
+                  // pointArray.push([fVLine[0].userData.distance, 90]);
+                  // pointArray.push([fVLine[1].userData.distance, -90]);
+                  // pointArray.push([fVLine[2].userData.distance, 180]);
+                  // pointArray.push([fVLine[3].userData.distance, 0]);
+                  pointArray = GeometryUtils.calcDistancesFromItemToWalls(selectedElement, layer).PointArray;
                   actions.itemsActions.storeDistArray(layer.id, selectedObject.itemID, pointArray);
                   internalType = internalType ? internalType : INTERNAL_EVENT_SELECT_ELEMENT;
                   sendInternalEvent(internalType, selectedElement, pointArray);
@@ -1540,16 +1546,17 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
                   var elementPrototype = null;
                   switch (true) {
                     case 'holeID' in selectedObject:
-                    case 'lineID' in selectedObject:
+                      elementID = selectedObject.holeID;
+                      elementPrototype = 'holes';
                       if (_this2.props.state.mode === MODE_DRAGGING_HOLE_3D) {
                         actions.holesActions.endDraggingHole3D(sPoint.x, sPoint.y);
-                        internalType = INTERNAL_EVENT_SELECT_ELEMENT;
-                        elementID = selectedObject.holeID;
-                        elementPrototype = 'holes';
                       }
                       break;
+                    case 'lineID' in selectedObject:
+                      elementID = selectedObject.lineID;
+                      elementPrototype = 'lines';
+                      break;
                     case 'areaID' in selectedObject:
-                      internalType = INTERNAL_EVENT_SELECT_ELEMENT;
                       elementID = selectedObject.areaID;
                       elementPrototype = 'areas';
                       break;
@@ -1561,15 +1568,20 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
                 isSelected = false;
               }
             } 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 (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;
+                }
               }
             }
             bMove = false;
@@ -1590,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 _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.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
               });
@@ -1638,7 +1630,7 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
                 _item3D.position.z = targetPoint.z;
                 _item3D.visible = true;
               }
-            }
+            } else {}
             if (bMoveUP) {
               bMoveUP = false;
             }
@@ -2085,7 +2077,7 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
         if (minDis < snapDelta && !snapFlag) {
           _this2.snap(snapObj, layer);
           snapFlag = true;
-          getDistances(layer, true);
+          getDistances(layer);
           var _i13 = 0;
           for (_i13 = 0; _i13 < fVLine.length; _i13++) {
             if (fVLine[_i13].userData.distance < snapDelta) {

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';
@@ -747,6 +750,7 @@ export var INTERNAL_EVENT_DRAG_ELEMENT = 'INTERNAL_EVENT_DRAG_ELEMENT';
 export var INTERNAL_EVENT_DRAW_ELEMENT = 'INTERNAL_EVENT_DRAW_ELEMENT';
 export var INTERNAL_EVENT_ROTATE_ELEMENT = 'INTERNAL_EVENT_ROTATE_ELEMENT';
 export var INTERNAL_EVENT_REPLACE_CABINET = 'INTERNAL_EVENT_REPLACE_CABINET';
+export var INTERNAL_EVENT_START_DRAW_WALL = 'INTERNAL_EVENT_START_DRAW_WALL';
 
 // room shape type
 export var ROOM_SHAPE_TYPE = {