kitchen-simulator 2.0.7-unselected-drag → 2.0.10

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

@@ -21,62 +21,30 @@ var _SVGLoader = require("three/addons/loaders/SVGLoader");
 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) { (0, _defineProperty2["default"])(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; }
 var PRECISION = 2;
-var loadSVGsByItem = /*#__PURE__*/function () {
-  var _ref = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(item) {
-    var _parsed$xml$viewBox, _parsed$xml$viewBox2, response, svgText, loader, parsed, _t;
-    return _regenerator["default"].wrap(function (_context) {
-      while (1) switch (_context.prev = _context.next) {
-        case 0:
-          if (item.outline) {
-            _context.next = 1;
-            break;
-          }
-          return _context.abrupt("return", null);
-        case 1:
-          _context.prev = 1;
-          _context.next = 2;
-          return fetch(item.outline, {
-            cache: 'no-store'
-          });
-        case 2:
-          response = _context.sent;
-          _context.next = 3;
-          return response.text();
-        case 3:
-          svgText = _context.sent;
-          loader = new _SVGLoader.SVGLoader();
-          parsed = loader.parse(svgText);
-          if (!(0, _helper.isEmpty)(parsed.paths)) {
-            _context.next = 4;
-            break;
-          }
-          return _context.abrupt("return", null);
-        case 4:
-          return _context.abrupt("return", {
-            paths: parsed.paths,
-            svgWidth: parseFloat(parsed.xml.getAttribute('width')) || ((_parsed$xml$viewBox = parsed.xml.viewBox) === null || _parsed$xml$viewBox === void 0 || (_parsed$xml$viewBox = _parsed$xml$viewBox.animVal) === null || _parsed$xml$viewBox === void 0 ? void 0 : _parsed$xml$viewBox.width) || 0,
-            svgHeight: parseFloat(parsed.xml.getAttribute('height')) || ((_parsed$xml$viewBox2 = parsed.xml.viewBox) === null || _parsed$xml$viewBox2 === void 0 || (_parsed$xml$viewBox2 = _parsed$xml$viewBox2.animVal) === null || _parsed$xml$viewBox2 === void 0 ? void 0 : _parsed$xml$viewBox2.height) || 0,
-            reverse: !parseFloat(parsed.xml.getAttribute('height'))
-          });
-        case 5:
-          _context.prev = 5;
-          _t = _context["catch"](1);
-          console.error('Failed to load SVG:', item.outline, _t);
-          return _context.abrupt("return", null);
-        case 6:
-        case "end":
-          return _context.stop();
-      }
-    }, _callee, null, [[1, 5]]);
-  }));
-  return function loadSVGsByItem(_x) {
-    return _ref.apply(this, arguments);
-  };
-}();
 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;
 };
-function loadJSON(_x2) {
+var updateViwer2D = function updateViwer2D(value, viewer2DActions) {
+  var _zoomValue = parseInt((value.a - 0.5) / _constants.ZOOM_VARIABLE);
+  if (_zoomValue > 404) return;
+  if (_zoomValue < 35 || Number.isNaN(_zoomValue)) return;
+
+  // modify e, f to fit to SVG
+  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)) viewer2DActions.updateCameraView(value);
+};
+function loadJSON(_x) {
   return _loadJSON.apply(this, arguments);
 }
 /********Parse TempPlaceholder from cabinetPayloadData **************/
@@ -107,7 +75,7 @@ function _loadJSON() {
   }));
   return _loadJSON.apply(this, arguments);
 }
-function parseTempPlaceholdersFromCabinetPayload(_x3) {
+function parseTempPlaceholdersFromCabinetPayload(_x2) {
   return _parseTempPlaceholdersFromCabinetPayload.apply(this, arguments);
 }
 /***** Update cabinetPayloadData with updatedTempPlaceholders *****/
@@ -451,9 +419,9 @@ function _parseTempPlaceholdersFromCabinetPayload() {
   }));
   return _parseTempPlaceholdersFromCabinetPayload.apply(this, arguments);
 }
-function updateCabinetPayload(_x4) {
+function updateCabinetPayload(_x3) {
   return _updateCabinetPayload.apply(this, arguments);
-} // Get attributs of current selected element
+}
 function _updateCabinetPayload() {
   _updateCabinetPayload = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee4(cabinetPayload) {
     var tempPlaceholders, cabinetPayloadKeys, i;
@@ -481,6 +449,112 @@ function _updateCabinetPayload() {
   }));
   return _updateCabinetPayload.apply(this, arguments);
 }
+var loadSVGsByItem = /*#__PURE__*/function () {
+  var _ref = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(item) {
+    var _parsed$xml$viewBox, _parsed$xml$viewBox2, response, svgText, loader, parsed, _t;
+    return _regenerator["default"].wrap(function (_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          if (item.outline) {
+            _context.next = 1;
+            break;
+          }
+          return _context.abrupt("return", null);
+        case 1:
+          _context.prev = 1;
+          _context.next = 2;
+          return fetch(item.outline, {
+            cache: 'no-store'
+          });
+        case 2:
+          response = _context.sent;
+          _context.next = 3;
+          return response.text();
+        case 3:
+          svgText = _context.sent;
+          loader = new _SVGLoader.SVGLoader();
+          parsed = loader.parse(svgText);
+          if (!(0, _helper.isEmpty)(parsed.paths)) {
+            _context.next = 4;
+            break;
+          }
+          return _context.abrupt("return", null);
+        case 4:
+          return _context.abrupt("return", {
+            paths: parsed.paths,
+            svgWidth: parseFloat(parsed.xml.getAttribute('width')) || ((_parsed$xml$viewBox = parsed.xml.viewBox) === null || _parsed$xml$viewBox === void 0 || (_parsed$xml$viewBox = _parsed$xml$viewBox.animVal) === null || _parsed$xml$viewBox === void 0 ? void 0 : _parsed$xml$viewBox.width) || 0,
+            svgHeight: parseFloat(parsed.xml.getAttribute('height')) || ((_parsed$xml$viewBox2 = parsed.xml.viewBox) === null || _parsed$xml$viewBox2 === void 0 || (_parsed$xml$viewBox2 = _parsed$xml$viewBox2.animVal) === null || _parsed$xml$viewBox2 === void 0 ? void 0 : _parsed$xml$viewBox2.height) || 0,
+            reverse: !parseFloat(parsed.xml.getAttribute('height'))
+          });
+        case 5:
+          _context.prev = 5;
+          _t = _context["catch"](1);
+          console.error('Failed to load SVG:', item.outline, _t);
+          return _context.abrupt("return", null);
+        case 6:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee, null, [[1, 5]]);
+  }));
+  return function loadSVGsByItem(_x4) {
+    return _ref.apply(this, arguments);
+  };
+}();
+function addItemToCatalog(_x5, _x6, _x7, _x8) {
+  return _addItemToCatalog.apply(this, arguments);
+} // Get attributs of current selected element
+function _addItemToCatalog() {
+  _addItemToCatalog = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee5(element, state, catalogInstance, projectActions) {
+    var elementJs, catalog, outlineSVGData, updatedStructureJson;
+    return _regenerator["default"].wrap(function (_context5) {
+      while (1) switch (_context5.prev = _context5.next) {
+        case 0:
+          elementJs = element;
+          catalog = state.getIn(['catalog']).toJS(); // add item to catalog of state
+          // if (isEmpty(catalog?.elements[element.name])) {
+          _context5.next = 1;
+          return loadSVGsByItem(element);
+        case 1:
+          outlineSVGData = _context5.sent;
+          if (!(element.type === 'cabinet')) {
+            _context5.next = 3;
+            break;
+          }
+          // make placeholders of element and tempPlaceholder
+          updatedStructureJson = _objectSpread(_objectSpread({}, element.structure_json), element.structure_json.tempPlaceholders[0].structure);
+          element.structure_json = updatedStructureJson;
+          element = _objectSpread(_objectSpread({}, element), {}, {
+            cds: {
+              data: [_objectSpread({}, element.customer_property)],
+              itemID: element.itemID
+            }
+          });
+          _context5.next = 2;
+          return updateCabinetPayload(element);
+        case 2:
+          elementJs = _context5.sent;
+        case 3:
+          elementJs = _objectSpread(_objectSpread({}, elementJs), {}, {
+            outlineSVGData: outlineSVGData,
+            type: element.type,
+            render2DItem: _itemLoader.render2DItem
+          });
+          if (element.type === 'appliance' || element.type === 'furnishing') elementJs.render3DItem = _itemLoader.render3DApplianceItem;else if (element.type === 'lighting') elementJs.render3DItem = _itemLoader.render3DLightingItem;else elementJs.render3DItem = _itemLoader.render3DItem;
+          elementJs = (0, _exporter["default"])(elementJs);
+          if (catalogInstance !== null && catalogInstance !== void 0 && catalogInstance.validateElement(elementJs)) {
+            catalogInstance.registerElement(elementJs);
+            projectActions.addElementToCatalog(elementJs);
+          }
+          // }
+        case 4:
+        case "end":
+          return _context5.stop();
+      }
+    }, _callee5);
+  }));
+  return _addItemToCatalog.apply(this, arguments);
+}
 function initAttrData(element, layer, state) {
   element = (0, _typeof2["default"])(element.misc) === 'object' ? element.set('misc', new _immutable.Map(element.misc)) : element;
   switch (element.prototype) {
@@ -743,21 +817,21 @@ function updateAttributeOfSelectedElement(element, attrPayload, state, layer, pr
             {
               var _line = layer.lines.get(element.line);
               var _layer$vertices$get5 = layer.vertices.get(_line.vertices.get(0)),
-                _x5 = _layer$vertices$get5.x,
+                _x9 = _layer$vertices$get5.x,
                 _y = _layer$vertices$get5.y;
               var _layer$vertices$get6 = layer.vertices.get(_line.vertices.get(1)),
-                _x6 = _layer$vertices$get6.x,
+                _x0 = _layer$vertices$get6.x,
                 _y2 = _layer$vertices$get6.y;
-              var _alpha = _export.GeometryUtils.angleBetweenTwoPoints(_x5, _y, _x6, _y2);
-              var _lineLength = _export.GeometryUtils.pointsDistance(_x5, _y, _x6, _y2);
+              var _alpha = _export.GeometryUtils.angleBetweenTwoPoints(_x9, _y, _x0, _y2);
+              var _lineLength = _export.GeometryUtils.pointsDistance(_x9, _y, _x0, _y2);
               var _widthLength = element.properties.get('width').get('length');
               var _halfWidthLength = _widthLength / 2;
               var _lengthValue = value.get('length');
               _lengthValue = Math.max(_lengthValue, 0);
               _lengthValue = Math.min(_lengthValue, _lineLength - _widthLength);
-              var _xp = _x6 - (_lengthValue + _halfWidthLength) * Math.cos(_alpha);
+              var _xp = _x0 - (_lengthValue + _halfWidthLength) * Math.cos(_alpha);
               var _yp = _y2 - (_lengthValue + _halfWidthLength) * Math.sin(_alpha);
-              var _offset = _export.GeometryUtils.pointPositionOnLineSegment(_x5, _y, _x6, _y2, _xp, _yp);
+              var _offset = _export.GeometryUtils.pointPositionOnLineSegment(_x9, _y, _x0, _y2, _xp, _yp);
               /*
               if (x0 > x1) offset = 1 - offset;
               */
@@ -829,67 +903,13 @@ projectActions) {
     projectActions.setProperties(properties);
   }
 }
-function addItemToCatalog(_x7, _x8, _x9, _x0) {
-  return _addItemToCatalog.apply(this, arguments);
-}
-function _addItemToCatalog() {
-  _addItemToCatalog = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee5(element, state, catalogInstance, projectActions) {
-    var elementJs, catalog, outlineSVGData, updatedStructureJson;
-    return _regenerator["default"].wrap(function (_context5) {
-      while (1) switch (_context5.prev = _context5.next) {
-        case 0:
-          elementJs = element;
-          catalog = state.getIn(['catalog']).toJS(); // add item to catalog of state
-          // if (isEmpty(catalog?.elements[element.name])) {
-          _context5.next = 1;
-          return loadSVGsByItem(element);
-        case 1:
-          outlineSVGData = _context5.sent;
-          if (!(element.type === 'cabinet')) {
-            _context5.next = 3;
-            break;
-          }
-          // make placeholders of element and tempPlaceholder
-          updatedStructureJson = _objectSpread(_objectSpread({}, element.structure_json), element.structure_json.tempPlaceholders[0].structure);
-          element.structure_json = updatedStructureJson;
-          element = _objectSpread(_objectSpread({}, element), {}, {
-            cds: {
-              data: [_objectSpread({}, element.customer_property)],
-              itemID: element.itemID
-            }
-          });
-          _context5.next = 2;
-          return updateCabinetPayload(element);
-        case 2:
-          elementJs = _context5.sent;
-        case 3:
-          elementJs = _objectSpread(_objectSpread({}, elementJs), {}, {
-            outlineSVGData: outlineSVGData,
-            type: element.type,
-            render2DItem: _itemLoader.render2DItem
-          });
-          if (element.type === 'appliance' || element.type === 'furnishing') elementJs.render3DItem = _itemLoader.render3DApplianceItem;else if (element.type === 'lighting') elementJs.render3DItem = _itemLoader.render3DLightingItem;else elementJs.render3DItem = _itemLoader.render3DItem;
-          elementJs = (0, _exporter["default"])(elementJs);
-          if (catalogInstance !== null && catalogInstance !== void 0 && catalogInstance.validateElement(elementJs)) {
-            catalogInstance.registerElement(elementJs);
-            projectActions.addElementToCatalog(elementJs);
-          }
-          // }
-        case 4:
-        case "end":
-          return _context5.stop();
-      }
-    }, _callee5);
-  }));
-  return _addItemToCatalog.apply(this, arguments);
-}
 function handleExternalEvent(_x1) {
   return _handleExternalEvent.apply(this, arguments);
 }
 function _handleExternalEvent() {
   _handleExternalEvent = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee7(props) {
     var _evt$payload3, _evt$payload4;
-    var evt, state, _evt$payload, cdsItems, itemKeys, _loop3, i, _props$onInternalEven, sLineCnt, element, _state$viewer2D, _evt$payload$initialP, mouseX, mouseY, v2d, vPosX, vPosY, layerID, _evt$payload5, moveType, moveValue, value, defaulTitle, _evt$payload6, doorStyle, itemCDS, isAll, _doorStyle, _value, _zoomValue, _value2, _zoomValue2, _evt$payload7, moldingInfo, isGlobal, _evt$payload8, option, _value3, layerId, layer, _layer$getIn, selectedLines, selectedHoles, selectedItems, _i2, _i3, _i4, _props$onInternalEven2, _t5, _t6;
+    var evt, state, _evt$payload, cdsItems, itemKeys, _loop3, i, _props$onInternalEven, sLineCnt, element, _state$viewer2D, _evt$payload$initialP, mouseX, mouseY, v2d, vPosX, vPosY, layerID, _evt$payload5, moveType, moveValue, value, defaulTitle, _evt$payload6, doorStyle, itemCDS, isAll, _doorStyle, _value, _value2, layer, bb, w, h, viewer, _evt$payload7, moldingInfo, isGlobal, _evt$payload8, option, _value3, layerId, _layer, _layer$getIn, selectedLines, selectedHoles, selectedItems, _i2, _i3, _i4, _props$onInternalEven2, _t5, _t6;
     return _regenerator["default"].wrap(function (_context8) {
       while (1) switch (_context8.prev = _context8.next) {
         case 0:
@@ -897,7 +917,7 @@ function _handleExternalEvent() {
           evt = props.externalEvent;
           state = props.state.get('KitchenConfigurator');
           _t5 = evt === null || evt === void 0 ? void 0 : evt.type;
-          _context8.next = _t5 === _constants.EXTERNAL_EVENT_LOAD_PROJECT ? 1 : _t5 === _constants.EXTERNAL_EVENT_TOGGLE_TO_3D ? 5 : _t5 === _constants.EXTERNAL_EVENT_TOGGLE_TO_2D ? 6 : _t5 === _constants.EXTERNAL_EVENT_TOGGLE_TO_ELEVATION ? 7 : _t5 === _constants.EXTERNAL_EVENT_ADD_WALL ? 8 : _t5 === _constants.EXTERNAL_EVENT_ADD_ITEM ? 9 : _t5 === _constants.EXTERNAL_EVENT_ADD_HOLE ? 12 : _t5 === _constants.EXTERNAL_EVENT_MOVE_PAN ? 13 : _t5 === _constants.EXTERNAL_EVENT_NEW_PROJECT ? 19 : _t5 === _constants.EXTERNAL_EVENT_CHANGE_DOORSTYLE ? 20 : _t5 === _constants.EXTERNAL_EVENT_SET_INITIAL_DATA ? 21 : _t5 === _constants.EXTERNAL_EVENT_ADD_ROOM_SHAPE ? 22 : _t5 === _constants.EXTERNAL_EVENT_ZOOM_IN ? 23 : _t5 === _constants.EXTERNAL_EVENT_ZOOM_OUT ? 26 : _t5 === _constants.EXTERNAL_EVENT_UNDO ? 29 : _t5 === _constants.EXTERNAL_EVENT_REDO ? 30 : _t5 === _constants.EXTERNAL_EVENT_SET_MOLDING ? 31 : _t5 === _constants.EXTERNAL_EVENT_PROJECT_SETTING ? 32 : _t5 === _constants.EXTERNAL_EVENT_UPDATE_ATTRIBUTE ? 33 : _t5 === _constants.EXTERNAL_EVENT_UPDATE_PROPERTY ? 33 : _t5 === _constants.EXTERNAL_EVENT_SYNC_SCENE ? 34 : 35;
+          _context8.next = _t5 === _constants.EXTERNAL_EVENT_LOAD_PROJECT ? 1 : _t5 === _constants.EXTERNAL_EVENT_TOGGLE_TO_3D ? 5 : _t5 === _constants.EXTERNAL_EVENT_TOGGLE_TO_2D ? 6 : _t5 === _constants.EXTERNAL_EVENT_TOGGLE_TO_ELEVATION ? 7 : _t5 === _constants.EXTERNAL_EVENT_ADD_WALL ? 8 : _t5 === _constants.EXTERNAL_EVENT_ADD_ITEM ? 9 : _t5 === _constants.EXTERNAL_EVENT_ADD_HOLE ? 12 : _t5 === _constants.EXTERNAL_EVENT_MOVE_PAN ? 13 : _t5 === _constants.EXTERNAL_EVENT_NEW_PROJECT ? 19 : _t5 === _constants.EXTERNAL_EVENT_CHANGE_DOORSTYLE ? 20 : _t5 === _constants.EXTERNAL_EVENT_SET_INITIAL_DATA ? 21 : _t5 === _constants.EXTERNAL_EVENT_ADD_ROOM_SHAPE ? 22 : _t5 === _constants.EXTERNAL_EVENT_ZOOM_IN ? 23 : _t5 === _constants.EXTERNAL_EVENT_ZOOM_OUT ? 24 : _t5 === _constants.EXTERNAL_EVENT_CENTERING_2D ? 25 : _t5 === _constants.EXTERNAL_EVENT_UNDO ? 26 : _t5 === _constants.EXTERNAL_EVENT_REDO ? 27 : _t5 === _constants.EXTERNAL_EVENT_SET_MOLDING ? 28 : _t5 === _constants.EXTERNAL_EVENT_PROJECT_SETTING ? 29 : _t5 === _constants.EXTERNAL_EVENT_UPDATE_ATTRIBUTE ? 30 : _t5 === _constants.EXTERNAL_EVENT_UPDATE_PROPERTY ? 30 : _t5 === _constants.EXTERNAL_EVENT_SYNC_SCENE ? 31 : 32;
           break;
         case 1:
           // prepare item data request
@@ -973,23 +993,23 @@ function _handleExternalEvent() {
               };
             }());
           }
-          return _context8.abrupt("continue", 35);
+          return _context8.abrupt("continue", 32);
         case 5:
           props.projectActions.setMode(_constants.MODE_IDLE_3D);
-          return _context8.abrupt("continue", 35);
+          return _context8.abrupt("continue", 32);
         case 6:
           props.projectActions.setMode(_constants.MODE_IDLE);
-          return _context8.abrupt("continue", 35);
+          return _context8.abrupt("continue", 32);
         case 7:
           sLineCnt = state.getIn(['scene', 'layers', 'layer-1', 'selected', 'lines']).size;
           if (sLineCnt > 0) props.projectActions.setMode(_constants.MODE_ELEVATION_VIEW);
-          return _context8.abrupt("continue", 35);
+          return _context8.abrupt("continue", 32);
         case 8:
           if (state.mode === _constants.MODE_IDLE || state.mode === _constants.MODE_2D_PAN) props.linesActions.selectToolDrawingLine('wall');else {
             props.projectActions.setMode(_constants.MODE_IDLE);
             props.linesActions.selectToolDrawingLine('wall');
           }
-          return _context8.abrupt("continue", 35);
+          return _context8.abrupt("continue", 32);
         case 9:
           if ((0, _helper.isEmpty)(evt === null || evt === void 0 ? void 0 : evt.payload)) {
             _context8.next = 11;
@@ -1020,10 +1040,10 @@ function _handleExternalEvent() {
           props.projectActions.pushLastSelectedCatalogElementToHistory(element);
           props.projectActions.setIsCabinetDrawing(true);
         case 11:
-          return _context8.abrupt("continue", 35);
+          return _context8.abrupt("continue", 32);
         case 12:
           _constants.ARRAY_3D_MODES.includes(state.mode) ? props.holesActions.selectToolDrawingHole3D(evt === null || evt === void 0 || (_evt$payload3 = evt.payload) === null || _evt$payload3 === void 0 ? void 0 : _evt$payload3.holeName) : props.holesActions.selectToolDrawingHole(evt === null || evt === void 0 || (_evt$payload4 = evt.payload) === null || _evt$payload4 === void 0 ? void 0 : _evt$payload4.holeName);
-          return _context8.abrupt("continue", 35);
+          return _context8.abrupt("continue", 32);
         case 13:
           _evt$payload5 = evt.payload, moveType = _evt$payload5.moveType, moveValue = _evt$payload5.moveValue;
           value = state.getIn(['viewer2D']).toJS();
@@ -1043,89 +1063,78 @@ function _handleExternalEvent() {
           value.e -= moveValue;
           return _context8.abrupt("continue", 18);
         case 18:
-          if (compareSVGRect(value)) props.viewer2DActions.updateCameraView(value);
-          return _context8.abrupt("continue", 35);
+          updateViwer2D(value, props.viewer2DActions);
+          return _context8.abrupt("continue", 32);
         case 19:
           defaulTitle = 'Untitle';
           props.projectActions.newProject();
           props.projectActions.rename(defaulTitle);
-          return _context8.abrupt("continue", 35);
+          return _context8.abrupt("continue", 32);
         case 20:
           _evt$payload6 = evt.payload, doorStyle = _evt$payload6.doorStyle, itemCDS = _evt$payload6.itemCDS, isAll = _evt$payload6.isAll;
           props.itemsActions.setDoorStyle(doorStyle, itemCDS, isAll);
-          return _context8.abrupt("continue", 35);
+          return _context8.abrupt("continue", 32);
         case 21:
           _doorStyle = evt.payload.doorStyle;
           props.itemsActions.setInitialDoorStyle(_doorStyle.doorStyle);
-          return _context8.abrupt("continue", 35);
+          return _context8.abrupt("continue", 32);
         case 22:
           props.projectActions.loadProject(evt.payload);
-          return _context8.abrupt("continue", 35);
+          return _context8.abrupt("continue", 32);
         case 23:
           _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) / _constants.ZOOM_VARIABLE);
-          if (!(_zoomValue > 404)) {
-            _context8.next = 24;
-            break;
-          }
-          return _context8.abrupt("return");
+          _value.a += 0.1;
+          _value.d += 0.1;
+          _value.e -= _value.SVGWidth * 0.1 / 2;
+          _value.f -= _value.SVGHeight * 0.1 / 2;
+          updateViwer2D(_value, props.viewer2DActions);
+          return _context8.abrupt("continue", 32);
         case 24:
-          if (!(_zoomValue < 35 || Number.isNaN(_zoomValue))) {
-            _context8.next = 25;
-            break;
-          }
-          return _context8.abrupt("return");
+          _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;
+          updateViwer2D(_value2, props.viewer2DActions);
+          return _context8.abrupt("continue", 32);
         case 25:
-          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;
+          // calculate the bounding box of all elements in plan
+          layer = state.scene.getIn(['layers', state.scene.selectedLayer]);
+          bb = {
+            minX: Infinity,
+            maxX: -Infinity,
+            minY: Infinity,
+            maxY: -Infinity
+          };
+          bb = layer.vertices.reduce(function (pre, cur) {
+            pre.minX = Math.min(pre.minX, cur.x);
+            pre.maxX = Math.max(pre.maxX, cur.x);
+            pre.minY = Math.min(pre.minY, cur.y);
+            pre.maxY = Math.max(pre.maxY, cur.y);
+            return pre;
+          }, bb);
+          w = bb.maxX - bb.minX;
+          h = bb.maxY - bb.minY; // calc scale and offset to fit view
+          viewer = state.getIn(['viewer2D']).toJS();
+          if (w != 0 && Math.abs(w) != Infinity && h != 0 && Math.abs(h) != Infinity) {
+            viewer.a = viewer.viewerHeight < h ? viewer.viewerHeight / h : viewer.viewerHeight / h * 3 / 5 / _constants.ZOOM_VARIABLE > 400 ? viewer.viewerHeight / h * 400 / (viewer.viewerHeight / h / _constants.ZOOM_VARIABLE) : viewer.viewerHeight / h * 3 / 5;
+            viewer.d = viewer.a;
+            viewer.e = (viewer.viewerWidth - (bb.maxX + bb.minX) * viewer.a) / 2;
+            viewer.f = (viewer.viewerHeight - (bb.maxY + bb.minY) * viewer.a) / 2;
+            updateViwer2D(viewer, props.viewer2DActions);
           }
-          while (!(_value.f + _value.a * _value.SVGHeight + 10 >= _value.viewerHeight)) {
-            _value.f += 0.1;
-          }
-          if (compareSVGRect(_value)) props.viewer2DActions.updateCameraView(_value);
-          return _context8.abrupt("continue", 35);
+          return _context8.abrupt("continue", 32);
         case 26:
-          _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) / _constants.ZOOM_VARIABLE);
-          if (!(_zoomValue2 > 404)) {
-            _context8.next = 27;
-            break;
-          }
-          return _context8.abrupt("return");
-        case 27:
-          if (!(_zoomValue2 < 35 || Number.isNaN(_zoomValue2))) {
-            _context8.next = 28;
-            break;
-          }
-          return _context8.abrupt("return");
-        case 28:
-          if (compareSVGRect(_value2)) props.viewer2DActions.updateCameraView(_value2);
-          return _context8.abrupt("continue", 35);
-        case 29:
           props.projectActions.undo();
-          return _context8.abrupt("continue", 35);
-        case 30:
+          return _context8.abrupt("continue", 32);
+        case 27:
           props.projectActions.redo();
-          return _context8.abrupt("continue", 35);
-        case 31:
+          return _context8.abrupt("continue", 32);
+        case 28:
           _evt$payload7 = evt.payload, moldingInfo = _evt$payload7.moldingInfo, isGlobal = _evt$payload7.isGlobal;
           props.itemsActions.setMolding(moldingInfo, isGlobal);
-          return _context8.abrupt("continue", 35);
-        case 32:
+          return _context8.abrupt("continue", 32);
+        case 29:
           _evt$payload8 = evt.payload, option = _evt$payload8.option, _value3 = _evt$payload8.value;
           if (option === _constants.PROJECT_SETTING_OPTION.UPDATE_CEIL_HEIGHT) {
             props.viewer2DActions.updateCeilHeight(_value3);
@@ -1139,16 +1148,16 @@ function _handleExternalEvent() {
           } else if (option === _constants.PROJECT_SETTING_OPTION.CHANGE_WINDOW_DOOR_MEASURE) {
             props.viewer2DActions.changeWindowDoorMeasure(_value3);
           }
-          return _context8.abrupt("continue", 35);
-        case 33:
+          return _context8.abrupt("continue", 32);
+        case 30:
           layerId = state.getIn(['scene', 'selectedLayer']);
-          layer = state.getIn(['scene', 'layers', layerId]);
-          _layer$getIn = layer.getIn(['selected']), selectedLines = _layer$getIn.lines, selectedHoles = _layer$getIn.holes, selectedItems = _layer$getIn.items;
-          for (_i2 = 0; _i2 < selectedLines.size; _i2++) (evt === null || evt === void 0 ? void 0 : evt.type) === _constants.EXTERNAL_EVENT_UPDATE_ATTRIBUTE ? updateAttributeOfSelectedElement(layer.getIn(['lines', selectedLines.get(_i2)]), evt.payload, state, layer, props.projectActions) : updatePropertyOfSelectedElement(layer.getIn(['lines', selectedLines.get(_i2)]), evt.payload, props.catalog, props.projectActions);
-          for (_i3 = 0; _i3 < selectedHoles.size; _i3++) (evt === null || evt === void 0 ? void 0 : evt.type) === _constants.EXTERNAL_EVENT_UPDATE_ATTRIBUTE ? updateAttributeOfSelectedElement(layer.getIn(['holes', selectedHoles.get(_i3)]), evt.payload, state, layer, props.projectActions) : updatePropertyOfSelectedElement(layer.getIn(['holes', selectedHoles.get(_i3)]), evt.payload, props.catalog, props.projectActions);
-          for (_i4 = 0; _i4 < selectedItems.size; _i4++) (evt === null || evt === void 0 ? void 0 : evt.type) === _constants.EXTERNAL_EVENT_UPDATE_ATTRIBUTE ? updateAttributeOfSelectedElement(layer.getIn(['items', selectedItems.get(_i4)]), evt.payload, state, layer, props.projectActions) : updatePropertyOfSelectedElement(layer.getIn(['items', selectedItems.get(_i4)]), evt.payload, props.catalog, props.projectActions);
-          return _context8.abrupt("continue", 35);
-        case 34:
+          _layer = state.getIn(['scene', 'layers', layerId]);
+          _layer$getIn = _layer.getIn(['selected']), selectedLines = _layer$getIn.lines, selectedHoles = _layer$getIn.holes, selectedItems = _layer$getIn.items;
+          for (_i2 = 0; _i2 < selectedLines.size; _i2++) (evt === null || evt === void 0 ? void 0 : evt.type) === _constants.EXTERNAL_EVENT_UPDATE_ATTRIBUTE ? updateAttributeOfSelectedElement(_layer.getIn(['lines', selectedLines.get(_i2)]), evt.payload, state, _layer, props.projectActions) : updatePropertyOfSelectedElement(_layer.getIn(['lines', selectedLines.get(_i2)]), evt.payload, props.catalog, props.projectActions);
+          for (_i3 = 0; _i3 < selectedHoles.size; _i3++) (evt === null || evt === void 0 ? void 0 : evt.type) === _constants.EXTERNAL_EVENT_UPDATE_ATTRIBUTE ? updateAttributeOfSelectedElement(_layer.getIn(['holes', selectedHoles.get(_i3)]), evt.payload, state, _layer, props.projectActions) : updatePropertyOfSelectedElement(_layer.getIn(['holes', selectedHoles.get(_i3)]), evt.payload, props.catalog, props.projectActions);
+          for (_i4 = 0; _i4 < selectedItems.size; _i4++) (evt === null || evt === void 0 ? void 0 : evt.type) === _constants.EXTERNAL_EVENT_UPDATE_ATTRIBUTE ? updateAttributeOfSelectedElement(_layer.getIn(['items', selectedItems.get(_i4)]), evt.payload, state, _layer, props.projectActions) : updatePropertyOfSelectedElement(_layer.getIn(['items', selectedItems.get(_i4)]), evt.payload, props.catalog, props.projectActions);
+          return _context8.abrupt("continue", 32);
+        case 31:
           // send scene object from 3DTool to HostApp using internalEvent
           (_props$onInternalEven2 = props.onInternalEvent) === null || _props$onInternalEven2 === void 0 || _props$onInternalEven2.call(props, {
             type: _constants.INTERNAL_EVENT_SYNC_SCENE,
@@ -1156,7 +1165,8 @@ function _handleExternalEvent() {
               scene: state.scene.toJS()
             }
           });
-        case 35:
+          return _context8.abrupt("continue", 32);
+        case 32:
         case "end":
           return _context8.stop();
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kitchen-simulator",
-  "version": "2.0.7-unselected-drag",
+  "version": "2.0.10",
   "description": "It is a kitchen simulator (self-contained micro-frontend).",
   "license": "MIT",
   "main": "lib/index.js",