kitchen-simulator 11.0.0-react-18 → 11.0.0

package/es/components/viewer3d/scene-creator.js

@@ -6,15 +6,17 @@ import * as Three from 'three';
 import { Color, Group } from 'three';
 import createGrid from "./grid-creator";
 import { disposeObject } from "./three-memory-cleaner";
-import { ANIMATE_STEP_MAX, ANIMATE_STEP_MIN, ARRAY_3D_MODES, ARROW_TEXT_BACKCOLOR, ARROW_TEXT_FONTFACE, ARROW_TEXT_FORECOLOR, BASE_CABINET_LAYOUTPOS, BOTTOM_MOLDING_LOCATION, DECIMAL_PLACES_2, DIFFERENT_VALUES_PATH_LENGTH, DISTANCE_EPSILON, EPSILON, MIDDLE_MOLDING_LOCATION, MODE_DRAGGING_ITEM_3D, MODE_DRAWING_ITEM_3D, MODE_IDLE, MODE_IDLE_3D, MODE_ROTATING_ITEM_3D, OBJTYPE_MESH, SHADE_DARK_PURPLE_COLOR, TOP_MOLDING_LOCATION, UNIT_CENTIMETER, UNIT_FOOT, UNIT_INCH, UNIT_METER, WALL_CABINET_LAYOUTPOS } from "../../constants";
+import { ANIMATE_STEP_MAX, ANIMATE_STEP_MIN, ARRAY_3D_MODES, ARROW_TEXT_BACKCOLOR, ARROW_TEXT_FONTFACE, ARROW_TEXT_FORECOLOR, BASE_CABINET_LAYOUTPOS, BOTTOM_MOLDING_LOCATION, DECIMAL_PLACES_2, DIFFERENT_VALUES_PATH_LENGTH, DISTANCE_EPSILON, EPSILON, ITEM_TYPE, MIDDLE_MOLDING_LOCATION, MODE_DRAGGING_ITEM_3D, MODE_DRAWING_ITEM_3D, MODE_IDLE, MODE_IDLE_3D, MODE_ROTATING_ITEM_3D, OBJTYPE_MESH, SHADE_DARK_PURPLE_COLOR, TOP_MOLDING_LOCATION, UNIT_CENTIMETER, UNIT_FOOT, UNIT_INCH, UNIT_METER, WALL_CABINET_LAYOUTPOS } from "../../constants";
 import { GeometryUtils, IDBroker, MoldingUtils } from "../../utils/export";
 import { convert } from "../../utils/convert-units-lite";
 import { calcDistancesFromItemToWalls, getLineSnapPointsOfItem, getSnappedWallLines, isOverlappedTwoItemsOnOneLine, pointsDistance, verticesDistance } from "../../utils/geometry";
 import * as GeomUtils from "../../catalog/utils/geom-utils";
 import { loadTexture } from "../../catalog/utils/item-loader";
+import { isWarningCabinet } from "../../shared/domain/cabinet-warning";
 import { returnReplaceableDeepSearchType } from "../viewer2d/utils";
 import { animateDoor, isElevationView, isEmpty, isImmutable, replaceMeshesWithLineSegments, translateDrawer } from "../../utils/helper";
 import { formatNumber } from "../../utils/math";
+import { toJSIfNeeded } from "../../shared/objects/immutable";
 export var fVLine = [];
 var scene_mode = null;
 export function parseData(sceneData, actions, catalog, camera, renderer, mode) {
@@ -502,16 +504,14 @@ function replaceObject(modifiedPath, layer, planData, actions, sceneData, oldSce
               }
               var mBoxColor = 0x99c3fb;
               var _item = item.toJS();
-              if (_item.doorStyle.doorStyles !== undefined && _item.doorStyle.doorStyles.cds) {
-                if (showYelloBox(_item)) {
-                  mBoxColor = 'rgba(232,187,47,1)';
-                  var mBox = GeomUtils.makeMBoxfromObject(item3D, mBoxColor);
-                  var warningObj = createWarningObject();
-                  warningObj.position.set(0, item.properties.get('height').get('length') / 3, 0);
-                  if (mBox) {
-                    mBox.add(warningObj);
-                    item3D.add(mBox);
-                  }
+              if (isWarningCabinet(_item)) {
+                mBoxColor = 'rgba(232,187,47,1)';
+                var mBox = GeomUtils.makeMBoxfromObject(item3D, mBoxColor);
+                var warningObj = createWarningObject();
+                warningObj.position.set(0, item.properties.get('height').get('length') / 3, 0);
+                if (mBox) {
+                  mBox.add(warningObj);
+                  item3D.add(mBox);
                 }
               }
             }
@@ -692,16 +692,14 @@ function replaceObject(modifiedPath, layer, planData, actions, sceneData, oldSce
             if (item3D) {
               var _mBoxColor = 0x99c3fb;
               var _item2 = item.toJS();
-              if (_item2.doorStyle.doorStyles !== undefined && _item2.doorStyle.doorStyles.cds) {
-                if (showYelloBox(_item2)) {
-                  _mBoxColor = 'rgba(232,187,47,1)';
-                  var _mBox2 = GeomUtils.makeMBoxfromObject(item3D, _mBoxColor);
-                  var _warningObj = createWarningObject();
-                  _warningObj.position.set(0, item.properties.get('height').get('length') / 3, 0);
-                  if (_mBox2) {
-                    _mBox2.add(_warningObj);
-                    item3D.add(_mBox2);
-                  }
+              if (isWarningCabinet(_item2)) {
+                _mBoxColor = 'rgba(232,187,47,1)';
+                var _mBox2 = GeomUtils.makeMBoxfromObject(item3D, _mBoxColor);
+                var _warningObj = createWarningObject();
+                _warningObj.position.set(0, item.properties.get('height').get('length') / 3, 0);
+                if (_mBox2) {
+                  _mBox2.add(_warningObj);
+                  item3D.add(_mBox2);
                 }
               }
             }
@@ -824,10 +822,8 @@ function replaceObject(modifiedPath, layer, planData, actions, sceneData, oldSce
             }
             var _mBoxColor2 = 0x99c3fb;
             var _item3 = item.toJS();
-            if (_item3.doorStyle.doorStyles !== undefined && _item3.doorStyle.doorStyles.cds) {
-              if (showYelloBox(_item3)) {
-                _mBoxColor2 = 'rgba(232,187,47,1)';
-              }
+            if (isWarningCabinet(_item3)) {
+              _mBoxColor2 = 'rgba(232,187,47,1)';
             }
             rItem.children[0].children.forEach(function (rItemElement) {
               rItemElement.visible = false;
@@ -2047,21 +2043,19 @@ function addItem(sceneData, planData, layer, itemID, catalog, itemsActions) {
     if (pivot) {
       var mBoxColor = 0x99c3fb;
       var _item = item.toJS();
-      if (_item.doorStyle.doorStyles !== undefined && _item.doorStyle.doorStyles.cds) {
-        if (showYelloBox(_item)) {
-          mBoxColor = 'rgba(232,187,47,1)';
-        } else {
-          pivot.children[0].children.forEach(function (pivotElement) {
-            pivotElement.visible = false;
-          });
-        }
-        var mBox = GeomUtils.makeMBoxfromObject(pivot, mBoxColor);
-        var warningObj = createWarningObject();
-        warningObj.position.set(0, item.properties.get('height').get('length') / 3, 0);
-        if (mBox) {
-          mBox.add(warningObj);
-          pivot.add(mBox);
-        }
+      if (isWarningCabinet(_item)) {
+        mBoxColor = 'rgba(232,187,47,1)';
+      } else {
+        pivot.children[0].children.forEach(function (pivotElement) {
+          pivotElement.visible = false;
+        });
+      }
+      var mBox = GeomUtils.makeMBoxfromObject(pivot, mBoxColor);
+      var warningObj = createWarningObject();
+      warningObj.position.set(0, item.properties.get('height').get('length') / 3, 0);
+      if (mBox) {
+        mBox.add(warningObj);
+        pivot.add(mBox);
       }
     }
 
@@ -2159,8 +2153,8 @@ function addItem(sceneData, planData, layer, itemID, catalog, itemsActions) {
       height: height,
       depth: depth
     };
-    val.layoutpos = cat.info.layoutpos;
-    val.is_corner = cat.info.is_corner;
+    val.layoutpos = item === null || item === void 0 ? void 0 : item.layoutpos;
+    val.is_corner = item === null || item === void 0 ? void 0 : item.is_corner;
     val.item = item;
     var calcrect = GeometryUtils.getCalcRectFromItem3D(val);
 
@@ -2187,13 +2181,9 @@ function addItem(sceneData, planData, layer, itemID, catalog, itemsActions) {
       });
       if (pivot.children.length > 1) {
         var _item4 = item.toJS();
-        if (_item4.doorStyle.doorStyles !== undefined) {
-          if (_item4.category === 'cabinet') {
-            if (_item4.doorStyle.doorStyles.cds.some(function (element) {
-              return element.itemID === item.itemID;
-            })) {
-              pivot.children.pop();
-            }
+        if (_item4.category === ITEM_TYPE.CABINET) {
+          if (!isWarningCabinet(item)) {
+            pivot.children.pop();
           } else {
             pivot.children.pop();
           }
@@ -2910,31 +2900,6 @@ export function threedfabs(a) {
 export function getDistanceBetweenLineSegment(pos1, pos2, pos3, pos4) {
   if (pos1.x == pos2.x && pos3.x == pos4.x) return pos3.x - pos1.x;else if (pos1.y == pos2.y && pos3.y == pos4.y) return pos3.y - pos1.y;else return -1;
 }
-
-/**
- * check to see if an item is suitable for the given doorStyle.
- * @param _item
- * @returns true if it's not suitable.
- */
-export function showYelloBox(_item) {
-  var _doorStyle;
-  var doorStyle = _item === null || _item === void 0 ? void 0 : _item.doorStyle;
-
-  // If doorStyle is an Immutable Map, convert to plain JS
-  if (doorStyle && typeof doorStyle.toJS === 'function') {
-    doorStyle = doorStyle.toJS();
-  }
-  var isItemCabinet = (_item === null || _item === void 0 ? void 0 : _item.category) === 'cabinet';
-  var cds = (_doorStyle = doorStyle) === null || _doorStyle === void 0 || (_doorStyle = _doorStyle.doorStyles) === null || _doorStyle === void 0 ? void 0 : _doorStyle.cds;
-
-  // hasItemCDS: item is suitable if its itemID exists in cds
-  var hasItemCDS = isItemCabinet && Array.isArray(cds) ? cds.some(function (element) {
-    return element.itemID === _item.itemID;
-  }) : false;
-
-  // return true if it's a cabinet but not suitable for the current doorStyle
-  return isItemCabinet && !hasItemCDS;
-}
 function isSimilar(a, b) {
   if (threedfabs(a - b) <= 0.01) return 1;
   return 0;
@@ -3473,7 +3438,7 @@ export function addMolding(MGArray, addItem, planData, layer, itemActions, mode)
   if (addItem.selected && [MODE_DRAGGING_ITEM_3D, MODE_ROTATING_ITEM_3D].includes(mode)) return false;
 
   // If the item is not available for current doorStyle
-  if (showYelloBox(addItem))
+  if (isWarningCabinet(addItem))
     // Do not add molding to that item
     return MGArray;
 

package/es/components/viewer3d/viewer3d-first-person.js

@@ -5,12 +5,11 @@ import _createClass from "@babel/runtime/helpers/esm/createClass";
 import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import React from 'react';
 import PropTypes from 'prop-types';
-import AppContext from "../../AppContext";
+import ReactDOM from 'react-dom';
 import * as Three from 'three';
 import { parseData, updateScene } from "./scene-creator";
 import { disposeScene } from "./three-memory-cleaner";
@@ -26,7 +25,6 @@ var Viewer3DFirstPerson = /*#__PURE__*/function (_React$Component) {
     _this.width = props.width;
     _this.height = props.height;
     _this.stopRendering = false;
-    _this.canvasWrapperRef = /*#__PURE__*/React.createRef();
     _this.renderer = window.__threeRenderer || new Three.WebGLRenderer({
       preserveDrawingBuffer: true
     });
@@ -57,7 +55,7 @@ var Viewer3DFirstPerson = /*#__PURE__*/function (_React$Component) {
       };
       var state = this.props.state;
       var data = state.scene;
-      var canvasWrapper = this.canvasWrapperRef.current;
+      var canvasWrapper = ReactDOM.findDOMNode(this.refs.canvasWrapper);
       var scene3D = new Three.Scene();
 
       // As I need to show the pointer above all scene objects, I use this workaround http://stackoverflow.com/a/13309722
@@ -256,8 +254,8 @@ var Viewer3DFirstPerson = /*#__PURE__*/function (_React$Component) {
       this.renderer.renderLists.dispose();
     }
   }, {
-    key: "UNSAFE_componentWillReceiveProps",
-    value: function UNSAFE_componentWillReceiveProps(nextProps) {
+    key: "componentWillReceiveProps",
+    value: function componentWillReceiveProps(nextProps) {
       var width = nextProps.width,
         height = nextProps.height;
       var camera = this.camera,
@@ -290,15 +288,22 @@ var Viewer3DFirstPerson = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       return /*#__PURE__*/React.createElement('div', {
-        ref: this.canvasWrapperRef
+        ref: 'canvasWrapper'
       });
     }
   }]);
 }(React.Component);
-_defineProperty(Viewer3DFirstPerson, "contextType", AppContext);
 export { Viewer3DFirstPerson as default };
 Viewer3DFirstPerson.propTypes = {
   state: PropTypes.object.isRequired,
   width: PropTypes.number.isRequired,
   height: PropTypes.number.isRequired
+};
+Viewer3DFirstPerson.contextTypes = {
+  areaActions: PropTypes.object.isRequired,
+  holesActions: PropTypes.object.isRequired,
+  itemsActions: PropTypes.object.isRequired,
+  linesActions: PropTypes.object.isRequired,
+  projectActions: PropTypes.object.isRequired,
+  catalog: PropTypes.object
 };

package/es/components/viewer3d/viewer3d.js

@@ -1,19 +1,19 @@
 'use strict';
 
 import _readOnlyError from "@babel/runtime/helpers/esm/readOnlyError";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
 import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import React from 'react';
 import PropTypes from 'prop-types';
-import AppContext from "../../AppContext";
+import ReactDOM from 'react-dom';
 import * as Three from 'three';
 import { checkCabinetOverlap, createBacksplash, deleteSpecifiedMeshObjects, fVLine, getDistances, parseData, updateScene, visibleTransformBox } from "./scene-creator";
 import { disposeObject, disposeScene } from "./three-memory-cleaner";
@@ -50,7 +50,6 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
     _this.width = props.width;
     _this.height = props.height;
     _this.renderingID = 0;
-    _this.canvasWrapperRef = /*#__PURE__*/React.createRef();
     var mode = props.state.mode;
     if (!window.__elevationRendererDownload) {
       window.__elevationRendererDownload = {};
@@ -545,7 +544,7 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
         if (item !== null) {
           var catid = item.type;
           var cat = catalog.elements[catid];
-          layoutpos = cat.info.layoutpos;
+          layoutpos = item === null || item === void 0 ? void 0 : item.layoutpos;
         }
         var oPos = new Three.Vector2(pos.clone().x, pos.clone().y);
         var sBounding = obj.children[0].userData;
@@ -565,9 +564,7 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
             return false;
           }
           var _item = layer.items.getIn([data.id]);
-          var ocatid = _item.type;
-          var ocat = catalog.elements[ocatid];
-          var olayoutpos = ocat.info.layoutpos;
+          var olayoutpos = _item.layoutpos;
           if (!(layoutpos === BASE_CABINET_LAYOUTPOS && olayoutpos === WALL_CABINET_LAYOUTPOS || layoutpos === WALL_CABINET_LAYOUTPOS && olayoutpos === BASE_CABINET_LAYOUTPOS)) {
             var tRot = _item.rotation;
             var tPos = new Three.Vector2(_item.x, _item.y);
@@ -1193,9 +1190,8 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
         var curLayerId = _this2.props.state.scene.selectedLayer;
         var curLayer = _this2.props.state.scene.getIn(['layers', curLayerId]);
         if (!isEmpty(evtType) && !isEmpty(evtElement)) {
-          var _state$get, _this2$props$onIntern, _this2$props;
-          var catalog = (_state$get = state.get('catalog')) === null || _state$get === void 0 ? void 0 : _state$get.toJS();
-          var payload = updatePayloadOfInternalEvent(evtElement, curLayer, catalog, pointArray);
+          var _this2$props$onIntern, _this2$props;
+          var payload = updatePayloadOfInternalEvent(evtElement, curLayer, pointArray);
           (_this2$props$onIntern = (_this2$props = _this2.props).onInternalEvent) === null || _this2$props$onIntern === void 0 || _this2$props$onIntern.call(_this2$props, {
             type: evtType,
             value: payload
@@ -2166,7 +2162,7 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
       }
 
       // Add the output of the renderer to the html element
-      var canvasWrapper = this.canvasWrapperRef.current;
+      var canvasWrapper = ReactDOM.findDOMNode(this.refs.canvasWrapper);
       canvasWrapper && canvasWrapper.appendChild(this.renderer.domElement);
 
       //
@@ -2435,8 +2431,8 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
       this.renderer.renderLists.dispose();
     }
   }, {
-    key: "UNSAFE_componentWillReceiveProps",
-    value: function UNSAFE_componentWillReceiveProps(nextProps) {
+    key: "componentWillReceiveProps",
+    value: function componentWillReceiveProps(nextProps) {
       var _this4 = this;
       if (this.props.downloadFlag && diff(this.props.state, nextProps.state).toJS().length == 0 || isEmpty(nextProps.state.scene)) return;
       var width = nextProps.width,
@@ -2646,17 +2642,25 @@ var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
         this.renderer.domElement.style.opacity = '1';
         !this.props.downloadFlag && document.getElementById('front') && (document.getElementById('front').style.display = 'block');
         return /*#__PURE__*/React.createElement('div', {
-          ref: this.canvasWrapperRef
+          ref: 'canvasWrapper'
         });
       }
     }
   }]);
 }(React.Component);
-_defineProperty(Scene3DViewer, "contextType", AppContext);
 export { Scene3DViewer as default };
 Scene3DViewer.propTypes = {
   state: PropTypes.object.isRequired,
   width: PropTypes.number.isRequired,
   height: PropTypes.number.isRequired,
   replaceCabinet: PropTypes.func.isRequired
+};
+Scene3DViewer.contextTypes = {
+  areaActions: PropTypes.object.isRequired,
+  holesActions: PropTypes.object.isRequired,
+  itemsActions: PropTypes.object.isRequired,
+  linesActions: PropTypes.object.isRequired,
+  sceneActions: PropTypes.object.isRequired,
+  projectActions: PropTypes.object.isRequired,
+  catalog: PropTypes.object
 };