kitchen-simulator 4.0.6 → 4.0.7-measurement-unit-payload

package/es/actions/project-actions.js

@@ -286,11 +286,12 @@ export function selectAll() {
     value: value
   };
 }
-export function createRoomWithShape(roomShapeType, width, height, doorStyle) {
+export function createRoomWithShape(roomShapeType, width, height, measurementUnit, doorStyle) {
   return {
     type: CREATE_ROOM_WITH_SHAPE,
     width: width,
     height: height,
+    measurementUnit: measurementUnit,
     roomShapeType: roomShapeType,
     doorStyle: doorStyle
   };

package/es/catalog/factories/wall-factory.js

@@ -16,7 +16,7 @@ var STYLE_LINE = {
   // strokeWidth:1
 };
 var STYLE_INTERIOR_LINE = {
-  strokeWidth: 2,
+  strokeWidth: 4,
   stroke: SharedStyle.INTERIOR_LINE.unselected
 };
 var STYLE_INTERIOR_LINE_SELECTED = {

package/es/catalog/utils/exporter.js

@@ -20,9 +20,18 @@ export default function (_ref) {
     alti = _ref.alti,
     obj_property = _ref.obj_property,
     outlineSVGData = _ref.outlineSVGData,
-    cds = _ref.cds;
+    cds = _ref.cds,
+    _ref$width_unit = _ref.width_unit,
+    width_unit = _ref$width_unit === void 0 ? 'in' : _ref$width_unit,
+    _ref$height_unit = _ref.height_unit,
+    height_unit = _ref$height_unit === void 0 ? 'in' : _ref$height_unit,
+    _ref$length_unit = _ref.length_unit,
+    length_unit = _ref$length_unit === void 0 ? 'in' : _ref$length_unit;
+  var widthUnit = width_unit === 'inch' ? 'in' : width_unit;
+  var heightUnit = height_unit === 'inch' ? 'in' : height_unit;
+  var lengthUnit = length_unit === 'inch' ? 'in' : length_unit;
   var _length = alti || 0;
-  var length = convert(_length).from('in').to('cm');
+  var length = convert(_length).from(lengthUnit).to('cm');
   // const length = _length;
 
   var additional_props = [];
@@ -33,8 +42,8 @@ export default function (_ref) {
         type: 'length-measure',
         defaultValue: {
           _length: sizeinfo.width,
-          _unit: 'in',
-          length: convert(sizeinfo.width).from('in').to('cm')
+          _unit: widthUnit,
+          length: convert(sizeinfo.width).from(widthUnit).to('cm')
         }
       }
     };
@@ -46,8 +55,8 @@ export default function (_ref) {
         type: 'length-measure',
         defaultValue: {
           _length: sizeinfo.width,
-          _unit: 'in',
-          length: convert(sizeinfo.width).from('in').to('cm')
+          _unit: widthUnit,
+          length: convert(sizeinfo.width).from(widthUnit).to('cm')
         }
       },
       depth: {
@@ -55,8 +64,8 @@ export default function (_ref) {
         type: 'length-measure',
         defaultValue: {
           _length: sizeinfo.depth,
-          _unit: 'in',
-          length: convert(sizeinfo.depth).from('in').to('cm')
+          _unit: lengthUnit,
+          length: convert(sizeinfo.depth).from(lengthUnit).to('cm')
         }
       },
       height: {
@@ -64,8 +73,8 @@ export default function (_ref) {
         type: 'length-measure',
         defaultValue: {
           _length: sizeinfo.height,
-          _unit: 'in',
-          length: convert(sizeinfo.height).from('in').to('cm')
+          _unit: heightUnit,
+          length: convert(sizeinfo.height).from(heightUnit).to('cm')
         }
       }
     };
@@ -97,7 +106,7 @@ export default function (_ref) {
         type: 'length-measure',
         defaultValue: {
           _length: _length,
-          _unit: 'in',
+          _unit: lengthUnit,
           length: length
         }
       },
@@ -138,6 +147,9 @@ export default function (_ref) {
     obj: obj_property,
     cds: cds,
     structure_json: structure_json,
+    width_unit: widthUnit,
+    length_unit: lengthUnit,
+    height_unit: heightUnit,
     render2D: function render2D(element, layer, scene) {
       return render2DItem.call(this, element, layer, scene, sizeinfo, layoutpos, is_corner, shape_svg);
     },

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

@@ -1001,18 +1001,13 @@ export function render3DItem(element, layer, scene, sizeinfo, structure_json, is
     if (!isEmpty(doorStyles)) {
       var _layer$toJS;
       var normalMap = doorStyles.get('base') || INITIAL_NORMAL_MAP;
-      if (isEmpty(counterTop.uri)) {
-        try {
-          counterTop = counterTop.toJS();
-        } catch (error) {
-          //@todo THIS IS A TEMPORARY FIX FOR COUNTERTOP TEXTURE UNDEFINED ISSUE
-          counterTop.uri = 'https://media.test.diydesignspace.com/uploads/CountTop/202105074107_5/texture/Unique_Calcatta_texture.jpg';
-          console.log(error);
-        }
-      }
       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;
       }
+      if (isEmpty(counterTop.uri)) {
+        //@todo THIS IS A TEMPORARY FIX FOR COUNTERTOP TEXTURE UNDEFINED ISSUE
+        counterTop.uri = 'https://media.test.diydesignspace.com/uploads/CountTop/202105074107_5/texture/Unique_Calcatta_texture.jpg';
+      }
       var countTopMap = counterTop.uri;
       var interiorMap = doorStyles.get('interior');
       var countT = loadTexture(countTopMap);

package/es/class/item.js

@@ -492,6 +492,9 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "storeDistArray",
     value: function storeDistArray(state, layerID, itemID, distArray) {
+      if (isEmpty(distArray)) return {
+        updatedState: state
+      };
       var curDistArray = state.getIn(['scene', 'layers', layerID, 'items', itemID, 'distArray']);
       distArray.forEach(function (dist) {
         dist[0] < 0 ? dist[0] = 0 : dist[0];

package/es/class/layer.js

@@ -567,7 +567,7 @@ var Layer = /*#__PURE__*/function () {
         return v.id !== vertexID && GeometryUtils.samePoints(vertex, v) // &&
         //!v.lines.contains( vertexID ) &&
         //!v.areas.contains( vertexID )
-        ;
+;
       });
       if (doubleVertices.isEmpty()) return {
         updatedState: state

package/es/class/project.js

@@ -103,6 +103,8 @@ var Project = /*#__PURE__*/function () {
       //   sceneJSON && (sceneJSON.layers[layerID] = newlayer);
       // }
 
+      // check type of ceilHeight and make it to Number
+      if (typeof sceneJSON.layers[layerID].ceilHeight !== 'number') sceneJSON.layers[layerID].ceilHeight = Number(sceneJSON.layers[layerID].ceilHeight);
       var newScene = new Scene(sceneJSON);
       state = new State({
         scene: newScene.toJS(),
@@ -168,6 +170,8 @@ var Project = /*#__PURE__*/function () {
       // Matching state.doorStyle with layer.doorStyle
       if (state.getIn(['scene', 'layers', layerID, 'doorStyle'])) {
         doorStyle = state.getIn(['scene', 'layers', layerID, 'doorStyle']);
+      } else if (!isEmpty(doorStyle)) {
+        state = state.setIn(['scene', 'layers', layerID, 'doorStyle'], doorStyle);
       }
       state = state.merge({
         doorStyle: doorStyle,
@@ -828,11 +832,10 @@ var Project = /*#__PURE__*/function () {
     }
   }, {
     key: "createRoomWithShape",
-    value: function createRoomWithShape(state, roomShapeType, width, height, doorStyle) {
+    value: function createRoomWithShape(state, roomShapeType, width, height, measurementUnit, doorStyle) {
       var catalog = state.catalog;
-      // keep measurement unit, sceneHistory
+      // keep sceneHistory
       var curLayerID = state.scene.selectedLayer;
-      var layerUnit = state.getIn(['scene', 'layers', curLayerID, 'unit']);
       var ceilHeight = state.getIn(['scene', 'layers', curLayerID, 'ceilHeight']);
       var sceneHistory = state.getIn(['sceneHistory']);
       state = this.newProject(state).updatedState;
@@ -847,8 +850,8 @@ var Project = /*#__PURE__*/function () {
         if (isEmpty(viewer)) return {
           updatedState: state
         };
-        width = convert(width).from(state.getIn(['scene', 'layers', 'layer-1', 'unit'])).to('cm');
-        height = convert(height).from(state.getIn(['scene', 'layers', 'layer-1', 'unit'])).to('cm');
+        width = convert(width).from(measurementUnit).to('cm');
+        height = convert(height).from(measurementUnit).to('cm');
         var halfWidth = width / 2;
         var halfHeight = height / 2;
         var viewerWidth = viewer.SVGWidth;
@@ -921,8 +924,7 @@ var Project = /*#__PURE__*/function () {
         }
       }
 
-      // copy keeped measurement unit, sceneHistory
-      state = state.setIn(['scene', 'layers', layerID, 'unit'], layerUnit);
+      // copy keeped sceneHistory
       state = state.setIn(['scene', 'layers', layerID, 'ceilHeight'], ceilHeight);
       state = state.setIn(['sceneHistory'], sceneHistory);
       state = centering2D(state);

package/es/components/viewer2d/line.js

@@ -34,28 +34,28 @@ export var STYLE_ROOM_SHAPE = {
 var STYLE_DASH = {
   stroke: DASH_LINE_COLOR,
   strokeDasharray: '4 4',
-  strokeWidth: '2px',
+  strokeWidth: '1px',
   strokeLinecap: 'round'
 };
 var STYLE_ROOM_ELEMENT = {
   fill: ROOM_ELEMENT_MEASUREMENT_LINE_COLOR,
   stroke: ROOM_ELEMENT_MEASUREMENT_LINE_COLOR,
-  strokeWidth: '2px'
+  strokeWidth: '1.5px'
 };
 var STYLE_BASE_ITEM = {
   fill: BASE_ITEM_MEASUREMENT_LINE_COLOR,
   stroke: BASE_ITEM_MEASUREMENT_LINE_COLOR,
-  strokeWidth: '2px'
+  strokeWidth: '1.5px'
 };
 var STYLE_WALL_ITEM = {
   fill: WALL_ITEM_MEASUREMENT_LINE_COLOR,
   stroke: WALL_ITEM_MEASUREMENT_LINE_COLOR,
-  strokeWidth: '2px'
+  strokeWidth: '1.5px'
 };
 var STYLE_DISTANCE = {
   fill: DISTANCE_MEASUREMENT_LINE_COLOR,
   stroke: DISTANCE_MEASUREMENT_LINE_COLOR,
-  strokeWidth: '2px'
+  strokeWidth: '1.5px'
 };
 var selectStyle = function selectStyle(element, style) {
   return element.iFlag ? style : STYLE_DISTANCE;

package/es/components/viewer2d/ruler.js

@@ -1,13 +1,9 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { convert } from "../../utils/convert-units-lite";
 import IDBroker from "../../utils/id-broker";
-import { LINE_THICKNESS, TEXT_COLOR_NEUTRAL_7, UNIT_FOOT, UNIT_METER } from "../../constants";
+import { TEXT_COLOR_NEUTRAL_7 } from "../../constants";
 import { STYLE_ROOM_SHAPE } from "./line";
-var STYLE = {
-  stroke: TEXT_COLOR_NEUTRAL_7,
-  strokeWidth: '1px'
-};
+import { getRulerDisplayData } from "../../utils/ruler";
 var BACKGROUNDSTYLE = {
   fill: 'transparent',
   fillOpacity: 0.8
@@ -31,13 +27,20 @@ export default function Ruler(_ref) {
     rulerUnit = _ref.rulerUnit,
     transform = _ref.transform,
     style = _ref.style;
-  var ruLength = convert(length).from(unit).to(rulerUnit);
-  var fixedLength = layer.unit === UNIT_METER || layer.unit === UNIT_FOOT ? 2 : 0;
-  var distanceText = (Math.round(convert(ruLength).from(rulerUnit).to(layer.unit) * 100) / 100).toFixed(fixedLength);
-  var textLength = (distanceText.length + layer.unit.length) * 9;
+  var _getRulerDisplayData = getRulerDisplayData({
+      length: length,
+      unit: unit,
+      rulerUnit: rulerUnit,
+      layerUnit: layer.unit
+    }),
+    distanceText = _getRulerDisplayData.distanceText,
+    unitStr = _getRulerDisplayData.unitStr,
+    textLength = _getRulerDisplayData.textLength,
+    bShowText = _getRulerDisplayData.bShowText,
+    bShowLine = _getRulerDisplayData.bShowLine;
   return /*#__PURE__*/React.createElement("g", {
     transform: transform
-  }, /*#__PURE__*/React.createElement("g", {
+  }, bShowText && /*#__PURE__*/React.createElement("g", {
     id: "ruler"
   }, /*#__PURE__*/React.createElement("rect", {
     id: "ruler_rect_".concat(IDBroker.acquireID()),
@@ -54,7 +57,7 @@ export default function Ruler(_ref) {
     transform: "scale(1, -1)",
     style: STYLE_TEXT,
     fill: TEXT_COLOR_NEUTRAL_7
-  }, distanceText, layer.unit === 'in' ? '"' : layer.unit)), /*#__PURE__*/React.createElement("line", {
+  }, distanceText, unitStr)), bShowLine && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("line", {
     x1: style === STYLE_ROOM_SHAPE ? 0 : 4,
     y1: "0",
     x2: (length - textLength) / 2 < 0 ? 0 : (length - textLength) / 2,
@@ -72,7 +75,7 @@ export default function Ruler(_ref) {
   }), /*#__PURE__*/React.createElement("polygon", {
     points: "".concat(length - 3, ", 0, ").concat(length - 6.5, ", 2, ").concat(length - 6.5, ", -2"),
     style: style
-  })));
+  }))));
 }
 Ruler.propTypes = {
   length: PropTypes.number.isRequired,

package/es/components/viewer2d/rulerDist.js

@@ -1,12 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { convert } from "../../utils/convert-units-lite";
-import { UNIT_FOOT, UNIT_METER } from "../../constants";
-var ARROW_STYLE = {
-  stroke: '#1183B7',
-  strokeWidth: '2px',
-  strokeLinecap: 'round'
-};
+import { getRulerDisplayData } from "../../utils/ruler";
 var STYLE = {
   stroke: '#455A64',
   fill: '#455A64',
@@ -32,10 +26,17 @@ export default function RulerDist(_ref) {
     transform = _ref.transform,
     angle = _ref.angle,
     rotation = _ref.rotation;
-  var ruLength = convert(length).from(unit).to(rulerUnit);
-  var fixedLength = layer.unit === UNIT_METER || layer.unit === UNIT_FOOT ? 2 : 0;
-  var distanceText = (Math.round(convert(ruLength).from(rulerUnit).to(layer.unit) * 100) / 100).toFixed(fixedLength);
-  var textLength = (distanceText.length + layer.unit.length) * 8;
+  var _getRulerDisplayData = getRulerDisplayData({
+      length: length,
+      unit: unit,
+      rulerUnit: rulerUnit,
+      layerUnit: layer.unit
+    }),
+    distanceText = _getRulerDisplayData.distanceText,
+    unitStr = _getRulerDisplayData.unitStr,
+    textLength = _getRulerDisplayData.textLength,
+    bShowText = _getRulerDisplayData.bShowText,
+    bShowLine = _getRulerDisplayData.bShowLine;
   var textangle = angle + 90;
   var textRotation = 1;
   var ay = 2;
@@ -67,47 +68,32 @@ export default function RulerDist(_ref) {
     textRotation = 180;
     ay = 5;
   }
-  if (ruLength > 0) {
-    if (ruLength < 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
-      }, distanceText, 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
-      }, distanceText, 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 null;
-  }
+  return /*#__PURE__*/React.createElement("g", {
+    transform: transform
+  }, bShowText && /*#__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
+  }, distanceText, unitStr)), bShowLine && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__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
+  })));
 }
 RulerDist.propTypes = {
   length: PropTypes.number.isRequired,

package/es/components/viewer2d/viewer2d.js

@@ -835,11 +835,15 @@ export default function Viewer2D(_ref, _ref2) {
     var event = viewerEvent.originalEvent;
     var parent = document.querySelector('#kitchen-simulator-container');
     var targetRect = event.target.getBoundingClientRect();
-    var parentRect = parent.getBoundingClientRect();
-    var left = targetRect.left - parentRect.left;
-    var top = targetRect.top - parentRect.top;
-    left = left - (200 - targetRect.width) / 2;
-    top = top - (50 - targetRect.height) / 2;
+    var left = targetRect.left;
+    var top = targetRect.top;
+    if (!isEmpty(parent)) {
+      var parentRect = parent.getBoundingClientRect();
+      left = targetRect.left - parentRect.left;
+      top = targetRect.top - parentRect.top;
+      left = left - (200 - targetRect.width) / 2;
+      top = top - (50 - targetRect.height) / 2;
+    }
     if (!mode.includes('ING')) {
       setToolbar('');
     }
@@ -931,6 +935,7 @@ export default function Viewer2D(_ref, _ref2) {
               // handle action when click elevation about selected line
               var _mode = MODE_ELEVATION_VIEW;
               projectActions.setMode(_mode);
+              internalType = constants.INTERNAL_EVENT_TOGGLE_TO_ELEVATION;
               break;
             } else {
               var tlines = [];