kitchen-simulator 1.1.1-test.49 → 1.1.1-test.50

package/lib/class/hole.js

@@ -0,0 +1,934 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _immutable = require("immutable");
+var _export = require("./export");
+var _export2 = require("../utils/export");
+var _snap = require("../utils/snap");
+var _constants = require("../constants");
+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 _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 Hole = exports["default"] = /*#__PURE__*/function () {
+  function Hole() {
+    _classCallCheck(this, Hole);
+  }
+  return _createClass(Hole, null, [{
+    key: "create",
+    value: function create(state, layerID, type, lineID, offset, properties, holeX, holeY) {
+      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,
+        x: holeX,
+        y: holeY
+      }, properties);
+      state = state.setIn(['scene', 'layers', layerID, 'holes', holeID], hole);
+      state = state.updateIn(['scene', 'layers', layerID, 'lines', lineID, 'holes'], function (holes) {
+        return 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 = this.setJsProperties(state, layerID, holeID, properties).updatedState;
+      return {
+        updatedState: state,
+        hole: hole
+      };
+    }
+  }, {
+    key: "select",
+    value: function select(state, layerID, holeID) {
+      state = _export.Layer.select(state, layerID).updatedState;
+      state = _export.Layer.selectElement(state, layerID, 'holes', holeID).updatedState;
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "remove",
+    value: function remove(state, layerID, holeID) {
+      var hole = state.getIn(['scene', 'layers', layerID, 'holes', holeID]);
+      state = this.unselect(state, layerID, holeID).updatedState;
+      state = _export.Layer.removeElement(state, layerID, 'holes', holeID).updatedState;
+      state = state.updateIn(['scene', 'layers', layerID, 'lines', hole.line, 'holes'], function (holes) {
+        var index = holes.findIndex(function (ID) {
+          return holeID === ID;
+        });
+        return index !== -1 ? holes.remove(index) : holes;
+      });
+      state.getIn(['scene', 'groups']).forEach(function (group) {
+        return state = _export.Group.removeElement(state, group.id, layerID, 'holes', holeID).updatedState;
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "unselect",
+    value: function unselect(state, layerID, holeID) {
+      state = _export.Layer.unselect(state, layerID, 'holes', holeID).updatedState;
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "selectToolDrawingHole",
+    value: function selectToolDrawingHole(state, sceneComponentType) {
+      var snapElements = new _immutable.List().withMutations(function (snapElements) {
+        var _state$getIn = state.getIn(['scene', 'layers', state.scene.selectedLayer]),
+          lines = _state$getIn.lines,
+          vertices = _state$getIn.vertices;
+        lines.forEach(function (line) {
+          var _vertices$get = vertices.get(line.vertices.get(0)),
+            x1 = _vertices$get.x,
+            y1 = _vertices$get.y;
+          var _vertices$get2 = vertices.get(line.vertices.get(1)),
+            x2 = _vertices$get2.x,
+            y2 = _vertices$get2.y;
+          (0, _snap.addLineSegmentSnap)(snapElements, x1, y1, x2, y2, 20, 1, line.id);
+        });
+      });
+      state = state.merge({
+        mode: _constants.MODE_DRAWING_HOLE,
+        snapElements: snapElements,
+        drawingSupport: (0, _immutable.Map)({
+          type: sceneComponentType
+        })
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "selectToolDrawingHole3D",
+    value: function selectToolDrawingHole3D(state, sceneComponentType) {
+      var snapElements = new _immutable.List().withMutations(function (snapElements) {
+        var _state$getIn2 = state.getIn(['scene', 'layers', state.scene.selectedLayer]),
+          lines = _state$getIn2.lines,
+          vertices = _state$getIn2.vertices;
+        lines.forEach(function (line) {
+          var _vertices$get3 = vertices.get(line.vertices.get(0)),
+            x1 = _vertices$get3.x,
+            y1 = _vertices$get3.y;
+          var _vertices$get4 = vertices.get(line.vertices.get(1)),
+            x2 = _vertices$get4.x,
+            y2 = _vertices$get4.y;
+          (0, _snap.addLineSegmentSnap)(snapElements, x1, y1, x2, y2, 20, 1, line.id);
+        });
+      });
+      state = state.merge({
+        mode: _constants.MODE_DRAWING_HOLE_3D,
+        snapElements: snapElements,
+        drawingSupport: (0, _immutable.Map)({
+          type: sceneComponentType
+        })
+      });
+      state = state.mergeIn(['scene', 'loadFlag'], false);
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "updateDrawingHole",
+    value: function updateDrawingHole(state, layerID, x, y) {
+      var catalog = state.catalog;
+      //calculate snap and overwrite coords if needed
+      //force snap to segment
+      var snap = (0, _snap.nearestSnap)(state.snapElements, x, y, state.snapMask.merge({
+        SNAP_SEGMENT: true
+      }));
+      if (snap) {
+        var _snap$point = snap.point;
+        x = _snap$point.x;
+        y = _snap$point.y;
+      }
+      var selectedHole = state.getIn(['scene', 'layers', layerID, 'selected', 'holes']).first();
+      if (snap) {
+        var lineID = snap.snap.related.get(0);
+        var vertices = state.getIn(['scene', 'layers', layerID, 'lines', lineID, 'vertices']);
+        var _state$getIn3 = state.getIn(['scene', 'layers', layerID, 'vertices', vertices.get(0)]),
+          x1 = _state$getIn3.x,
+          y1 = _state$getIn3.y;
+        var _state$getIn4 = state.getIn(['scene', 'layers', layerID, 'vertices', vertices.get(1)]),
+          x2 = _state$getIn4.x,
+          y2 = _state$getIn4.y;
+
+        // // I need min and max vertices on this line segment
+        var minVertex = _export2.GeometryUtils.minVertex({
+          x: x1,
+          y: y1
+        }, {
+          x: x2,
+          y: y2
+        });
+        var maxVertex = _export2.GeometryUtils.maxVertex({
+          x: x1,
+          y: y1
+        }, {
+          x: x2,
+          y: y2
+        });
+        var width = catalog.factoryElement(state.drawingSupport.get('type')).properties.getIn(['width', 'length']);
+
+        // // Now I need min and max possible coordinates for the hole on the line. They depend on the width of the hole
+        var lineLength = _export2.GeometryUtils.pointsDistance(x1, y1, x2, y2);
+        var alpha = _export2.GeometryUtils.absAngleBetweenTwoPoints(x1, y1, x2, y2);
+        var cosAlpha = _export2.GeometryUtils.cosWithThreshold(Math.abs(alpha), 0.0000001);
+        var sinAlpha = _export2.GeometryUtils.sinWithThreshold(Math.abs(alpha), 0.0000001);
+        var minLeftVertexHole = {
+          x: minVertex.x + (state.mode.includes('ING_HOLE') ? width + 1 : width) / 2 * cosAlpha,
+          y: minVertex.y + (state.mode.includes('ING_HOLE') ? width + 1 : width) / 2 * sinAlpha
+        };
+        var maxRightVertexHole = {
+          x: minVertex.x + lineLength * cosAlpha - (state.mode.includes('ING_HOLE') ? width + 1 : width) / 2 * cosAlpha,
+          y: minVertex.y + lineLength * sinAlpha - (state.mode.includes('ING_HOLE') ? width + 1 : width) / 2 * sinAlpha
+        };
+        var offset;
+        if (x < minLeftVertexHole.x) {
+          offset = _export2.GeometryUtils.pointPositionOnLineSegment(minVertex.x, minVertex.y, maxVertex.x, maxVertex.y, minLeftVertexHole.x, minLeftVertexHole.y);
+          offset = minVertex.x === x1 && minVertex.y === y1 ? offset : 1 - offset;
+        } else {
+          if (x > maxRightVertexHole.x) {
+            offset = _export2.GeometryUtils.pointPositionOnLineSegment(minVertex.x, minVertex.y, maxVertex.x, maxVertex.y, maxRightVertexHole.x, maxRightVertexHole.y);
+            offset = minVertex.x === x1 && minVertex.y === y1 ? offset : 1 - offset;
+          } else if (x === minLeftVertexHole.x && x === maxRightVertexHole.x) {
+            if (y < minLeftVertexHole.y) {
+              offset = _export2.GeometryUtils.pointPositionOnLineSegment(minVertex.x, minVertex.y, maxVertex.x, maxVertex.y, minLeftVertexHole.x, minLeftVertexHole.y);
+              offset = minVertex.x === x1 && minVertex.y === y1 ? offset : 1 - offset;
+            } else if (y > maxRightVertexHole.y) {
+              offset = _export2.GeometryUtils.pointPositionOnLineSegment(minVertex.x, minVertex.y, maxVertex.x, maxVertex.y, maxRightVertexHole.x, maxRightVertexHole.y);
+              offset = minVertex.x === x1 && minVertex.y === y1 ? offset : 1 - offset;
+            } else {
+              offset = _export2.GeometryUtils.pointPositionOnLineSegment(x1, y1, x2, y2, x, y);
+            }
+          } else {
+            offset = _export2.GeometryUtils.pointPositionOnLineSegment(x1, y1, x2, y2, x, y);
+            // offset =
+            //   minVertex.x === x1 && minVertex.y === y1 ? offset : 1 - offset;
+          }
+        }
+        if (this.checkHoleCollide(state.getIn(['scene', 'layers', layerID]), lineID, selectedHole, x, y, width)) {
+          return {
+            updatedState: state
+          };
+        }
+
+        //if hole does exist, update
+        if (state.getIn(['drawingSupport', 'currentID'])) {
+          var hole = state.getIn(['scene', 'layers', layerID, 'holes', state.getIn(['drawingSupport', 'currentID'])]);
+          hole = hole.merge({
+            offset: offset,
+            line: lineID,
+            x: x,
+            y: y,
+            rotation: alpha
+          });
+          state = state.mergeIn(['scene', 'layers', layerID, 'holes', state.getIn(['drawingSupport', 'currentID'])], hole);
+          //remove from old line ( if present )
+          var index = state.getIn(['scene', 'layers', layerID, 'lines']).findEntry(function (line) {
+            return line.id !== lineID && line.get('holes').contains(state.getIn(['drawingSupport', 'currentID']));
+          });
+          if (index) {
+            var removed = index[1].get('holes').filter(function (hl) {
+              return hl !== state.getIn(['drawingSupport', 'currentID']);
+            });
+            state = state.setIn(['scene', 'layers', layerID, 'lines', index[0], 'holes'], removed);
+          }
+
+          //   //add to line
+          var line_holes = state.getIn(['scene', 'layers', layerID, 'lines', lineID, 'holes']);
+          if (!line_holes.contains(state.getIn(['drawingSupport', 'currentID']))) {
+            state = state.setIn(['scene', 'layers', layerID, 'lines', lineID, 'holes'], line_holes.push(state.getIn(['drawingSupport', 'currentID'])));
+          }
+          // 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) {
+                if (hole != undefined) {
+                  var properties = hole.properties.toJS();
+                  if (properties.hasOwnProperty('flip_orizzontal')) {
+                    properties['flip_orizzontal'] = false;
+                  }
+                  if (properties.hasOwnProperty('flip_horizontal')) {
+                    properties['flip_horizontal'] = false;
+                  }
+                  state = this.setJsProperties(state, layerID, state.getIn(['drawingSupport', 'currentID']), properties).updatedState;
+                }
+                return {
+                  updatedState: state
+                };
+              }
+              if (index0 == 0 && index1 == _vertices.length - 1) {
+                if (hole != undefined) {
+                  var _properties = hole.properties.toJS();
+                  if (_properties.hasOwnProperty('flip_orizzontal')) {
+                    _properties['flip_orizzontal'] = false;
+                  }
+                  if (_properties.hasOwnProperty('flip_horizontal')) {
+                    _properties['flip_horizontal'] = false;
+                  }
+                  state = this.setJsProperties(state, layerID, state.getIn(['drawingSupport', 'currentID']), _properties).updatedState;
+                }
+                return {
+                  updatedState: state
+                };
+              }
+              // ////////////////////////
+            }
+          }
+          // ///////////////////////////
+          if (hole != undefined) {
+            var _properties2 = hole.properties.toJS();
+            if (_properties2.hasOwnProperty('flip_orizzontal')) {
+              _properties2['flip_orizzontal'] = true;
+            }
+            if (_properties2.hasOwnProperty('flip_horizontal')) {
+              _properties2['flip_horizontal'] = true;
+            }
+            state = this.setJsProperties(state, layerID, state.getIn(['drawingSupport', 'currentID']), _properties2).updatedState;
+          }
+        } else {
+          //if hole does not exist, create
+          var _this$create = this.create(state, layerID, state.drawingSupport.get('type'), lineID, offset),
+            stateH = _this$create.updatedState,
+            _hole = _this$create.hole;
+          state = Hole.select(stateH, layerID, _hole.id).updatedState;
+          state = state.setIn(['drawingSupport', 'currentID'], _hole.id);
+        }
+      }
+      //i've lost the snap while trying to drop the hole
+      else if (false && selectedHole) {
+        //think if enable
+        state = Hole.remove(state, layerID, selectedHole).updatedState;
+      }
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "updateDrawingHole3D",
+    value: function updateDrawingHole3D(state, layerID, x, y) {
+      var catalog = state.catalog;
+      //calculate snap and overwrite coords if needed
+      //force snap to segment
+      var snap = (0, _snap.nearestSnap)(state.snapElements, x, y, state.snapMask.merge({
+        SNAP_SEGMENT: true
+      }));
+      if (snap) {
+        var _snap$point2 = snap.point;
+        x = _snap$point2.x;
+        y = _snap$point2.y;
+      }
+      var selectedHole = state.getIn(['scene', 'layers', layerID, 'selected', 'holes']).first();
+      if (snap) {
+        var lineID = snap.snap.related.get(0);
+        var vertices = state.getIn(['scene', 'layers', layerID, 'lines', lineID, 'vertices']);
+        var _state$getIn5 = state.getIn(['scene', 'layers', layerID, 'vertices', vertices.get(0)]),
+          x1 = _state$getIn5.x,
+          y1 = _state$getIn5.y;
+        var _state$getIn6 = state.getIn(['scene', 'layers', layerID, 'vertices', vertices.get(1)]),
+          x2 = _state$getIn6.x,
+          y2 = _state$getIn6.y;
+
+        // // I need min and max vertices on this line segment
+        var minVertex = _export2.GeometryUtils.minVertex({
+          x: x1,
+          y: y1
+        }, {
+          x: x2,
+          y: y2
+        });
+        var maxVertex = _export2.GeometryUtils.maxVertex({
+          x: x1,
+          y: y1
+        }, {
+          x: x2,
+          y: y2
+        });
+        var width = catalog.factoryElement(state.drawingSupport.get('type')).properties.getIn(['width', 'length']);
+
+        // // Now I need min and max possible coordinates for the hole on the line. They depend on the width of the hole
+        var lineLength = _export2.GeometryUtils.pointsDistance(x1, y1, x2, y2);
+        var alpha = _export2.GeometryUtils.absAngleBetweenTwoPoints(x1, y1, x2, y2);
+        var cosAlpha = _export2.GeometryUtils.cosWithThreshold(Math.abs(alpha), 0.0000001);
+        var sinAlpha = _export2.GeometryUtils.sinWithThreshold(Math.abs(alpha), 0.0000001);
+        var minLeftVertexHole = {
+          x: minVertex.x + (state.mode.includes('ING_HOLE_3D') ? width + 1 : width) / 2 * cosAlpha,
+          y: minVertex.y + (state.mode.includes('ING_HOLE_3D') ? width + 1 : width) / 2 * sinAlpha
+        };
+        var maxRightVertexHole = {
+          x: minVertex.x + lineLength * cosAlpha - (state.mode.includes('ING_HOLE_3D') ? width + 1 : width) / 2 * cosAlpha,
+          y: minVertex.y + lineLength * sinAlpha - (state.mode.includes('ING_HOLE_3D') ? width + 1 : width) / 2 * sinAlpha
+        };
+        var offset;
+        if (x < minLeftVertexHole.x) {
+          offset = _export2.GeometryUtils.pointPositionOnLineSegment(minVertex.x, minVertex.y, maxVertex.x, maxVertex.y, minLeftVertexHole.x, minLeftVertexHole.y);
+        } else if (x > maxRightVertexHole.x) {
+          offset = _export2.GeometryUtils.pointPositionOnLineSegment(minVertex.x, minVertex.y, maxVertex.x, maxVertex.y, maxRightVertexHole.x, maxRightVertexHole.y);
+        } else {
+          if (x === minLeftVertexHole.x && x === maxRightVertexHole.x) {
+            if (y < minLeftVertexHole.y) {
+              offset = _export2.GeometryUtils.pointPositionOnLineSegment(minVertex.x, minVertex.y, maxVertex.x, maxVertex.y, minLeftVertexHole.x, minLeftVertexHole.y);
+              /*
+              offset =
+                minVertex.x === x1 && minVertex.y === y1 ? offset : 1 - offset;
+              */
+            } else if (y > maxRightVertexHole.y) {
+              offset = _export2.GeometryUtils.pointPositionOnLineSegment(minVertex.x, minVertex.y, maxVertex.x, maxVertex.y, maxRightVertexHole.x, maxRightVertexHole.y);
+              /*
+              offset =
+                minVertex.x === x1 && minVertex.y === y1 ? offset : 1 - offset;
+              */
+            } else {
+              offset = _export2.GeometryUtils.pointPositionOnLineSegment(x1, y1, x2, y2, x, y);
+            }
+          } else {
+            offset = _export2.GeometryUtils.pointPositionOnLineSegment(x1, y1, x2, y2, x, y);
+          }
+        }
+        if (this.checkHoleCollide(state.getIn(['scene', 'layers', layerID]), lineID, selectedHole, x, y, width)) {
+          return {
+            updatedState: state
+          };
+        }
+
+        //if hole does exist, update
+        if (state.getIn(['drawingSupport', 'currentID'])) {
+          var hole = state.getIn(['scene', 'layers', layerID, 'holes', state.getIn(['drawingSupport', 'currentID'])]);
+          hole = hole.merge({
+            offset: offset,
+            line: lineID,
+            x: x,
+            y: y,
+            rotation: alpha
+          });
+          state = state.mergeIn(['scene', 'layers', layerID, 'holes', state.getIn(['drawingSupport', 'currentID'])], hole);
+
+          //remove from old line ( if present )
+          var index = state.getIn(['scene', 'layers', layerID, 'lines']).findEntry(function (line) {
+            return line.id !== lineID && line.get('holes').contains(state.getIn(['drawingSupport', 'currentID']));
+          });
+          if (index && state.mode !== 'MODE_DRAWING_HOLE_3D') {
+            var removed = index[1].get('holes').filter(function (hl) {
+              return hl !== state.getIn(['drawingSupport', 'currentID']);
+            });
+            state = state.setIn(['scene', 'layers', layerID, 'lines', index[0], 'holes'], removed);
+          }
+
+          //add to line
+          var line_holes = state.getIn(['scene', 'layers', layerID, 'lines', lineID, 'holes']);
+          if (!line_holes.contains(state.getIn(['drawingSupport', 'currentID'])) && state.mode !== 'MODE_DRAWING_HOLE_3D') {
+            state = state.setIn(['scene', 'layers', layerID, 'lines', lineID, 'holes'], line_holes.push(state.getIn(['drawingSupport', 'currentID'])));
+          }
+
+          // 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 _vertices2 = verticesArray[i];
+            if (_vertices2.includes(vetName0) && _vertices2.includes(vetName1)) {
+              var index0 = _vertices2.indexOf(vetName0);
+              var index1 = _vertices2.indexOf(vetName1);
+              // if vertex order chanege//
+              if (index1 + 1 == index0) {
+                if (hole != undefined) {
+                  var properties = hole.properties.toJS();
+                  if (properties.hasOwnProperty('flip_orizzontal')) {
+                    properties['flip_orizzontal'] = false;
+                  }
+                  if (properties.hasOwnProperty('flip_horizontal')) {
+                    properties['flip_horizontal'] = false;
+                  }
+                  state = this.setJsProperties(state, layerID, state.getIn(['drawingSupport', 'currentID']), properties).updatedState;
+                  if (state.mode === 'MODE_DRAWING_HOLE_3D') {
+                    state = state.setIn(['scene', 'layers', layerID, 'holes', state.getIn(['drawingSupport', 'currentID']), 'visible'], false);
+                  } else {
+                    state = state.setIn(['scene', 'layers', layerID, 'holes', state.getIn(['drawingSupport', 'currentID']), 'visible'], true);
+                  }
+                }
+                return {
+                  updatedState: state
+                };
+              }
+              if (index0 == 0 && index1 == _vertices2.length - 1) {
+                if (hole != undefined) {
+                  var _properties3 = hole.properties.toJS();
+                  if (_properties3.hasOwnProperty('flip_orizzontal')) {
+                    _properties3['flip_orizzontal'] = false;
+                  }
+                  if (_properties3.hasOwnProperty('flip_horizontal')) {
+                    _properties3['flip_horizontal'] = false;
+                  }
+                  state = this.setJsProperties(state, layerID, state.getIn(['drawingSupport', 'currentID']), _properties3).updatedState;
+                  if (state.mode === 'MODE_DRAWING_HOLE_3D') {
+                    state = state.setIn(['scene', 'layers', layerID, 'holes', state.getIn(['drawingSupport', 'currentID']), 'visible'], false);
+                  } else {
+                    state = state.setIn(['scene', 'layers', layerID, 'holes', state.getIn(['drawingSupport', 'currentID']), 'visible'], true);
+                  }
+                }
+                return {
+                  updatedState: state
+                };
+              }
+              // ////////////////////////
+            }
+          }
+          // ///////////////////////////
+          if (hole != undefined) {
+            var _properties4 = hole.properties.toJS();
+            if (_properties4.hasOwnProperty('flip_orizzontal')) {
+              _properties4['flip_orizzontal'] = true;
+            }
+            if (_properties4.hasOwnProperty('flip_horizontal')) {
+              _properties4['flip_horizontal'] = true;
+            }
+            state = this.setJsProperties(state, layerID, state.getIn(['drawingSupport', 'currentID']), _properties4).updatedState;
+            if (state.mode === 'MODE_DRAWING_HOLE_3D') {
+              state = state.setIn(['scene', 'layers', layerID, 'holes', state.getIn(['drawingSupport', 'currentID']), 'visible'], false);
+            } else {
+              state = state.setIn(['scene', 'layers', layerID, 'holes', state.getIn(['drawingSupport', 'currentID']), 'visible'], true);
+            }
+          }
+        } else {
+          //if hole does not exist, create
+          var _this$create2 = this.create(state, layerID, state.drawingSupport.get('type'), lineID, offset),
+            stateH = _this$create2.updatedState,
+            _hole2 = _this$create2.hole;
+          state = Hole.select(stateH, layerID, _hole2.id).updatedState;
+          state = state.setIn(['drawingSupport', 'currentID'], _hole2.id);
+        }
+      }
+      if (state.mode !== 'MODE_DRAWING_HOLE_3D') {
+        state = state.getIn(['scene', 'layers', layerID, 'holes']).reduce(function (oldReduceState, element) {
+          oldReduceState = oldReduceState.setIn(['scene', 'layers', layerID, 'holes', element.id, 'visible'], true);
+          return oldReduceState;
+        }, state);
+      }
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "endCreatingHole",
+    value: function endCreatingHole(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: "endDrawingHole",
+    value: function endDrawingHole(state, layerID, x, y) {
+      state = this.updateDrawingHole(state, layerID, x, y).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,
+        mode: _constants.MODE_IDLE
+      });
+      state = _export.Layer.unselectAll(state, layerID).updatedState;
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "endDrawingHole3D",
+    value: function endDrawingHole3D(state, layerID, x, y) {
+      state = state.merge({
+        mode: _constants.MODE_IDLE_3D
+      });
+      state = this.updateDrawingHole3D(state, layerID, x, y).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,
+        mode: _constants.MODE_IDLE_3D
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "beginDraggingHole",
+    value: function beginDraggingHole(state, layerID, holeID, x, y) {
+      var layer = state.getIn(['scene', 'layers', layerID]);
+      var hole = layer.getIn(['holes', holeID]);
+      var line = layer.getIn(['lines', hole.line]);
+      var v0 = layer.getIn(['vertices', line.vertices.get(0)]);
+      var v1 = layer.getIn(['vertices', line.vertices.get(1)]);
+      var snapElements = (0, _snap.addLineSegmentSnap)((0, _immutable.List)(), v0.x, v0.y, v1.x, v1.y, 9999999, 1, null);
+      state = state.merge({
+        mode: _constants.MODE_DRAGGING_HOLE,
+        snapElements: snapElements,
+        draggingSupport: (0, _immutable.Map)({
+          layerID: layerID,
+          holeID: holeID,
+          startPointX: x,
+          startPointY: y
+        })
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "beginDraggingHole3D",
+    value: function beginDraggingHole3D(state, layerID, holeID, x, y) {
+      var layer = state.getIn(['scene', 'layers', layerID]);
+      var hole = layer.getIn(['holes', holeID]);
+      var line = layer.getIn(['lines', hole.line]);
+      var v0 = layer.getIn(['vertices', line.vertices.get(0)]);
+      var v1 = layer.getIn(['vertices', line.vertices.get(1)]);
+      var snapElements = (0, _snap.addLineSegmentSnap)((0, _immutable.List)(), v0.x, v0.y, v1.x, v1.y, 9999999, 1, null);
+      state = state.updateIn(['scene', 'layers', layerID, 'lines', hole.line, 'holes'], function (holes) {
+        var index = holes.findIndex(function (ID) {
+          return holeID === ID;
+        });
+        return index !== -1 ? holes.remove(index) : holes;
+      });
+      state = state.merge({
+        mode: _constants.MODE_DRAGGING_HOLE_3D,
+        snapElements: snapElements,
+        draggingSupport: (0, _immutable.Map)({
+          layerID: layerID,
+          holeID: holeID,
+          startPointX: x,
+          startPointY: y
+        })
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "updateDraggingHole",
+    value: function updateDraggingHole(state, x, y) {
+      //calculate snap and overwrite coords if needed
+      //force snap to segment
+      var snap = (0, _snap.nearestSnap)(state.snapElements, x, y, state.snapMask.merge({
+        SNAP_SEGMENT: true
+      }));
+      if (!snap) return state;
+      var _state = state,
+        draggingSupport = _state.draggingSupport,
+        scene = _state.scene;
+      var layerID = draggingSupport.get('layerID');
+      var holeID = draggingSupport.get('holeID');
+      var startPointX = draggingSupport.get('startPointX');
+      var startPointY = draggingSupport.get('startPointY');
+      var layer = state.getIn(['scene', 'layers', layerID]);
+      var hole = layer.getIn(['holes', holeID]);
+      var line = layer.getIn(['lines', hole.line]);
+      var v0 = layer.getIn(['vertices', line.vertices.get(0)]);
+      var v1 = layer.getIn(['vertices', line.vertices.get(1)]);
+      // I need min and max vertices on this line segment
+      var _snap$point3 = snap.point;
+      x = _snap$point3.x;
+      y = _snap$point3.y;
+      var minVertex = _export2.GeometryUtils.minVertex(v0, v1);
+      var maxVertex = _export2.GeometryUtils.maxVertex(v0, v1);
+
+      // Now I need min and max possible coordinates for the hole on the line. They depend on the width of the hole
+
+      var width = hole.properties.get('width').get('length');
+      var lineLength = _export2.GeometryUtils.pointsDistance(v0.x, v0.y, v1.x, v1.y);
+      var alpha = Math.atan2(v1.y - v0.y, Math.abs(v1.x - v0.x));
+      var alpha1 = Math.atan2(v1.y - v0.y, v1.x - v0.x);
+      var angle_temp;
+      if (180 * alpha1 / Math.PI < 0) {
+        angle_temp = 180 * alpha1 / Math.PI + 360;
+      } else {
+        angle_temp = 180 * alpha1 / Math.PI;
+      }
+      var cosWithThreshold = function cosWithThreshold(alpha) {
+        var cos = Math.cos(Math.abs(alpha));
+        return cos < 0.0000001 ? 0 : cos;
+      };
+      var sinWithThreshold = function sinWithThreshold(alpha) {
+        var sin = Math.sin(Math.abs(alpha));
+        return sin < 0.0000001 ? 0 : sin;
+      };
+      var cosAlpha = cosWithThreshold(Math.abs(alpha));
+      var sinAlpha = sinWithThreshold(Math.abs(alpha));
+      var minLeftVertexHole = {
+        x: minVertex.x + (state.mode.includes('ING_HOLE') ? width + 1 : width) / 2 * cosAlpha,
+        y: minVertex.y + (state.mode.includes('ING_HOLE') ? width + 1 : width) / 2 * sinAlpha
+      };
+      var maxRightVertexHole = {
+        x: minVertex.x + lineLength * cosAlpha - (state.mode.includes('ING_HOLE') ? width + 1 : width) / 2 * cosAlpha,
+        y: minVertex.y + lineLength * sinAlpha - (state.mode.includes('ING_HOLE') ? width + 1 : width) / 2 * sinAlpha
+      };
+      // Now I need to verify if the snap vertex (with coordinates x and y) is on the line segment
+
+      var offset;
+      if (x < minLeftVertexHole.x) {
+        // Snap point is previous the the line
+        offset = _export2.GeometryUtils.pointPositionOnLineSegment(minVertex.x, minVertex.y, maxVertex.x, maxVertex.y, minLeftVertexHole.x, minLeftVertexHole.y);
+        offset = minVertex === v0 ? offset : 1 - offset;
+      } else {
+        // Snap point is after the line or on the line
+        if (x > maxRightVertexHole.x) {
+          offset = _export2.GeometryUtils.pointPositionOnLineSegment(minVertex.x, minVertex.y, maxVertex.x, maxVertex.y, maxRightVertexHole.x, maxRightVertexHole.y);
+          offset = minVertex === v0 ? offset : 1 - offset;
+        } else if (x === minLeftVertexHole.x && x === maxRightVertexHole.x) {
+          // I am on a vertical line, I need to check y coordinates
+          if (y < minLeftVertexHole.y) {
+            offset = _export2.GeometryUtils.pointPositionOnLineSegment(minVertex.x, minVertex.y, maxVertex.x, maxVertex.y, minLeftVertexHole.x, minLeftVertexHole.y);
+            offset = minVertex === v0 ? offset : 1 - offset;
+          } else if (y > maxRightVertexHole.y) {
+            offset = _export2.GeometryUtils.pointPositionOnLineSegment(minVertex.x, minVertex.y, maxVertex.x, maxVertex.y, maxRightVertexHole.x, maxRightVertexHole.y);
+            offset = minVertex === v0 ? offset : 1 - offset;
+          } else {
+            offset = _export2.GeometryUtils.pointPositionOnLineSegment(minVertex.x, minVertex.y, maxVertex.x, maxVertex.y, x, y);
+            offset = minVertex === v0 ? offset : 1 - offset;
+          }
+        } else {
+          offset = _export2.GeometryUtils.pointPositionOnLineSegment(minVertex.x, minVertex.y, maxVertex.x, maxVertex.y, x, y);
+          if (angle_temp > 90 && angle_temp < 270) {
+            offset = 1 - offset;
+          }
+        }
+      }
+      if (this.checkHoleCollide(layer, hole.line, holeID, x, y, width)) {
+        return {
+          updatedState: state
+        };
+      }
+      hole = hole.set('offset', offset);
+      hole = hole.merge({
+        x: x,
+        y: y,
+        rotation: alpha
+      });
+      state = state.merge({
+        scene: scene.mergeIn(['layers', layerID, 'holes', holeID], hole)
+      });
+      state = state.updateIn(['scene', 'layers', layerID, 'lines', hole.line, 'holes'], function (holes) {
+        console.log(holes, 'holes');
+        var index = holes.findIndex(function (ID) {
+          return holeID === ID;
+        });
+        console.log(index, 'index');
+        return index === -1 ? holes.push(holeID) : holes;
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "updateDraggingHoleChanged",
+    value: function updateDraggingHoleChanged(state, x, y, layerID, holeID) {
+      var _state2 = state,
+        scene = _state2.scene;
+      var hole = scene.getIn(['layers', layerID, 'holes', holeID]);
+      hole = hole.merge({
+        x: x,
+        y: y
+      });
+      state = state.merge({
+        scene: scene.mergeIn(['layers', layerID, 'holes', holeID], hole)
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "updateDraggingHoleRulerChanged",
+    value: function updateDraggingHoleRulerChanged(state, width, layerID, holeID) {
+      var _state3 = state,
+        scene = _state3.scene;
+      state = state.mergeIn(['scene', 'layers', layerID, 'holes', holeID, 'properties', 'width', 'length'], width);
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "endDraggingHole3D",
+    value: function endDraggingHole3D(state, x, y) {
+      if (state === undefined) return;
+      state = this.updateDraggingHole(state, x, y).updatedState;
+      var _ref = state.draggingSupport !== undefined ? state : null,
+        draggingSupport = _ref.draggingSupport;
+      if (draggingSupport && draggingSupport.size === 0 && draggingSupport === null) return {
+        updatedState: state
+      };
+      var layerID = draggingSupport.get('layerID');
+      var holeID = draggingSupport.get('holeID');
+      var layer = state.getIn(['scene', 'layers', layerID]);
+      var hole = layer.getIn(['holes', holeID]);
+      state = state.updateIn(['scene', 'layers', layerID, 'lines', hole.line, 'holes'], function (holes) {
+        var index = holes.findIndex(function (ID) {
+          return holeID === ID;
+        });
+        return index === -1 ? holes.push(holeID) : holes;
+      });
+      state = state.merge({
+        mode: _constants.MODE_IDLE_3D,
+        draggingSupport: (0, _immutable.Map)({})
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "checkHoleCollide",
+    value: function checkHoleCollide(layer, lineID, selectedHoleID, hx, hy, hw) {
+      var line = layer.getIn(['lines', lineID]);
+      var holes = line.getIn(['holes']);
+      var bCollide = holes.some(function (holeID) {
+        if (holeID == selectedHoleID) return false;
+        var hole = layer.getIn(['holes', holeID]);
+        var dx = hole.get('x') - hx;
+        var dy = hole.get('y') - hy;
+        var dw = (hole.properties.get('width').get('length') + hw) / 2;
+        if (dx * dx + dy * dy < dw * dw) {
+          return true;
+        }
+      });
+      return bCollide;
+    }
+  }, {
+    key: "endDraggingHole",
+    value: function endDraggingHole(state, x, y) {
+      state = this.updateDraggingHole(state, x, y).updatedState;
+      state = state.merge({
+        mode: _constants.MODE_IDLE
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "setProperties",
+    value: function setProperties(state, layerID, holeID, properties) {
+      state = state.setIn(['scene', 'layers', layerID, 'holes', holeID, 'properties'], properties);
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "setJsProperties",
+    value: function setJsProperties(state, layerID, holeID, properties) {
+      return this.setProperties(state, layerID, holeID, (0, _immutable.fromJS)(properties));
+    }
+  }, {
+    key: "updateProperties",
+    value: function updateProperties(state, layerID, holeID, properties) {
+      properties.forEach(function (v, k) {
+        if (state.hasIn(['scene', 'layers', layerID, 'holes', holeID, 'properties', k])) state = state.mergeIn(['scene', 'layers', layerID, 'holes', holeID, 'properties', k], v);
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "updateJsProperties",
+    value: function updateJsProperties(state, layerID, holeID, properties) {
+      return this.updateProperties(state, layerID, holeID, (0, _immutable.fromJS)(properties));
+    }
+  }, {
+    key: "setAttributes",
+    value: function setAttributes(state, layerID, holeID, holesAttributes) {
+      var hAttr = holesAttributes.toJS();
+      var offsetA = hAttr.offsetA,
+        offsetB = hAttr.offsetB,
+        offset = hAttr.offset;
+      delete hAttr['offsetA'];
+      delete hAttr['offsetB'];
+      delete hAttr['offset'];
+      var misc = new _immutable.Map({
+        _unitA: offsetA._unit,
+        _unitB: offsetB._unit
+      });
+      state = state.mergeIn(['scene', 'layers', layerID, 'holes', holeID], (0, _immutable.fromJS)(hAttr)).mergeDeepIn(['scene', 'layers', layerID, 'holes', holeID], new _immutable.Map({
+        offset: offset,
+        misc: misc
+      }));
+      return {
+        updatedState: state
+      };
+    }
+  }]);
+}();