kitchen-simulator 4.0.0-queuedEvents → 4.0.0

package/lib/components/viewer2d/ruler.js

@@ -10,6 +10,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _convertUnitsLite = require("../../utils/convert-units-lite");
 var _idBroker = _interopRequireDefault(require("../../utils/id-broker"));
 var _constants = require("../../constants");
+var _line = require("./line");
 var STYLE = {
   stroke: _constants.TEXT_COLOR_NEUTRAL_7,
   strokeWidth: '1px'
@@ -22,6 +23,7 @@ var STYLE_TEXT = {
   textAnchor: 'middle',
   fontSize: '12px',
   pointerEvents: 'none',
+  fill: '#455A64',
   //http://stackoverflow.com/questions/826782/how-to-disable-text-selection-highlighting-using-css
   WebkitTouchCallout: 'none' /* iOS Safari */,
   WebkitUserSelect: 'none' /* Chrome/Safari/Opera */,
@@ -35,37 +37,11 @@ function Ruler(_ref) {
     unit = _ref.unit,
     rulerUnit = _ref.rulerUnit,
     transform = _ref.transform,
-    flag = _ref.flag;
-  var update = function update(lengthInput, unitInput, type) {
-    var newLength = toFixedFloat(lengthInput);
-    var merged = null;
-    if (type === 0) {
-      merged = value.merge({
-        _length: newLength,
-        length: (0, _convertUnitsLite.convert)(newLength).from(unitInput).to('cm')
-      });
-    } else {
-      merged = value.merge({
-        _length: (0, _convertUnitsLite.convert)(newLength).from(UNIT_INCH).to(unitInput),
-        _unit: unitInput
-      });
-    }
-    // if (hook) {
-    //   return hook(merged, sourceElement, internalState, state).then(val => {
-    //     return onUpdate(val);
-    //   });
-    // }
-    // return onUpdate(merged);
-  };
-  // let _unit = "in";
-  // let distanceText = convert(length).from(unit).to(rulerUnit);
-  var distanceText = (0, _convertUnitsLite.convert)(length).from(unit).to(rulerUnit).toFixed(0);
-  var thickness = (0, _convertUnitsLite.convert)(_constants.LINE_THICKNESS).from(unit).to(rulerUnit).toFixed(0);
-  // let _ft_len = convert(_length).from('in').to('ft');
-  // let _ft_val = Math.floor(_ft_len); _ft_len -= _ft_val;
-  // let _in_val = convert(_ft_len).from('ft').to('in').toFixed(0);
-  // let distanceText = `${_ft_val}'${_in_val}"`;
-  var textLength = (distanceText.length + layer.unit.length) * 18;
+    style = _ref.style;
+  var ruLength = (0, _convertUnitsLite.convert)(length).from(unit).to(rulerUnit);
+  var fixedLength = layer.unit === _constants.UNIT_METER || layer.unit === _constants.UNIT_FOOT ? 2 : 0;
+  var distanceText = (Math.round((0, _convertUnitsLite.convert)(ruLength).from(rulerUnit).to(layer.unit) * 100) / 100).toFixed(fixedLength);
+  var textLength = (distanceText.length + layer.unit.length) * 9;
   return /*#__PURE__*/_react["default"].createElement("g", {
     transform: transform
   }, /*#__PURE__*/_react["default"].createElement("g", {
@@ -85,19 +61,25 @@ function Ruler(_ref) {
     transform: "scale(1, -1)",
     style: STYLE_TEXT,
     fill: _constants.TEXT_COLOR_NEUTRAL_7
-  }, Math.round((0, _convertUnitsLite.convert)(distanceText).from('in').to(layer.unit) * 100) / 100, layer.unit === 'in' ? '"' : layer.unit)), /*#__PURE__*/_react["default"].createElement("line", {
-    x1: "0",
+  }, distanceText, layer.unit === 'in' ? '"' : layer.unit)), /*#__PURE__*/_react["default"].createElement("line", {
+    x1: style === _line.STYLE_ROOM_SHAPE ? 0 : 4,
     y1: "0",
     x2: (length - textLength) / 2 < 0 ? 0 : (length - textLength) / 2,
     y2: "0",
-    style: STYLE
+    style: style
   }), /*#__PURE__*/_react["default"].createElement("line", {
     x1: (length + textLength) / 2 < 0 ? 0 : (length + textLength) / 2 < length ? (length + textLength) / 2 : length,
     y1: "0",
-    x2: length,
+    x2: style === _line.STYLE_ROOM_SHAPE ? length : length - 4,
     y2: "0",
-    style: STYLE
-  }));
+    style: style
+  }), style !== _line.STYLE_ROOM_SHAPE && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("polygon", {
+    points: "3, 0, 6.5, -2, 6.5, 2 ",
+    style: style
+  }), /*#__PURE__*/_react["default"].createElement("polygon", {
+    points: "".concat(length - 3, ", 0, ").concat(length - 6.5, ", 2, ").concat(length - 6.5, ", -2"),
+    style: style
+  })));
 }
 Ruler.propTypes = {
   length: _propTypes["default"].number.isRequired,

package/lib/components/viewer2d/rulerDist.js

@@ -8,19 +8,22 @@ exports["default"] = RulerDist;
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _convertUnitsLite = require("../../utils/convert-units-lite");
+var _constants = require("../../constants");
 var ARROW_STYLE = {
   stroke: '#1183B7',
   strokeWidth: '2px',
   strokeLinecap: 'round'
 };
 var STYLE = {
-  stroke: 'black',
-  strokeWidth: '1.1px'
+  stroke: '#455A64',
+  fill: '#455A64',
+  strokeWidth: '1.5px'
 };
 var STYLE_TEXT = {
   textAnchor: 'middle',
   fontSize: '10px',
   pointerEvents: 'none',
+  fill: '#455A64',
   //http://stackoverflow.com/questions/826782/how-to-disable-text-selection-highlighting-using-css
   WebkitTouchCallout: 'none' /* iOS Safari */,
   WebkitUserSelect: 'none' /* Chrome/Safari/Opera */,
@@ -36,10 +39,10 @@ function RulerDist(_ref) {
     transform = _ref.transform,
     angle = _ref.angle,
     rotation = _ref.rotation;
-  var _unit = 'in';
-  // let _length = convert(length).from(unit).to(rulerUnit);
-  var distanceText = "".concat((0, _convertUnitsLite.convert)(length).from('cm').to(rulerUnit).toFixed(0));
-  var textLength = (distanceText.length + layer.unit.length) * 18;
+  var ruLength = (0, _convertUnitsLite.convert)(length).from(unit).to(rulerUnit);
+  var fixedLength = layer.unit === _constants.UNIT_METER || layer.unit === _constants.UNIT_FOOT ? 2 : 0;
+  var distanceText = (Math.round((0, _convertUnitsLite.convert)(ruLength).from(rulerUnit).to(layer.unit) * 100) / 100).toFixed(fixedLength);
+  var textLength = (distanceText.length + layer.unit.length) * 8;
   var textangle = angle + 90;
   var textRotation = 1;
   var ay = 2;
@@ -71,79 +74,46 @@ function RulerDist(_ref) {
     textRotation = 180;
     ay = 5;
   }
-  if (Math.abs(length - textLength) / 2 <= 16) {
-    var dy = textRotation == 0 ? 15 : -15;
-    return /*#__PURE__*/_react["default"].createElement("g", {
-      transform: transform
-    }, /*#__PURE__*/_react["default"].createElement("g", {
-      transform: "translate(0, ".concat(dy, ")")
-    }, /*#__PURE__*/_react["default"].createElement("text", {
-      x: "0",
-      y: "0",
-      transform: "translate(".concat(length / 2, ",").concat(ay, ") scale(1, -1) rotate(").concat(textRotation, ")"),
-      style: STYLE_TEXT
-    }, Math.round((0, _convertUnitsLite.convert)(distanceText).from('in').to(layer.unit) * 100) / 100, layer.unit)), /*#__PURE__*/_react["default"].createElement("circle", {
-      cx: "1",
-      cy: "0",
-      fill: "white",
-      r: "1.1",
-      stroke: "black",
-      strokeWidth: "0.6"
-    }), /*#__PURE__*/_react["default"].createElement("line", {
-      x1: "2",
-      y1: "0",
-      x2: (length - textLength) / 2 < 0 ? 0 : length,
-      y2: "0",
-      style: STYLE
-    }), /*#__PURE__*/_react["default"].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["default"].createElement("circle", {
-      cx: length - 1,
-      cy: "0",
-      fill: "white",
-      r: "1.1",
-      stroke: "black",
-      strokeWidth: "0.6"
-    }));
+  if (ruLength > 0) {
+    if (ruLength < 28) {
+      return /*#__PURE__*/_react["default"].createElement("g", {
+        transform: transform
+      }, /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].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["default"].createElement("g", {
+        transform: transform
+      }, /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].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["default"].createElement("line", {
+        x1: "2",
+        y1: "0",
+        x2: (length - textLength) / 2 < 0 ? 0 : (length - textLength) / 2,
+        y2: "0",
+        style: STYLE
+      }), /*#__PURE__*/_react["default"].createElement("polygon", {
+        points: "1, 0, 4.5, -2, 4.5, 2 ",
+        style: STYLE
+      }), /*#__PURE__*/_react["default"].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["default"].createElement("polygon", {
+        points: "".concat(length - 1, ", 0, ").concat(length - 4.5, ", 2, ").concat(length - 4.5, ", -2"),
+        style: STYLE
+      }));
+    }
   } else {
-    return /*#__PURE__*/_react["default"].createElement("g", {
-      transform: transform
-    }, /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("text", {
-      x: "0",
-      y: "0",
-      transform: "translate(".concat(length / 2, ",").concat(ay, ") scale(1, -1) rotate(").concat(textRotation, ")"),
-      style: STYLE_TEXT
-    }, Math.round((0, _convertUnitsLite.convert)(distanceText).from('in').to(layer.unit) * 100) / 100, layer.unit)), /*#__PURE__*/_react["default"].createElement("circle", {
-      cx: "1",
-      cy: "0",
-      fill: "white",
-      r: "1.1",
-      stroke: "black",
-      strokeWidth: "0.6"
-    }), /*#__PURE__*/_react["default"].createElement("line", {
-      x1: "2",
-      y1: "0",
-      x2: (length - textLength) / 2 < 0 ? 0 : (length - textLength) / 2,
-      y2: "0",
-      style: STYLE
-    }), /*#__PURE__*/_react["default"].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["default"].createElement("circle", {
-      cx: length - 1,
-      cy: "0",
-      fill: "white",
-      r: "1.1",
-      stroke: "black",
-      strokeWidth: "0.6"
-    }));
+    return null;
   }
 }
 RulerDist.propTypes = {

package/lib/components/viewer2d/utils.js

@@ -9,6 +9,7 @@ exports.getInstallationSuffix = getInstallationSuffix;
 exports.getToeKickSKU = void 0;
 exports.isEmpty = isEmpty;
 exports.isEqualInstallationType = isEqualInstallationType;
+exports.isWarningItem = void 0;
 exports.makeSKUForMagento = makeSKUForMagento;
 exports.searchForSkuValue = exports.returnReplaceableDeepSearchType = void 0;
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
@@ -197,4 +198,10 @@ var areaPolygon = exports.areaPolygon = function areaPolygon(points) {
   }
   var area = det / 2;
   return signed ? area : Math.abs(area);
+};
+var isWarningItem = exports.isWarningItem = function isWarningItem(item) {
+  var _item$toJS$doorStyle;
+  if (item.category === 'cabinet') return !(item !== null && item !== void 0 && (_item$toJS$doorStyle = item.toJS().doorStyle) !== null && _item$toJS$doorStyle !== void 0 && (_item$toJS$doorStyle = _item$toJS$doorStyle.doorStyles) !== null && _item$toJS$doorStyle !== void 0 && (_item$toJS$doorStyle = _item$toJS$doorStyle.cds) !== null && _item$toJS$doorStyle !== void 0 && _item$toJS$doorStyle.filter(function (cd) {
+    return cd.itemID == (item === null || item === void 0 ? void 0 : item.getIn(['itemID']));
+  }).length) > 0;else return false;
 };