kitchen-simulator 2.0.56 → 2.0.60

package/es/catalog/holes/window-clear/planner-element.js

@@ -4,12 +4,12 @@ import { loadGLTF, scaleObject } from "../../utils/load-obj";
 import { OBJTYPE_MESH } from "../../../constants";
 var cached3DWindow = null;
 export default {
-  name: 'Window',
+  name: 'Clear Window',
   prototype: 'holes',
   info: {
     title: 'Clear',
     tag: ['window'],
-    description: 'Window',
+    description: 'Clear Window',
     image: '/assets/img/svg/window/Clear.svg',
     url: '/assets/gltf/window_clear.gltf'
   },

package/es/class/item.js

@@ -30,6 +30,7 @@ var Item = /*#__PURE__*/function () {
     value: function create(state, layerID, type, x, y, width, height, rotation, isDuplication) {
       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 itemID = IDBroker.acquireID();
       var item = state.catalog.factoryElement(type, {
         id: itemID,
@@ -50,19 +51,25 @@ var Item = /*#__PURE__*/function () {
         isInitialPos: isInitialPos ? isInitialPos : false
       }, null, state);
       if (item.category === 'cabinet') {
-        var _state$doorStyle;
-        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']);
-        if (cds) {
-          var updatedDoorStyles = _objectSpread(_objectSpread({}, temp.doorStyles), {}, {
-            cds: [cds]
-          });
+        if (isDuplication && refItem) {
           item = item.merge({
-            doorStyle: fromJS(_objectSpread(_objectSpread({}, temp), {}, {
-              doorStyles: updatedDoorStyles
-            }))
+            doorStyle: refItem.doorStyle
           });
+        } else {
+          var _state$doorStyle;
+          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']);
+          if (cds) {
+            var updatedDoorStyles = _objectSpread(_objectSpread({}, temp.doorStyles), {}, {
+              cds: [cds]
+            });
+            item = item.merge({
+              doorStyle: fromJS(_objectSpread(_objectSpread({}, temp), {}, {
+                doorStyles: updatedDoorStyles
+              }))
+            });
+          }
         }
       }
       if (item.get('type') === 'cabinet' && item.get('doorStyle').size === 0) {
@@ -294,7 +301,7 @@ var Item = /*#__PURE__*/function () {
           var isrectSect = GeometryUtils.validInterSect(allRect, val);
           if (isrectSect) {
             // Duplicated object has a original object's molding property
-            var _this$create = this.create(state, layerID, sceneComponentType, x + width * Math.cos(rotRad), y + width * Math.sin(rotRad), 200, 100, rotRad * 180 / Math.PI, true, myObject.molding),
+            var _this$create = 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$create.updatedState,
               item = _this$create.item;
             duplicatedElement = item;
@@ -321,7 +328,7 @@ var Item = /*#__PURE__*/function () {
             _val.is_corner = allItemRect.cur.is_corner;
             var isRect = GeometryUtils.validInterSect(allRect, _val);
             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),
+              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;
@@ -348,7 +355,7 @@ var Item = /*#__PURE__*/function () {
               _val2.is_corner = allItemRect.cur.is_corner;
               var isRectDown = GeometryUtils.validInterSect(allRect, _val2);
               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),
+                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;
@@ -375,7 +382,7 @@ var Item = /*#__PURE__*/function () {
                 _val3.is_corner = allItemRect.cur.is_corner;
                 var isRectUp = GeometryUtils.validInterSect(allRect, _val3);
                 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),
+                  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;

package/es/components/viewer2d/item.js

@@ -32,7 +32,8 @@ export default function Item(_ref, _ref2) {
   var x = item.x,
     y = item.y,
     rotation = item.rotation,
-    id = item.id;
+    id = item.id,
+    layoutpos = item.layoutpos;
   var showBaseCabinetMeasure = scene.showBaseCabinetMeasure,
     showWallCabinetMeasure = scene.showWallCabinetMeasure;
   var vertices = layer.vertices;
@@ -43,6 +44,7 @@ export default function Item(_ref, _ref2) {
   var allLineRects;
   var allItemRect;
   var width, height;
+  var altitude = item.properties.getIn(['altitude', '_length']);
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     clockRotateState = _useState2[0],
@@ -146,33 +148,36 @@ export default function Item(_ref, _ref2) {
       // }
 
       if (!item.selected) {
-        var _x = val.pos.x;
-        var _y = val.pos.y;
-        var rotRad = val.rotRad;
-        var w = val.size.width / 2;
-        var h = val.size.height / 2;
-        var mx = _x - w * Math.cos(rotRad);
-        var my = _y - w * Math.sin(rotRad);
-        var x0 = mx + h * Math.sin(rotRad);
-        var y0 = my - h * Math.cos(rotRad);
-        var x3 = mx * 2 - x0;
-        var y3 = my * 2 - y0;
-        var x1 = _x * 2 - x3;
-        var y1 = _y * 2 - y3;
-        var x2 = _x * 2 - x0;
-        var y2 = _y * 2 - y0;
-        rectarray.push({
-          rect: [point(x0, y0), point(x1, y1), point(x0, y0), point(x1, y1)]
-        });
-        rectarray.push({
-          rect: [point(x1, y1), point(x2, y2), point(x1, y1), point(x2, y2)]
-        });
-        rectarray.push({
-          rect: [point(x2, y2), point(x3, y3), point(x2, y2), point(x3, y3)]
-        });
-        rectarray.push({
-          rect: [point(x3, y3), point(x0, y0), point(x3, y3), point(x0, y0)]
-        });
+        var detectObjectsAtSameAltitudeFlag = layoutpos === 'Base' ? item.properties.getIn(['altitude', '_length']) <= altitude + tempHeight.get('_length') : item.properties.getIn(['altitude', '_length']) + item.properties.getIn(['height', '_length']) >= altitude;
+        if (detectObjectsAtSameAltitudeFlag) {
+          var _x = val.pos.x;
+          var _y = val.pos.y;
+          var rotRad = val.rotRad;
+          var w = val.size.width / 2;
+          var h = val.size.height / 2;
+          var mx = _x - w * Math.cos(rotRad);
+          var my = _y - w * Math.sin(rotRad);
+          var x0 = mx + h * Math.sin(rotRad);
+          var y0 = my - h * Math.cos(rotRad);
+          var x3 = mx * 2 - x0;
+          var y3 = my * 2 - y0;
+          var x1 = _x * 2 - x3;
+          var y1 = _y * 2 - y3;
+          var x2 = _x * 2 - x0;
+          var y2 = _y * 2 - y0;
+          rectarray.push({
+            rect: [point(x0, y0), point(x1, y1), point(x0, y0), point(x1, y1)]
+          });
+          rectarray.push({
+            rect: [point(x1, y1), point(x2, y2), point(x1, y1), point(x2, y2)]
+          });
+          rectarray.push({
+            rect: [point(x2, y2), point(x3, y3), point(x2, y2), point(x3, y3)]
+          });
+          rectarray.push({
+            rect: [point(x3, y3), point(x0, y0), point(x3, y3), point(x0, y0)]
+          });
+        }
       }
     });
 
@@ -253,7 +258,7 @@ export default function Item(_ref, _ref2) {
           if (GeometryUtils.pointsDistance(p0.x, p0.y, p1.x, p1.y) > GeometryUtils.pointsDistance(p0.x, p0.y, coordinatePoint.x, coordinatePoint.y) && GeometryUtils.pointsDistance(p0.x, p0.y, p1.x, p1.y) > GeometryUtils.pointsDistance(p1.x, p1.y, coordinatePoint.x, coordinatePoint.y)) {
             if (GeometryUtils.pointsDistance(coordinatePoint.x, coordinatePoint.y, center_x, center_y) > GeometryUtils.pointsDistance(centerpoint[0].x, centerpoint[0].y, coordinatePoint.x, coordinatePoint.y)) {
               comparelength.push(GeometryUtils.pointsDistance(centerpoint[0].x, centerpoint[0].y, coordinatePoint.x, coordinatePoint.y));
-              a = Math.max.apply(null, comparelength);
+              a = Math.min.apply(null, comparelength);
             }
           }
         }

package/es/components/viewer2d/rulerDist.js

@@ -66,63 +66,46 @@ export default function RulerDist(_ref) {
     textRotation = 180;
     ay = 5;
   }
-  if (Math.abs(length - textLength) / 2 <= 16) {
-    var dy = textRotation == 0 ? 15 : -15;
-    return /*#__PURE__*/React.createElement("g", {
-      transform: transform
-    }, /*#__PURE__*/React.createElement("g", {
-      transform: "translate(0, ".concat(dy, ")")
-    }, /*#__PURE__*/React.createElement("text", {
-      x: "0",
-      y: "0",
-      transform: "translate(".concat(length / 2, ",").concat(ay, ") scale(1, -1) rotate(").concat(textRotation, ")"),
-      style: STYLE_TEXT
-    }, Math.round(convert(distanceText).from('in').to(layer.unit) * 100) / 100, layer.unit === 'in' ? '"' : layer.unit)), /*#__PURE__*/React.createElement("line", {
-      x1: "2",
-      y1: "0",
-      x2: (length - textLength) / 2 < 0 ? 0 : length,
-      y2: "0",
-      style: STYLE
-    }), /*#__PURE__*/React.createElement("polygon", {
-      points: "1, 0, 4.5, -2, 4.5, 2 ",
-      style: STYLE
-    }), /*#__PURE__*/React.createElement("line", {
-      x1: (length + textLength) / 2 < 0 ? 0 : (length + textLength) / 2 < length ? (length + textLength) / 2 : length,
-      y1: "0",
-      x2: length,
-      y2: "0",
-      style: STYLE
-    }), /*#__PURE__*/React.createElement("polygon", {
-      points: "".concat(length - 1, ", 0, ").concat(length - 4.5, ", 2, ").concat(length - 4.5, ", -2"),
-      style: STYLE
-    }));
+  if (distanceText > 0) {
+    if (distanceText < 28) {
+      return /*#__PURE__*/React.createElement("g", {
+        transform: transform
+      }, /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("text", {
+        x: "0",
+        y: "0",
+        transform: "translate(".concat(length / 2, ",").concat(ay, ") scale(1, -1) rotate(").concat(textRotation, ")"),
+        style: STYLE_TEXT
+      }, Math.round(convert(distanceText).from('in').to(layer.unit) * 100) / 100, layer.unit === 'in' ? '"' : layer.unit)));
+    } else {
+      return /*#__PURE__*/React.createElement("g", {
+        transform: transform
+      }, /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("text", {
+        x: "0",
+        y: "0",
+        transform: "translate(".concat(length / 2, ",").concat(ay, ") scale(1, -1) rotate(").concat(textRotation, ")"),
+        style: STYLE_TEXT
+      }, Math.round(convert(distanceText).from('in').to(layer.unit) * 100) / 100, layer.unit === 'in' ? '"' : layer.unit)), /*#__PURE__*/React.createElement("line", {
+        x1: "2",
+        y1: "0",
+        x2: (length - textLength) / 2 < 0 ? 0 : (length - textLength) / 2,
+        y2: "0",
+        style: STYLE
+      }), /*#__PURE__*/React.createElement("polygon", {
+        points: "1, 0, 4.5, -2, 4.5, 2 ",
+        style: STYLE
+      }), /*#__PURE__*/React.createElement("line", {
+        x1: (length + textLength) / 2 < 0 ? 0 : (length + textLength) / 2 < length ? (length + textLength) / 2 : length,
+        y1: "0",
+        x2: length,
+        y2: "0",
+        style: STYLE
+      }), /*#__PURE__*/React.createElement("polygon", {
+        points: "".concat(length - 1, ", 0, ").concat(length - 4.5, ", 2, ").concat(length - 4.5, ", -2"),
+        style: STYLE
+      }));
+    }
   } else {
-    return /*#__PURE__*/React.createElement("g", {
-      transform: transform
-    }, /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("text", {
-      x: "0",
-      y: "0",
-      transform: "translate(".concat(length / 2, ",").concat(ay, ") scale(1, -1) rotate(").concat(textRotation, ")"),
-      style: STYLE_TEXT
-    }, Math.round(convert(distanceText).from('in').to(layer.unit) * 100) / 100, layer.unit === 'in' ? '"' : layer.unit)), /*#__PURE__*/React.createElement("line", {
-      x1: "2",
-      y1: "0",
-      x2: (length - textLength) / 2 < 0 ? 0 : (length - textLength) / 2,
-      y2: "0",
-      style: STYLE
-    }), /*#__PURE__*/React.createElement("polygon", {
-      points: "1, 0, 4.5, -2, 4.5, 2 ",
-      style: STYLE
-    }), /*#__PURE__*/React.createElement("line", {
-      x1: (length + textLength) / 2 < 0 ? 0 : (length + textLength) / 2 < length ? (length + textLength) / 2 : length,
-      y1: "0",
-      x2: length,
-      y2: "0",
-      style: STYLE
-    }), /*#__PURE__*/React.createElement("polygon", {
-      points: "".concat(length - 1, ", 0, ").concat(length - 4.5, ", 2, ").concat(length - 4.5, ", -2"),
-      style: STYLE
-    }));
+    return null;
   }
 }
 RulerDist.propTypes = {

package/es/components/viewer2d/viewer2d.js

@@ -1243,12 +1243,9 @@ export default function Viewer2D(_ref, _ref2) {
         break;
     }
     if (internalType) {
-      var _currentObject = null;
-      if (internalType === INTERNAL_EVENT_SELECT_ELEMENT || internalType === constants.INTERNAL_EVENT_REPLACE_CABINET) {
-        var _currentObject2;
-        _currentObject = state.getIn(['scene', 'layers', layerID, elementData === null || elementData === void 0 ? void 0 : elementData.prototype, elementData === null || elementData === void 0 ? void 0 : elementData.id]);
-        if (internalType === INTERNAL_EVENT_SELECT_ELEMENT && ((_currentObject2 = _currentObject) === null || _currentObject2 === void 0 ? void 0 : _currentObject2.prototype) === 'items' && draggingDistance > constants.EPSILON) internalType = INTERNAL_EVENT_DRAG_ELEMENT;
-      } else if (draggingDistance > constants.EPSILON) {
+      var _currentObject2;
+      var _currentObject = state.getIn(['scene', 'layers', layerID, elementData === null || elementData === void 0 ? void 0 : elementData.prototype, elementData === null || elementData === void 0 ? void 0 : elementData.id]);
+      if (internalType === INTERNAL_EVENT_SELECT_ELEMENT && ((_currentObject2 = _currentObject) === null || _currentObject2 === void 0 ? void 0 : _currentObject2.prototype) === 'items' && draggingDistance > constants.EPSILON) internalType = INTERNAL_EVENT_DRAG_ELEMENT;else if (internalType === INTERNAL_EVENT_DRAW_ELEMENT || draggingDistance > constants.EPSILON) {
         var elementID = state.getIn(['scene', 'layers', layerID, 'selected', elementPrototype]).first();
         _currentObject = state.getIn(['scene', 'layers', layerID, elementPrototype, elementID]);
       }
@@ -1289,10 +1286,10 @@ export default function Viewer2D(_ref, _ref2) {
     if (_zoomValue > constants.MAX_ZOOM_IN_SCALE) return;
     if (_zoomValue < 0 || Number.isNaN(_zoomValue)) return;
     if (rulerEdit !== null && value.startX && value.startY || value.lastAction === 'zoom') {
-      var _rulerEdit = document.getElementById('ruler_numberInput'),
+      var _rulerEdit = document.getElementById('ruler_numberInput') && document.getElementById('ruler_numberInput'),
         _rect;
       if (rulerEditID !== null) {
-        _rect = document.getElementById(rulerEditID);
+        _rect = document.getElementById(rulerEditID) && document.getElementById(rulerEditID);
       }
       var bbox;
       if (_rect && _rulerEdit) {

package/es/components/viewer3d/front3D.js

@@ -2,6 +2,7 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React, { useState, useEffect } from 'react';
 import Viewer3D from "./viewer3d";
 import State3D from "./ruler-utils/state3D";
+import { isEmpty } from "../viewer2d/utils";
 var k = 0;
 export default function Front3D(_ref, _ref2) {
   var width = _ref.width,
@@ -26,9 +27,9 @@ export default function Front3D(_ref, _ref2) {
     setToolbar('');
   };
   useEffect(function () {
-    document.getElementById('front').addEventListener('mouseup', mouseUpEvent);
+    if (!isEmpty(document.getElementById('front'))) document.getElementById('front').addEventListener('mouseup', mouseUpEvent);
     return function () {
-      document.getElementById('front').removeEventListener('mouseup', mouseUpEvent);
+      if (!isEmpty(document.getElementById('front'))) document.getElementById('front').removeEventListener('mouseup', mouseUpEvent);
     };
   }, []);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("svg", {

package/es/constants.js

@@ -653,7 +653,7 @@ export var PROJECT_SETTING_OPTION = {
   CHANGE_WINDOW_DOOR_MEASURE: CHANGE_WINDOW_DOOR_MEASURE
 };
 export var HOLE_NAMES = {
-  WINDOW_CLEAR: 'Window',
+  WINDOW_CLEAR: 'Clear Window',
   WINDOW_CROSS: 'Cross Window',
   WINDOW_DOUBLE_HUNG: 'Double Hung Window',
   WINDOW_VERTICAL: 'window-vertical',
@@ -698,6 +698,15 @@ export var PROP_ALTITUDE = 'altitude';
 export var PROP_RESIZE_WIDTH = 'width';
 export var PROP_RESIZE_HEIGHT = 'height';
 export var PROP_RESIZE_DEPTH = 'depth';
+
+// finishing typs
+export var FINISHING_TYPE = {
+  COUNTER_TOP: 'counterTop',
+  DOOR_HANDLE: 'doorHandle',
+  WALL_COLOR: 'wallColor',
+  FLOOR_STYLE: 'floorStyle',
+  BACKSPLASH: 'backsplash'
+};
 export var MAX_ZOOM_IN_SCALE = Infinity;
 
 // external event type
@@ -729,6 +738,7 @@ export var EXTERNAL_EVENT_DELETE_ELEMENT = 'EXTERNAL_EVENT_DELETE_ELEMENT';
 export var EXTERNAL_EVENT_UPDATE_ATTRIBUTE = 'EXTERNAL_EVENT_UPDATE_ATTRIBUTE'; // update the element's attributes (distance, rotation...) in the property window
 export var EXTERNAL_EVENT_UPDATE_PROPERTY = 'EXTERNAL_EVENT_UPDATE_PROPERTY'; // update the element's property (flip_doorhandle, open_doors...) in the property window
 export var EXTERNAL_EVENT_REPLACE_CABINET = 'EXTERNAL_EVENT_REPLACE_CABINET';
+export var EXTERNAL_EVENT_SET_FINISHING = 'EXTERNAL_EVENT_SET_FINISHING'; // set finishing(wallColor, floorStyle, doorHandle, backsplash, counterTop)
 
 // internal event type
 export var INTERNAL_EVENT_UNSELECT_ALL = 'INTERNAL_EVENT_UNSELECT_ALL';