kitchen-simulator 5.0.0-test.3 → 5.0.0-test.5

package/lib/class/item.js

@@ -1,1894 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-var _convertUnits = _interopRequireDefault(require("convert-units"));
-var _export = require("./export");
-var _export2 = require("../utils/export");
-var _immutable = require("immutable");
-var _path = _interopRequireDefault(require("path"));
-var _constants = require("../constants");
-var _helper = require("../utils/helper");
-var _util = require("util");
-var _molding = require("../utils/molding");
-var _utils = require("../components/viewer2d/utils");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
-function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
-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 _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
-function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
-function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-var allItemRect;
-var allItemSnap;
-var allLines;
-var allLineRects;
-var allLineSnap;
-var allRect;
-var time1;
-var time2;
-var Item = exports["default"] = /*#__PURE__*/function () {
-  function Item() {
-    _classCallCheck(this, Item);
-  }
-  return _createClass(Item, null, [{
-    key: "create",
-    value: function create(state, layerID, type, x, y, width, height, rotation, isDuplication) {
-      var molding = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : [];
-      var itemID = _export2.IDBroker.acquireID();
-      var item = state.catalog.factoryElement(type, {
-        id: itemID,
-        itemID: state.catalog.getIn(['elements', type, 'itemID']),
-        name: _export2.NameGenerator.generateName('items', state.catalog.getIn(['elements', type, 'info', 'title'])),
-        sku_number: state.catalog.getIn(['elements', type, 'obj']).toJS().sku_number,
-        //style: state.catalog.getIn(['elements', type, 'info', 'door']),
-        category: state.catalog.getIn(['elements', type, 'type']),
-        layoutpos: state.catalog.getIn(['elements', type, 'info', 'layoutpos']),
-        cabinet_category: state.catalog.getIn(['elements', type, 'obj']).toJS().cabinet_category,
-        type: type,
-        height: height,
-        width: width,
-        x: x,
-        y: y,
-        rotation: rotation,
-        isDuplication: isDuplication
-      }, null, state);
-      if (item.category === 'cabinet') {
-        var layer = state.getIn(['scene', 'layers', layerID]);
-        if (state.doorStyle !== null && state.doorStyle !== undefined) {
-          var _temp$doorStyles;
-          var temp = layer.doorStyle ? layer.doorStyle : state.doorStyle.toJS();
-          var _cds = temp === null || temp === void 0 || (_temp$doorStyles = temp.doorStyles) === null || _temp$doorStyles === void 0 ? void 0 : _temp$doorStyles.cds.find(function (elem) {
-            return elem.itemID === state.catalog.getIn(['elements', type, 'itemID']);
-          });
-          var tmpDS = temp;
-          if (_cds !== undefined && _cds !== null) {
-            tmpDS.doorStyles = _objectSpread(_objectSpread(_objectSpread({}, temp.doorStyles), _cds.data[0]), {}, {
-              cabinet_door_style_id: _cds.cabinet_door_style_id
-            });
-            item = item.merge({
-              doorStyle: (0, _immutable.fromJS)(tmpDS)
-            });
-          } else {
-            var _state$oStyle;
-            var styleObj = (_state$oStyle = state.oStyle) === null || _state$oStyle === void 0 || (_state$oStyle = _state$oStyle.toJS()) === null || _state$oStyle === void 0 ? void 0 : _state$oStyle.oStyle;
-            if (styleObj) {
-              for (var _x in styleObj) {
-                _cds = styleObj[_x].data.doorStyles.cds.find(function (elem) {
-                  return elem.itemID === state.catalog.getIn(['elements', type, 'itemID']);
-                });
-                if (_cds !== null && _cds !== undefined && _cds) {
-                  tmpDS = styleObj[_x].data;
-                  tmpDS.doorStyles = _objectSpread(_objectSpread(_objectSpread({}, tmpDS.doorStyles), _cds.data[0]), {}, {
-                    cabinet_door_style_id: _cds.cabinet_door_style_id
-                  });
-                  item = item.merge({
-                    doorStyle: (0, _immutable.fromJS)(tmpDS)
-                  });
-                  break;
-                }
-              }
-            }
-          }
-        } else {
-          var _state$oStyle2;
-          var _styleObj = (_state$oStyle2 = state.oStyle) === null || _state$oStyle2 === void 0 || (_state$oStyle2 = _state$oStyle2.toJS()) === null || _state$oStyle2 === void 0 ? void 0 : _state$oStyle2.oStyle;
-          if (_styleObj) {
-            for (var _x2 in _styleObj) {
-              cds = _styleObj[_x2].data.doorStyles.cds.find(function (elem) {
-                return elem.itemID === state.catalog.getIn(['elements', type, 'itemID']);
-              });
-              if (cds !== null && cds !== undefined && cds) {
-                var _tmpDS = _styleObj[_x2].data;
-                _tmpDS.doorStyles = _objectSpread(_objectSpread(_objectSpread({}, _tmpDS.doorStyles), cds.data[0]), {}, {
-                  cabinet_door_style_id: cds.cabinet_door_style_id
-                });
-                item = item.merge({
-                  doorStyle: (0, _immutable.fromJS)(_tmpDS)
-                });
-                break;
-              }
-            }
-          }
-        }
-      }
-      if (item.get('type') === 'cabinet' && item.get('doorStyle').size === 0) {
-        return {
-          updatedState: state,
-          item: null
-        };
-      }
-      var setSizeOfItemByDoorStyle = function setSizeOfItemByDoorStyle() {
-        var _doorStyle$doorStyles;
-        var doorStyle = item.get('doorStyle').toJS();
-        var cds = doorStyle === null || doorStyle === void 0 || (_doorStyle$doorStyles = doorStyle.doorStyles) === null || _doorStyle$doorStyles === void 0 || (_doorStyle$doorStyles = _doorStyle$doorStyles.cds) === null || _doorStyle$doorStyles === void 0 ? void 0 : _doorStyle$doorStyles.find(function (elem) {
-          return elem.itemID === item.itemID;
-        });
-        var euro_cds = [];
-        if (cds !== undefined) {
-          euro_cds = cds && cds.data.filter(function (element) {
-            return element.is_euro_cds;
-          });
-        }
-        if (doorStyle.door_style_name === 'Euro & Frameless' && euro_cds.length > 0) {
-          var newProperties = item.get('properties').toJS();
-          if (newProperties.hasOwnProperty('depth')) {
-            if (!newProperties.hasOwnProperty('oldDepth')) {
-              newProperties['oldDepth'] = new _immutable.Map({
-                length: newProperties.depth.length,
-                _length: newProperties.depth._length,
-                _unit: newProperties.depth._unit
-              });
-            }
-            newProperties['depth'] = new _immutable.Map({
-              length: (0, _convertUnits["default"])(euro_cds[0].euro_length).from('in').to('cm'),
-              _length: euro_cds[0].euro_length,
-              _unit: 'in'
-            });
-          }
-          if (newProperties.hasOwnProperty('height')) {
-            if (!newProperties.hasOwnProperty('oldHeight')) {
-              newProperties['oldHeight'] = new _immutable.Map({
-                length: newProperties.height.length,
-                _length: newProperties.height._length,
-                _unit: newProperties.height._unit
-              });
-            }
-            newProperties['height'] = new _immutable.Map({
-              length: (0, _convertUnits["default"])(euro_cds[0].euro_height).from('in').to('cm'),
-              _length: euro_cds[0].euro_height,
-              _unit: 'in'
-            });
-          }
-          if (newProperties.hasOwnProperty('width')) {
-            if (!newProperties.hasOwnProperty('oldWidth')) {
-              newProperties['oldWidth'] = new _immutable.Map({
-                length: newProperties.width.length,
-                _length: newProperties.width._length,
-                _unit: newProperties.width._unit
-              });
-            }
-            newProperties['width'] = new _immutable.Map({
-              length: (0, _convertUnits["default"])(euro_cds[0].euro_width).from('in').to('cm') - 10,
-              _length: euro_cds[0].euro_width,
-              _unit: 'in'
-            });
-          }
-          item = item.merge({
-            properties: (0, _immutable.fromJS)(newProperties)
-          });
-        } else {
-          var properties = item.get('properties').toJS();
-          if (properties.hasOwnProperty('oldDepth')) {
-            properties['depth'] = new _immutable.Map({
-              length: properties.oldDepth.length,
-              _length: properties.oldDepth._length,
-              _unit: properties.oldDepth._unit
-            });
-          }
-          if (properties.hasOwnProperty('oldHeight')) {
-            properties['height'] = new _immutable.Map({
-              length: properties.oldHeight.length,
-              _length: properties.oldHeight._length,
-              _unit: properties.oldHeight._unit
-            });
-          }
-          if (properties.hasOwnProperty('oldWidth')) {
-            properties['width'] = new _immutable.Map({
-              length: properties.oldWidth.length,
-              _length: properties.oldWidth._length,
-              _unit: properties.oldWidth._unit
-            });
-          }
-          item = item.merge({
-            properties: (0, _immutable.fromJS)(properties)
-          });
-        }
-      };
-      item.category === 'cabinet' && setSizeOfItemByDoorStyle();
-      item = this.updateDoorHandle(item, state.getIn(['scene', 'layers', layerID]));
-      state = state.setIn(['scene', 'layers', layerID, 'items', itemID], item);
-      if (item.type.includes('Light')) {
-        var ceilHeight = state.getIn(['scene', 'layers', layerID, 'ceilHeight']);
-        var ceilUnit = state.getIn(['scene', 'layers', layerID, 'unit']);
-        ceilHeight = (0, _convertUnits["default"])(ceilHeight).from(ceilUnit).to('cm');
-        var newAltitude = ceilHeight - item.properties.getIn(['height', 'length']);
-        newAltitude = (0, _convertUnits["default"])(newAltitude).from('cm').to(ceilUnit);
-        item = item.setIn(['properties', 'altitude', '_length'], newAltitude);
-        state = state.setIn(['scene', 'layers', layerID, 'items', item.id], item);
-      }
-      if (item.category === 'cabinet') {
-        // If create a copied object, copied object has original object's molding property.And if create a object, it has a layer's molding property.
-        var layerMolding = state.getIn(['scene', 'layers', layerID, 'molding']).filter(function (md) {
-          return (0, _molding.hasMoldingLayout)(md, item.layoutpos);
-        });
-        state = state.setIn(['scene', 'layers', layerID, 'items', itemID, 'molding'], layerMolding.length ? layerMolding : molding);
-      }
-      return {
-        updatedState: state,
-        item: item
-      };
-    }
-  }, {
-    key: "updateDoorHandle",
-    value: function updateDoorHandle(item, layer) {
-      var doorHandle = layer.get('doorHandle');
-      if (doorHandle == '') return item;
-      var dataJSON = item.toJS();
-      var itemID = dataJSON.id;
-      var doorStyle = dataJSON.doorStyle;
-      var tmpDS = _objectSpread(_objectSpread({}, doorStyle), {}, {
-        handle_gltf: doorHandle,
-        metalness: 0.2,
-        roughness: 0.1
-      });
-      var cnt = 0;
-      for (var prop in doorStyle.doorStyles) cnt++;
-      if (cnt !== 0) {
-        for (var i = 1; i < 10; i++) {
-          tmpDS['doorStyles']['door_handle_' + i + '_gltf'] = doorHandle;
-          tmpDS['doorStyles']['fixed_drawer_door_handle_' + i + '_gltf'] = doorHandle;
-          tmpDS['doorStyles']['drawer_door_handle_' + i + '_gltf'] = doorHandle;
-        }
-      }
-      item = item.mergeIn(['doorStyle'], (0, _immutable.fromJS)(tmpDS));
-      return item;
-    }
-  }, {
-    key: "select",
-    value: function select(state, layerID, itemID) {
-      state = _export.Layer.select(state, layerID).updatedState;
-      state = _export.Layer.selectElement(state, layerID, 'items', itemID).updatedState;
-      state = state.merge({
-        replacingSupport: new _immutable.Map({
-          layerID: layerID,
-          itemID: itemID
-        })
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "selectHole",
-    value: function selectHole(state, layerID, holeID) {
-      state = _export.Layer.select(state, layerID).updatedState;
-      state = _export.Layer.selectElement(state, layerID, 'holes', holeID).updatedState;
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "editWidth",
-    value: function editWidth(state, newWidth, layerID, itemID) {
-      var item = state.getIn(['scene', 'layers', layerID, 'items', itemID]);
-      var properties = item.properties;
-      if (newWidth === 0) {
-        alert('You can not set width to 0');
-        return {
-          updatedState: state
-        };
-      }
-      var width = new _immutable.Map({
-        _length: newWidth,
-        _unit: 'in',
-        length: (0, _convertUnits["default"])(newWidth).from('in').to('cm')
-      });
-      properties = properties.set('width', width);
-      state = state.mergeIn(['scene', 'layers', layerID, 'items', itemID, 'properties'], properties);
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "prepareSnap",
-    value: function prepareSnap(state, layerID) {
-      var layer = state.getIn(['scene', 'layers', layerID]);
-      var scene = state.get('scene');
-      var catalog = state.catalog.toJS();
-      allLines = _export2.GeometryUtils.getAllLines(layer);
-      allLineRects = _export2.GeometryUtils.buildRectFromLines(layer, allLines);
-      allItemRect = _export2.GeometryUtils.getAllItems(scene, catalog, allLineRects);
-      allItemSnap = _export2.GeometryUtils.getAllItemSnap(allItemRect);
-      allLineSnap = _export2.GeometryUtils.getAllLineSnap(allLineRects, allItemRect.cur);
-      allRect = allItemRect.others.concat(allLineRects);
-      allItemSnap = _export2.GeometryUtils.validateSnaps(allItemSnap, allRect);
-      allLineSnap = _export2.GeometryUtils.validateSnaps(allLineSnap, allRect);
-    }
-  }, {
-    key: "duplicateSelected",
-    value: function duplicateSelected(state, currentObject) {
-      var layerID = state.getIn(['scene', 'selectedLayer']);
-      var layer = state.getIn(['scene', 'layers', layerID]);
-      var objectID = currentObject.id;
-      var myObject;
-      var x = currentObject.x;
-      var y = currentObject.y;
-      var sceneComponentType, width, depth, rotRad;
-      switch (currentObject.prototype) {
-        case 'items':
-          myObject = state.getIn(['scene', 'layers', layerID, 'items', objectID]);
-          sceneComponentType = myObject.type;
-          width = myObject.properties.getIn(['width', 'length']);
-          depth = myObject.properties.getIn(['depth', 'length']);
-          rotRad = myObject.rotation * Math.PI / 180;
-          this.prepareSnap(state, layerID);
-          var val = {
-            pos: {
-              x: x + width * Math.cos(rotRad),
-              y: y + width * Math.sin(rotRad)
-            },
-            rotRad: rotRad
-          };
-          val.size = allItemRect.cur.size;
-          val.layoutpos = allItemRect.cur.layoutpos;
-          val.is_corner = allItemRect.cur.is_corner;
-          var isrectSect = _export2.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),
-              stateI = _this$create.updatedState,
-              item = _this$create.item;
-            if (item === null) {
-              alert('There are no Door Colors in this cabinet.');
-              state = state.merge({
-                mode: _constants.MODE_IDLE,
-                drawingSupport: new _immutable.Map()
-              });
-            } else {
-              state = Item.select(stateI, layerID, item.id).updatedState;
-              state = state.setIn(['drawingSupport', 'currentID'], item.id);
-            }
-          } else {
-            var _val = {
-              pos: {
-                x: x - width * Math.cos(rotRad),
-                y: y - width * Math.sin(rotRad)
-              },
-              rotRad: rotRad
-            };
-            _val.size = allItemRect.cur.size;
-            _val.layoutpos = allItemRect.cur.layoutpos;
-            _val.is_corner = allItemRect.cur.is_corner;
-            var isRect = _export2.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),
-                _stateI = _this$create2.updatedState,
-                _item = _this$create2.item;
-              if (_item === null) {
-                alert('There are no Door Colors in this cabinet.');
-                state = state.merge({
-                  mode: _constants.MODE_IDLE,
-                  drawingSupport: new _immutable.Map()
-                });
-              } else {
-                state = Item.select(_stateI, layerID, _item.id).updatedState;
-                state = state.setIn(['drawingSupport', 'currentID'], _item.id);
-              }
-            } else {
-              var _val2 = {
-                pos: {
-                  x: x - depth * Math.sin(rotRad),
-                  y: y - depth * Math.cos(rotRad)
-                },
-                rotRad: rotRad
-              };
-              _val2.size = allItemRect.cur.size;
-              _val2.layoutpos = allItemRect.cur.layoutpos;
-              _val2.is_corner = allItemRect.cur.is_corner;
-              var isRectDown = _export2.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),
-                  _stateI2 = _this$create3.updatedState,
-                  _item2 = _this$create3.item;
-                if (_item2 === null) {
-                  alert('There are no Door Colors in this cabinet.');
-                  state = state.merge({
-                    mode: _constants.MODE_IDLE,
-                    drawingSupport: new _immutable.Map()
-                  });
-                } else {
-                  state = Item.select(_stateI2, layerID, _item2.id).updatedState;
-                  state = state.setIn(['drawingSupport', 'currentID'], _item2.id);
-                }
-              } else {
-                var _val3 = {
-                  pos: {
-                    x: x + depth * Math.sin(rotRad),
-                    y: y + depth * Math.cos(rotRad)
-                  },
-                  rotRad: rotRad
-                };
-                _val3.size = allItemRect.cur.size;
-                _val3.layoutpos = allItemRect.cur.layoutpos;
-                _val3.is_corner = allItemRect.cur.is_corner;
-                var isRectUp = _export2.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),
-                    _stateI3 = _this$create4.updatedState,
-                    _item3 = _this$create4.item;
-                  if (_item3 === null) {
-                    alert('There are no Door Colors in this cabinet.');
-                    state = state.merge({
-                      mode: _constants.MODE_IDLE,
-                      drawingSupport: new _immutable.Map()
-                    });
-                  } else {
-                    state = Item.select(_stateI3, layerID, _item3.id).updatedState;
-                    state = state.setIn(['drawingSupport', 'currentID'], _item3.id);
-                  }
-                } else {
-                  console.log('there is no space');
-                  alert('No more space!');
-                }
-              }
-            }
-          }
-          break;
-        case 'holes':
-          this.prepareSnap(state, layerID);
-          myObject = state.getIn(['scene', 'layers', layerID, 'holes', objectID]);
-          var line = state.getIn(['scene', 'layers', layerID, 'lines', myObject.line]);
-          sceneComponentType = myObject.type;
-          width = myObject.get('properties').get('width').get('length');
-          var myOffset = myObject.offset;
-          var v0 = layer.getIn(['vertices', line.vertices.get(0)]);
-          var v1 = layer.getIn(['vertices', line.vertices.get(1)]);
-          var lineLength = _export2.GeometryUtils.pointsDistance(v0.x, v0.y, v1.x, v1.y);
-          var delta = width / 2 / lineLength + 0.00001;
-          var allHoles = state.getIn(['scene', 'layers', layerID, 'holes']);
-          var rightAble = true;
-          var leftAble = true;
-          if (myOffset + 3 * delta > 1) rightAble = false;else if (myOffset - 3 * delta < 0) leftAble = false;
-          if (allHoles.size === 0) {
-            var _this$createHole = this.createHole(state, layerID, sceneComponentType, myObject.line, myOffset + delta * 2, myObject.get('properties')),
-              stateH = _this$createHole.updatedState,
-              hole = _this$createHole.hole;
-            state = this.selectHole(stateH, layerID, hole.id).updatedState;
-            state = state.setIn(['drawingSupport', 'currentID'], hole.id);
-          } else {
-            allHoles.forEach(function (hole) {
-              if (hole.line === line.id) if (!hole.selected) {
-                var newDelta = hole.get('properties').get('width').get('length') / 2 / lineLength;
-                if (myOffset < hole.offset) {
-                  if (myOffset + delta * 3 > hole.offset - newDelta) {
-                    rightAble = false;
-                  }
-                } else {
-                  if (myOffset - delta * 3 < hole.offset + newDelta) {
-                    leftAble = false;
-                  }
-                }
-              }
-            });
-          }
-          if (rightAble) {
-            var _this$createHole2 = this.createHole(state, layerID, sceneComponentType, myObject.line, myOffset + delta * 2, myObject.get('properties')),
-              _stateH = _this$createHole2.updatedState,
-              _hole = _this$createHole2.hole;
-            state = this.selectHole(_stateH, layerID, _hole.id).updatedState;
-            state = state.setIn(['drawingSupport', 'currentID'], _hole.id);
-          } else {
-            if (leftAble) {
-              var _this$createHole3 = this.createHole(state, layerID, sceneComponentType, myObject.line, myOffset - delta * 2, myObject.get('properties')),
-                _stateH2 = _this$createHole3.updatedState,
-                _hole2 = _this$createHole3.hole;
-              state = this.selectHole(_stateH2, layerID, _hole2.id).updatedState;
-              state = state.setIn(['drawingSupport', 'currentID'], _hole2.id);
-            } else alert('No more space');
-          }
-          break;
-        case 'lines':
-          alert('Duplicating lines is not currently supported yet.');
-          break;
-        default:
-          break;
-      }
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "storeDistArray",
-    value: function storeDistArray(state, layerID, itemID, distArray) {
-      var curDistArray = state.getIn(['scene', 'layers', layerID, 'items', itemID, 'distArray']);
-      var isEqualDist = function isEqualDist(a, b) {
-        return a == b;
-      };
-      if (curDistArray) {
-        var equal = curDistArray.every(function (curElement, index) {
-          return isEqualDist(curElement[0], distArray[index][0]);
-        });
-        if (!equal) {
-          state = state.setIn(['scene', 'layers', layerID, 'items', itemID, 'distArray'], distArray);
-        }
-      }
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "validateItemPositions",
-    value: function validateItemPositions(state, layerID) {
-      var _this = this;
-      var layer = state.getIn(['scene', 'layers', layerID]);
-      function isItemInRect(item) {
-        var _state$getIn = state.getIn(['scene']),
-          width = _state$getIn.width,
-          height = _state$getIn.height;
-        return item.x >= 0 && item.x <= width && item.y >= 0 && item.y <= height;
-      }
-      layer.items.forEach(function (item) {
-        if (!isItemInRect(item)) state = _this.remove(state, layerID, item.id).updatedState;
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "remove",
-    value: function remove(state, layerID, itemID) {
-      state = this.unselect(state, layerID, itemID).updatedState;
-      state = _export.Layer.removeElement(state, layerID, 'items', itemID).updatedState;
-      state.getIn(['scene', 'groups']).forEach(function (group) {
-        return state = _export.Group.removeElement(state, group.id, layerID, 'items', itemID).updatedState;
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "replaceItem",
-    value: function replaceItem(state, selectedPos, currentObject, selectedObject) {
-      state = this.remove(state, state.scene.selectedLayer, selectedPos.selectedItemId).updatedState;
-      state = this.create(state, state.scene.selectedLayer, selectedObject.name, selectedPos.x, selectedPos.y, selectedObject.info.width, selectedObject.info.height, selectedPos.rotation, false).updatedState;
-      // state = this.select(state, state.scene.selectedLayer, selectedPos.selectedItemId).updatedState;
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "unselect",
-    value: function unselect(state, layerID, itemID) {
-      state = _export.Layer.unselect(state, layerID, 'items', itemID).updatedState;
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "selectToolDrawingItem",
-    value: function selectToolDrawingItem(state, sceneComponentType) {
-      state = state.merge({
-        mode: _constants.MODE_DRAWING_ITEM,
-        drawingSupport: new _immutable.Map({
-          type: sceneComponentType
-        })
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "selectToolDrawingItem3D",
-    value: function selectToolDrawingItem3D(state, sceneComponentType) {
-      state = state.merge({
-        mode: _constants.MODE_DRAWING_ITEM_3D,
-        drawingSupport: new _immutable.Map({
-          type: sceneComponentType
-        })
-      });
-      state = state.mergeIn(['scene', 'loadFlag'], false);
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "endCreatingCabinet",
-    value: function endCreatingCabinet(state) {
-      state = state.merge({
-        isOpen: false,
-        openedType: 0
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "updatePopupOpen",
-    value: function updatePopupOpen(state, value) {
-      state = state.merge({
-        openedType: value
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "updateDrawingItem",
-    value: function updateDrawingItem(state, layerID, x, y) {
-      if (state.hasIn(['drawingSupport', 'currentID'])) {
-        var mode = state.get('mode');
-        if ([_constants.MODE_DRAWING_ITEM_3D].includes(mode)) {
-          state = state.updateIn(['scene', 'layers', layerID, 'items', state.getIn(['drawingSupport', 'currentID'])], function (item) {
-            return item && item.merge({
-              x: x,
-              y: y
-            });
-          });
-          state = state.merge({
-            mode: _constants.MODE_IDLE_3D
-          });
-        }
-        if ([_constants.MODE_DRAWING_ITEM].includes(mode)) {
-          state = state.merge({
-            mode: _constants.MODE_IDLE
-          });
-          state = state.updateIn(['scene', 'layers', layerID, 'items', state.getIn(['drawingSupport', 'currentID'])], function (item) {
-            return item && item.merge({
-              x: x,
-              y: y
-            });
-          });
-        }
-      } else {
-        var _this$create5 = this.create(state, layerID, state.getIn(['drawingSupport', 'type']), x, y, 200, 100, 0, false),
-          stateI = _this$create5.updatedState,
-          item = _this$create5.item;
-        if (item === null) {
-          alert('There are no Door Colors in this cabinet.');
-          state = state.merge({
-            mode: _constants.MODE_IDLE,
-            drawingSupport: new _immutable.Map()
-          });
-        } else {
-          state = Item.select(stateI, layerID, item.id).updatedState;
-          state = state.setIn(['drawingSupport', 'currentID'], item.id);
-        }
-      }
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "updateDraggingItemChanged",
-    value: function updateDraggingItemChanged(state, x, y, layerID, itemID) {
-      var _state = state,
-        scene = _state.scene;
-      // let originalX = draggingSupport.get('originalX');
-      // let originalY = draggingSupport.get('originalY');
-
-      // let diffX = x;
-      // let diffY = y;
-
-      var item = scene.getIn(['layers', layerID, 'items', itemID]);
-      // let tX = originalX - diffX;
-      // let tY = originalY - diffY;
-      // tX = tX > 500 ? 500 : tX < 0 ? 0 : tX;
-      // tY = tY > 500 ? 500 : tY < 0 ? 0 : tY;
-      item = item.merge({
-        x: x,
-        y: y
-      });
-      state = state.merge({
-        scene: scene.mergeIn(['layers', layerID, 'items', itemID], item)
-      });
-      time2 = (0, _helper.debugUtil)();
-      false && console.log('FPS:', Math.round(1000 / (time2 - time1)), ' Delta Time:', (time2 - time1) / 1000, '(s)');
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "endDrawingItem",
-    value: function endDrawingItem(state, layerID, x, y) {
-      var catalog = state.catalog;
-      state = this.updateDrawingItem(state, layerID, x, y, catalog).updatedState;
-      state = _export.Layer.unselectAll(state, layerID).updatedState;
-      var popup = state.get('popup');
-      state = state.merge({
-        drawingSupport: (0, _immutable.Map)({
-          type: state.drawingSupport.get('type')
-        }),
-        isOpen: !popup
-      });
-      state = _export.Layer.unselectAll(state, layerID).updatedState;
-      this.updateMolding(state);
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "beginDraggingItem",
-    value: function beginDraggingItem(state, layerID, itemID, x, y) {
-      var item = state.getIn(['scene', 'layers', layerID, 'items', itemID]);
-      time1 = (0, _helper.debugUtil)();
-      if ((0, _util.isUndefined)(item)) return;
-      state = state.merge({
-        mode: _constants.MODE_DRAGGING_ITEM,
-        draggingSupport: (0, _immutable.Map)({
-          layerID: layerID,
-          itemID: itemID,
-          startPointX: x,
-          startPointY: y,
-          originalX: item.x,
-          originalY: item.y
-        })
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "beginDraggingItem3D",
-    value: function beginDraggingItem3D(state, layerID, itemID, x, y) {
-      var item = state.getIn(['scene', 'layers', layerID, 'items', itemID]);
-      state = state.setIn(['scene', 'isEndDragging'], false);
-      if ((0, _util.isUndefined)(item)) return {
-        updatedState: state
-      };
-      state = state.merge({
-        mode: _constants.MODE_DRAGGING_ITEM_3D,
-        draggingSupport: (0, _immutable.Map)({
-          layerID: layerID,
-          itemID: itemID,
-          startPointX: x,
-          startPointY: y,
-          originalX: item.x,
-          originalY: item.y
-        })
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "updateDraggingItem",
-    value: function updateDraggingItem(state, x, y) {
-      var _state2 = state,
-        draggingSupport = _state2.draggingSupport,
-        scene = _state2.scene;
-      var layerID = draggingSupport.get('layerID');
-      var itemID = draggingSupport.get('itemID');
-      var startPointX = draggingSupport.get('startPointX');
-      var startPointY = draggingSupport.get('startPointY');
-      var originalX = draggingSupport.get('originalX');
-      var originalY = draggingSupport.get('originalY');
-      var diffX = startPointX - x;
-      var diffY = startPointY - y;
-      var item = scene.getIn(['layers', layerID, 'items', itemID]);
-      if ((0, _util.isUndefined)(item)) return {
-        updatedState: state
-      };
-      var tX = originalX - diffX;
-      var tY = originalY - diffY;
-      tX = tX > scene.width ? scene.width : tX < 0 ? 0 : tX;
-      tY = tY > scene.height ? scene.height : tY < 0 ? 0 : tY;
-      item = item.merge({
-        x: tX,
-        y: tY
-      });
-      state = state.merge({
-        scene: scene.mergeIn(['layers', layerID, 'items', itemID], item)
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "updateDraggingItem3DX",
-    value: function updateDraggingItem3DX(state, x) {
-      var _state3 = state,
-        draggingSupport = _state3.draggingSupport,
-        scene = _state3.scene;
-      var layerID = draggingSupport.get('layerID');
-      var itemID = draggingSupport.get('itemID');
-      var startPointX = draggingSupport.get('startPointX');
-      var originalX = draggingSupport.get('originalX');
-      var diffX = startPointX - x;
-      var item = scene.getIn(['layers', layerID, 'items', itemID]);
-      item = item.merge({
-        x: originalX - diffX
-      });
-      state = state.merge({
-        scene: scene.mergeIn(['layers', layerID, 'items', itemID], item)
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "updateDraggingItem3DY",
-    value: function updateDraggingItem3DY(state, y) {
-      var _state4 = state,
-        draggingSupport = _state4.draggingSupport,
-        scene = _state4.scene;
-      var layerID = draggingSupport.get('layerID');
-      var itemID = draggingSupport.get('itemID');
-      var startPointY = draggingSupport.get('startPointY');
-      var originalY = draggingSupport.get('originalY');
-      var diffY = startPointY - y;
-      var item = scene.getIn(['layers', layerID, 'items', itemID]);
-      item = item.merge({
-        y: originalY - diffY
-      });
-      state = state.merge({
-        scene: scene.mergeIn(['layers', layerID, 'items', itemID], item)
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "endDraggingItem",
-    value: function endDraggingItem(state, x, y) {
-      state = this.updateDraggingItem(state, x, y).updatedState;
-      state = state.merge({
-        mode: _constants.MODE_IDLE
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "endDraggingItem3D",
-    value: function endDraggingItem3D(state) {
-      // state = this.updateDraggingItem(state, x, y).updatedState;
-      state = state.merge({
-        mode: _constants.MODE_IDLE_3D
-      });
-      state = state.setIn(['scene', 'isEndDragging'], true);
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "beginRotatingItem",
-    value: function beginRotatingItem(state, layerID, itemID, x, y) {
-      var item = state.getIn(['scene', 'layers', layerID, 'items', itemID]);
-      var originRotation = item.get('rotation');
-      state = state.merge({
-        mode: _constants.MODE_ROTATING_ITEM,
-        rotatingSupport: (0, _immutable.Map)({
-          layerID: layerID,
-          itemID: itemID,
-          x: x,
-          y: y,
-          originRotation: originRotation
-        })
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "beginRotatingItem3D",
-    value: function beginRotatingItem3D(state, layerID, itemID, x, y) {
-      var item = state.getIn(['scene', 'layers', layerID, 'items', itemID]);
-      var originRotation = item.get('rotation');
-      state = state.merge({
-        mode: _constants.MODE_ROTATING_ITEM_3D,
-        rotatingSupport: (0, _immutable.Map)({
-          layerID: layerID,
-          itemID: itemID,
-          x: x,
-          y: y,
-          originRotation: originRotation
-        })
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "updateRotatingItem",
-    value: function updateRotatingItem(state, x, y) {
-      var _state5 = state,
-        rotatingSupport = _state5.rotatingSupport,
-        scene = _state5.scene;
-      var layerID = rotatingSupport.get('layerID');
-      var itemID = rotatingSupport.get('itemID');
-      var item = state.getIn(['scene', 'layers', layerID, 'items', itemID]);
-      var origin = {
-        x: rotatingSupport.get('x'),
-        y: rotatingSupport.get('y'),
-        originRotation: rotatingSupport.get('originRotation')
-      };
-      var newRot = Math.atan2(origin.y - item.y, origin.x - item.x) * 180 / Math.PI + 90;
-      var deltaRot = newRot - origin.originRotation;
-      var deltaX = x - item.x;
-      var deltaY = y - item.y;
-      var rotation = Math.atan2(deltaY, deltaX) * 180 / Math.PI + 90;
-      rotation -= deltaRot;
-      if (-5 < rotation && rotation < 5) rotation = 0;
-      if (-95 < rotation && rotation < -85) rotation = -90;
-      if (-185 < rotation && rotation < -175) rotation = -180;
-      if (85 < rotation && rotation < 95) rotation = 90;
-      if (-270 < rotation && rotation < -265) rotation = 90;
-      if (175 < rotation && rotation < 185) rotation = 180;
-      if (265 < rotation && rotation < 275) rotation = -90;
-      item = item.merge({
-        rotation: rotation
-      });
-      state = state.merge({
-        scene: scene.mergeIn(['layers', layerID, 'items', itemID], item)
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "updateRotatingItemChanged",
-    value: function updateRotatingItemChanged(state, rotation, layerID, itemID) {
-      var scene = state.scene;
-
-      // let originalX = draggingSupport.get('originalX');
-      // let originalY = draggingSupport.get('originalY');
-
-      // let diffX = x;
-      // let diffY = y;
-
-      var item = scene.getIn(['layers', layerID, 'items', itemID]);
-      // let tX = originalX - diffX;
-      // let tY = originalY - diffY;
-      // tX = tX > 500 ? 500 : tX < 0 ? 0 : tX;
-      // tY = tY > 500 ? 500 : tY < 0 ? 0 : tY;
-      item = item.merge({
-        rotation: rotation
-      });
-      state = state.merge({
-        scene: scene.mergeIn(['layers', layerID, 'items', itemID], item)
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "endRotatingItem",
-    value: function endRotatingItem(state, x, y) {
-      //state = this.updateRotatingItem(state, x, y).updatedState;
-      state = state.merge({
-        mode: _constants.MODE_IDLE
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "endRotatingItem3D",
-    value: function endRotatingItem3D(state, x, y) {
-      state = this.updateRotatingItem(state, x, y).updatedState;
-      state = state.merge({
-        mode: _constants.MODE_IDLE_3D
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "replaceSubmodule",
-    value: function replaceSubmodule(state, url) {
-      var _state6 = state,
-        replacingSupport = _state6.replacingSupport,
-        scene = _state6.scene;
-      url = 'catalog/texture.png';
-      var urlData = url.split('/');
-      var newURL = '';
-      var addURL = false;
-      for (var i = 0; i < urlData.length; i++) {
-        if (urlData[i] == '') {
-          continue;
-        }
-        newURL += '/' + urlData[i];
-      }
-      var layerID = replacingSupport.get('layerID');
-      var itemID = replacingSupport.get('itemID');
-      var item = state.getIn(['scene', 'layers', layerID, 'items', itemID]);
-      var submodule = [];
-      var normalMap = [];
-      for (var _i = 0; _i < item.submodule.size; _i++) submodule.push(item.submodule.get(_i));
-      for (var _i2 = 0; _i2 < item.normalMap.size; _i2++) normalMap.push(item.normalMap.get(_i2));
-      //let submodule = state.getIn(['scene', 'layers', layerID, 'items', itemID, 'submodule']);
-      urlData = newURL.split('/');
-      var flag = false;
-      if (urlData[urlData.length - 1].includes('.gltf')) {
-        for (var _i3 = 0; _i3 < submodule.length; _i3++) {
-          var pathData = submodule[_i3].split('/');
-          if (pathData[pathData.length - 2] === urlData[urlData.length - 2]) {
-            submodule[_i3] = newURL;
-            flag = true;
-          }
-        }
-        if (!flag) submodule.push(newURL);
-        item = item.merge({
-          submodule: submodule
-        });
-      } else {
-        for (var _i4 = 0; _i4 < normalMap.length; _i4++) {
-          var _pathData = normalMap[_i4].split('/');
-          if (_pathData[_pathData.length - 2] === urlData[urlData.length - 2]) {
-            normalMap[_i4] = newURL;
-            flag = true;
-          }
-        }
-        if (!flag) normalMap.push(newURL);
-        item = item.merge({
-          normalMap: normalMap
-        });
-      }
-      state = state.merge({
-        scene: scene.mergeIn(['layers', layerID, 'items', itemID], item)
-      });
-      state = state.merge({
-        mode: _constants.MODE_IDLE_3D
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setProperties",
-    value: function setProperties(state, layerID, itemID, properties) {
-      state = state.mergeIn(['scene', 'layers', layerID, 'items', itemID, 'properties'], properties);
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setJsProperties",
-    value: function setJsProperties(state, layerID, itemID, properties) {
-      return this.setProperties(state, layerID, itemID, (0, _immutable.fromJS)(properties));
-    }
-  }, {
-    key: "updateProperties",
-    value: function updateProperties(state, layerID, itemID, properties) {
-      properties.forEach(function (v, k) {
-        if (state.hasIn(['scene', 'layers', layerID, 'items', itemID, 'properties', k])) state = state.mergeIn(['scene', 'layers', layerID, 'items', itemID, 'properties', k], v);
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "updateJsProperties",
-    value: function updateJsProperties(state, layerID, itemID, properties) {
-      return this.updateProperties(state, layerID, itemID, (0, _immutable.fromJS)(properties));
-    }
-  }, {
-    key: "setAttributes",
-    value: function setAttributes(state, layerID, itemID, itemAttributes) {
-      state = state.mergeIn(['scene', 'layers', layerID, 'items', itemID], itemAttributes);
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setJsAttributes",
-    value: function setJsAttributes(state, layerID, itemID, itemAttributes) {
-      itemAttributes = (0, _immutable.fromJS)(itemAttributes);
-      return this.setAttributes(state, layerID, itemID, itemAttributes);
-    }
-  }, {
-    key: "animateObject",
-    value: function animateObject(state, value) {
-      var _state7 = state,
-        replacingSupport = _state7.replacingSupport,
-        scene = _state7.scene;
-      var layerID = replacingSupport.get('layerID');
-      var itemID = replacingSupport.get('itemID');
-      var item = state.getIn(['scene', 'layers', layerID, 'items', itemID]);
-      if (item !== undefined) {
-        var animCount = item.get('animate');
-        item = item.merge({
-          animValue: value,
-          animate: animCount + 1
-        });
-        state = state.merge({
-          scene: scene.mergeIn(['layers', layerID, 'items', itemID], item)
-        });
-        state = state.merge({
-          mode: _constants.MODE_IDLE_3D
-        });
-      }
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "removeReplacingSupport",
-    value: function removeReplacingSupport(state) {
-      state = state.merge({
-        replacingSupport: new _immutable.Map()
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setInitialDoorStyle",
-    value: function setInitialDoorStyle(state, doorStyle, oStyle) {
-      if (doorStyle === undefined) {
-        state = state.merge({
-          oStyle: new _immutable.Map({
-            oStyle: oStyle
-          })
-        });
-      } else {
-        state = state.merge({
-          doorStyle: doorStyle,
-          oStyle: new _immutable.Map({
-            oStyle: oStyle
-          })
-        });
-        var _state8 = state,
-          scene = _state8.scene;
-        var layerID = scene.get('selectedLayer');
-        var layers = scene.layers.get(layerID);
-        var items = layers.items;
-        items.forEach(function (data) {
-          {
-            var itemID = data.id;
-            var tmpDS = _objectSpread(_objectSpread({}, data.doorStyle), {}, {
-              doorStyles: _objectSpread(_objectSpread({}, data.doorStyle.doorStyles), {}, {
-                counttop: doorStyle.doorStyles.counttop
-              })
-            });
-            data = data.mergeIn(['doorStyle'], (0, _immutable.fromJS)(tmpDS));
-            layers = layers.mergeIn(['items', itemID], data);
-            state = state.merge({
-              scene: scene.mergeIn(['layers', layerID], layers)
-            });
-          }
-        });
-      }
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setDoorStyle",
-    value: function setDoorStyle(state, doorStyle, pathes, isAll) {
-      var _this2 = this;
-      var keys = Object.keys(doorStyle.doorStyles);
-      keys = keys.filter(function (elem) {
-        return !elem.endsWith('_gltf');
-      });
-      var tmp = {};
-      for (var x in keys) {
-        tmp[keys[x]] = doorStyle.doorStyles[keys[x]];
-      }
-      state = state.setIn(['scene', 'layers', state.scene.selectedLayer, 'doorStyle'], doorStyle);
-      state = state.merge({
-        doorStyle: doorStyle
-      });
-      var layerID = state.scene.get('selectedLayer');
-      var temp_layer_molding = state.scene.getIn(['layers', layerID, 'molding']);
-      temp_layer_molding = temp_layer_molding.filter(function (md) {
-        return doorStyle.doorStyles.cds.some(function (ds) {
-          return md.itemID === ds.itemID;
-        });
-      });
-      state = state.setIn(['scene', 'layers', layerID, 'molding'], temp_layer_molding);
-      var itemIDs = state.scene.layers.getIn([layerID, 'selected', 'items']).toJS();
-      var setDoorStyleOfItem = function setDoorStyleOfItem(data) {
-        if (data.category !== 'cabinet') return; //CDS should effect to cabinets
-        var itemID = data.id;
-        var curItem = state.getIn(['scene', 'layers', layerID, 'items', itemID]);
-        var layer = state.getIn(['scene', 'layers', layerID]);
-        var tmpMolding = _toConsumableArray(curItem.molding);
-        var temp_item_molding = _toConsumableArray(curItem.molding);
-        temp_item_molding = temp_item_molding.filter(function (md) {
-          return doorStyle.doorStyles.cds.some(function (ds) {
-            return ds.itemID === md.itemID;
-          });
-        });
-        tmpMolding.forEach(function (md) {
-          var itemGroup = _export2.MoldingUtils.getItemGroupFromMolding(layer, curItem, md);
-          itemGroup.forEach(function (it) {
-            state = state.setIn(['scene', 'layers', layerID, 'items', it.id, 'molding'], temp_item_molding);
-          });
-        });
-        var cds = doorStyle.doorStyles.cds.find(function (elem) {
-          return elem.itemID === data.itemID;
-        });
-        var euro_cds = [];
-        if (cds !== undefined) {
-          euro_cds = cds && cds.data.filter(function (element) {
-            return element.is_euro_cds;
-          });
-        }
-        var cds_data;
-        if (doorStyle.door_style_name === 'Euro & Frameless' && euro_cds.length > 0) {
-          cds_data = cds ? _objectSpread(_objectSpread({}, euro_cds[0]), {}, {
-            cabinet_door_style_id: cds.cabinet_door_style_id
-          }) : {};
-          var newProperties = state.scene.getIn(['layers', layerID, 'items', itemID, 'properties']).toJS();
-          if (newProperties.hasOwnProperty('depth')) {
-            if (!newProperties.hasOwnProperty('oldDepth')) {
-              newProperties['oldDepth'] = new _immutable.Map({
-                length: newProperties.depth.length,
-                _length: newProperties.depth._length,
-                _unit: newProperties.depth._unit
-              });
-            }
-            newProperties['depth'] = new _immutable.Map({
-              length: (0, _convertUnits["default"])(euro_cds[0].euro_length).from('in').to('cm'),
-              _length: euro_cds[0].euro_length,
-              _unit: 'in'
-            });
-          }
-          if (newProperties.hasOwnProperty('height')) {
-            if (!newProperties.hasOwnProperty('oldHeight')) {
-              newProperties['oldHeight'] = new _immutable.Map({
-                length: newProperties.height.length,
-                _length: newProperties.height._length,
-                _unit: newProperties.height._unit
-              });
-            }
-            newProperties['height'] = new _immutable.Map({
-              length: (0, _convertUnits["default"])(euro_cds[0].euro_height).from('in').to('cm'),
-              _length: euro_cds[0].euro_height,
-              _unit: 'in'
-            });
-          }
-          if (newProperties.hasOwnProperty('width')) {
-            if (!newProperties.hasOwnProperty('oldWidth')) {
-              newProperties['oldWidth'] = new _immutable.Map({
-                length: newProperties.width.length,
-                _length: newProperties.width._length,
-                _unit: newProperties.width._unit
-              });
-            }
-            newProperties['width'] = new _immutable.Map({
-              length: (0, _convertUnits["default"])(euro_cds[0].euro_width).from('in').to('cm') - 10,
-              _length: euro_cds[0].euro_width,
-              _unit: 'in'
-            });
-          }
-          state = _this2.setJsProperties(state, layerID, itemID, newProperties).updatedState;
-        } else {
-          cds_data = cds ? _objectSpread(_objectSpread({}, cds.data[0]), {}, {
-            cabinet_door_style_id: cds.cabinet_door_style_id
-          }) : {};
-          var properties = state.scene.getIn(['layers', layerID, 'items', itemID, 'properties']).toJS();
-          if (properties.hasOwnProperty('oldDepth')) {
-            properties['depth'] = new _immutable.Map({
-              length: properties.oldDepth.length,
-              _length: properties.oldDepth._length,
-              _unit: properties.oldDepth._unit
-            });
-          }
-          if (properties.hasOwnProperty('oldHeight')) {
-            properties['height'] = new _immutable.Map({
-              length: properties.oldHeight.length,
-              _length: properties.oldHeight._length,
-              _unit: properties.oldHeight._unit
-            });
-          }
-          if (properties.hasOwnProperty('oldWidth')) {
-            properties['width'] = new _immutable.Map({
-              length: properties.oldWidth.length,
-              _length: properties.oldWidth._length,
-              _unit: properties.oldWidth._unit
-            });
-          }
-          state = _this2.setJsProperties(state, layerID, itemID, properties).updatedState;
-        }
-        var tmpDS = {
-          id: doorStyle.id,
-          brightness: doorStyle.brightness,
-          color: doorStyle.color,
-          glossness: doorStyle.glossness,
-          name: doorStyle.name,
-          door_style_name: doorStyle.door_style_name,
-          texture: doorStyle.texture,
-          thumbnail: doorStyle.thumbnail,
-          type: doorStyle.type,
-          sku: doorStyle.sku,
-          color_sku_alias: doorStyle.color_sku_alias,
-          // alias name of color_sku for the current dealer
-          install: (0, _utils.getInstallationSuffix)(_constants.INSTALLATION_SUFFIX_TYPE.NAME, doorStyle),
-          doorStyles: _objectSpread(_objectSpread({}, tmp), cds_data)
-        };
-        state = state.mergeIn(['scene', 'layers', layerID, 'items', itemID, 'doorStyle'], (0, _immutable.fromJS)(tmpDS));
-      };
-      if (isAll) {
-        var items = state.scene.layers.get(layerID).items;
-        items.forEach(setDoorStyleOfItem);
-      } else {
-        if (itemIDs.length > 0) {
-          var _loop = function _loop() {
-            var itemID = itemIDs[i];
-            var items = state.scene.layers.get(layerID).items;
-            items.forEach(function (data) {
-              if (itemID === data.id) {
-                setDoorStyleOfItem(data);
-              }
-            });
-          };
-          for (var i = 0; i < itemIDs.length; i++) {
-            _loop();
-          }
-        }
-      }
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setCounterTop",
-    value: function setCounterTop(state, counterTop) {
-      var _state9 = state,
-        scene = _state9.scene;
-      var layerID = scene.get('selectedLayer');
-      var layers = scene.layers.get(layerID);
-      layers = layers.mergeIn(['counterTop'], counterTop);
-      state = state.merge({
-        scene: scene.mergeIn(['layers', layerID], layers)
-      });
-      var items = layers.items;
-      items.forEach(function (data) {
-        {
-          var dataJSON = data.toJS();
-          var itemID = dataJSON.id;
-          var newCounter = dataJSON.counterTop;
-          newCounter = _objectSpread(_objectSpread({}, newCounter), counterTop);
-          data = data.mergeIn(['counterTop'], newCounter);
-          layers = layers.mergeIn(['items', itemID], data);
-          state = state.merge({
-            scene: scene.mergeIn(['layers', layerID], layers)
-          });
-        }
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setItemsDoorHandle",
-    value: function setItemsDoorHandle(state, scene, layer, layerID, elements_item) {
-      var _this3 = this;
-      elements_item.forEach(function (data) {
-        var itemID = data.id;
-        var item = _this3.updateDoorHandle(data, layer);
-        layer = layer.mergeIn(['items', itemID], item);
-        state = state.merge({
-          scene: scene.mergeIn(['layers', layerID], layer)
-        });
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setDoorHandle",
-    value: function setDoorHandle(state, doorHandle) {
-      var _state0 = state,
-        scene = _state0.scene;
-      var layerID = scene.get('selectedLayer');
-      var layer = scene.layers.get(layerID);
-      layer = layer.mergeIn(['doorHandle'], doorHandle);
-      state = state.merge({
-        scene: scene.mergeIn(['layers', layerID], layer)
-      });
-      var items = layer.items;
-      var selectedItems = items.filter(function (element) {
-        return element.selected === true;
-      }); // find selected items (default 1 selected)
-
-      if (selectedItems.size === 0) {
-        state = this.setItemsDoorHandle(state, scene, layer, layerID, items).updatedState;
-      } else {
-        state = this.setItemsDoorHandle(state, scene, layer, layerID, selectedItems).updatedState;
-      }
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setHandleMaterial",
-    value: function setHandleMaterial(state, material) {
-      var _state1 = state,
-        scene = _state1.scene;
-      var layerID = scene.get('selectedLayer');
-      var layers = scene.layers.get(layerID);
-      var items = layers.items;
-      items.forEach(function (data) {
-        var dataJSON = data.toJS();
-        var itemID = dataJSON.id;
-        var doorStyle = dataJSON.doorStyle;
-        var tmpDS = _objectSpread(_objectSpread({}, doorStyle), {}, {
-          metalness: material.metalness,
-          roughness: material.roughness
-        });
-        data = data.mergeIn(['doorStyle'], (0, _immutable.fromJS)(tmpDS));
-        layers = layers.mergeIn(['items', itemID], data);
-        state = state.merge({
-          scene: scene.mergeIn(['layers', layerID], layers)
-        });
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setWallColor",
-    value: function setWallColor(state, wallColor) {
-      var _state10 = state,
-        scene = _state10.scene;
-      var layerID = scene.get('selectedLayer');
-      var layer = scene.layers.get(layerID);
-      layer = layer.merge({
-        wallColor: wallColor
-      });
-      state = state.merge({
-        scene: scene.mergeIn(['layers', layerID], layer)
-      });
-      var lines = layer.lines;
-      lines.forEach(function (data) {
-        var dataJSON = data.toJS();
-        var lineID = dataJSON.id;
-        data = data.mergeIn(['wallColor'], wallColor);
-        layer = layer.mergeIn(['lines', lineID], data);
-        state = state.merge({
-          scene: scene.mergeIn(['layers', layerID], layer)
-        });
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setBacksplash",
-    value: function setBacksplash(state, backsplash) {
-      var _state11 = state,
-        scene = _state11.scene;
-      var layerID = scene.get('selectedLayer');
-      var layer = scene.layers.get(layerID);
-      var dataJSON = layer.toJS();
-      var newBack = dataJSON.backsplash;
-      var flag = true; // selected or not
-      // if backsplash is already set
-      if (layer.getIn(['backsplash']).uri === backsplash.uri) {
-        // unselect
-        newBack = _objectSpread(_objectSpread({}, newBack), {}, {
-          uri: ''
-        });
-        flag = false;
-      }
-      // else then, set backsplash
-      else newBack = _objectSpread(_objectSpread({}, newBack), backsplash);
-      layer = layer.mergeIn(['backsplash'], newBack);
-      layer = layer.set('backsplashApplied', flag);
-      state = state.merge({
-        scene: scene.mergeIn(['layers', layerID], layer)
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setMolding",
-    value: function setMolding(state, molding, isAll) {
-      var _state12 = state,
-        scene = _state12.scene;
-      var layerID = scene.get('selectedLayer');
-      var layer = scene.layers.get(layerID);
-      if (isAll) {
-        var tempLayerMolding = layer.molding;
-        var flag = tempLayerMolding.some(function (mol) {
-          return mol.name === molding.name;
-        });
-        if (flag) {
-          tempLayerMolding = tempLayerMolding.filter(function (mol) {
-            return mol.name !== molding.name;
-          });
-        } else {
-          if (tempLayerMolding.some(function (mol) {
-            return mol.molding_type === molding.molding_type && mol.location_type === molding.location_type;
-          })) {
-            tempLayerMolding = tempLayerMolding.filter(function (mol) {
-              return mol.molding_type !== molding.molding_type || mol.location_type !== molding.location_type;
-            });
-          }
-          tempLayerMolding = tempLayerMolding.concat(molding);
-        }
-        layer = layer.set('molding', tempLayerMolding);
-        state = state.merge({
-          scene: scene.mergeIn(['layers', layerID], layer)
-        });
-        layer.items.toArray().forEach(function (item) {
-          if (_export2.MoldingUtils.isEnableItemForMolding(layer, item, molding)) {
-            var tempItemMolding = item.molding;
-            if (flag) {
-              if (tempItemMolding.some(function (mol) {
-                return mol.name === molding.name;
-              })) {
-                tempItemMolding = tempItemMolding.filter(function (mol) {
-                  return mol.name !== molding.name;
-                });
-              }
-            } else {
-              if (tempItemMolding.some(function (mol) {
-                return mol.molding_type === molding.molding_type && mol.location_type === molding.location_type;
-              })) {
-                tempItemMolding = tempItemMolding.filter(function (mol) {
-                  return mol.molding_type !== molding.molding_type || mol.location_type !== molding.location_type;
-                });
-              }
-              tempItemMolding = tempItemMolding.concat(molding);
-            }
-            state = state.setIn(['scene', 'layers', layerID, 'items', item.id, 'molding'], tempItemMolding);
-          }
-        });
-      } else {
-        var selectedItem = layer.getIn(['items', layer.selected.toJS().items[0]]);
-        if (_export2.MoldingUtils.isEnableItemForMolding(layer, selectedItem, molding)) {
-          var moldingGroup = _export2.MoldingUtils.getItemGroupFromMolding(layer, selectedItem, molding);
-          var tempSelItemMolding = selectedItem.molding;
-          var _flag = tempSelItemMolding.some(function (mol) {
-            return mol.name === molding.name;
-          });
-          moldingGroup.forEach(function (item) {
-            var tempItemMolding = item.molding;
-            if (_flag) {
-              if (tempItemMolding.some(function (mol) {
-                return mol.name === molding.name;
-              })) {
-                tempItemMolding = tempItemMolding.filter(function (mol) {
-                  return mol.name !== molding.name;
-                });
-              }
-            } else {
-              if (tempItemMolding.some(function (mol) {
-                return mol.molding_type === molding.molding_type && mol.location_type === molding.location_type;
-              })) {
-                tempItemMolding = tempItemMolding.filter(function (mol) {
-                  return mol.molding_type !== molding.molding_type || mol.location_type !== molding.location_type;
-                });
-              }
-              tempItemMolding = tempItemMolding.concat(molding);
-            }
-            state = state.setIn(['scene', 'layers', layerID, 'items', item.id, 'molding'], tempItemMolding);
-          });
-        }
-      }
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "updateMolding",
-    value: function updateMolding(state) {
-      var _state13 = state,
-        scene = _state13.scene;
-      var layerID = scene.get('selectedLayer');
-      var layer = scene.layers.get(layerID);
-      var selectedItem = layer.getIn(['items', layer.selected.toJS().items[0]]);
-      var snappedItemGroup = []; // The array that include snapped items with selected item.
-      if (!!selectedItem && selectedItem.category === 'cabinet') {
-        var itemGroups = [];
-        layer.items.toArray().forEach(function (curItem) {
-          if (selectedItem.id !== curItem.id && curItem.category === 'cabinet') {
-            if (_export2.MoldingUtils.isItemSnappedItem(selectedItem, curItem)) {
-              snappedItemGroup.push(curItem); // add the snapped item.
-              // add the snapped item that has same molding location type, layoutpos and height to itemGroups.
-              if (curItem.molding.length) {
-                curItem.molding.forEach(function (md) {
-                  // This code check whether the curItem can be grouped with selected Item in molding.
-                  if (_export2.MoldingUtils.tryMergeMDItem(layer, selectedItem, curItem, [selectedItem], md)) {
-                    itemGroups.push({
-                      base_item: curItem,
-                      group: _export2.MoldingUtils.getItemGroupFromMolding(layer, curItem, md),
-                      molding: md
-                    });
-                  }
-                });
-              }
-            }
-          }
-        });
-        var updateSelectItemMolding = function updateSelectItemMolding() {
-          var _loop2 = function _loop2() {
-            // check whether snapped item is same as selected item in layoutpos(Wall, Tall, Base)
-            if (_export2.MoldingUtils.isSameMoldingLayoutpos(selectedItem, snappedItemGroup[i])) {
-              // check whether snapped item is same in location(same location type and height).
-              var delMoldings = [];
-              for (var k = 0; k < selectedItem.molding.length; k++) {
-                if (_export2.MoldingUtils.isItemSameItemByLocation(selectedItem, snappedItemGroup[i], selectedItem.molding[k].location_type)) {
-                  delMoldings.push(selectedItem.molding[k].itemID);
-                }
-              }
-              var resultMol = [];
-              selectedItem.molding.forEach(function (mol) {
-                if (!delMoldings.some(function (id) {
-                  return id === mol.itemID;
-                })) {
-                  resultMol.push(mol);
-                }
-              });
-              state = state.setIn(['scene', 'layers', layerID, 'items', selectedItem.id, 'molding'], resultMol);
-            }
-          };
-          for (var i = 0; i < snappedItemGroup.length; i++) {
-            _loop2();
-          }
-        };
-        var emptyMoldingArray = function emptyMoldingArray() {
-          var temp_items = [selectedItem];
-          var groupMoldings = [];
-          itemGroups.forEach(function (itGroup) {
-            groupMoldings.push(itGroup.molding);
-            itGroup.group.forEach(function (it) {
-              if (!temp_items.some(function (i) {
-                return i.id === it.id;
-              })) {
-                temp_items.push(it);
-              }
-            });
-          });
-          temp_items.forEach(function (item) {
-            var finalMoldings = [];
-            var tempMoldings = state.getIn(['scene', 'layers', layerID, 'items', item.id, 'molding']);
-            tempMoldings.forEach(function (molding) {
-              if (!groupMoldings.some(function (ml) {
-                return ml.itemID === molding.itemID;
-              })) {
-                finalMoldings.push(molding);
-              }
-            });
-            state = state.setIn(['scene', 'layers', layerID, 'items', item.id, 'molding'], finalMoldings);
-          });
-          updateSelectItemMolding();
-        };
-        var setLocationMolding = function setLocationMolding(location) {
-          var locationMolding = itemGroups.filter(function (it) {
-            return it.molding.location_type === location;
-          }).sort(function (a, b) {
-            if (a.group.length === b.group.length) {
-              return _export2.GeometryUtils.pointsDistance(a.base_item.x, a.base_item.y, selectedItem.x, selectedItem.y) - _export2.GeometryUtils.pointsDistance(b.base_item.x, b.base_item.y, selectedItem.x, selectedItem.y);
-            } else {
-              return a.group.length - b.group.length;
-            }
-          });
-          if (locationMolding.length) {
-            var locationMoldingItems = _export2.MoldingUtils.getItemGroupFromMolding(layer, selectedItem, locationMolding[0].molding);
-            locationMoldingItems.forEach(function (item) {
-              var tempMoldings = state.getIn(['scene', 'layers', layerID, 'items', item.id, 'molding']);
-              if (!tempMoldings.some(function (mol) {
-                return mol.itemID === locationMolding[0].molding.itemID;
-              })) tempMoldings.push(locationMolding[0].molding);
-              state = state.setIn(['scene', 'layers', layerID, 'items', item.id, 'molding'], tempMoldings);
-            });
-          }
-        };
-        if (itemGroups.length && layer.items.some(function (it) {
-          return _export2.MoldingUtils.isItemSnappedItem(selectedItem, it) && it.category === 'cabinet';
-        })) {
-          emptyMoldingArray();
-          for (var i = 0; i < _constants.MOLDING_LOCATIONS.length; i++) {
-            setLocationMolding(_constants.MOLDING_LOCATIONS[i]);
-          }
-        } else if (!itemGroups.length && selectedItem.molding.length) {
-          // Delete the selected Item's molding property if selItem attached the group that has no molding.
-          // If snapped items have no moldings and one item's property is same as selected Item, selected Item's molding should be deleted.
-          updateSelectItemMolding();
-        }
-      }
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setBacksplashVisible",
-    value: function setBacksplashVisible(state, itemID, backsplashVisible) {
-      var _state14 = state,
-        scene = _state14.scene;
-      var layerID = scene.get('selectedLayer');
-      var layer = scene.layers.get(layerID);
-      layer = layer.mergeIn(['items', itemID, 'backsplashVisible'], backsplashVisible);
-      // let cabinet_category = layer.getIn(["items"], itemID).toJS()[itemID].cabinet_category;
-      // if (cabinet_category && (cabinet_category.search("Sink") !== -1 || cabinet_category.search("End/Angle") !== -1)) {
-      //   layer = layer.mergeIn(["items", itemID, "backsplashVisible"], true);
-      // } else {
-      //   layer = layer.mergeIn(["items", itemID, "backsplashVisible"], false);
-      // }
-      state = state.merge({
-        scene: scene.mergeIn(['layers', layerID], layer)
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setApplianceMaterial",
-    value: function setApplianceMaterial(state, material) {
-      var _state15 = state,
-        scene = _state15.scene;
-      var layerID = scene.get('selectedLayer');
-      var layers = scene.layers.get(layerID);
-      var items = layers.items;
-      items.forEach(function (data) {
-        var dataJSON = data.toJS();
-        var itemID = dataJSON.id;
-        var newMaterial = {
-          metalness: material.metalness,
-          roughness: material.roughness
-        };
-        data = data.mergeIn(['applianceMaterial'], newMaterial);
-        layers = layers.mergeIn(['items', itemID], data);
-        state = state.merge({
-          scene: scene.mergeIn(['layers', layerID], layers)
-        });
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "setModelling",
-    value: function setModelling(state, molding) {
-      var _state16 = state,
-        scene = _state16.scene;
-      var layerID = scene.get('selectedLayer');
-      var layers = scene.layers.get(layerID);
-      var items = layers.items;
-      items.forEach(function (data) {
-        var dataJSON = data.toJS();
-        var itemID = dataJSON.id;
-      });
-      state = state.merge({
-        scene: scene.mergeIn(['layers', layerID], layers)
-      });
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "updateItemsAltitude",
-    value: function updateItemsAltitude(state, layerID, itemID, value) {
-      var item = state.getIn(['scene', 'layers', layerID, 'items', itemID]);
-      var properties = item.get('properties');
-      var altitude = properties.get('altitude');
-      var length = altitude.get('length');
-      var _length = altitude.get('_length');
-      var _unit = altitude.get('_unit');
-      length = length - value;
-      switch (_unit) {
-        case 'mm':
-          _length = length * 10;
-          break;
-        case 'm':
-          _length = length * 0.01;
-          break;
-        default:
-          _length = length;
-      }
-      if (length <= 0) {
-        length = 0;
-        _length = 0;
-      }
-      state = state.mergeIn(['scene', 'layers', layerID, 'items', itemID, 'properties', 'altitude'], new _immutable.Map({
-        length: length,
-        _length: _length,
-        _unit: _unit
-      }));
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "createHole",
-    value: function createHole(state, layerID, type, lineID, offset, properties) {
-      var holeID = _export2.IDBroker.acquireID();
-      var hole = state.catalog.factoryElement(type, {
-        id: holeID,
-        url: state.catalog.getIn(['elements', type, 'info', 'url']),
-        type: type,
-        offset: offset,
-        line: lineID
-      }, properties);
-      state = state.setIn(['scene', 'layers', layerID, 'holes', holeID], hole);
-      state = state.updateIn(['scene', 'layers', layerID, 'lines', lineID, 'holes'], function (holes) {
-        return holes && holes.push(holeID);
-      });
-      // get vertex order/////
-      var element = state.scene.layers.getIn([layerID, 'lines', lineID]);
-      var layer = state.getIn(['scene', 'layers', layerID]);
-      var vetName0 = element.vertices.get(0);
-      var vetName1 = element.vertices.get(1);
-      var verticesArray = [];
-      layer.areas.forEach(function (data) {
-        verticesArray.push(data.vertices.toJS());
-      });
-      for (var i = 0; i < verticesArray.length; i++) {
-        var vertices = verticesArray[i];
-        if (vertices.includes(vetName0) && vertices.includes(vetName1)) {
-          var index0 = vertices.indexOf(vetName0);
-          var index1 = vertices.indexOf(vetName1);
-          // if vertex order chanege//
-          if (index1 + 1 == index0) {
-            return {
-              updatedState: state,
-              hole: hole
-            };
-          }
-          if (index0 == 0 && index1 == vertices.length - 1) {
-            return {
-              updatedState: state,
-              hole: hole
-            };
-          }
-          // ////////////////////////
-        }
-      }
-      // ///////////////////////////
-      properties = hole.properties.toJS();
-      if (properties.hasOwnProperty('flip_orizzontal')) {
-        properties['flip_orizzontal'] = true;
-      }
-      if (properties.hasOwnProperty('flip_horizontal')) {
-        properties['flip_horizontal'] = true;
-      }
-      state = _export.Hole.setJsProperties(state, layerID, holeID, properties).updatedState;
-      return {
-        updatedState: state,
-        hole: hole
-      };
-    }
-  }, {
-    key: "toggleLoadingCabinet",
-    value: function toggleLoadingCabinet(state) {
-      var _state17 = state,
-        scene = _state17.scene;
-      console.log('scene.isLoadingCabinet: ', !scene.isLoadingCabinet);
-      // scene = scene.set('isLoadingCabinet', !scene.isLoadingCabinet);
-      // state = state.set('scene', scene);
-      state = state.setIn(['scene', 'isLoadingCabinet'], !scene.isLoadingCabinet);
-      return {
-        updatedState: state
-      };
-    }
-  }, {
-    key: "endLoading",
-    value: function endLoading(state) {
-      var _state18 = state,
-        scene = _state18.scene;
-      state = state.setIn(['scene', 'loadFlag'], true);
-      return {
-        updatedState: state
-      };
-    }
-  }]);
-}();
-//# sourceMappingURL=item.js.map