kitchen-simulator 1.1.1-test.70 → 1.1.1-test.71

package/es/components/viewer3d/viewer3d.js

@@ -1,45 +1,40 @@
 'use strict';
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-exports.__esModule = true;
-exports["default"] = void 0;
-var _readOnlyError2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/readOnlyError"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/createClass"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/getPrototypeOf"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/inherits"));
-var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _reactDom = _interopRequireDefault(require("react-dom"));
-var Three = _interopRequireWildcard(require("three"));
-var _sceneCreator = require("./scene-creator");
-var _threeMemoryCleaner = require("./three-memory-cleaner");
-var _immutablediff = _interopRequireDefault(require("immutablediff"));
-var SharedStyle = _interopRequireWildcard(require("../../shared-style"));
-var _constants = require("../../constants");
-var _geometry = require("../../utils/geometry");
-var _convertUnitsLite = require("../../utils/convert-units-lite");
-var _export = require("../../utils/export");
-var _helper = require("../../utils/helper");
-var _RGBELoader = require("three/examples/jsm/loaders/RGBELoader");
-var _cameraControls = _interopRequireDefault(require("camera-controls"));
-var _utils = require("../viewer2d/utils");
-var _objectsUtils = require("../../utils/objects-utils");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+import _readOnlyError from "@babel/runtime/helpers/esm/readOnlyError";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
 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 _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 _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 _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(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; })(); }
-_cameraControls["default"].install({
+import React from 'react';
+import PropTypes from 'prop-types';
+import ReactDOM from 'react-dom';
+import * as Three from 'three';
+import { checkCabinetOverlap, createBacksplash, deleteSpecifiedMeshObjects, fVLine, getDistances, parseData, updateScene, visibleTransformBox } from "./scene-creator";
+import { disposeObject, disposeScene } from "./three-memory-cleaner";
+import diff from 'immutablediff';
+import * as SharedStyle from "../../shared-style";
+import { BASE_CABINET_LAYOUTPOS, MODE_3D_VIEW, MODE_DRAGGING_ITEM_3D, MODE_DRAWING_HOLE_3D, MODE_DRAWING_ITEM_3D, MODE_ELEVATION_VIEW, MODE_IDLE_3D, MODE_ROTATING_ITEM_3D, SECONDARY_PURPLE_COLOR, TALL_CABINET_LAYOUTPOS, UNIT_CENTIMETER, WALL_CABINET_LAYOUTPOS } from "../../constants";
+import { verticesDistance } from "../../utils/geometry";
+import { convert } from "../../utils/convert-units-lite";
+import { GeometryUtils } from "../../utils/export";
+import { handleCamRect, isElevationView, isEmpty } from "../../utils/helper";
+import { RGBELoader } from 'three/examples/jsm/loaders/RGBELoader';
+import CameraControls from 'camera-controls';
+import { returnReplaceableDeepSearchType } from "../viewer2d/utils";
+import { getAllMeshes, vectorIntersectWithMesh } from "../../utils/objects-utils";
+CameraControls.install({
   THREE: Three
 });
-var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component) {
+var Scene3DViewer = /*#__PURE__*/function (_React$Component) {
   function Scene3DViewer(props) {
     var _this;
-    (0, _classCallCheck2["default"])(this, Scene3DViewer);
+    _classCallCheck(this, Scene3DViewer);
     _this = _callSuper(this, Scene3DViewer, [props]);
     _this.state = {
       isLoading: false,
@@ -59,14 +54,14 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
       window.__elevationRendererDownload = {};
     }
     switch (mode) {
-      case _constants.MODE_IDLE_3D:
+      case MODE_IDLE_3D:
         _this.renderer = window.__threeRenderer || new Three.WebGLRenderer({
           preserveDrawingBuffer: true,
           alpha: true,
           antialias: true
         });
         break;
-      case _constants.MODE_3D_VIEW:
+      case MODE_3D_VIEW:
         _this.renderer = window.__threeRendererDownload || new Three.WebGLRenderer({
           preserveDrawingBuffer: true,
           alpha: true,
@@ -101,8 +96,8 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
     _this.renderer.domElement.style.display = 'none';
     return _this;
   }
-  (0, _inherits2["default"])(Scene3DViewer, _React$Component);
-  return (0, _createClass2["default"])(Scene3DViewer, [{
+  _inherits(Scene3DViewer, _React$Component);
+  return _createClass(Scene3DViewer, [{
     key: "componentDidMount",
     value: function componentDidMount(nextProps) {
       var _this2 = this;
@@ -122,7 +117,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
       var mode = state.mode,
         scene = state.scene;
       function setupLight(scene, inbBox) {
-        if ((0, _helper.isElevationView)(mode)) {
+        if (isElevationView(mode)) {
           var ambilight = new Three.AmbientLight('0xffffff', 3);
           scene.add(ambilight);
         } else {
@@ -181,10 +176,10 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             var spotlightDis = 1.5 * Math.abs(inbBox.min.y - inbBox.max.y);
 
             // check if spotlight is inside the room
-            (0, _objectsUtils.vectorIntersectWithMesh)(spot1, scene3D.getObjectByName('floor')) && addSpotLight('0xffffff', 0.8, spot1, spot1, spotlightDis);
-            (0, _objectsUtils.vectorIntersectWithMesh)(spot2, scene3D.getObjectByName('floor')) && addSpotLight('0xffffff', 0.8, spot2, spot2, spotlightDis);
-            (0, _objectsUtils.vectorIntersectWithMesh)(spot3, scene3D.getObjectByName('floor')) && addSpotLight('0xffffff', 0.8, spot3, spot3, spotlightDis);
-            (0, _objectsUtils.vectorIntersectWithMesh)(spot4, scene3D.getObjectByName('floor')) && addSpotLight('0xffffff', 0.8, spot4, spot4, spotlightDis);
+            vectorIntersectWithMesh(spot1, scene3D.getObjectByName('floor')) && addSpotLight('0xffffff', 0.8, spot1, spot1, spotlightDis);
+            vectorIntersectWithMesh(spot2, scene3D.getObjectByName('floor')) && addSpotLight('0xffffff', 0.8, spot2, spot2, spotlightDis);
+            vectorIntersectWithMesh(spot3, scene3D.getObjectByName('floor')) && addSpotLight('0xffffff', 0.8, spot3, spot3, spotlightDis);
+            vectorIntersectWithMesh(spot4, scene3D.getObjectByName('floor')) && addSpotLight('0xffffff', 0.8, spot4, spot4, spotlightDis);
           }
         }
       }
@@ -200,15 +195,15 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
 
         // set loading bar
         switch (self.props.state.mode) {
-          case _constants.MODE_ELEVATION_VIEW:
+          case MODE_ELEVATION_VIEW:
             self.props.setIsLoadingElevation('front', true);
             break;
-          case _constants.MODE_3D_VIEW:
+          case MODE_3D_VIEW:
             self.props.setIsLoading3D(true);
             break;
         }
       }
-      var _parseData = (0, _sceneCreator.parseData)(scene, actions, this.context.catalog, camera, this.renderer, state.mode),
+      var _parseData = parseData(scene, actions, this.context.catalog, camera, this.renderer, state.mode),
         promise = _parseData.promise,
         planData = _parseData.planData;
       promise.then(function () {
@@ -222,7 +217,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           obj.removeFromParent();
         });
         var bbox = new Three.Box3().setFromObject(planData.plan);
-        if (!(0, _helper.isElevationView)(state.mode)) {
+        if (!isElevationView(state.mode)) {
           cameraControls.fitToBox(bbox);
         }
         setupLight(scene3D, planData.boundingBox);
@@ -281,7 +276,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             realVec.push(vec);
           });
           if (aVertices.includes(realVec[0]) && aVertices.includes(realVec[1])) {
-            height = (0, _convertUnitsLite.convert)(layer.ceilHeight).from(layer.unit).to(_constants.UNIT_CENTIMETER);
+            height = convert(layer.ceilHeight).from(layer.unit).to(UNIT_CENTIMETER);
             // height = data.properties.getIn(['height', 'length']);
             return 1; // break
           }
@@ -379,11 +374,11 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
 
       // end snap function variable///////////////////////
       var backsplashVisible = false;
-      var holeItems = _export.GeometryUtils.getHoleItems(layer);
+      var holeItems = GeometryUtils.getHoleItems(layer);
       var removeSnapBox = function removeSnapBox() {
         if (snapBox != null) {
           planData.plan.remove(snapBox);
-          (0, _threeMemoryCleaner.disposeObject)(snapBox);
+          disposeObject(snapBox);
           snapBox = null;
           targetObj = null;
           snapFlag = false;
@@ -454,7 +449,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               x: shape2[j + 1].x,
               y: shape2[j + 1].y
             };
-            var flag = _export.GeometryUtils.getLineInterSect(sl1.x, sl1.y, sl2.x, sl2.y, el1.x, el1.y, el2.x, el2.y);
+            var flag = GeometryUtils.getLineInterSect(sl1.x, sl1.y, sl2.x, sl2.y, el1.x, el1.y, el2.x, el2.y);
             if (flag) {
               count++;
               if (count > 1) return true;
@@ -501,20 +496,20 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
         return vertices;
       };
       var prepareSnap = function prepareSnap(layer) {
-        allLines = _export.GeometryUtils.getAllLines(layer);
-        allLineRects = _export.GeometryUtils.buildRectFromLines(layer, allLines);
-        allItemRect = _export.GeometryUtils.getAllItems(_this2.props.state.scene, actions.catalog, allLineRects);
-        allItemSnap = _export.GeometryUtils.getAllItemSnap(allItemRect);
-        allLineSnap = _export.GeometryUtils.getAllLineSnap(allLineRects, allItemRect.cur);
+        allLines = GeometryUtils.getAllLines(layer);
+        allLineRects = GeometryUtils.buildRectFromLines(layer, allLines);
+        allItemRect = GeometryUtils.getAllItems(_this2.props.state.scene, actions.catalog, allLineRects);
+        allItemSnap = GeometryUtils.getAllItemSnap(allItemRect);
+        allLineSnap = GeometryUtils.getAllLineSnap(allLineRects, allItemRect.cur);
         allRect = allItemRect.others.concat(allLineRects);
-        allItemSnap = _export.GeometryUtils.validateSnaps(allItemSnap, allRect);
-        allLineSnap = _export.GeometryUtils.validateSnaps(allLineSnap, allRect);
-        allArea = _export.GeometryUtils.getAllArea(layer);
+        allItemSnap = GeometryUtils.validateSnaps(allItemSnap, allRect);
+        allLineSnap = GeometryUtils.validateSnaps(allLineSnap, allRect);
+        allArea = GeometryUtils.getAllArea(layer);
       };
       var prepareSnapSpec = function prepareSnapSpec(layer) {
-        allLines = _export.GeometryUtils.getAllLines(layer);
-        allLineRects = _export.GeometryUtils.buildRectFromLines(layer, allLines);
-        allItemRect = _export.GeometryUtils.getAllItemSpecified(_this2.props.state.scene, actions.catalog, _constants.WALL_CABINET_LAYOUTPOS);
+        allLines = GeometryUtils.getAllLines(layer);
+        allLineRects = GeometryUtils.buildRectFromLines(layer, allLines);
+        allItemRect = GeometryUtils.getAllItemSpecified(_this2.props.state.scene, actions.catalog, WALL_CABINET_LAYOUTPOS);
         // allItemSnap = GeometryUtils.getAllItemSnap(allItemRect);
       };
 
@@ -567,7 +562,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           var ocatid = _item.type;
           var ocat = catalog.elements[ocatid];
           var olayoutpos = ocat.info.layoutpos;
-          if (!(layoutpos === _constants.BASE_CABINET_LAYOUTPOS && olayoutpos === _constants.WALL_CABINET_LAYOUTPOS || layoutpos === _constants.WALL_CABINET_LAYOUTPOS && olayoutpos === _constants.BASE_CABINET_LAYOUTPOS)) {
+          if (!(layoutpos === BASE_CABINET_LAYOUTPOS && olayoutpos === WALL_CABINET_LAYOUTPOS || layoutpos === WALL_CABINET_LAYOUTPOS && olayoutpos === BASE_CABINET_LAYOUTPOS)) {
             var tRot = _item.rotation;
             var tPos = new Three.Vector2(_item.x, _item.y);
             var tBounding = target.children[0].userData;
@@ -649,13 +644,13 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           var _item2 = layer.items.getIn([data.id]);
           var ocatid = _item2.type;
           var ocat = catalog.elements[ocatid];
-          if (!ocat) ocat = catalog.elements[(0, _utils.returnReplaceableDeepSearchType)(ocatid)];
+          if (!ocat) ocat = catalog.elements[returnReplaceableDeepSearchType(ocatid)];
           var otherItem = {
             item: _item2,
             cat: ocat
           };
           console.log('currentItem =>', currentItem);
-          if (_export.GeometryUtils.needSnap(currentItem, otherItem) && otherItem.cat.type != 'cabinet') {
+          if (GeometryUtils.needSnap(currentItem, otherItem) && otherItem.cat.type != 'cabinet') {
             var tRot = _item2.rotation;
             var tPos = new Three.Vector2(_item2.x, _item2.y);
             var tBounding = target.children[0].userData;
@@ -709,7 +704,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
         // sort from distance
         for (var _i5 = 0; _i5 < items.length - 1; _i5++) {
           for (var j = _i5 + 1; j < items.length; j++) {
-            if ((0, _geometry.verticesDistance)(oPos, new Three.Vector2(items[_i5].x, items[_i5].y)) > (0, _geometry.verticesDistance)(oPos, new Three.Vector2(items[j].x, items[j].y))) {
+            if (verticesDistance(oPos, new Three.Vector2(items[_i5].x, items[_i5].y)) > verticesDistance(oPos, new Three.Vector2(items[j].x, items[j].y))) {
               var exchange = items[j];
               items[j] = items[_i5];
               items[_i5] = exchange;
@@ -827,7 +822,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           var tRot = layer.getIn(['items', target.userData.itemId]) ? layer.getIn(['items', target.userData.itemId]).rotation : 0;
           var item = layer.getIn(['items', source.userData.itemId]);
           var layoutType = item.layoutpos;
-          var altitudeLength = (0, _convertUnitsLite.convert)(item.properties.getIn(['altitude', '_length'])).from('in').to('cm');
+          var altitudeLength = convert(item.properties.getIn(['altitude', '_length'])).from('in').to('cm');
           var sBounding = source.children[0].userData;
           var tBounding = target.children[0].userData;
           var tPos = target.position.clone();
@@ -844,7 +839,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           var removeSnapBoxObj = function removeSnapBoxObj() {
             if (snapBoxObj) {
               planData.plan.remove(snapBoxObj);
-              (0, _threeMemoryCleaner.disposeObject)(snapBoxObj);
+              disposeObject(snapBoxObj);
             }
             snapFlag = false;
           };
@@ -853,7 +848,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           box.material.depthTest = false;
           box.renderOrder = 200;
           snapBoxObj.add(box);
-          snapBoxObj.position.set(source.position.x, layoutType === _constants.WALL_CABINET_LAYOUTPOS ? altitudeLength + source.position.y + height / 2 : source.position.y + height / 2, source.position.z);
+          snapBoxObj.position.set(source.position.x, layoutType === WALL_CABINET_LAYOUTPOS ? altitudeLength + source.position.y + height / 2 : source.position.y + height / 2, source.position.z);
           snapBoxObj.rotation.set(source.rotation.x, source.rotation.y, source.rotation.z);
           snapBoxObj.name = 'TransformBox';
           planData.plan.add(snapBoxObj);
@@ -928,7 +923,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             return;
           } else {
             var _layoutType = _item3.layoutpos;
-            var _altitudeLength = (0, _convertUnitsLite.convert)(_item3.properties.getIn(['altitude', '_length'])).from('in').to('cm');
+            var _altitudeLength = convert(_item3.properties.getIn(['altitude', '_length'])).from('in').to('cm');
             var _sBounding = source.children[0].userData;
             var _width = _sBounding.max.x - _sBounding.min.x;
             var _height = _sBounding.max.y - _sBounding.min.y;
@@ -943,7 +938,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             var _removeSnapBoxObj = function _removeSnapBoxObj() {
               if (_snapBoxObj) {
                 planData.plan.remove(_snapBoxObj);
-                (0, _threeMemoryCleaner.disposeObject)(_snapBoxObj);
+                disposeObject(_snapBoxObj);
               }
               snapFlag = false;
             };
@@ -952,7 +947,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             _box.material.depthTest = false;
             _box.renderOrder = 100;
             _snapBoxObj.add(_box);
-            _snapBoxObj.position.set(source.position.x, _layoutType === _constants.WALL_CABINET_LAYOUTPOS ? _altitudeLength + source.position.y + _height / 2 : source.position.y + _height / 2, source.position.z);
+            _snapBoxObj.position.set(source.position.x, _layoutType === WALL_CABINET_LAYOUTPOS ? _altitudeLength + source.position.y + _height / 2 : source.position.y + _height / 2, source.position.z);
             _snapBoxObj.rotation.set(source.rotation.x, source.rotation.y, source.rotation.z);
             _snapBoxObj.name = 'TransformBox';
             planData.plan.add(_snapBoxObj);
@@ -1089,7 +1084,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
         ctx.beginPath();
         ctx.arc(50, 50, 45, 0, 2 * Math.PI);
         ctx.stroke();
-        ctx.strokeStyle = _constants.SECONDARY_PURPLE_COLOR;
+        ctx.strokeStyle = SECONDARY_PURPLE_COLOR;
         ctx.lineWidth = 6;
         ctx.beginPath();
         if (lastAngle < 15 && lastAngle > -15) {
@@ -1193,7 +1188,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           var properties = allItemRect.cur.itemInfo.properties;
           altitude = properties.getIn(['altitude', '_length']);
           var unit = properties.getIn(['altitude', '_unit']) || 'in';
-          altitude = (0, _convertUnitsLite.convert)(altitude).from(unit).to(_this2.props.state.scene.unit);
+          altitude = convert(altitude).from(unit).to(_this2.props.state.scene.unit);
         }
         getPoint(event, altitude);
         var state = _this2.props.state;
@@ -1258,7 +1253,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             console.log('intersects[i] is undefined in viewer3d/viewer3d.js');
           }
         }
-        if (_this2.props.state.mode == _constants.MODE_DRAWING_ITEM_3D) return;
+        if (_this2.props.state.mode == MODE_DRAWING_ITEM_3D) return;
         if (isSelected) {
           !_this2.props.downloadFlag && _this2.props.setToolbar('');
           if (intersects.length > 0 && !isNaN(intersects[0].distance)) {
@@ -1285,7 +1280,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
                   var _properties = allItemRect.cur.itemInfo.properties;
                   alti = _properties.getIn(['altitude', '_length']);
                   var _unit = _properties.getIn(['altitude', '_unit']) || 'in';
-                  alti = (0, _convertUnitsLite.convert)(alti).from(_unit).to(_this2.props.state.scene.unit);
+                  alti = convert(alti).from(_unit).to(_this2.props.state.scene.unit);
                 }
                 getPoint({
                   offsetX: event.offsetX - 50,
@@ -1322,8 +1317,8 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               for (_i1 = 0; _i1 < intersects.length; _i1++) {
                 if (selectedItem != undefined && intersects[_i1].object.parent && intersects[_i1].object.parent.parent.userData.itemId === selectedItem.userData.itemId) selectedFlag = true;
               }
-              if (selectedFlag || toolIntersects.length > 0 && !(0, _helper.isElevationView)(mode)) {
-                cameraControls.mouseButtons.left = _cameraControls["default"].ACTION.NONE;
+              if (selectedFlag || toolIntersects.length > 0 && !isElevationView(mode)) {
+                cameraControls.mouseButtons.left = CameraControls.ACTION.NONE;
                 selectedFlag = false;
               } else {
                 isSelected = false;
@@ -1349,7 +1344,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           var properties = allItemRect.cur.itemInfo.properties;
           altitude = properties.getIn(['altitude', '_length']);
           var unit = properties.getIn(['altitude', '_unit']) || 'in';
-          altitude = (0, _convertUnitsLite.convert)(altitude).from(unit).to(_this2.props.state.scene.unit);
+          altitude = convert(altitude).from(unit).to(_this2.props.state.scene.unit);
         }
         scene3D.remove(angleObj);
         scene3D.remove(toolObj);
@@ -1357,7 +1352,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           _this2.props.setToolbar('');
         }
         getPoint(event, altitude);
-        if (_this2.props.state.mode == _constants.MODE_DRAWING_ITEM_3D) {
+        if (_this2.props.state.mode == MODE_DRAWING_ITEM_3D) {
           if (Point.x > _this2.props.state.scene.width) Point.x = _this2.props.state.width;
           if (Point.y > _this2.props.state.scene.height) Point.y = _this2.props.state.height;
           if (Point.x < 0) Point.x = 0;
@@ -1368,7 +1363,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             removeSnapBox();
             var polygon = lineRect(layer);
             // if cursor is outside of room
-            if (!_export.GeometryUtils.ContainsPoint(polygon, Point.x, Point.y)) {
+            if (!GeometryUtils.ContainsPoint(polygon, Point.x, Point.y)) {
               actions.itemsActions.endDrawingItem(_this2.props.state.scene.selectedLayer, sPoint.x, sPoint.y);
             } else {
               actions.itemsActions.updateDraggingItemChanged(targetPoint.x, -targetPoint.z, selectedObject.layerID, selectedObject.itemID);
@@ -1379,13 +1374,13 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           bMove = false;
           return;
         }
-        if (_this2.props.state.mode == _constants.MODE_DRAGGING_ITEM_3D) {
+        if (_this2.props.state.mode == MODE_DRAGGING_ITEM_3D) {
           _this2.context.itemsActions.endDraggingItem3D();
         }
-        if (_this2.props.state.mode == _constants.MODE_ROTATING_ITEM_3D) {
+        if (_this2.props.state.mode == MODE_ROTATING_ITEM_3D) {
           _this2.context.itemsActions.endRotatingItem3D(sPoint.x, sPoint.y);
         }
-        if (_this2.props.state.mode == _constants.MODE_DRAWING_HOLE_3D) {
+        if (_this2.props.state.mode == MODE_DRAWING_HOLE_3D) {
           gridPlanOrigin = gridPlane.position;
           gridMatrix.copy(gridPlane.matrixWorld).invert();
           camPos = camera.position;
@@ -1396,7 +1391,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
         }
         event.preventDefault();
         if (event.button === 0) {
-          cameraControls.mouseButtons.left = _cameraControls["default"].ACTION.ROTATE;
+          cameraControls.mouseButtons.left = CameraControls.ACTION.ROTATE;
           mouse.x = event.offsetX / _this2.width * 2 - 1;
           mouse.y = -(event.offsetY / _this2.height) * 2 + 1;
           raycaster.setFromCamera(mouse, camera);
@@ -1460,7 +1455,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
                 }
                 isSelected = true;
                 setTimeout(function () {
-                  (0, _sceneCreator.getDistances)(layer);
+                  getDistances(layer);
                   var selectedItem = planData.sceneGraph.layers[selectedObject.layerID].items[selectedObject.itemID];
                   if (!selectedItem) return;
                   var selItem = _this2.props.state.scene.layers.get(selectedObject.layerID).items.get(selectedObject.itemID);
@@ -1477,10 +1472,10 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
                   // showItemButtons(layer.getIn(['items', selectedObject.itemID]), currentObject, event, camera, this.renderer);
                   var pointArray = [],
                     cnt = 0;
-                  pointArray.push([_sceneCreator.fVLine[0].userData.distance, 90]);
-                  pointArray.push([_sceneCreator.fVLine[1].userData.distance, -90]);
-                  pointArray.push([_sceneCreator.fVLine[2].userData.distance, 180]);
-                  pointArray.push([_sceneCreator.fVLine[3].userData.distance, 0]);
+                  pointArray.push([fVLine[0].userData.distance, 90]);
+                  pointArray.push([fVLine[1].userData.distance, -90]);
+                  pointArray.push([fVLine[2].userData.distance, 180]);
+                  pointArray.push([fVLine[3].userData.distance, 0]);
                   pointArray.forEach(function (pointElement, index) {
                     if (pointElement[0] == undefined) pointArray[index][0] = 0;
                   });
@@ -1532,13 +1527,13 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               selectedObj = allItemRect.cur;
             }
           } else {
-            (0, _sceneCreator.visibleTransformBox)(false);
+            visibleTransformBox(false);
             var alti = 0;
             if (allItemRect && allItemRect.cur && allItemRect.cur.itemInfo !== undefined) {
               var _properties2 = allItemRect.cur.itemInfo.properties;
               alti = _properties2.getIn(['altitude', '_length']);
               var _unit2 = _properties2.getIn(['altitude', '_unit']) || 'in';
-              alti = (0, _convertUnitsLite.convert)(alti).from(_unit2).to(_this2.props.state.scene.unit);
+              alti = convert(alti).from(_unit2).to(_this2.props.state.scene.unit);
             }
             getPoint(event, alti);
             if (bRotate) {
@@ -1611,9 +1606,9 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           var properties = allItemRect.cur.itemInfo.properties;
           altitude = properties.getIn(['altitude', '_length']);
           var unit = properties.getIn(['altitude', '_unit']) || 'in';
-          altitude = (0, _convertUnitsLite.convert)(altitude).from(unit).to(_this2.props.state.scene.unit);
+          altitude = convert(altitude).from(unit).to(_this2.props.state.scene.unit);
         }
-        if (_this2.props.state.mode === _constants.MODE_DRAWING_HOLE_3D) {
+        if (_this2.props.state.mode === MODE_DRAWING_HOLE_3D) {
           gridPlanOrigin = gridPlane.position;
           gridMatrix.copy(gridPlane.matrixWorld).invert();
           camPos = camera.position;
@@ -1625,7 +1620,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           } else {
             var layerID = _this2.props.state.scene.selectedLayer;
             var holeID = _this2.props.state.drawingSupport.get('currentID');
-            (0, _sceneCreator.deleteSpecifiedMeshObjects)('WarningBox' + holeID);
+            deleteSpecifiedMeshObjects('WarningBox' + holeID);
             prepareSnap(layer);
 
             // let {nx, ny, rot} = GeometryUtils.calcSnap(allItemRect, allItemSnap, allLineRects, allLineSnap, allRect, Point.x, Point.y, allArea);
@@ -1635,7 +1630,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             sPoint.set(nx, ny);
           }
         }
-        if (_this2.props.state.mode === _constants.MODE_DRAWING_ITEM_3D) {
+        if (_this2.props.state.mode === MODE_DRAWING_ITEM_3D) {
           // We need to set cam position since when MODE_DRAWING_ITEM_3D mouse down event
           // is not emited so cam position is not valid
           gridPlanOrigin = gridPlane.position;
@@ -1649,7 +1644,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           };
           var _layer = _this2.props.state.scene.getIn(['layers', selectedObject.layerID]);
           var polygon = lineRect(_layer);
-          var isCursorInArea = _export.GeometryUtils.ContainsPoint(polygon, Point.x, Point.y);
+          var isCursorInArea = GeometryUtils.ContainsPoint(polygon, Point.x, Point.y);
           var _drawingSupport = _this2.props.state.drawingSupport;
           if (!_drawingSupport.has('currentID')) {
             var initialX = Point.x,
@@ -1668,7 +1663,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
                   point = [];
                 }
               });
-              var centroid = _export.GeometryUtils.getCentroidOfPolygon(points);
+              var centroid = GeometryUtils.getCentroidOfPolygon(points);
               initialX = centroid[0];
               initialY = centroid[1];
             }
@@ -1680,8 +1675,8 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             var mX = Point.x - sPoint.x;
             var mY = Point.y - sPoint.y;
             var item3D = planData.sceneGraph.layers[selectedObject.layerID].items[selectedObject.itemID];
-            (0, _sceneCreator.deleteSpecifiedMeshObjects)('TransformBox');
-            (0, _sceneCreator.deleteSpecifiedMeshObjects)('WarningBox' + itemID);
+            deleteSpecifiedMeshObjects('TransformBox');
+            deleteSpecifiedMeshObjects('WarningBox' + itemID);
             var item = _layer.items.getIn([selectedObject.itemID]);
             if (item.counterTop.uri == '') item.counterTop.uri = _layer.counterTop.uri;
             var sRot = item.rotation;
@@ -1693,7 +1688,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             var sdepth = sBounding.max.z - sBounding.min.z;
             var sVertices = _this2.getRectPoints(swidth, sdepth, tPos.clone(), sRot % 360 / 180 * Math.PI);
             prepareSnap(_layer);
-            var _GeometryUtils$calcSn = _export.GeometryUtils.calcSnap(allItemRect, allItemSnap, allLineRects, allLineSnap, allRect, Point.x, Point.y, allArea),
+            var _GeometryUtils$calcSn = GeometryUtils.calcSnap(allItemRect, allItemSnap, allLineRects, allLineSnap, allRect, Point.x, Point.y, allArea),
               _nx = _GeometryUtils$calcSn.nx,
               _ny = _GeometryUtils$calcSn.ny,
               rot = _GeometryUtils$calcSn.rot;
@@ -1707,9 +1702,9 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               //return;
             }
             if (polygon.length > 0) {
-              var PolygonSect = _export.GeometryUtils.ContainsPoint(polygon, _nx, _ny);
+              var PolygonSect = GeometryUtils.ContainsPoint(polygon, _nx, _ny);
               if (!PolygonSect) {
-                var _GeometryUtils$calcCr = _export.GeometryUtils.calcCreateSnap(allItemRect, allItemSnap, allLineRects, allLineSnap, allRect, Point.x, Point.y, polygon),
+                var _GeometryUtils$calcCr = GeometryUtils.calcCreateSnap(allItemRect, allItemSnap, allLineRects, allLineSnap, allRect, Point.x, Point.y, polygon),
                   cx = _GeometryUtils$calcCr.cx,
                   cy = _GeometryUtils$calcCr.cy,
                   crot = _GeometryUtils$calcCr.crot;
@@ -1719,19 +1714,19 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               }
             }
             if (polygon.length > 0) {
-              var isSnapInArea = _export.GeometryUtils.ContainsPoint(polygon, _nx, _ny);
+              var isSnapInArea = GeometryUtils.ContainsPoint(polygon, _nx, _ny);
               if (!isSnapInArea) return;
             }
             actions.itemsActions.updateDraggingItemChanged(_nx, _ny, selectedObject.layerID, selectedObject.itemID);
             actions.itemsActions.updateRotatingItemChanged(rot, selectedObject.layerID, selectedObject.itemID);
             sPoint.set(_nx, _ny);
-            (0, _sceneCreator.getDistances)(_layer);
+            getDistances(_layer);
             var pointArray = [],
               cnt = 0;
-            pointArray.push([_sceneCreator.fVLine[0].userData.distance, 90]);
-            pointArray.push([_sceneCreator.fVLine[1].userData.distance, -90]);
-            pointArray.push([_sceneCreator.fVLine[2].userData.distance, 180]);
-            pointArray.push([_sceneCreator.fVLine[3].userData.distance, 0]);
+            pointArray.push([fVLine[0].userData.distance, 90]);
+            pointArray.push([fVLine[1].userData.distance, -90]);
+            pointArray.push([fVLine[2].userData.distance, 180]);
+            pointArray.push([fVLine[3].userData.distance, 0]);
             pointArray.forEach(function (pointElement, index) {
               if (pointElement[0] == undefined) pointArray[index][0] = 0;
             });
@@ -1743,8 +1738,8 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               pointArray[1][0] = 100;
             }
             actions.itemsActions.storeDistArray(_layer.id, item.id, pointArray);
-            var minDis = _sceneCreator.fVLine[0].userData.distance;
-            var snapObj = _sceneCreator.fVLine[0];
+            var minDis = fVLine[0].userData.distance;
+            var snapObj = fVLine[0];
             var iPos = item3D.position.clone();
             var snapDis = Math.sqrt((iPos.x - targetPoint.x) * (iPos.x - targetPoint.x) + (iPos.z - targetPoint.z) * (iPos.z - targetPoint.z));
             if (snapDis >= 100 && snapObj != null) {
@@ -1752,10 +1747,10 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               backsplashVisible = false;
               //console.log('1 snap no');
             }
-            for (var _i11 = 1; _i11 < _sceneCreator.fVLine.length; _i11++) {
-              if (minDis > _sceneCreator.fVLine[_i11].userData.distance) {
-                minDis = _sceneCreator.fVLine[_i11].userData.distance;
-                snapObj = _sceneCreator.fVLine[_i11];
+            for (var _i11 = 1; _i11 < fVLine.length; _i11++) {
+              if (minDis > fVLine[_i11].userData.distance) {
+                minDis = fVLine[_i11].userData.distance;
+                snapObj = fVLine[_i11];
               }
             }
             if (snapBox == null) {
@@ -1766,14 +1761,14 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               _this2.snap(snapObj, _layer);
               snapFlag = true;
               //console.log('1 snap Yes')
-              (0, _sceneCreator.getDistances)(_layer, true);
+              getDistances(_layer, true);
               var _i12 = 0;
-              for (_i12 = 0; _i12 < _sceneCreator.fVLine.length; _i12++) {
-                if (_sceneCreator.fVLine[_i12].userData.distance < snapDelta) {
+              for (_i12 = 0; _i12 < fVLine.length; _i12++) {
+                if (fVLine[_i12].userData.distance < snapDelta) {
                   break;
                 }
               }
-              if (_i12 === _sceneCreator.fVLine.length) backsplashVisible = false;else backsplashVisible = true;
+              if (_i12 === fVLine.length) backsplashVisible = false;else backsplashVisible = true;
             }
             actions.itemsActions.setBacksplashVisible(selectedObject.itemID, backsplashVisible);
           }
@@ -1786,8 +1781,8 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           var orginRot = _this2.props.state.rotatingSupport.get('originRotation');
           angleTexture.image = createAngleObject((orginRot < 0 ? 360 - orginRot : orginRot) - _item4.rotation);
           angleTexture.needsUpdate = true;
-          (0, _sceneCreator.deleteSpecifiedMeshObjects)('WarningBox' + selectedObject.itemID);
-          (0, _sceneCreator.deleteSpecifiedMeshObjects)('backsplash' + selectedObject.itemID);
+          deleteSpecifiedMeshObjects('WarningBox' + selectedObject.itemID);
+          deleteSpecifiedMeshObjects('backsplash' + selectedObject.itemID);
           actions.sceneActions.updateMovingState(false);
         }
         if (bMoveUP) {
@@ -1805,7 +1800,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               sPoint.set(Point.x, Point.y);
             } else {
               var _holeID = _this2.props.state.draggingSupport.get('currentID');
-              (0, _sceneCreator.deleteSpecifiedMeshObjects)('WarningBox' + _holeID);
+              deleteSpecifiedMeshObjects('WarningBox' + _holeID);
               var _nx2 = Point.x;
               var _ny2 = Point.y;
               actions.holesActions.updateDraggingHole(_nx2, _ny2);
@@ -1820,8 +1815,8 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             var _sRot2 = _item5.rotation;
             var _mX = Point.x - sPoint.x;
             var _mY = Point.y - sPoint.y;
-            (0, _sceneCreator.deleteSpecifiedMeshObjects)('WarningBox' + selectedObject.itemID);
-            (0, _sceneCreator.deleteSpecifiedMeshObjects)('backsplash' + selectedObject.itemID);
+            deleteSpecifiedMeshObjects('WarningBox' + selectedObject.itemID);
+            deleteSpecifiedMeshObjects('backsplash' + selectedObject.itemID);
             prepareSnap(_layer3);
             getPoint(event, altitude);
             var _originPos = _item3D2.position.clone();
@@ -1830,7 +1825,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             var _swidth = _sBounding2.max.x - _sBounding2.min.x;
             var _sdepth = _sBounding2.max.z - _sBounding2.min.z;
             var _sVertices = _this2.getRectPoints(_swidth, _sdepth, _tPos4.clone(), _sRot2 % 360 / 180 * Math.PI);
-            var _GeometryUtils$calcSn2 = _export.GeometryUtils.calcSnap(allItemRect, allItemSnap, allLineRects, allLineSnap, allRect, Point.x, Point.y, allArea),
+            var _GeometryUtils$calcSn2 = GeometryUtils.calcSnap(allItemRect, allItemSnap, allLineRects, allLineSnap, allRect, Point.x, Point.y, allArea),
               _nx3 = _GeometryUtils$calcSn2.nx,
               _ny3 = _GeometryUtils$calcSn2.ny,
               _rot = _GeometryUtils$calcSn2.rot;
@@ -1845,9 +1840,9 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             }
             var polygonPoint = lineRect(_layer3);
             if (polygonPoint.length > 0) {
-              var _PolygonSect = _export.GeometryUtils.ContainsPoint(polygonPoint, _nx3, _ny3);
+              var _PolygonSect = GeometryUtils.ContainsPoint(polygonPoint, _nx3, _ny3);
               if (!_PolygonSect) {
-                var _GeometryUtils$calcCr2 = _export.GeometryUtils.calcCreateSnap(allItemRect, allItemSnap, allLineRects, allLineSnap, allRect, Point.x, Point.y, polygonPoint),
+                var _GeometryUtils$calcCr2 = GeometryUtils.calcCreateSnap(allItemRect, allItemSnap, allLineRects, allLineSnap, allRect, Point.x, Point.y, polygonPoint),
                   _cx3 = _GeometryUtils$calcCr2.cx,
                   _cy = _GeometryUtils$calcCr2.cy,
                   _crot = _GeometryUtils$calcCr2.crot;
@@ -1858,19 +1853,19 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             }
             var _polygon = lineRect(_layer3);
             if (_polygon.length > 0) {
-              var Sect = _export.GeometryUtils.ContainsPoint(_polygon, _nx3, _ny3);
+              var Sect = GeometryUtils.ContainsPoint(_polygon, _nx3, _ny3);
               if (!Sect) return;
             }
             actions.itemsActions.updateDraggingItemChanged(_nx3, _ny3, selectedObject.layerID, selectedObject.itemID);
             actions.itemsActions.updateRotatingItemChanged(_rot, selectedObject.layerID, selectedObject.itemID);
             sPoint.set(_nx3, _ny3);
-            (0, _sceneCreator.getDistances)(_layer3);
+            getDistances(_layer3);
             var _pointArray = [],
               _cnt = 0;
-            _pointArray.push([_sceneCreator.fVLine[0].userData.distance, 90]);
-            _pointArray.push([_sceneCreator.fVLine[1].userData.distance, -90]);
-            _pointArray.push([_sceneCreator.fVLine[2].userData.distance, 180]);
-            _pointArray.push([_sceneCreator.fVLine[3].userData.distance, 0]);
+            _pointArray.push([fVLine[0].userData.distance, 90]);
+            _pointArray.push([fVLine[1].userData.distance, -90]);
+            _pointArray.push([fVLine[2].userData.distance, 180]);
+            _pointArray.push([fVLine[3].userData.distance, 0]);
             _pointArray.forEach(function (pointElement, index) {
               if (pointElement[0] == undefined) _pointArray[index][0] = 0;
             });
@@ -1882,8 +1877,8 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               _pointArray[1][0] = 100;
             }
             actions.itemsActions.storeDistArray(_layer3.id, _item5.id, _pointArray);
-            var _minDis = _sceneCreator.fVLine[0].userData.distance;
-            var _snapObj = _sceneCreator.fVLine[0];
+            var _minDis = fVLine[0].userData.distance;
+            var _snapObj = fVLine[0];
             var _iPos = _item3D2.position.clone();
             var _snapDis = Math.sqrt((_iPos.x - targetPoint.x) * (_iPos.x - targetPoint.x) + (_iPos.z - targetPoint.z) * (_iPos.z - targetPoint.z));
             if (_snapDis >= 100 && _snapObj != null) {
@@ -1891,10 +1886,10 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               backsplashVisible = false;
               //console.log('1 snap no');
             }
-            for (var _i13 = 1; _i13 < _sceneCreator.fVLine.length; _i13++) {
-              if (_minDis > _sceneCreator.fVLine[_i13].userData.distance) {
-                _minDis = _sceneCreator.fVLine[_i13].userData.distance;
-                _snapObj = _sceneCreator.fVLine[_i13];
+            for (var _i13 = 1; _i13 < fVLine.length; _i13++) {
+              if (_minDis > fVLine[_i13].userData.distance) {
+                _minDis = fVLine[_i13].userData.distance;
+                _snapObj = fVLine[_i13];
               }
             }
             if (snapBox == null) {
@@ -1905,14 +1900,14 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               _this2.snap(_snapObj, _layer3);
               snapFlag = true;
               //console.log('1 snap Yes')
-              (0, _sceneCreator.getDistances)(_layer3, true);
+              getDistances(_layer3, true);
               var _i14 = 0;
-              for (_i14 = 0; _i14 < _sceneCreator.fVLine.length; _i14++) {
-                if (_sceneCreator.fVLine[_i14].userData.distance < snapDelta) {
+              for (_i14 = 0; _i14 < fVLine.length; _i14++) {
+                if (fVLine[_i14].userData.distance < snapDelta) {
                   break;
                 }
               }
-              if (_i14 === _sceneCreator.fVLine.length) backsplashVisible = false;else backsplashVisible = true;
+              if (_i14 === fVLine.length) backsplashVisible = false;else backsplashVisible = true;
             }
             actions.itemsActions.setBacksplashVisible(selectedObject.itemID, backsplashVisible);
           }
@@ -1925,7 +1920,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           raycaster.setFromCamera(curPos, camera);
           rayDirection = raycaster.ray.direction;
           rayDirection = rayDirection.normalize();
-          var meshes = (0, _objectsUtils.getAllMeshes)(toIntersect);
+          var meshes = getAllMeshes(toIntersect);
           var intersects = raycaster.intersectObjects(meshes, true);
           var _i15;
           if (intersects.length > 0 && !isNaN(intersects[0].distance)) {
@@ -1960,7 +1955,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
         document.getElementById('warning_box_2d').style.display = 'none';
       };
       this.onkeydown = function (event) {
-        if (_this2.props.keyDownEnable && !(0, _helper.isElevationView)(state.mode)) {
+        if (_this2.props.keyDownEnable && !isElevationView(state.mode)) {
           switch (event.keyCode) {
             case 27:
               // escape key
@@ -2029,7 +2024,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
       }
 
       // Add the output of the renderer to the html element
-      var canvasWrapper = _reactDom["default"].findDOMNode(this.refs.canvasWrapper);
+      var canvasWrapper = ReactDOM.findDOMNode(this.refs.canvasWrapper);
       canvasWrapper && canvasWrapper.appendChild(this.renderer.domElement);
 
       //
@@ -2061,17 +2056,17 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
       function init() {
         clock = new Three.Clock();
         scene3D = new Three.Scene();
-        if ((0, _helper.isElevationView)(state.mode)) scene3D.background = new Three.Color(0xffffff);
+        if (isElevationView(state.mode)) scene3D.background = new Three.Color(0xffffff);
         // change color about v1: 0x8791AB, v2: 0xC2C2C2, v3: 0xC3CADC
         else scene3D.background = new Three.Color(0xc3cadc); // change color about v1: 0x8791AB, v2: 0xC2C2C2, v3: 0xC3CADC
         // scene3D.fog = new Three.Fog(0xC3CADC, 2000, 3500);
         window.scene3D = scene3D;
         // Camera
-        if ((0, _helper.isElevationView)(state.mode)) {
+        if (isElevationView(state.mode)) {
           // In elevation view, set Orthographic camera's position, angle and rotation about selected line
           var layers = scene.layers;
           var selectedLayer = layers.get(scene.selectedLayer);
-          var ceilHeight = (0, _convertUnitsLite.convert)(selectedLayer.ceilHeight).from(selectedLayer.unit).to(scene.unit);
+          var ceilHeight = convert(selectedLayer.ceilHeight).from(selectedLayer.unit).to(scene.unit);
           var lines = [];
           var selectedLine = selectedLayer.lines.get(selectedLayer.selected.lines.toJS()[0]);
           var vertex0 = selectedLayer.vertices.get(selectedLine.vertices.get(0));
@@ -2080,7 +2075,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             y1 = vertex0.y;
           var x2 = vertex1.x,
             y2 = vertex1.y;
-          if (_export.GeometryUtils.compareVertices(vertex0, vertex1) >= 0 && vertex0.x !== vertex1.x) {
+          if (GeometryUtils.compareVertices(vertex0, vertex1) >= 0 && vertex0.x !== vertex1.x) {
             x1 = vertex1.x;
             y1 = vertex1.y;
             x2 = vertex0.x;
@@ -2102,11 +2097,11 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               lines.push(data);
             }
           });
-          var lineLength = _export.GeometryUtils.pointsDistance(x1, y1, x2, y2);
+          var lineLength = GeometryUtils.pointsDistance(x1, y1, x2, y2);
           self.setState({
             lineLength: lineLength
           });
-          var cameraRect = (0, _helper.handleCamRect)(self.width, self.height, ceilHeight, lineLength);
+          var cameraRect = handleCamRect(self.width, self.height, ceilHeight, lineLength);
           camera = new Three.OrthographicCamera(-cameraRect.width / 2, cameraRect.width / 2, cameraRect.height / 2, -cameraRect.height / 2, 1, 1000);
           var angle = Math.atan((y1 - y2) / (x1 - x2));
           var r = 300;
@@ -2127,15 +2122,15 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
         }
         camera.layers.enable(1);
         function loadENV() {
-          new _RGBELoader.RGBELoader().load('/assets/brown_photostudio_02_1k.hdr', function (texture) {
+          new RGBELoader().load('/assets/brown_photostudio_02_1k.hdr', function (texture) {
             texture.mapping = Three.EquirectangularReflectionMapping;
             scene3D.environment = texture;
             texture.dispose();
           });
         }
         // Camera Controls
-        if (!(0, _helper.isElevationView)(state.mode)) {
-          cameraControls = new _cameraControls["default"](camera, self.renderer.domElement);
+        if (!isElevationView(state.mode)) {
+          cameraControls = new CameraControls(camera, self.renderer.domElement);
           cameraControls.dollyToCursor = true;
           cameraControls.infinityDolly = true;
           cameraControls.minDistance = 50;
@@ -2146,7 +2141,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
         scene3D.add(planData.plan);
         scene3D.add(planData.grid);
         scene3D.add(camera);
-        if ((0, _helper.isElevationView)(state.mode)) {
+        if (isElevationView(state.mode)) {
           planData.cam.add(camera);
           scene3D.add(planData.cam);
         } else {
@@ -2161,7 +2156,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
       }
       function render() {
         var delta = clock.getDelta(); // Get time delta for smooth updates
-        if (!(0, _helper.isElevationView)(state.mode)) cameraControls.update(delta);
+        if (!isElevationView(state.mode)) cameraControls.update(delta);
         for (var _i16 = 0; _i16 < lights.length; _i16++) {
           lights[_i16].light.position.set(planData.plan.position.x + lights[_i16].x, planData.plan.position.y + lights[_i16].height - 10, planData.plan.position.z - lights[_i16].y);
           lights[_i16].target.position.set(planData.plan.position.x + lights[_i16].x, planData.plan.position.y, planData.plan.position.z - lights[_i16].y);
@@ -2208,7 +2203,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
             var indexAttribute = line.geometry.getIndex();
             var firstFaceIndices = undefined;
             if (indexAttribute && indexAttribute.length > 0) {
-              [indexAttribute.getX(0), indexAttribute.getX(1), indexAttribute.getX(2)], (0, _readOnlyError2["default"])("firstFaceIndices");
+              [indexAttribute.getX(0), indexAttribute.getX(1), indexAttribute.getX(2)], _readOnlyError("firstFaceIndices");
             }
             if (firstFaceIndices == undefined) return;
             // normal vector of the line
@@ -2257,7 +2252,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
                 isLoading: false,
                 waitForRender: 0
               });
-              if ((0, _helper.isElevationView)(self.props.state.mode)) {
+              if (isElevationView(self.props.state.mode)) {
                 setTimeout(function () {
                   self.props.setIsLoadingElevation('front', false);
                 }, 100);
@@ -2281,14 +2276,14 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
       cancelAnimationFrame(this.renderingID);
-      if (!(0, _helper.isElevationView)(this.props.state.mode)) {
+      if (!isElevationView(this.props.state.mode)) {
         if (this.cameraControls !== undefined) this.cameraControls.dispose();
       }
       if (!this.props.downloadFlag) {
         this.renderer.domElement.removeEventListener('mousedown', this.mouseDownEvent);
         this.renderer.domElement.removeEventListener('mouseup', this.mouseUpEvent);
       }
-      (0, _threeMemoryCleaner.disposeScene)(this.scene3D);
+      disposeScene(this.scene3D);
       this.scene3D.remove(this.planData.plan);
       this.scene3D.remove(this.planData.grid);
       this.scene3D = null;
@@ -2301,11 +2296,11 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
     key: "componentWillReceiveProps",
     value: function componentWillReceiveProps(nextProps) {
       var _this4 = this;
-      if (this.props.downloadFlag && (0, _immutablediff["default"])(this.props.state, nextProps.state).toJS().length == 0 || (0, _helper.isEmpty)(nextProps.state.scene)) return;
+      if (this.props.downloadFlag && diff(this.props.state, nextProps.state).toJS().length == 0 || isEmpty(nextProps.state.scene)) return;
       var width = nextProps.width,
         height = nextProps.height;
       var selectedLayer = nextProps.state.getIn(['scene', 'layers', nextProps.state.scene.selectedLayer]);
-      var ceilHeight = (0, _convertUnitsLite.convert)(selectedLayer.ceilHeight).from(selectedLayer.unit).to(nextProps.state.scene.unit);
+      var ceilHeight = convert(selectedLayer.ceilHeight).from(selectedLayer.unit).to(nextProps.state.scene.unit);
       var actions = {
         areaActions: this.context.areaActions,
         holesActions: this.context.holesActions,
@@ -2327,9 +2322,9 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
 
       // handle camera setting
       switch (this.props.state.mode) {
-        case _constants.MODE_ELEVATION_VIEW:
+        case MODE_ELEVATION_VIEW:
           // when Elevation mode (camera: Orthographic)
-          var cameraRect = (0, _helper.handleCamRect)(width, height, ceilHeight, this.state.lineLength);
+          var cameraRect = handleCamRect(width, height, ceilHeight, this.state.lineLength);
           // camera size
           this.camera.left = -cameraRect.width / 2;
           this.camera.right = cameraRect.width / 2;
@@ -2338,7 +2333,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           //camera position
           this.camera.position.y = ceilHeight / 2;
           break;
-        case _constants.MODE_3D_VIEW:
+        case MODE_3D_VIEW:
           // when 3D mode (camera: Perspective)
           this.camera.aspect = width / height;
           break;
@@ -2348,34 +2343,34 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
       var layer = data.getIn(['layers', data.selectedLayer]);
       var self = this;
       function implementBacksplash() {
-        if ((0, _helper.isElevationView)(self.props.state.mode)) return; // apply backsplash when just 3D_mode, not elevation_mode
-        var allItems = _export.GeometryUtils.getAllItemSpecified(nextProps.state.scene, actions.catalog, _constants.BASE_CABINET_LAYOUTPOS);
+        if (isElevationView(self.props.state.mode)) return; // apply backsplash when just 3D_mode, not elevation_mode
+        var allItems = GeometryUtils.getAllItemSpecified(nextProps.state.scene, actions.catalog, BASE_CABINET_LAYOUTPOS);
         var i,
           items = [];
         for (i = 0; i < allItems.others.length; i++) items.push(allItems.others[i]);
         if (allItems.cur) items.push(allItems.cur);
         for (i = 0; i < items.length; i++) {
-          var calcRect = _export.GeometryUtils.getCalcRectFromItem3D(items[i]);
-          var visible = _export.GeometryUtils.isSnappedLine(calcRect, allLineRects);
+          var calcRect = GeometryUtils.getCalcRectFromItem3D(items[i]);
+          var visible = GeometryUtils.isSnappedLine(calcRect, allLineRects);
           actions.itemsActions.setBacksplashVisible(items[i].itemInfo.id, visible);
-          (0, _sceneCreator.createBacksplash)(items[i], nextProps.state.scene.getIn(['layers', nextProps.state.scene.selectedLayer]), planData, nextProps.state.scene);
+          createBacksplash(items[i], nextProps.state.scene.getIn(['layers', nextProps.state.scene.selectedLayer]), planData, nextProps.state.scene);
         }
       }
       function implementWarningBox() {
-        var holeItems = _export.GeometryUtils.getHoleItems(layer);
+        var holeItems = GeometryUtils.getHoleItems(layer);
         var i,
           items = [];
         for (i = 0; i < allItemRect.others.length; i++) items.push(allItemRect.others[i]);
         if (allItemRect.cur) items.push(allItemRect.cur);
-        for (i = 0; i < items.length; i++) (0, _sceneCreator.checkCabinetOverlap)({
+        for (i = 0; i < items.length; i++) checkCabinetOverlap({
           x: items[i].pos.x,
           y: items[i].pos.y
         }, items[i], holeItems, planData);
       }
       var prepareSnapSpec = function prepareSnapSpec(layer) {
-        allLines = _export.GeometryUtils.getAllLines(layer);
-        allLineRects = _export.GeometryUtils.buildRectFromLines(layer, allLines);
-        allItemRect = _export.GeometryUtils.getAllItemSpecified(_this4.props.state.scene, actions.catalog, [_constants.WALL_CABINET_LAYOUTPOS, _constants.TALL_CABINET_LAYOUTPOS]);
+        allLines = GeometryUtils.getAllLines(layer);
+        allLineRects = GeometryUtils.buildRectFromLines(layer, allLines);
+        allItemRect = GeometryUtils.getAllItemSpecified(_this4.props.state.scene, actions.catalog, [WALL_CABINET_LAYOUTPOS, TALL_CABINET_LAYOUTPOS]);
       };
       var layer1 = this.props.state.scene.getIn(['layers', data.selectedLayer]);
       if (this.state.showflag) {
@@ -2387,7 +2382,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
         });
       }
       if (nextProps.state.scene !== this.props.state.scene || nextProps.state.doorStyle && nextProps.state.doorStyle.get('name') !== this.props.state.doorStyle.get('name')) {
-        var changedValues = (0, _immutablediff["default"])(this.props.state.scene, nextProps.state.scene);
+        var changedValues = diff(this.props.state.scene, nextProps.state.scene);
         prepareSnapSpec(layer);
         if (nextProps.state.doorStyle && nextProps.state.doorStyle.get('name') === this.props.state.doorStyle.get('name')) {
           self.setState({
@@ -2398,10 +2393,10 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               waitForRender: 0
             });
             switch (self.props.state.mode) {
-              case _constants.MODE_ELEVATION_VIEW:
+              case MODE_ELEVATION_VIEW:
                 self.props.setIsLoadingElevation('front', true);
                 break;
-              case _constants.MODE_3D_VIEW:
+              case MODE_3D_VIEW:
                 self.props.setIsLoading3D(true);
                 break;
             }
@@ -2412,12 +2407,12 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           implementBacksplash();
           implementWarningBox();
         } else {
-          (0, _sceneCreator.deleteSpecifiedMeshObjects)('TransformBox');
+          deleteSpecifiedMeshObjects('TransformBox');
         }
         var _this$state = this.state,
           toolObj = _this$state.toolObj,
           angleObj = _this$state.angleObj;
-        var _updateScene = (0, _sceneCreator.updateScene)(this.planData, nextProps.state.scene, this.props.state.scene, changedValues.toJS(), actions, this.context.catalog, nextProps.state.mode, toolObj, angleObj, nextProps.state.draggingSupport),
+        var _updateScene = updateScene(this.planData, nextProps.state.scene, this.props.state.scene, changedValues.toJS(), actions, this.context.catalog, nextProps.state.mode, toolObj, angleObj, nextProps.state.draggingSupport),
           promise = _updateScene.promise;
         self.setState();
         promise.then(function (p1Value) {
@@ -2444,7 +2439,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
       if (isLoading) {
         if (this.props.downloadFlag) {
           this.renderer.domElement.style.display = 'none';
-          return /*#__PURE__*/_react["default"].createElement("div", {
+          return /*#__PURE__*/React.createElement("div", {
             style: {
               alignItems: ' center',
               width: this.props.width,
@@ -2452,7 +2447,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
               display: 'inline-flex',
               justifyContent: 'center'
             }
-          }, /*#__PURE__*/_react["default"].createElement("img", {
+          }, /*#__PURE__*/React.createElement("img", {
             style: {
               width: '70px',
               height: '70px',
@@ -2465,12 +2460,12 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
           document.getElementById('front') && (document.getElementById('front').style.display = 'none');
           document.getElementById('error').style.display = 'none';
           this.renderer.domElement.style.display = 'none';
-          return /*#__PURE__*/_react["default"].createElement("div", {
+          return /*#__PURE__*/React.createElement("div", {
             style: {
               textAlign: 'center',
               width: '100%'
             }
-          }, /*#__PURE__*/_react["default"].createElement("img", {
+          }, /*#__PURE__*/React.createElement("img", {
             style: {
               animation: 'spin 2s linear infinite',
               marginTop: "22%"
@@ -2483,12 +2478,12 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
         this.renderer.domElement.style.pointerEvents = 'none';
         document.getElementById('front') && (document.getElementById('front').style.display = 'none');
         this.renderer.domElement.style.opacity = '0.4';
-        return /*#__PURE__*/_react["default"].createElement("div", {
+        return /*#__PURE__*/React.createElement("div", {
           style: {
             textAlign: 'center',
             width: '100%'
           }
-        }, /*#__PURE__*/_react["default"].createElement("img", {
+        }, /*#__PURE__*/React.createElement("img", {
           style: {
             animation: 'spin 2s linear infinite',
             position: "absolute",
@@ -2502,25 +2497,26 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
         this.renderer.domElement.style.pointerEvents = 'auto';
         this.renderer.domElement.style.opacity = '1';
         !this.props.downloadFlag && document.getElementById('front') && (document.getElementById('front').style.display = 'block');
-        return /*#__PURE__*/_react["default"].createElement('div', {
+        return /*#__PURE__*/React.createElement('div', {
           ref: 'canvasWrapper'
         });
       }
     }
   }]);
-}(_react["default"].Component);
+}(React.Component);
+export { Scene3DViewer as default };
 Scene3DViewer.propTypes = {
-  state: _propTypes["default"].object.isRequired,
-  width: _propTypes["default"].number.isRequired,
-  height: _propTypes["default"].number.isRequired,
-  replaceCabinet: _propTypes["default"].func.isRequired
+  state: PropTypes.object.isRequired,
+  width: PropTypes.number.isRequired,
+  height: PropTypes.number.isRequired,
+  replaceCabinet: PropTypes.func.isRequired
 };
 Scene3DViewer.contextTypes = {
-  areaActions: _propTypes["default"].object.isRequired,
-  holesActions: _propTypes["default"].object.isRequired,
-  itemsActions: _propTypes["default"].object.isRequired,
-  linesActions: _propTypes["default"].object.isRequired,
-  sceneActions: _propTypes["default"].object.isRequired,
-  projectActions: _propTypes["default"].object.isRequired,
-  catalog: _propTypes["default"].object
+  areaActions: PropTypes.object.isRequired,
+  holesActions: PropTypes.object.isRequired,
+  itemsActions: PropTypes.object.isRequired,
+  linesActions: PropTypes.object.isRequired,
+  sceneActions: PropTypes.object.isRequired,
+  projectActions: PropTypes.object.isRequired,
+  catalog: PropTypes.object
 };