kitchen-simulator 1.0.0-alin.17 → 1.0.0-alin.20

package/es/LiteKitchenConfigurator.js

@@ -475,7 +475,7 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
 
       // handle external events
       if (this.props.externalEvent !== externalEvent) {
-        handleExternalEvent(externalEvent, this.props);
+        handleExternalEvent(nextProps);
       }
       var plannerState = stateExtractor(state);
       var catalogReady = plannerState.getIn(['catalog', 'ready']);

package/es/actions/items-actions.js

@@ -223,11 +223,10 @@ export function updateItemsAltitude(layerID, itemID, value) {
     value: value
   };
 }
-export function setDoorStyle(doorStyle, pathes, isAll) {
+export function setDoorStyle(doorStyle, isAll) {
   return {
     type: SET_DOOR_STYLE,
     doorStyle: doorStyle,
-    pathes: pathes,
     isAll: isAll
   };
 }

package/es/class/item.js

@@ -1164,7 +1164,7 @@ var Item = /*#__PURE__*/function () {
     }
   }, {
     key: "setDoorStyle",
-    value: function setDoorStyle(state, doorStyle, pathes, isAll) {
+    value: function setDoorStyle(state, doorStyle, isAll) {
       var _this2 = this;
       var keys = Object.keys(doorStyle.doorStyles);
       keys = keys.filter(function (elem) {

package/es/class/project.js

@@ -478,6 +478,10 @@ var Project = /*#__PURE__*/function () {
         };
       }
       var mode;
+      var isLineAction = false;
+      if (state.mode.includes('LINE')) {
+        isLineAction = true;
+      }
       if (state.mode == MODE_DRAWING_ITEM_3D) {
         mode = MODE_IDLE_3D;
         if (state.drawingSupport.has('currentID')) state = Layer.removeElement(state, state.scene.selectedLayer, 'items', state.drawingSupport.get('currentID')).updatedState;
@@ -520,6 +524,9 @@ var Project = /*#__PURE__*/function () {
         draggingSupport: new Map(),
         rotatingSupport: new Map()
       });
+      if (isLineAction) {
+        state = Line.applyWallChanges(state, END_DRAWING_LINE).updatedState;
+      }
       return {
         updatedState: state
       };
@@ -604,7 +611,7 @@ var Project = /*#__PURE__*/function () {
           updatedState: state
         };
       } catch (error) {
-        console.log('initCatalogError', error);
+        console.log('addElementToCatalogError', error);
         return {
           updatedState: state
         };

package/es/components/viewer2d/item.js

@@ -29,7 +29,8 @@ export default function Item(_ref, _ref2) {
   var itemsActions = _ref2.itemsActions;
   var x = item.x,
     y = item.y,
-    rotation = item.rotation;
+    rotation = item.rotation,
+    id = item.id;
   var showBaseCabinetMeasure = scene.showBaseCabinetMeasure,
     showWallCabinetMeasure = scene.showWallCabinetMeasure;
   var vertices = layer.vertices;
@@ -281,6 +282,9 @@ export default function Item(_ref, _ref2) {
   PointArray.forEach(function (pointElement, index) {
     if (pointElement[0] == undefined) PointArray[index][0] = 0;
   });
+  if (Array.isArray(PointArray)) {
+    itemsActions.storeDistArray(layerID, id, PointArray);
+  }
   var renderedRuler = [];
   var ep = 0.1;
   if (item.selected) {

package/es/components/viewer2d/layer.js

@@ -137,7 +137,7 @@ export default function Layer(_ref) {
       unit: unit,
       catalog: catalog
     });
-  }), lineData, itemData, itemWall, itemSelected, mode !== MODE_DRAWING_LINE && vertices.valueSeq().filter(function (v) {
+  }), itemData, itemWall, lineData, itemSelected, mode !== MODE_DRAWING_LINE && vertices.valueSeq().filter(function (v) {
     return v.selected;
   }).map(function (vertex) {
     return /*#__PURE__*/React.createElement(Vertex, {

package/es/components/viewer2d/line.js

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { GeometryUtils } from "../../utils/export";
 import Ruler from "./ruler";
-import { BASE_CABINET_LAYOUTPOS, LINE_THICKNESS, WALL_CABINET_LAYOUTPOS } from "../../constants";
+import { BASE_CABINET_LAYOUTPOS, LINE_THICKNESS, MODE_DRAGGING_LINE, MODE_DRAWING_LINE, WALL_CABINET_LAYOUTPOS, MAX_ANGLE_SCALE } from "../../constants";
 import * as Three from 'three';
 import { isEmpty } from "./utils";
 var STYLE = {
@@ -21,7 +21,7 @@ var STYLE_TEXT = {
   textAnchor: 'middle',
   fontSize: '7px',
   fontWeight: 'middle',
-  fontFamily: "'Microsoft YaHei UI', Courier, monospace"
+  fontFamily: "'Courier New', Courier, monospace"
 };
 export function compareVertices(v0, v1) {
   return v0.x === v1.x ? v0.y - v1.y : v0.x - v1.x;
@@ -710,22 +710,32 @@ export default function Line(_ref) {
     "data-layer": layer.id,
     "data-length": length
   }, showWallLengthMeasure ? renderedRuler : null), line.selected && angleVertices.map(function (vertex, index) {
+    var _relateLineLengthArra2;
     var lineGroup = vertex[0].lines;
     var angles = [];
     var thickness = [];
     var vectories = [];
+    var relateLineLengthArray = [];
+
     // get the vector of lines
     lineGroup.forEach(function (line) {
+      var _relateLineLengthArra;
       line = layer.lines.get(line);
       var vertex0 = layer.vertices.get(line.vertices.get(0));
       var vertex1 = layer.vertices.get(line.vertices.get(1));
       var vec = vertex0 === vertex[0] ? new Three.Vector2(vertex1.x - vertex0.x, vertex1.y - vertex0.y) : new Three.Vector2(vertex0.x - vertex1.x, vertex0.y - vertex1.y);
+      (_relateLineLengthArra = relateLineLengthArray) === null || _relateLineLengthArra === void 0 || _relateLineLengthArra.push(GeometryUtils.verticesDistance(vertex0, vertex1));
       var angle = vec.angle();
       var thick = 15;
       angles.push(angle);
       thickness.push(thick);
       vectories.push(vec.normalize());
     });
+    relateLineLengthArray = (_relateLineLengthArra2 = relateLineLengthArray) === null || _relateLineLengthArra2 === void 0 ? void 0 : _relateLineLengthArra2.sort(function (a, b) {
+      return a - b;
+    });
+    var minLineLength = relateLineLengthArray[0] < MAX_ANGLE_SCALE * 2 ? relateLineLengthArray[0] / 2 //  scale down to half of the smallest adjacent surface
+    : MAX_ANGLE_SCALE;
 
     // calculate the angle between two lines
     var center = new Three.Vector2(vertex[0].x, vertex[0].y);
@@ -744,16 +754,15 @@ export default function Line(_ref) {
     var rotDir = vec1.cross(vec2) > 0; // true: rotate CCW, false: rotate CW
 
     // Angle Text Position
-
     var angleTextO = center.clone();
-    var textTranslation = vec1.clone().add(vec2).normalize().multiplyScalar(25);
+    var textTranslation = vec1.clone().add(vec2).normalize().multiplyScalar(minLineLength * 2 / 3);
     angleTextO.add(textTranslation);
-    angleTextO.y -= 5; // half the height of text `angle`
-
+    angleTextO.y -= minLineLength / 10; // half the height of text `angle`
+    angleTextO.x += minLineLength / 10;
     var tx = 0;
     var ty = 0;
-    vec = vec.multiplyScalar(35);
-    vec1 = vec1.multiplyScalar(35);
+    vec = vec.multiplyScalar(minLineLength);
+    vec1 = vec1.multiplyScalar(minLineLength);
     var cen1 = center.clone(),
       cen2 = center.clone();
     center = center.add(vec);
@@ -766,7 +775,7 @@ export default function Line(_ref) {
     // Angle SVG Path
     lines.push(/*#__PURE__*/React.createElement("path", {
       style: STYLE_ANGLE,
-      d: "\n          M ".concat(vertex[0].x, ",").concat(vertex[0].y, "           L ").concat(pos1.x, ",").concat(pos1.y, "           A 30,30 ").concat(angle, " 0 ").concat(t > 0 ? 1 : 0, " ").concat(pos2.x, ",").concat(pos2.y, " z\n        ")
+      d: "\n          M ".concat(vertex[0].x, ",").concat(vertex[0].y, "           L ").concat(pos1.x, ",").concat(pos1.y, "           A ").concat(minLineLength, " ").concat(minLineLength, " ").concat(angle, " 0 ").concat(t > 0 ? 1 : 0, " ").concat(pos2.x, ",").concat(pos2.y, " z\n        ")
     }));
     var length = angle;
     // draw angle and angle text
@@ -780,15 +789,9 @@ export default function Line(_ref) {
       "data-id": [vertex[0].id, vertex[1].id, rotDir],
       "data-length": length
     }, lines, /*#__PURE__*/React.createElement("text", {
-      transform: "translate(".concat(angleTextO.x, ", ").concat(angleTextO.y, ") scale(1.5, -1.5)"),
+      transform: "translate(".concat(angleTextO.x, ", ").concat(angleTextO.y, ") scale(").concat(minLineLength / 20, ", ").concat(-minLineLength / 20, ")"),
       style: STYLE_TEXT
-    }, angle), /*#__PURE__*/React.createElement("circle", {
-      transform: "translate(".concat(angleTextO.x, ", ").concat(angleTextO.y, ") translate(10, 9)"),
-      fill: "transparent",
-      stroke: "rgb(77, 77, 77)",
-      strokeWidth: 1,
-      r: 2
-    }));
+    }, angle + '° '));
   }), showWindowDoorMeasure ? renderedAllRuler : null, showBaseCabinetMeasure ? baseRuler : null, showWallCabinetMeasure ? wallRuler : null, /*#__PURE__*/React.createElement("g", {
     "data-element-root": true,
     "data-prototype": line.prototype,

package/es/components/viewer2d/viewer2d.js

@@ -1,4 +1,3 @@
-import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 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; }
@@ -536,48 +535,18 @@ export default function Viewer2D(_ref, _ref2) {
       rectCenterPoint: [[point(mx, my), 180], [point(m1x, m1y), -90], [point(m2x, m2y), 0], [point(m3x, m3y), 90]]
     };
   };
-  var calcDistanceArray = function calcDistanceArray() {
-    var items = layer === null || layer === void 0 ? void 0 : layer.get('items');
-    if (!items) return;
-    items.forEach(function (item) {
-      if ((item === null || item === void 0 ? void 0 : item.selected) === true) {
-        var x = item.x,
-          y = item.y,
-          rotation = item.rotation,
-          id = item.id;
-        if (x == null || y == null) return;
-        var val = {
-          pos: {
-            x: x,
-            y: y
-          },
-          rotRad: rotation / 180 * Math.PI
-        };
-        var _width = getProperties(item, 'width');
-        var depth = getProperties(item, 'depth');
-        val.size = {
-          width: _width,
-          height: depth
-        };
-
-        // collect geometry
-        var _allLines = GeometryUtils.getAllLines(layer) || [];
-        var _allLineRects = GeometryUtils.buildRectFromLines(layer, _allLines) || [];
-        var _allItemRect = GeometryUtils.getAllItems(scene, catalog, _allLineRects) || {
-          others: []
-        };
-        var _allRect = [].concat(_toConsumableArray(_allItemRect.others || []), _toConsumableArray(_allLineRects));
-
-        // current item
-        var curItemInfo = getCalcRectFromItem(val);
-        var pointArray = getDistant(x, y, val.rotRad, curItemInfo, _allRect);
-
-        // store results safely
-        if (Array.isArray(pointArray)) {
-          itemsActions.storeDistArray(layerID, id, pointArray);
-        }
-      }
-    });
+  var getConnectedLines = function getConnectedLines() {
+    var _state$getIn;
+    var vertices = state.getIn(['scene', 'layers', layerID, 'vertices']).toJS();
+    var lines = state.getIn(['scene', 'layers', layerID, 'lines']).toJS();
+    var lineID = state.getIn(['scene', 'layers', layerID, 'selected', 'lines']).first();
+    var drawingLine = (_state$getIn = state.getIn(['scene', 'layers', layerID, 'lines', lineID])) === null || _state$getIn === void 0 ? void 0 : _state$getIn.toJS();
+    // get the lines that have same points with drawing line.
+    if (!isEmpty(drawingLine)) {
+      var tlines = [];
+      getRelatedLines(tlines, drawingLine, vertices, lines);
+      setRelatedLines(tlines);
+    }
   };
   var onMouseMove = function onMouseMove(viewerEvent) {
     //workaround that allow imageful component to work
@@ -627,7 +596,6 @@ export default function Viewer2D(_ref, _ref2) {
         holesActions.updateDrawingHole(layerID, x, y);
         break;
       case constants.MODE_DRAWING_ITEM:
-        calcDistanceArray();
         var _layer = scene.layers.get(layerID);
         var flag = false;
         _layer.items.some(function (item) {
@@ -713,11 +681,11 @@ export default function Viewer2D(_ref, _ref2) {
         break;
       case constants.MODE_DRAGGING_VERTEX:
         var vertices = state.getIn(['scene', 'layers', layerID, 'vertices']).toJS();
+        getConnectedLines();
         var result = getEndPoint(vertices, x, y, 'DRAGGING_VERTEX');
         verticesActions.updateDraggingVertex(result.x, result.y, state.snapMask);
         break;
       case constants.MODE_DRAGGING_ITEM:
-        calcDistanceArray();
         prepareSnap();
         var _GeometryUtils$calcSn2 = GeometryUtils.calcSnap(allItemRect, allItemSnap, allLineRects, allLineSnap, allRect, x, y, allArea),
           nx = _GeometryUtils$calcSn2.nx,
@@ -889,10 +857,10 @@ export default function Viewer2D(_ref, _ref2) {
               projectActions.setMode(_mode);
               break;
             } else {
-              var _tlines = [];
-              var _drawingLine = state.getIn(['scene', 'layers', layerID, 'lines', elementData.id]).toJS();
-              getRelatedLines(_tlines, _drawingLine, vertices, lines);
-              setRelatedLines(_tlines);
+              var tlines = [];
+              var drawingLine = state.getIn(['scene', 'layers', layerID, 'lines', elementData.id]).toJS();
+              getRelatedLines(tlines, drawingLine, vertices, lines);
+              setRelatedLines(tlines);
               linesActions.selectLine(elementData.layer, elementData.id);
               break;
             }
@@ -1178,12 +1146,7 @@ export default function Viewer2D(_ref, _ref2) {
         // if (dx > dy) y = prevVertex.y
         // else x = prevVertex.x;
         setdrawStart(true);
-        var lineID = state.getIn(['scene', 'layers', layerID, 'selected', 'lines']).first();
-        var drawingLine = state.getIn(['scene', 'layers', layerID, 'lines', lineID]).toJS();
-        // get the lines that have same points with drawing line.
-        var tlines = [];
-        getRelatedLines(tlines, drawingLine, vertices, lines);
-        setRelatedLines(tlines);
+        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);
@@ -1198,6 +1161,7 @@ export default function Viewer2D(_ref, _ref2) {
         linesActions.endDraggingLine(x, y, relatedLines, state.snapMask);
         break;
       case constants.MODE_DRAGGING_VERTEX:
+        getConnectedLines();
         var result = getEndPoint(vertices, x, y, 'DRAGGING_VERTEX');
         verticesActions.endDraggingVertex(result.x, result.y, state.snapMask);
         break;

package/es/constants.js

@@ -579,6 +579,7 @@ export var ANIMATE_OBJECT_OPEN_DOOR_ROTATION_UNIT = 0.1;
 export var DIFFERENT_VALUES_PATH_LENGTH = 5;
 export var MIN_ANGLE_DISALLOW_DRAW_WALL = 45;
 export var UNIT_ANGLE = 5;
+export var MAX_ANGLE_SCALE = 30;
 export var HDR_URLS = ['px.hdr', 'nx.hdr', 'py.hdr', 'ny.hdr', 'pz.hdr', 'nz.hdr'];
 export var SUBMIT_REQUEST_ASSIST = 'submit';
 export var SUBMIT_ADD_CART = 'addCart';
@@ -650,4 +651,9 @@ export var EXTERNAL_EVENT_TOGGLE_TO_ELEVATION = 'EXTERNAL_EVENT_TOGGLE_TO_ELEVAT
 export var EXTERNAL_EVENT_ADD_WALL = 'EXTERNAL_EVENT_ADD_WALL';
 export var EXTERNAL_EVENT_ADD_ITEM = 'EXTERNAL_EVENT_ADD_ITEM';
 export var EXTERNAL_EVENT_MOVE_PAN = 'EXTERNAL_EVENT_MOVE_PAN';
-export var EXTERNAL_EVENT_NEW_PROJECT = 'EXTERNAL_EVENT_NEW_PROJECT';
+export var EXTERNAL_EVENT_NEW_PROJECT = 'EXTERNAL_EVENT_NEW_PROJECT';
+export var EXTERNAL_EVENT_CHANGE_DOORSTYLE = 'EXTERNAL_EVENT_CHANGE_DOORSTYLE';
+export var EXTERNAL_EVENT_SET_INITIAL_DATA = 'EXTERNAL_EVENT_SET_INITIAL_DATA';
+export var EXTERNAL_EVENT_ADD_ROOM_SHAPE = 'EXTERNAL_EVENT_ADD_ROOM_SHAPE';
+export var EXTERNAL_EVENT_ZOOM_IN = 'EXTERNAL_EVENT_ZOOM_IN';
+export var EXTERNAL_EVENT_ZOOM_OUT = 'EXTERNAL_EVENT_ZOOM_OUT';

package/es/devLiteRenderer.js

@@ -5,10 +5,13 @@ import mockProps from "./mocks/mockProps.json";
 import mockCategoryData from "./mocks/categoryData.json";
 import mockDataBundle from "./mocks/dataBundle.json";
 import cabinetPaylod from "./mocks/cabinetPayload.json";
+import doorStylePaylod from "./mocks/doorStylePayload.json";
+import oStylePaylod from "./mocks/oStylePayload.json";
+import rectangleData from "./mocks/rectangleShape.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 } 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_SET_INITIAL_DATA, EXTERNAL_EVENT_ADD_ROOM_SHAPE, EXTERNAL_EVENT_ZOOM_IN, EXTERNAL_EVENT_ZOOM_OUT } from "./constants";
 
 // --- renderer props ---
 var options = {
@@ -22,6 +25,18 @@ function WorkSpace(props) {
     externalEvent = _useState2[0],
     setExternalEvent = _useState2[1];
   var offset = 5;
+  useEffect(function () {
+    var evt = {
+      type: EXTERNAL_EVENT_SET_INITIAL_DATA,
+      payload: {
+        doorStyle: {
+          doorStyle: doorStylePaylod,
+          oStyle: oStylePaylod
+        }
+      }
+    };
+    setExternalEvent(evt);
+  }, []);
   return /*#__PURE__*/React.createElement("div", {
     className: "flex gap-4"
   }, /*#__PURE__*/React.createElement(Button, {
@@ -107,6 +122,28 @@ function WorkSpace(props) {
     }
   }, /*#__PURE__*/React.createElement("img", {
     src: "/assets/img/svg/bottombar/arrow-right.svg"
+  })), /*#__PURE__*/React.createElement(Button, {
+    actionType: "primary",
+    onClick: function onClick() {
+      var evt = {
+        type: EXTERNAL_EVENT_ZOOM_IN,
+        payload: {}
+      };
+      setExternalEvent(evt);
+    }
+  }, /*#__PURE__*/React.createElement("img", {
+    src: "/assets/img/svg/bottombar/arrow-minus.svg"
+  })), /*#__PURE__*/React.createElement(Button, {
+    actionType: "primary",
+    onClick: function onClick() {
+      var evt = {
+        type: EXTERNAL_EVENT_ZOOM_OUT,
+        payload: {}
+      };
+      setExternalEvent(evt);
+    }
+  }, /*#__PURE__*/React.createElement("img", {
+    src: "/assets/img/svg/bottombar/arrow-plus.svg"
   })), /*#__PURE__*/React.createElement(Button, {
     actionType: "primary",
     onClick: function onClick() {
@@ -134,9 +171,30 @@ function WorkSpace(props) {
       };
       setExternalEvent(evt);
     }
-  }, "Add B12 Cabinet"), /*#__PURE__*/React.createElement(LiteRenderer, {
-    width: 1200,
-    height: 953,
+  }, "Add B12 Cabinet"), /*#__PURE__*/React.createElement(Button, {
+    actionType: "danger",
+    onClick: function onClick() {
+      var evt = {
+        type: EXTERNAL_EVENT_CHANGE_DOORSTYLE,
+        payload: {
+          doorStyle: doorStylePaylod,
+          isAll: true
+        }
+      };
+      setExternalEvent(evt);
+    }
+  }, "DoorStyle (Change into Midtown White Shaker)"), /*#__PURE__*/React.createElement(Button, {
+    actionType: "danger",
+    onClick: function onClick() {
+      var evt = {
+        type: EXTERNAL_EVENT_ADD_ROOM_SHAPE,
+        payload: rectangleData
+      };
+      setExternalEvent(evt);
+    }
+  }, "Add Room shape(rectangle)"), /*#__PURE__*/React.createElement(LiteRenderer, {
+    width: props.width,
+    height: props.height,
     projectElement: mockProps.projectElement,
     categoryData: mockCategoryData,
     dataBundle: mockDataBundle,
@@ -158,4 +216,11 @@ function WorkSpace(props) {
     }
   }));
 }
-ReactDOM.render(/*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(WorkSpace, null)), document.getElementById('app'));
+ReactDOM.render(/*#__PURE__*/React.createElement(ContainerDimensions, null, function (_ref) {
+  var width = _ref.width,
+    height = _ref.height;
+  return /*#__PURE__*/React.createElement(WorkSpace, {
+    width: width,
+    height: height
+  });
+}), document.getElementById('app'));

package/es/reducers/items-reducer.js

@@ -105,7 +105,7 @@ export default function (state, action) {
     case SELECT_TOOL_DRAWING_ITEM_3D:
       return Item.selectToolDrawingItem3D(state, action.sceneComponentType).updatedState;
     case SET_DOOR_STYLE:
-      return Item.setDoorStyle(state, action.doorStyle, action.pathes, action.isAll).updatedState;
+      return Item.setDoorStyle(state, action.doorStyle, action.isAll).updatedState;
     case SET_HANDLE_MATERIAL:
       return Item.setHandleMaterial(state, action.material).updatedState;
     case SET_DOOR_HANDLE:

package/es/utils/isolate-event-handler.js

@@ -4,7 +4,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 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; }
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { fromJS, List, Map, Record } from 'immutable';
-import { EXTERNAL_EVENT_ADD_WALL, EXTERNAL_EVENT_TOGGLE_TO_3D, EXTERNAL_EVENT_TOGGLE_TO_2D, EXTERNAL_EVENT_TOGGLE_TO_ELEVATION, EXTERNAL_EVENT_MOVE_PAN, MODE_IDLE, MODE_2D_PAN, EXTERNAL_EVENT_ADD_ITEM, ARRAY_3D_MODES, MODE_IDLE_3D, MODE_ELEVATION_VIEW, TOP, BOTTOM, LEFT, RIGHT, EXTERNAL_EVENT_NEW_PROJECT } from "../constants";
+import { EXTERNAL_EVENT_ADD_WALL, EXTERNAL_EVENT_TOGGLE_TO_3D, EXTERNAL_EVENT_TOGGLE_TO_2D, EXTERNAL_EVENT_TOGGLE_TO_ELEVATION, EXTERNAL_EVENT_MOVE_PAN, MODE_IDLE, MODE_2D_PAN, EXTERNAL_EVENT_ADD_ITEM, ARRAY_3D_MODES, MODE_IDLE_3D, MODE_ELEVATION_VIEW, TOP, BOTTOM, LEFT, RIGHT, EXTERNAL_EVENT_NEW_PROJECT, EXTERNAL_EVENT_CHANGE_DOORSTYLE, EXTERNAL_EVENT_SET_INITIAL_DATA, EXTERNAL_EVENT_ADD_ROOM_SHAPE, EXTERNAL_EVENT_ZOOM_IN, EXTERNAL_EVENT_ZOOM_OUT, ZOOM_VARIABLE } from "../constants";
 import { isEmpty } from "./helper";
 import exporter from "../catalog/utils/exporter";
 import { render2DItem, render3DItem } from "../catalog/utils/item-loader";
@@ -62,42 +62,46 @@ var loadSVGsByItem = /*#__PURE__*/function () {
     return _ref.apply(this, arguments);
   };
 }();
-export function handleExternalEvent(_x2, _x3) {
+var compareSVGRect = function compareSVGRect(value) {
+  return value.e <= 10 && value.e + value.a * value.SVGWidth + 10 >= value.viewerWidth && value.f <= 80 && value.f + value.d * value.SVGHeight + 10 >= value.viewerHeight ? true : false;
+};
+export function handleExternalEvent(_x2) {
   return _handleExternalEvent.apply(this, arguments);
 }
 function _handleExternalEvent() {
-  _handleExternalEvent = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(evt, props) {
-    var state, sLineCnt, element, catalog, outlineSVGData, catalogInstance, elementJs, _evt$payload, moveType, moveValue, value, defaulTitle, _t2, _t3;
+  _handleExternalEvent = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(props) {
+    var evt, state, sLineCnt, element, catalog, outlineSVGData, catalogInstance, elementJs, _evt$payload, moveType, moveValue, value, defaulTitle, _evt$payload2, doorStyle, isAll, _doorStyle, _value, _zoomValue, _value2, _zoomValue2, _t2, _t3;
     return _regeneratorRuntime.wrap(function (_context2) {
       while (1) switch (_context2.prev = _context2.next) {
         case 0:
-          state = props.state;
+          evt = props.externalEvent;
+          state = props.state.get('KitchenConfigurator');
           _t2 = evt === null || evt === void 0 ? void 0 : evt.type;
-          _context2.next = _t2 === EXTERNAL_EVENT_TOGGLE_TO_3D ? 1 : _t2 === EXTERNAL_EVENT_TOGGLE_TO_2D ? 2 : _t2 === EXTERNAL_EVENT_TOGGLE_TO_ELEVATION ? 3 : _t2 === EXTERNAL_EVENT_ADD_WALL ? 4 : _t2 === EXTERNAL_EVENT_ADD_ITEM ? 5 : _t2 === EXTERNAL_EVENT_MOVE_PAN ? 9 : _t2 === EXTERNAL_EVENT_NEW_PROJECT ? 15 : 16;
+          _context2.next = _t2 === EXTERNAL_EVENT_TOGGLE_TO_3D ? 1 : _t2 === EXTERNAL_EVENT_TOGGLE_TO_2D ? 2 : _t2 === EXTERNAL_EVENT_TOGGLE_TO_ELEVATION ? 3 : _t2 === EXTERNAL_EVENT_ADD_WALL ? 4 : _t2 === EXTERNAL_EVENT_ADD_ITEM ? 5 : _t2 === EXTERNAL_EVENT_MOVE_PAN ? 9 : _t2 === EXTERNAL_EVENT_NEW_PROJECT ? 15 : _t2 === EXTERNAL_EVENT_CHANGE_DOORSTYLE ? 16 : _t2 === EXTERNAL_EVENT_SET_INITIAL_DATA ? 17 : _t2 === EXTERNAL_EVENT_ADD_ROOM_SHAPE ? 18 : _t2 === EXTERNAL_EVENT_ZOOM_IN ? 19 : _t2 === EXTERNAL_EVENT_ZOOM_OUT ? 22 : 25;
           break;
         case 1:
           props.projectActions.setMode(MODE_IDLE_3D);
-          return _context2.abrupt("continue", 16);
+          return _context2.abrupt("continue", 25);
         case 2:
           props.projectActions.setMode(MODE_IDLE);
-          return _context2.abrupt("continue", 16);
+          return _context2.abrupt("continue", 25);
         case 3:
-          sLineCnt = state.getIn(['KitchenConfigurator', 'scene', 'layers', 'layer-1', 'selected', 'lines']).size;
+          sLineCnt = state.getIn(['scene', 'layers', 'layer-1', 'selected', 'lines']).size;
           if (sLineCnt > 0) props.projectActions.setMode(MODE_ELEVATION_VIEW);
-          return _context2.abrupt("continue", 16);
+          return _context2.abrupt("continue", 25);
         case 4:
           if (state.mode === MODE_IDLE || state.mode === MODE_2D_PAN) props.linesActions.selectToolDrawingLine('wall');else {
             props.projectActions.setMode(MODE_IDLE);
             props.linesActions.selectToolDrawingLine('wall');
           }
-          return _context2.abrupt("continue", 16);
+          return _context2.abrupt("continue", 25);
         case 5:
           if (isEmpty(evt === null || evt === void 0 ? void 0 : evt.payload)) {
             _context2.next = 8;
             break;
           }
           element = evt.payload;
-          catalog = state.getIn(['KitchenConfigurator', 'catalog']).toJS(); // add item to catalog of state
+          catalog = state.getIn(['catalog']).toJS(); // add item to catalog of state
           if (!isEmpty(catalog === null || catalog === void 0 ? void 0 : catalog.elements[element.name])) {
             _context2.next = 7;
             break;
@@ -122,10 +126,10 @@ function _handleExternalEvent() {
           props.projectActions.pushLastSelectedCatalogElementToHistory(element);
           props.projectActions.setIsCabinetDrawing(true);
         case 8:
-          return _context2.abrupt("continue", 16);
+          return _context2.abrupt("continue", 25);
         case 9:
           _evt$payload = evt.payload, moveType = _evt$payload.moveType, moveValue = _evt$payload.moveValue;
-          value = state.getIn(['KitchenConfigurator', 'viewer2D']).toJS();
+          value = state.getIn(['viewer2D']).toJS();
           _t3 = moveType;
           _context2.next = _t3 === TOP ? 10 : _t3 === BOTTOM ? 11 : _t3 === RIGHT ? 12 : _t3 === LEFT ? 13 : 14;
           break;
@@ -142,14 +146,79 @@ function _handleExternalEvent() {
           value.e -= moveValue;
           return _context2.abrupt("continue", 14);
         case 14:
-          if (value.e <= 10 && value.e + value.a * value.SVGWidth + 10 >= value.viewerWidth && value.f <= 80 && value.f + value.d * value.SVGHeight + 10 >= value.viewerHeight) props.viewer2DActions.updateCameraView(value);
-          return _context2.abrupt("continue", 16);
+          if (compareSVGRect(value)) props.viewer2DActions.updateCameraView(value);
+          return _context2.abrupt("continue", 25);
         case 15:
           defaulTitle = 'Untitle';
           props.projectActions.newProject();
           props.projectActions.rename(defaulTitle);
-          return _context2.abrupt("continue", 16);
+          return _context2.abrupt("continue", 25);
         case 16:
+          _evt$payload2 = evt.payload, doorStyle = _evt$payload2.doorStyle, isAll = _evt$payload2.isAll;
+          props.itemsActions.setDoorStyle(doorStyle, isAll);
+          return _context2.abrupt("continue", 25);
+        case 17:
+          _doorStyle = evt.payload.doorStyle;
+          props.itemsActions.setInitialDoorStyle(_doorStyle.doorStyle, _doorStyle.oStyle);
+          return _context2.abrupt("continue", 25);
+        case 18:
+          props.projectActions.loadProject(evt.payload, props.categoryData);
+          return _context2.abrupt("continue", 25);
+        case 19:
+          _value = state.getIn(['viewer2D']).toJS();
+          _value.a -= 0.1;
+          _value.d -= 0.1;
+          _value.e += _value.SVGWidth * 0.1 / 2;
+          _value.f += _value.SVGHeight * 0.1 / 2;
+          _zoomValue = parseInt((_value.a - 0.5) / ZOOM_VARIABLE);
+          if (!(_zoomValue > 404)) {
+            _context2.next = 20;
+            break;
+          }
+          return _context2.abrupt("return");
+        case 20:
+          if (!(_zoomValue < 35 || Number.isNaN(_zoomValue))) {
+            _context2.next = 21;
+            break;
+          }
+          return _context2.abrupt("return");
+        case 21:
+          while (!(_value.e <= 10)) {
+            _value.e -= 0.1;
+          }
+          while (!(_value.e + _value.a * _value.SVGWidth + 10 >= _value.viewerWidth)) {
+            _value.e += 0.1;
+          }
+          while (!(_value.f <= 80)) {
+            _value.f -= 0.1;
+          }
+          while (!(_value.f + _value.a * _value.SVGHeight + 10 >= _value.viewerHeight)) {
+            _value.f += 0.1;
+          }
+          if (compareSVGRect(_value)) props.viewer2DActions.updateCameraView(_value);
+          return _context2.abrupt("continue", 25);
+        case 22:
+          _value2 = state.getIn(['viewer2D']).toJS();
+          _value2.a += 0.1;
+          _value2.d += 0.1;
+          _value2.e -= _value2.SVGWidth * 0.1 / 2;
+          _value2.f -= _value2.SVGHeight * 0.1 / 2;
+          _zoomValue2 = parseInt((_value2.a - 0.5) / ZOOM_VARIABLE);
+          if (!(_zoomValue2 > 404)) {
+            _context2.next = 23;
+            break;
+          }
+          return _context2.abrupt("return");
+        case 23:
+          if (!(_zoomValue2 < 35 || Number.isNaN(_zoomValue2))) {
+            _context2.next = 24;
+            break;
+          }
+          return _context2.abrupt("return");
+        case 24:
+          if (compareSVGRect(_value2)) props.viewer2DActions.updateCameraView(_value2);
+          return _context2.abrupt("continue", 25);
+        case 25:
         case "end":
           return _context2.stop();
       }

package/lib/LiteKitchenConfigurator.js

@@ -484,7 +484,7 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
 
       // handle external events
       if (this.props.externalEvent !== externalEvent) {
-        (0, _isolateEventHandler.handleExternalEvent)(externalEvent, this.props);
+        (0, _isolateEventHandler.handleExternalEvent)(nextProps);
       }
       var plannerState = stateExtractor(state);
       var catalogReady = plannerState.getIn(['catalog', 'ready']);

package/lib/actions/items-actions.js

@@ -274,11 +274,10 @@ function updateItemsAltitude(layerID, itemID, value) {
     value: value
   };
 }
-function setDoorStyle(doorStyle, pathes, isAll) {
+function setDoorStyle(doorStyle, isAll) {
   return {
     type: _constants.SET_DOOR_STYLE,
     doorStyle: doorStyle,
-    pathes: pathes,
     isAll: isAll
   };
 }

package/lib/class/item.js

@@ -1171,7 +1171,7 @@ var Item = exports["default"] = /*#__PURE__*/function () {
     }
   }, {
     key: "setDoorStyle",
-    value: function setDoorStyle(state, doorStyle, pathes, isAll) {
+    value: function setDoorStyle(state, doorStyle, isAll) {
       var _this2 = this;
       var keys = Object.keys(doorStyle.doorStyles);
       keys = keys.filter(function (elem) {