kitchen-simulator 1.0.0-alin.1 → 1.0.0-alin.12

package/lib/devLiteRenderer.js

@@ -4,11 +4,12 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 var _typeof = require("@babel/runtime/helpers/typeof");
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
+var _reactContainerDimensions = _interopRequireDefault(require("react-container-dimensions"));
 var _mockProps = _interopRequireDefault(require("./mocks/mockProps.json"));
 var _categoryData = _interopRequireDefault(require("./mocks/categoryData.json"));
 var _dataBundle = _interopRequireDefault(require("./mocks/dataBundle.json"));
+var _cabinetPayload = _interopRequireDefault(require("./mocks/cabinetPayload.json"));
 var _reactDom = _interopRequireDefault(require("react-dom"));
-var _LiteKitchenConfigurator = _interopRequireDefault(require("./LiteKitchenConfigurator"));
 var _LiteRenderer = _interopRequireDefault(require("./LiteRenderer"));
 var _antd = require("antd");
 var _constants = require("./constants");
@@ -18,19 +19,6 @@ var options = {
   unit: 'in',
   enable3D: true
 };
-var onSave = function onSave(_ref) {
-  var payload = _ref.payload;
-  console.log('SAVE triggered:', payload.scene);
-};
-var onEvent = function onEvent(evt) {
-  console.log('EVENT:', evt.type, evt.payload);
-};
-var onExternalEvent = function onExternalEvent(evt) {
-  console.log('EXTERNAL EVENT:', evt.type, evt.payload);
-};
-var onError = function onError(err) {
-  console.error('ERROR:', err);
-};
 document.getElementById('app').style.display = 'block';
 function WorkSpace(props) {
   var _useState = (0, _react.useState)(null),
@@ -130,7 +118,7 @@ function WorkSpace(props) {
         type: _constants.EXTERNAL_EVENT_NEW_PROJECT,
         payload: {}
       };
-      setExternalEvant(evt);
+      setExternalEvent(evt);
     }
   }, "New Project"), /*#__PURE__*/_react["default"].createElement(_antd.Button, {
     actionType: "secondary",
@@ -141,9 +129,18 @@ function WorkSpace(props) {
       };
       setExternalEvent(evt);
     }
-  }, "Add Walls"), /*#__PURE__*/_react["default"].createElement(_LiteRenderer["default"], {
-    width: 1264,
-    height: 1164,
+  }, "Add Walls"), /*#__PURE__*/_react["default"].createElement(_antd.Button, {
+    actionType: "danger",
+    onClick: function onClick() {
+      var evt = {
+        type: _constants.EXTERNAL_EVENT_ADD_ITEM,
+        payload: _cabinetPayload["default"]
+      };
+      setExternalEvent(evt);
+    }
+  }, "Add B12 Cabinet"), /*#__PURE__*/_react["default"].createElement(_LiteRenderer["default"], {
+    width: 1200,
+    height: 953,
     projectElement: _mockProps["default"].projectElement,
     categoryData: _categoryData["default"],
     dataBundle: _dataBundle["default"],
@@ -153,9 +150,16 @@ function WorkSpace(props) {
     companyUrl: "https://example.com",
     toolbarButtons: [],
     externalEvent: externalEvent,
-    onSave: onSave,
-    onEvent: onEvent,
-    onError: onError
+    onError: function onError(payload) {
+      // payload = {
+      //   type: 'render-error' | 'runtime-error' | 'unhandled-rejection',
+      //   error: { name?, message, stack?, raw? },
+      //   info?: { componentStack? },
+      //   externalEvent: { id?, type, payload } | null,
+      //   meta?: { filename?, lineno?, colno? }
+      // }
+      console.error('TOOL ERROR:', payload);
+    }
   }));
 }
 _reactDom["default"].render(/*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(WorkSpace, null)), document.getElementById('app'));

package/lib/index.js

@@ -6,16 +6,29 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 exports.renderKitchenSimulator = renderKitchenSimulator;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _reactDom = _interopRequireDefault(require("react-dom"));
 var _react = _interopRequireDefault(require("react"));
 var _LiteRenderer = _interopRequireDefault(require("./LiteRenderer"));
+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) { (0, _defineProperty2["default"])(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 renderKitchenSimulator(container) {
   var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  var currentProps = props;
+
+  // Initial render
   var root = _reactDom["default"].render(/*#__PURE__*/_react["default"].createElement(_LiteRenderer["default"], props), container);
   return {
     root: root,
-    unmount: function unmount() {
-      _reactDom["default"].unmountComponentAtNode(container);
+    updateExternalEvent: function updateExternalEvent(newExternalEvent) {
+      var prevEvent = currentProps.externalEvent;
+      var isSameEvent = prevEvent && newExternalEvent && prevEvent.type === newExternalEvent.type && JSON.stringify(prevEvent.payload) === JSON.stringify(newExternalEvent.payload);
+      if (!isSameEvent) {
+        currentProps = _objectSpread(_objectSpread({}, currentProps), {}, {
+          externalEvent: newExternalEvent
+        });
+        _reactDom["default"].render(/*#__PURE__*/_react["default"].createElement(_LiteRenderer["default"], currentProps), container);
+      }
     }
   };
 }

package/lib/models.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Vertex = exports.State = exports.Scene = exports.Line = exports.Layer = exports.Item = exports.Hole = exports.HistoryStructure = exports.Group = exports.Grid = exports.ElementsSet = exports.DefaultLayers = exports.DefaultGrids = exports.CatalogElement = exports.Catalog = exports.Area = void 0;
+exports.safeLoadMapList = exports.Vertex = exports.State = exports.Scene = exports.Line = exports.Layer = exports.Item = exports.Hole = exports.HistoryStructure = exports.Group = exports.Grid = exports.ElementsSet = exports.DefaultLayers = exports.DefaultGrids = exports.CatalogElement = exports.Catalog = exports.Area = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
@@ -20,7 +20,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 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) { (0, _defineProperty2["default"])(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 = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(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; })(); }
-var safeLoadMapList = function safeLoadMapList(mapList, Model, defaultMap) {
+var safeLoadMapList = exports.safeLoadMapList = function safeLoadMapList(mapList, Model, defaultMap) {
   return mapList ? new _immutable.Map(mapList).map(function (m) {
     return new Model(m);
   }).toMap() : defaultMap || new _immutable.Map();

package/lib/reducers/project-reducer.js

@@ -83,6 +83,8 @@ function _default(state, action) {
       return _export2.Project.openProjectConfigurator(state).updatedState;
     case _constants.INIT_CATALOG:
       return _export2.Project.initCatalog(state, action.catalog).updatedState;
+    case _constants.ADD_ELEMENT_TO_CATALOG:
+      return _export2.Project.addElementToCatalog(state, action.element).updatedState;
     case _constants.UPDATE_MOUSE_COORDS:
       return _export2.Project.updateMouseCoord(state, action.coords).updatedState;
     case _constants.UPDATE_ZOOM_SCALE:

package/lib/reducers/viewer2d-reducer.js

@@ -43,7 +43,7 @@ function _default(state, action) {
         state = state.mergeIn(['scene', 'layers', _selectedLayer, 'items'], newItems);
         return state;
       }
-    case _constants.MOVE_PAN:
+    case _constants.UPDATE_2D_CAMERA:
       return state.merge({
         viewer2D: action.value
       });

package/lib/reducers/viewer3d-reducer.js

@@ -48,8 +48,6 @@ function _default(state, action) {
         state = state.mergeIn(['scene', 'layers', _selectedLayer, 'items'], newItems);
         return state;
       }
-    case _constants.MOVE_PAN:
-      return state;
     case _constants.SELECT_TOOL_3D_VIEW:
       state = _export.Project.rollback(state).updatedState;
       state = _export.Project.setMode(state, _constants.MODE_3D_VIEW).updatedState;

package/lib/utils/isolate-event-handler.js

@@ -1,62 +1,166 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.handleExternalEvent = handleExternalEvent;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _immutable = require("immutable");
 var _constants = require("../constants");
 var _helper = require("./helper");
-function handleExternalEvent(evt, props) {
-  var state = props.state;
-  switch (evt === null || evt === void 0 ? void 0 : evt.type) {
-    case _constants.EXTERNAL_EVENT_TOGGLE_TO_3D:
-      props.projectActions.setMode(_constants.MODE_IDLE_3D);
-      break;
-    case _constants.EXTERNAL_EVENT_TOGGLE_TO_2D:
-      props.projectActions.setMode(_constants.MODE_IDLE);
-      break;
-    case _constants.EXTERNAL_EVENT_TOGGLE_TO_ELEVATION:
-      props.projectActions.setMode(_constants.MODE_ELEVATION_VIEW);
-      break;
-    case _constants.EXTERNAL_EVENT_ADD_WALL:
-      if (state.mode === _constants.MODE_IDLE || state.mode === _constants.MODE_2D_PAN) props.linesActions.selectToolDrawingLine('wall');else {
-        props.projectActions.setMode(_constants.MODE_IDLE);
-        props.linesActions.selectToolDrawingLine('wall');
+var _exporter = _interopRequireDefault(require("../catalog/utils/exporter"));
+var _itemLoader = require("../catalog/utils/item-loader");
+var _catalog = _interopRequireDefault(require("../catalog/catalog"));
+var _models = require("../models");
+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) { (0, _defineProperty2["default"])(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; }
+var loadSVGsByItem = /*#__PURE__*/function () {
+  var _ref = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(item) {
+    var _parsed$xml$viewBox, _parsed$xml$viewBox2, response, svgText, loader, parsed, _t;
+    return _regenerator["default"].wrap(function (_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          if (item.outline) {
+            _context.next = 1;
+            break;
+          }
+          return _context.abrupt("return", null);
+        case 1:
+          _context.prev = 1;
+          _context.next = 2;
+          return fetch(item.outline, {
+            cache: 'no-store'
+          });
+        case 2:
+          response = _context.sent;
+          _context.next = 3;
+          return response.text();
+        case 3:
+          svgText = _context.sent;
+          loader = new SVGLoader();
+          parsed = loader.parse(svgText);
+          if (!(0, _helper.isEmpty)(parsed.paths)) {
+            _context.next = 4;
+            break;
+          }
+          return _context.abrupt("return", null);
+        case 4:
+          return _context.abrupt("return", {
+            paths: parsed.paths,
+            svgWidth: parseFloat(parsed.xml.getAttribute('width')) || ((_parsed$xml$viewBox = parsed.xml.viewBox) === null || _parsed$xml$viewBox === void 0 || (_parsed$xml$viewBox = _parsed$xml$viewBox.animVal) === null || _parsed$xml$viewBox === void 0 ? void 0 : _parsed$xml$viewBox.width) || 0,
+            svgHeight: parseFloat(parsed.xml.getAttribute('height')) || ((_parsed$xml$viewBox2 = parsed.xml.viewBox) === null || _parsed$xml$viewBox2 === void 0 || (_parsed$xml$viewBox2 = _parsed$xml$viewBox2.animVal) === null || _parsed$xml$viewBox2 === void 0 ? void 0 : _parsed$xml$viewBox2.height) || 0,
+            reverse: !parseFloat(parsed.xml.getAttribute('height'))
+          });
+        case 5:
+          _context.prev = 5;
+          _t = _context["catch"](1);
+          console.error('Failed to load SVG:', item.outline, _t);
+          return _context.abrupt("return", null);
+        case 6:
+        case "end":
+          return _context.stop();
       }
-      break;
-    case _constants.EXTERNAL_EVENT_ADD_ITEM:
-      {
-        var element = evt.payload;
-        !(0, _helper.isEmpty)(evt === null || evt === void 0 ? void 0 : evt.payload) && _constants.ARRAY_3D_MODES.includes(state.mode) ? props.itemsActions.selectToolDrawingItem3D(element.name) : props.itemsActions.selectToolDrawingItem(element.name);
-        props.projectActions.pushLastSelectedCatalogElementToHistory(element);
-        props.projectActions.setIsCabinetDrawing(true);
-      }
-      break;
-    case _constants.EXTERNAL_EVENT_MOVE_PAN:
-      var _evt$payload = evt.payload,
-        moveType = _evt$payload.moveType,
-        moveValue = _evt$payload.moveValue;
-      var value = state.getIn(['KitchenConfigurator', 'viewer2D']).toJS();
-      switch (moveType) {
-        case _constants.TOP:
-          value.f -= moveValue;
+    }, _callee, null, [[1, 5]]);
+  }));
+  return function loadSVGsByItem(_x) {
+    return _ref.apply(this, arguments);
+  };
+}();
+function handleExternalEvent(_x2, _x3) {
+  return _handleExternalEvent.apply(this, arguments);
+}
+function _handleExternalEvent() {
+  _handleExternalEvent = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee2(evt, props) {
+    var state, sLineCnt, element, catalog, outlineSVGData, catalogInstance, elementJs, _evt$payload, moveType, moveValue, value, defaulTitle, _t2, _t3;
+    return _regenerator["default"].wrap(function (_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          state = props.state;
+          _t2 = evt === null || evt === void 0 ? void 0 : evt.type;
+          _context2.next = _t2 === _constants.EXTERNAL_EVENT_TOGGLE_TO_3D ? 1 : _t2 === _constants.EXTERNAL_EVENT_TOGGLE_TO_2D ? 2 : _t2 === _constants.EXTERNAL_EVENT_TOGGLE_TO_ELEVATION ? 3 : _t2 === _constants.EXTERNAL_EVENT_ADD_WALL ? 4 : _t2 === _constants.EXTERNAL_EVENT_ADD_ITEM ? 5 : _t2 === _constants.EXTERNAL_EVENT_MOVE_PAN ? 9 : _t2 === _constants.EXTERNAL_EVENT_NEW_PROJECT ? 15 : 16;
           break;
-        case _constants.BOTTOM:
-          value.f += moveValue;
+        case 1:
+          props.projectActions.setMode(_constants.MODE_IDLE_3D);
+          return _context2.abrupt("continue", 16);
+        case 2:
+          props.projectActions.setMode(_constants.MODE_IDLE);
+          return _context2.abrupt("continue", 16);
+        case 3:
+          sLineCnt = state.getIn(['KitchenConfigurator', 'scene', 'layers', 'layer-1', 'selected', 'lines']).size;
+          if (sLineCnt > 0) props.projectActions.setMode(_constants.MODE_ELEVATION_VIEW);
+          return _context2.abrupt("continue", 16);
+        case 4:
+          if (state.mode === _constants.MODE_IDLE || state.mode === _constants.MODE_2D_PAN) props.linesActions.selectToolDrawingLine('wall');else {
+            props.projectActions.setMode(_constants.MODE_IDLE);
+            props.linesActions.selectToolDrawingLine('wall');
+          }
+          return _context2.abrupt("continue", 16);
+        case 5:
+          if ((0, _helper.isEmpty)(evt === null || evt === void 0 ? void 0 : evt.payload)) {
+            _context2.next = 8;
+            break;
+          }
+          element = evt.payload;
+          catalog = state.getIn(['KitchenConfigurator', 'catalog']).toJS(); // add item to catalog of state
+          if (!(0, _helper.isEmpty)(catalog === null || catalog === void 0 ? void 0 : catalog.elements[element.name])) {
+            _context2.next = 7;
+            break;
+          }
+          _context2.next = 6;
+          return loadSVGsByItem(element);
+        case 6:
+          outlineSVGData = _context2.sent;
+          catalogInstance = props.catalog;
+          elementJs = (0, _exporter["default"])(_objectSpread(_objectSpread({}, element), {}, {
+            outlineSVGData: outlineSVGData,
+            type: 'cabinet',
+            render2DItem: _itemLoader.render2DItem,
+            render3DItem: _itemLoader.render3DItem
+          }));
+          if (catalogInstance !== null && catalogInstance !== void 0 && catalogInstance.validateElement(elementJs)) {
+            props.projectActions.addElementToCatalog(elementJs);
+          }
+        case 7:
+          // start drawing item
+          _constants.ARRAY_3D_MODES.includes(state.mode) ? props.itemsActions.selectToolDrawingItem3D(element.name) : props.itemsActions.selectToolDrawingItem(element.name);
+          props.projectActions.pushLastSelectedCatalogElementToHistory(element);
+          props.projectActions.setIsCabinetDrawing(true);
+        case 8:
+          return _context2.abrupt("continue", 16);
+        case 9:
+          _evt$payload = evt.payload, moveType = _evt$payload.moveType, moveValue = _evt$payload.moveValue;
+          value = state.getIn(['KitchenConfigurator', 'viewer2D']).toJS();
+          _t3 = moveType;
+          _context2.next = _t3 === _constants.TOP ? 10 : _t3 === _constants.BOTTOM ? 11 : _t3 === _constants.RIGHT ? 12 : _t3 === _constants.LEFT ? 13 : 14;
           break;
-        case _constants.RIGHT:
+        case 10:
+          value.f -= moveValue;
+          return _context2.abrupt("continue", 14);
+        case 11:
+          value.f += moveValue;
+          return _context2.abrupt("continue", 14);
+        case 12:
           value.e += moveValue;
-          break;
-        case _constants.LEFT:
+          return _context2.abrupt("continue", 14);
+        case 13:
           value.e -= moveValue;
-          break;
+          return _context2.abrupt("continue", 14);
+        case 14:
+          if (value.e <= 10 && value.e + value.a * value.SVGWidth + 10 >= value.viewerWidth && value.f <= 80 && value.f + value.d * value.SVGHeight + 10 >= value.viewerHeight) props.viewer2DActions.updateCameraView(value);
+          return _context2.abrupt("continue", 16);
+        case 15:
+          defaulTitle = 'Untitle';
+          props.projectActions.newProject();
+          props.projectActions.rename(defaulTitle);
+          return _context2.abrupt("continue", 16);
+        case 16:
+        case "end":
+          return _context2.stop();
       }
-      if (value.e <= 10 && value.e + value.a * value.SVGWidth + 10 >= value.viewerWidth && value.f <= 80 && value.f + value.d * value.SVGHeight + 10 >= value.viewerHeight) props.viewer2DActions.updateCameraView(value);
-      break;
-    case _constants.EXTERNAL_EVENT_NEW_PROJECT:
-      var defaulTitle = 'Untitle';
-      props.projectActions.newProject();
-      props.projectActions.rename(defaulTitle);
-      break;
-  }
+    }, _callee2);
+  }));
+  return _handleExternalEvent.apply(this, arguments);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kitchen-simulator",
-  "version": "1.0.0-alin.01",
+  "version": "1.0.0-alin.12",
   "description": "It is a kitchen simulator (self-contained micro-frontend).",
   "license": "MIT",
   "main": "lib/index.js",
@@ -26,11 +26,14 @@
     "start9010": "webpack-dev-server --config webpack.config.js --port 9010 --mode development",
     "start9020": "webpack-dev-server --config webpack.config.js --port 9020 --mode development",
     "build": "node scripts/custom-build.js",
+    "build-src": "webpack --config webpack.config.js --mode production",
+    "build-dist": "npm run clean && npm run build-src && mkdir -p dist && cp -R src/catalog dist/ && cp -R src/assets dist/",
     "clean": "rimraf lib es",
     "update-version-file": "const-version ./package.json ./src/version.js",
-    "version": "npm run update-version-file && npm run build",
+    "version": "npm run update-version-file && npm run build && npm run add-build-to-vcs",
     "prepublishOnly": "cross-env NODE_ENV=production npm run build",
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "add-build-to-vcs": "git add -A src/version.js && git add -A es && git add -A lib"
   },
   "repository": {
     "type": "git",