kitchen-simulator 4.0.7-react-18 → 4.0.7

package/es/catalog/utils/item-loader.js

@@ -80,7 +80,7 @@ export function render2DItem(element, layer, scene, sizeinfo, layoutpos, is_corn
     el_is_euro_cds = _element.doorStyle.doorStyles.is_euro_cds;
     el_euro_shape_svg = _element.doorStyle.doorStyles.euro_shape_svg;
   }
-  if (el_euro_length === undefined && el_euro_width === undefined) {
+  if (isEmpty(el_euro_length) && isEmpty(el_euro_width)) {
     el_DSN = 'el_DSN';
   }
   if (el_DSN === 'Euro & Frameless') {
@@ -207,12 +207,17 @@ export function render2DItem(element, layer, scene, sizeinfo, layoutpos, is_corn
         transform: "translate(".concat(-transX, "px, ").concat(-transY, "px)")
       },
       onMouseEnter: function onMouseEnter(event) {
-        var bbox = event.target.getBoundingClientRect();
-        if (document.getElementById('warning_box_2d')) {
-          document.getElementById('warning_box_2d').style.display = 'flex';
-          document.getElementById('warning_box_2d').style.top = "".concat(bbox.top - 60, "px");
-          document.getElementById('warning_box_2d').style.left = "".concat(bbox.left, "px");
-        }
+        var target = event.currentTarget;
+        var tooltip = document.getElementById('warning_box_2d');
+        var parent = document.querySelector('#kitchen-simulator-container');
+        if (!tooltip || !parent) return;
+        var targetRect = target.getBoundingClientRect();
+        var parentRect = parent.getBoundingClientRect();
+        var left = targetRect.left - parentRect.left;
+        var top = targetRect.top - parentRect.top;
+        tooltip.style.display = 'flex';
+        tooltip.style.left = "".concat(left, "px");
+        tooltip.style.top = "".concat(top - 60, "px");
       },
       onMouseLeave: function onMouseLeave() {
         if (document.getElementById('warning_box_2d')) {
@@ -432,25 +437,28 @@ export function render3DItem(element, layer, scene, sizeinfo, structure_json, is
     counterTop.uri = layer.toJS().counterTop.uri;
   }
   if ('name' in element.doorStyle) {
+    var _element2, _element3, _element4, _element5;
     doorStyles = new Map(element.doorStyle.doorStyles);
-    color = element.doorStyle.color;
-    glossness = element.doorStyle.glossness;
-    handleMaterial.metalness = element.doorStyle.metalness;
-    handleMaterial.roughness = element.doorStyle.roughness;
+    color = (_element2 = element) === null || _element2 === void 0 || (_element2 = _element2.doorStyle) === null || _element2 === void 0 ? void 0 : _element2.color;
+    glossness = (_element3 = element) === null || _element3 === void 0 || (_element3 = _element3.doorStyle) === null || _element3 === void 0 ? void 0 : _element3.glossness;
+    handleMaterial.metalness = (_element4 = element) === null || _element4 === void 0 || (_element4 = _element4.doorStyle) === null || _element4 === void 0 ? void 0 : _element4.metalness;
+    handleMaterial.roughness = (_element5 = element) === null || _element5 === void 0 || (_element5 = _element5.doorStyle) === null || _element5 === void 0 ? void 0 : _element5.roughness;
   } else if (element.doorStyle != null && element.doorStyle) {
-    doorStyles = element.doorStyle.get('doorStyles');
-    color = element.doorStyle.get('color');
-    glossness = element.doorStyle.get('glossness');
-    handleMaterial.metalness = element.doorStyle.get('metalness');
-    handleMaterial.roughness = element.doorStyle.get('roughness');
+    var _element6, _element7, _element8, _element9, _element0;
+    doorStyles = (_element6 = element) === null || _element6 === void 0 || (_element6 = _element6.doorStyle) === null || _element6 === void 0 ? void 0 : _element6.get('doorStyles');
+    color = (_element7 = element) === null || _element7 === void 0 || (_element7 = _element7.doorStyle) === null || _element7 === void 0 ? void 0 : _element7.get('color');
+    glossness = (_element8 = element) === null || _element8 === void 0 || (_element8 = _element8.doorStyle) === null || _element8 === void 0 ? void 0 : _element8.get('glossness');
+    handleMaterial.metalness = (_element9 = element) === null || _element9 === void 0 || (_element9 = _element9.doorStyle) === null || _element9 === void 0 ? void 0 : _element9.get('metalness');
+    handleMaterial.roughness = (_element0 = element) === null || _element0 === void 0 || (_element0 = _element0.doorStyle) === null || _element0 === void 0 ? void 0 : _element0.get('roughness');
   }
-  if (color === undefined) color = '#ffffff';
-  if (glossness === undefined) glossness = 1;
+  if (isEmpty(color)) color = '#ffffff';
+  if (isEmpty(glossness)) glossness = 1;
   var tempDoorStyles = doorStyles.toJS();
   var tempPlaceholders = structure.tempPlaceholders;
   var tPlaceholders = tempPlaceholders.find(function (el) {
-    return el.id === tempDoorStyles.cabinet_door_style_id;
-    // return el.id === tempDoorStyles.cds[0].cabinet_door_style_id;
+    var _tempDoorStyles$cds, _tempDoorStyles$cds$;
+    if (tempDoorStyles !== null && tempDoorStyles !== void 0 && tempDoorStyles.cabinet_door_style_id) return el.id === (tempDoorStyles === null || tempDoorStyles === void 0 ? void 0 : tempDoorStyles.cabinet_door_style_id);else if ((tempDoorStyles === null || tempDoorStyles === void 0 || (_tempDoorStyles$cds = tempDoorStyles.cds) === null || _tempDoorStyles$cds === void 0 ? void 0 : _tempDoorStyles$cds.length) > 0) return el.id === (tempDoorStyles === null || tempDoorStyles === void 0 || (_tempDoorStyles$cds$ = tempDoorStyles.cds[0]) === null || _tempDoorStyles$cds$ === void 0 ? void 0 : _tempDoorStyles$cds$.cabinet_door_style_id);
+    return false;
   });
   if (tPlaceholders !== undefined) {
     placeholders = tPlaceholders.placeholders;
@@ -641,10 +649,10 @@ export function render3DItem(element, layer, scene, sizeinfo, structure_json, is
       vLine3.material.depthTest = false;
       // translate vector to center of object
       var uVec = new Three.Vector3(-posVec.x / scalevec.x, -posVec.y / scalevec.y, -posVec.z / scalevec.z);
-      vLine.translateY(0.1);
-      vLine1.translateY(0.1);
-      vLine2.translateY(0.1);
-      vLine3.translateY(0.1);
+      vLine.translateY(_boundingBox.min.y + 0.1);
+      vLine1.translateY(_boundingBox.min.y + 0.1);
+      vLine2.translateY(_boundingBox.min.y + 0.1);
+      vLine3.translateY(_boundingBox.min.y + 0.1);
 
       //rotObj.translateOnAxis(uVec, 1);
       upObj.translateOnAxis(uVec, 1);
@@ -991,8 +999,9 @@ export function render3DItem(element, layer, scene, sizeinfo, structure_json, is
     object.receiveShadow = true;
     objGroup = object;
     if (!isEmpty(doorStyles)) {
+      var _layer$toJS;
       var normalMap = doorStyles.get('base') || INITIAL_NORMAL_MAP;
-      if (counterTop.uri === undefined) {
+      if (isEmpty(counterTop.uri)) {
         try {
           counterTop = counterTop.toJS();
         } catch (error) {
@@ -1001,7 +1010,7 @@ export function render3DItem(element, layer, scene, sizeinfo, structure_json, is
           console.log(error);
         }
       }
-      if (counterTop.uri === undefined && layer.toJS().counterTop.uri !== undefined) {
+      if (isEmpty(counterTop.uri) && !isEmpty(layer === null || layer === void 0 || (_layer$toJS = layer.toJS()) === null || _layer$toJS === void 0 ? void 0 : _layer$toJS.counterTop.uri)) {
         counterTop.uri = layer.toJS().counterTop.uri;
       }
       var countTopMap = counterTop.uri;

package/es/class/hole.js

@@ -777,11 +777,9 @@ var Hole = /*#__PURE__*/function () {
         scene: scene.mergeIn(['layers', layerID, 'holes', holeID], hole)
       });
       state = state.updateIn(['scene', 'layers', layerID, 'lines', hole.line, 'holes'], function (holes) {
-        console.log(holes, 'holes');
         var index = holes.findIndex(function (ID) {
           return holeID === ID;
         });
-        console.log(index, 'index');
         return index === -1 ? holes.push(holeID) : holes;
       });
       return {

package/es/class/item.js

@@ -9,10 +9,11 @@ import { Group, Hole, Layer } from "./export";
 import { GeometryUtils, IDBroker, MoldingUtils, NameGenerator } from "../utils/export";
 import { fromJS, Map } from 'immutable';
 import { INSTALLATION_SUFFIX_TYPE, INTERNAL_EVENT_DRAW_ELEMENT, MODE_DRAGGING_ITEM, MODE_DRAGGING_ITEM_3D, MODE_DRAWING_ITEM, MODE_DRAWING_ITEM_3D, MODE_IDLE, MODE_IDLE_3D, MODE_ROTATING_ITEM, MODE_ROTATING_ITEM_3D, MOLDING_LOCATIONS } from "../constants";
-import { debugUtil } from "../utils/helper";
+import { debugUtil, updatePayloadOfInternalEvent } from "../utils/helper";
 import { isUndefined } from 'util';
 import { hasMoldingLayout } from "../utils/molding";
-import { getInstallationSuffix, isWarningItem } from "../components/viewer2d/utils";
+import { getInstallationSuffix, isEmpty } from "../components/viewer2d/utils";
+import { historyPush } from "../utils/history";
 var allItemRect;
 var allItemSnap;
 var allLines;
@@ -28,9 +29,11 @@ var Item = /*#__PURE__*/function () {
   return _createClass(Item, null, [{
     key: "create",
     value: function create(state, layerID, type, x, y, width, height, rotation, isDuplication) {
+      var _item;
       var molding = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : [];
       var isInitialPos = arguments.length > 10 && arguments[10] !== undefined ? arguments[10] : false;
       var refItem = arguments.length > 11 && arguments[11] !== undefined ? arguments[11] : null;
+      var counterTopURI = arguments.length > 12 && arguments[12] !== undefined ? arguments[12] : null;
       var itemID = IDBroker.acquireID();
       var item = state.catalog.factoryElement(type, {
         id: itemID,
@@ -56,13 +59,20 @@ var Item = /*#__PURE__*/function () {
             doorStyle: refItem.doorStyle
           });
         } else {
-          var _state$doorStyle;
+          var _state$doorStyle, _ref, _temp$doorStyles$cds$, _temp$doorStyles, _temp$cds, _state3;
           var layer = state.getIn(['scene', 'layers', layerID]);
           var temp = layer.doorStyle || ((_state$doorStyle = state.doorStyle) === null || _state$doorStyle === void 0 ? void 0 : _state$doorStyle.toJS());
-          var cds = state.catalog.getIn(['elements', type, 'cds']);
+          var cds = (_ref = (_temp$doorStyles$cds$ = temp === null || temp === void 0 || (_temp$doorStyles = temp.doorStyles) === null || _temp$doorStyles === void 0 || (_temp$doorStyles = _temp$doorStyles.cds) === null || _temp$doorStyles === void 0 ? void 0 : _temp$doorStyles.find(function (elem) {
+            var _state;
+            return elem.itemID === ((_state = state) === null || _state === void 0 || (_state = _state.catalog) === null || _state === void 0 ? void 0 : _state.getIn(['elements', type, 'itemID']));
+          })) !== null && _temp$doorStyles$cds$ !== void 0 ? _temp$doorStyles$cds$ : temp === null || temp === void 0 || (_temp$cds = temp.cds) === null || _temp$cds === void 0 ? void 0 : _temp$cds.find(function (elem) {
+            var _state2;
+            return elem.itemID === ((_state2 = state) === null || _state2 === void 0 || (_state2 = _state2.catalog) === null || _state2 === void 0 ? void 0 : _state2.getIn(['elements', type, 'itemID']));
+          })) !== null && _ref !== void 0 ? _ref : (_state3 = state) === null || _state3 === void 0 || (_state3 = _state3.catalog) === null || _state3 === void 0 ? void 0 : _state3.getIn(['elements', type, 'cds']);
           if (cds) {
-            var updatedDoorStyles = _objectSpread(_objectSpread({}, temp.doorStyles), {}, {
-              cds: [cds]
+            var updatedDoorStyles = _objectSpread(_objectSpread({}, temp === null || temp === void 0 ? void 0 : temp.doorStyles), {}, {
+              cds: [cds],
+              cabinet_door_style_id: cds.cabinet_door_style_id
             });
             item = item.merge({
               doorStyle: fromJS(_objectSpread(_objectSpread({}, temp), {}, {
@@ -159,6 +169,9 @@ var Item = /*#__PURE__*/function () {
         }
       };
       item.category === 'cabinet' && setSizeOfItemByDoorStyle();
+      if (!isEmpty(counterTopURI) && !isEmpty((_item = item) === null || _item === void 0 ? void 0 : _item.counterTop)) {
+        item.counterTop.uri = counterTopURI;
+      }
       item = this.updateDoorHandle(item, state.getIn(['scene', 'layers', layerID]));
       state = state.setIn(['scene', 'layers', layerID, 'items', itemID], item);
       if (item.type.includes('Light')) {
@@ -330,17 +343,17 @@ var Item = /*#__PURE__*/function () {
             if (isRect) {
               var _this$create2 = this.create(state, layerID, sceneComponentType, x - width * Math.cos(rotRad), y - width * Math.sin(rotRad), 200, 100, rotRad * 180 / Math.PI, true, myObject.molding, false, myObject),
                 _stateI = _this$create2.updatedState,
-                _item = _this$create2.item;
-              duplicatedElement = _item;
-              if (_item === null) {
+                _item2 = _this$create2.item;
+              duplicatedElement = _item2;
+              if (_item2 === null) {
                 alert('There are no Door Colors in this cabinet.');
                 state = state.merge({
                   mode: MODE_IDLE,
                   drawingSupport: new Map()
                 });
               } else {
-                state = Item.select(_stateI, layerID, _item.id).updatedState;
-                state = state.setIn(['drawingSupport', 'currentID'], _item.id);
+                state = Item.select(_stateI, layerID, _item2.id).updatedState;
+                state = state.setIn(['drawingSupport', 'currentID'], _item2.id);
               }
             } else {
               var _val2 = {
@@ -357,17 +370,17 @@ var Item = /*#__PURE__*/function () {
               if (isRectDown) {
                 var _this$create3 = this.create(state, layerID, sceneComponentType, x - depth * Math.sin(rotRad), y - depth * Math.cos(rotRad), 200, 100, rotRad * 180 / Math.PI, true, myObject.molding, false, myObject),
                   _stateI2 = _this$create3.updatedState,
-                  _item2 = _this$create3.item;
-                duplicatedElement = _item2;
-                if (_item2 === null) {
+                  _item3 = _this$create3.item;
+                duplicatedElement = _item3;
+                if (_item3 === null) {
                   alert('There are no Door Colors in this cabinet.');
                   state = state.merge({
                     mode: MODE_IDLE,
                     drawingSupport: new Map()
                   });
                 } else {
-                  state = Item.select(_stateI2, layerID, _item2.id).updatedState;
-                  state = state.setIn(['drawingSupport', 'currentID'], _item2.id);
+                  state = Item.select(_stateI2, layerID, _item3.id).updatedState;
+                  state = state.setIn(['drawingSupport', 'currentID'], _item3.id);
                 }
               } else {
                 var _val3 = {
@@ -384,17 +397,17 @@ var Item = /*#__PURE__*/function () {
                 if (isRectUp) {
                   var _this$create4 = this.create(state, layerID, sceneComponentType, x + depth * Math.sin(rotRad), y + depth * Math.cos(rotRad), 200, 100, rotRad * 180 / Math.PI, true, myObject.molding, false, myObject),
                     _stateI3 = _this$create4.updatedState,
-                    _item3 = _this$create4.item;
-                  duplicatedElement = _item3;
-                  if (_item3 === null) {
+                    _item4 = _this$create4.item;
+                  duplicatedElement = _item4;
+                  if (_item4 === null) {
                     alert('There are no Door Colors in this cabinet.');
                     state = state.merge({
                       mode: MODE_IDLE,
                       drawingSupport: new Map()
                     });
                   } else {
-                    state = Item.select(_stateI3, layerID, _item3.id).updatedState;
-                    state = state.setIn(['drawingSupport', 'currentID'], _item3.id);
+                    state = Item.select(_stateI3, layerID, _item4.id).updatedState;
+                    state = state.setIn(['drawingSupport', 'currentID'], _item4.id);
                   }
                 } else {
                   console.log('there is no space');
@@ -464,8 +477,9 @@ var Item = /*#__PURE__*/function () {
           break;
       }
       if (onInternalEvent && duplicatedElement) {
-        var jsElement = duplicatedElement.toJS();
-        if (jsElement.prototype === 'items') jsElement.isWarning = isWarningItem(duplicatedElement);
+        var _state$get;
+        var catalog = (_state$get = state.get('catalog')) === null || _state$get === void 0 ? void 0 : _state$get.toJS();
+        var jsElement = updatePayloadOfInternalEvent(duplicatedElement, layer, catalog);
         onInternalEvent({
           type: INTERNAL_EVENT_DRAW_ELEMENT,
           value: jsElement
@@ -530,8 +544,14 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "replaceItem",
     value: function replaceItem(state, selectedPos, currentObject, selectedObject) {
+      var _currentObject$counte;
+      var counterTopURI = '';
+      if (!isEmpty(currentObject === null || currentObject === void 0 || (_currentObject$counte = currentObject.counterTop) === null || _currentObject$counte === void 0 ? void 0 : _currentObject$counte.uri)) {
+        var _currentObject$counte2;
+        counterTopURI = currentObject === null || currentObject === void 0 || (_currentObject$counte2 = currentObject.counterTop) === null || _currentObject$counte2 === void 0 ? void 0 : _currentObject$counte2.uri;
+      } else if (!isEmpty(state.getIn(['scene', 'layers', 'layer-1', 'counterTop']))) counterTopURI = state.getIn(['scene', 'layers', 'layer-1', 'counterTop']).uri;else counterTopURI = 'https://media.test.diydesignspace.com/uploads/CountTop/202105074107_5/texture/Unique_Calcatta_texture.jpg';
       state = this.remove(state, state.scene.selectedLayer, selectedPos.selectedItemId).updatedState;
-      state = this.create(state, state.scene.selectedLayer, selectedObject.name, selectedPos.x, selectedPos.y, selectedObject.info.width, selectedObject.info.height, selectedPos.rotation, false).updatedState;
+      state = this.create(state, state.scene.selectedLayer, selectedObject.name, selectedPos.x, selectedPos.y, selectedObject.info.width, selectedObject.info.height, selectedPos.rotation, false, [], false, null, counterTopURI).updatedState;
       // state = this.select(state, state.scene.selectedLayer, selectedPos.selectedItemId).updatedState;
       return {
         updatedState: state
@@ -649,8 +669,8 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "updateDraggingItemChanged",
     value: function updateDraggingItemChanged(state, x, y, layerID, itemID) {
-      var _state = state,
-        scene = _state.scene;
+      var _state4 = state,
+        scene = _state4.scene;
       // let originalX = draggingSupport.get('originalX');
       // let originalY = draggingSupport.get('originalY');
 
@@ -742,9 +762,9 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "updateDraggingItem",
     value: function updateDraggingItem(state, x, y) {
-      var _state2 = state,
-        draggingSupport = _state2.draggingSupport,
-        scene = _state2.scene;
+      var _state5 = state,
+        draggingSupport = _state5.draggingSupport,
+        scene = _state5.scene;
       var layerID = draggingSupport.get('layerID');
       var itemID = draggingSupport.get('itemID');
       var startPointX = draggingSupport.get('startPointX');
@@ -776,9 +796,9 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "updateDraggingItem3DX",
     value: function updateDraggingItem3DX(state, x) {
-      var _state3 = state,
-        draggingSupport = _state3.draggingSupport,
-        scene = _state3.scene;
+      var _state6 = state,
+        draggingSupport = _state6.draggingSupport,
+        scene = _state6.scene;
       var layerID = draggingSupport.get('layerID');
       var itemID = draggingSupport.get('itemID');
       var startPointX = draggingSupport.get('startPointX');
@@ -798,9 +818,9 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "updateDraggingItem3DY",
     value: function updateDraggingItem3DY(state, y) {
-      var _state4 = state,
-        draggingSupport = _state4.draggingSupport,
-        scene = _state4.scene;
+      var _state7 = state,
+        draggingSupport = _state7.draggingSupport,
+        scene = _state7.scene;
       var layerID = draggingSupport.get('layerID');
       var itemID = draggingSupport.get('itemID');
       var startPointY = draggingSupport.get('startPointY');
@@ -881,9 +901,9 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "updateRotatingItem",
     value: function updateRotatingItem(state, x, y) {
-      var _state5 = state,
-        rotatingSupport = _state5.rotatingSupport,
-        scene = _state5.scene;
+      var _state8 = state,
+        rotatingSupport = _state8.rotatingSupport,
+        scene = _state8.scene;
       var layerID = rotatingSupport.get('layerID');
       var itemID = rotatingSupport.get('itemID');
       var item = state.getIn(['scene', 'layers', layerID, 'items', itemID]);
@@ -966,9 +986,9 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "replaceSubmodule",
     value: function replaceSubmodule(state, url) {
-      var _state6 = state,
-        replacingSupport = _state6.replacingSupport,
-        scene = _state6.scene;
+      var _state9 = state,
+        replacingSupport = _state9.replacingSupport,
+        scene = _state9.scene;
       url = 'catalog/texture.png';
       var urlData = url.split('/');
       var newURL = '';
@@ -1069,9 +1089,9 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "animateObject",
     value: function animateObject(state, value) {
-      var _state7 = state,
-        replacingSupport = _state7.replacingSupport,
-        scene = _state7.scene;
+      var _state0 = state,
+        replacingSupport = _state0.replacingSupport,
+        scene = _state0.scene;
       var layerID = replacingSupport.get('layerID');
       var itemID = replacingSupport.get('itemID');
       var item = state.getIn(['scene', 'layers', layerID, 'items', itemID]);
@@ -1108,8 +1128,8 @@ var Item = /*#__PURE__*/function () {
       state = state.merge({
         doorStyle: doorStyle
       });
-      var _state8 = state,
-        scene = _state8.scene;
+      var _state1 = state,
+        scene = _state1.scene;
       var layerID = scene.get('selectedLayer');
       var layers = scene.layers.get(layerID);
       var items = layers.items;
@@ -1306,8 +1326,8 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "setCounterTop",
     value: function setCounterTop(state, counterTop) {
-      var _state9 = state,
-        scene = _state9.scene;
+      var _state10 = state,
+        scene = _state10.scene;
       var layerID = scene.get('selectedLayer');
       var layers = scene.layers.get(layerID);
       layers = layers.mergeIn(['counterTop'], counterTop);
@@ -1351,8 +1371,8 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "setDoorHandle",
     value: function setDoorHandle(state, doorHandle) {
-      var _state0 = state,
-        scene = _state0.scene;
+      var _state11 = state,
+        scene = _state11.scene;
       var layerID = scene.get('selectedLayer');
       var layer = scene.layers.get(layerID);
       layer = layer.mergeIn(['doorHandle'], doorHandle);
@@ -1376,8 +1396,8 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "setHandleMaterial",
     value: function setHandleMaterial(state, material) {
-      var _state1 = state,
-        scene = _state1.scene;
+      var _state12 = state,
+        scene = _state12.scene;
       var layerID = scene.get('selectedLayer');
       var layers = scene.layers.get(layerID);
       var items = layers.items;
@@ -1402,8 +1422,8 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "setWallColor",
     value: function setWallColor(state, wallColor) {
-      var _state10 = state,
-        scene = _state10.scene;
+      var _state13 = state,
+        scene = _state13.scene;
       var layerID = scene.get('selectedLayer');
       var layer = scene.layers.get(layerID);
       layer = layer.merge({
@@ -1429,8 +1449,8 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "setBacksplash",
     value: function setBacksplash(state, backsplash) {
-      var _state11 = state,
-        scene = _state11.scene;
+      var _state14 = state,
+        scene = _state14.scene;
       var layerID = scene.get('selectedLayer');
       var layer = scene.layers.get(layerID);
       var dataJSON = layer.toJS();
@@ -1458,8 +1478,8 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "setMolding",
     value: function setMolding(state, molding, isAll) {
-      var _state12 = state,
-        scene = _state12.scene;
+      var _state15 = state,
+        scene = _state15.scene;
       var layerID = scene.get('selectedLayer');
       var layer = scene.layers.get(layerID);
       if (isAll) {
@@ -1541,6 +1561,9 @@ var Item = /*#__PURE__*/function () {
           });
         }
       }
+      state = state.merge({
+        sceneHistory: historyPush(state.sceneHistory, state.scene)
+      });
       return {
         updatedState: state
       };
@@ -1548,8 +1571,8 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "updateMolding",
     value: function updateMolding(state) {
-      var _state13 = state,
-        scene = _state13.scene;
+      var _state16 = state,
+        scene = _state16.scene;
       var layerID = scene.get('selectedLayer');
       var layer = scene.layers.get(layerID);
       var selectedItem = layer.getIn(['items', layer.selected.toJS().items[0]]);
@@ -1663,6 +1686,9 @@ var Item = /*#__PURE__*/function () {
           updateSelectItemMolding();
         }
       }
+      state = state.merge({
+        sceneHistory: historyPush(state.sceneHistory, state.scene)
+      });
       return {
         updatedState: state
       };
@@ -1670,8 +1696,8 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "setBacksplashVisible",
     value: function setBacksplashVisible(state, itemID, backsplashVisible) {
-      var _state14 = state,
-        scene = _state14.scene;
+      var _state17 = state,
+        scene = _state17.scene;
       var layerID = scene.get('selectedLayer');
       var layer = scene.layers.get(layerID);
       layer = layer.mergeIn(['items', itemID, 'backsplashVisible'], backsplashVisible);
@@ -1691,8 +1717,8 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "setApplianceMaterial",
     value: function setApplianceMaterial(state, material) {
-      var _state15 = state,
-        scene = _state15.scene;
+      var _state18 = state,
+        scene = _state18.scene;
       var layerID = scene.get('selectedLayer');
       var layers = scene.layers.get(layerID);
       var items = layers.items;
@@ -1716,8 +1742,8 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "setModelling",
     value: function setModelling(state, molding) {
-      var _state16 = state,
-        scene = _state16.scene;
+      var _state19 = state,
+        scene = _state19.scene;
       var layerID = scene.get('selectedLayer');
       var layers = scene.layers.get(layerID);
       var items = layers.items;
@@ -1827,8 +1853,8 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "toggleLoadingCabinet",
     value: function toggleLoadingCabinet(state) {
-      var _state17 = state,
-        scene = _state17.scene;
+      var _state20 = state,
+        scene = _state20.scene;
       console.log('scene.isLoadingCabinet: ', !scene.isLoadingCabinet);
       // scene = scene.set('isLoadingCabinet', !scene.isLoadingCabinet);
       // state = state.set('scene', scene);
@@ -1840,8 +1866,8 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "endLoading",
     value: function endLoading(state) {
-      var _state18 = state,
-        scene = _state18.scene;
+      var _state21 = state,
+        scene = _state21.scene;
       state = state.setIn(['scene', 'loadFlag'], true);
       return {
         updatedState: state

package/es/class/line.js

@@ -6,8 +6,7 @@ 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, 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";
+import { isEmpty, updatePayloadOfInternalEvent } from "../utils/helper";
 var timeGlobal = 0;
 var TimeRecorder = /*#__PURE__*/function () {
   function TimeRecorder(name) {
@@ -428,6 +427,7 @@ var Line = /*#__PURE__*/function () {
   }, {
     key: "beginDrawingLine",
     value: function beginDrawingLine(state, layerID, x, y, onInternalEvent) {
+      var _state$get;
       // if end drawing by created area
       if (state.mode == MODE_IDLE) {
         return {
@@ -481,12 +481,8 @@ var Line = /*#__PURE__*/function () {
         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('in');
-      payload.length = _length;
+      var catalog = (_state$get = state.get('catalog')) === null || _state$get === void 0 ? void 0 : _state$get.toJS();
+      var payload = updatePayloadOfInternalEvent(line, layer, catalog);
       if (onInternalEvent) onInternalEvent({
         type: INTERNAL_EVENT_START_DRAW_WALL,
         value: payload