kitchen-simulator 2.0.0 → 2.0.1-test.1

package/es/class/line.js

@@ -0,0 +1,1221 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import { fromJS, List, Map } from 'immutable';
+import { Group, Hole, Layer, Vertex } from "./export";
+import { GeometryUtils, history, IDBroker, NameGenerator, SnapSceneUtils, SnapUtils } from "../utils/export";
+import * as Three from 'three';
+import { END_DRAGGING_LINE, END_DRAGGING_VERTEX, END_DRAWING_LINE, EPSILON, MIN_ANGLE_DISALLOW_DRAW_WALL, MODE_DRAGGING_LINE, MODE_DRAWING_LINE, MODE_IDLE, MODE_WAITING_DRAWING_LINE, UNIT_ANGLE } from "../constants";
+import { isEmpty } from "../utils/helper";
+var timeGlobal = 0;
+var TimeRecorder = /*#__PURE__*/function () {
+  function TimeRecorder(name) {
+    _classCallCheck(this, TimeRecorder);
+    this.name = name;
+    if (name === 'beginDrawingLine') {
+      console.log('time__  Start Drawing');
+    }
+  }
+  return _createClass(TimeRecorder, [{
+    key: "start",
+    value: function start() {
+      this.first = Date.now();
+    }
+  }, {
+    key: "end",
+    value: function end() {
+      this.second = Date.now();
+      var elapsed = this.second - this.first;
+      console.log('time__      ', this.name, ' : ', elapsed, 'ms');
+      if (['beginDrawingLine', 'updateDrawingLine', 'endDrawingLine'].includes(this.name)) timeGlobal += elapsed;
+      if (this.name === 'endDrawingLine') {
+        console.log('time__  Drawing Ended. Passed Time : ', timeGlobal, 'ms');
+        timeGlobal = 0;
+      }
+    }
+  }]);
+}();
+var Line = /*#__PURE__*/function () {
+  function Line() {
+    _classCallCheck(this, Line);
+  }
+  return _createClass(Line, null, [{
+    key: "create",
+    value: function create(state, layerID, type, x0, y0, x1, y1, properties) {
+      var lineCreatedDateTime = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : new Date().getTime();
+      // if end drawing by created area
+      // if (state.mode == MODE_IDLE) {
+      //   return { updatedState: state };
+      // }
+      // ///////////////
+      var lineID = IDBroker.acquireID();
+      var _Vertex$add = Vertex.add(state, layerID, x0, y0, 'lines', lineID),
+        stateV0 = _Vertex$add.updatedState,
+        v0 = _Vertex$add.vertex;
+      var _Vertex$add2 = Vertex.add(stateV0, layerID, x1, y1, 'lines', lineID),
+        stateV1 = _Vertex$add2.updatedState,
+        v1 = _Vertex$add2.vertex;
+      state = stateV1;
+      var line = state.catalog.factoryElement(type, {
+        id: lineID,
+        name: NameGenerator.generateName('lines', state.catalog.getIn(['elements', type, 'info', 'title'])),
+        vertices: new List([v0.id, v1.id]),
+        type: type
+      }, properties);
+      line = line.set('createdDateTime', lineCreatedDateTime !== undefined ? lineCreatedDateTime : new Date().getTime());
+      state = state.setIn(['scene', 'layers', layerID, 'lines', lineID], line);
+      // set default texture//
+      var defaultTexture = {
+        textureA: 'plaster',
+        textureB: 'plaster'
+      };
+      state = this.setJsProperties(state, layerID, lineID, defaultTexture).updatedState;
+      // /////////////////////
+      return {
+        updatedState: state,
+        line: line
+      };
+    }
+  }, {
+    key: "select",
+    value: function select(state, layerID, lineID) {
+      var _line$toJS, _line$vertices, _line$vertices$get, _line$vertices2, _line$vertices2$get;
+      // Try selecting the layer first
+      var layerResult = Layer.select(state, layerID);
+      if (!layerResult || !layerResult.updatedState) {
+        return {
+          updatedState: state
+        }; // no update if layer not found
+      }
+      state = layerResult.updatedState;
+
+      // Try getting the line
+      var line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
+      if (!line || isEmpty((_line$toJS = line.toJS) === null || _line$toJS === void 0 ? void 0 : _line$toJS.call(line))) {
+        return {
+          updatedState: state
+        }; // no update if line not found
+      }
+
+      // Select the line element
+      var lineSelectResult = Layer.selectElement(state, layerID, 'lines', lineID);
+      if (lineSelectResult !== null && lineSelectResult !== void 0 && lineSelectResult.updatedState) {
+        state = lineSelectResult.updatedState;
+      }
+
+      // Select the first vertex (if available)
+      var firstVertex = (_line$vertices = line.vertices) === null || _line$vertices === void 0 || (_line$vertices$get = _line$vertices.get) === null || _line$vertices$get === void 0 ? void 0 : _line$vertices$get.call(_line$vertices, 0);
+      if (firstVertex !== undefined) {
+        var v1Result = Layer.selectElement(state, layerID, 'vertices', firstVertex);
+        if (v1Result !== null && v1Result !== void 0 && v1Result.updatedState) {
+          state = v1Result.updatedState;
+        }
+      }
+
+      // Select the second vertex (if available)
+      var secondVertex = (_line$vertices2 = line.vertices) === null || _line$vertices2 === void 0 || (_line$vertices2$get = _line$vertices2.get) === null || _line$vertices2$get === void 0 ? void 0 : _line$vertices2$get.call(_line$vertices2, 1);
+      if (secondVertex !== undefined) {
+        var v2Result = Layer.selectElement(state, layerID, 'vertices', secondVertex);
+        if (v2Result !== null && v2Result !== void 0 && v2Result.updatedState) {
+          state = v2Result.updatedState;
+        }
+      }
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "remove",
+    value: function remove(state, layerID, lineID) {
+      var _line$toJS2;
+      var line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
+      if (line && !isEmpty((_line$toJS2 = line.toJS) === null || _line$toJS2 === void 0 ? void 0 : _line$toJS2.call(line))) {
+        state = this.unselect(state, layerID, lineID).updatedState;
+        line.holes.forEach(function (holeID) {
+          return state = Hole.remove(state, layerID, holeID).updatedState;
+        });
+        state = Layer.removeElement(state, layerID, 'lines', lineID).updatedState;
+        line.vertices.forEach(function (vertexID) {
+          return state = Vertex.remove(state, layerID, vertexID, 'lines', lineID).updatedState;
+        });
+        state.getIn(['scene', 'groups']).forEach(function (group) {
+          return state = Group.removeElement(state, group.id, layerID, 'lines', lineID).updatedState;
+        });
+      }
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "setRelatedLine",
+    value: function setRelatedLine(state, layerID, lineID, intersection) {
+      var curIntersection = state.getIn(['scene', 'layers', layerID, 'lines', lineID, 'relatedVertices']);
+      if (curIntersection == undefined) return {
+        updatedState: state
+      };
+      var isEqualIntersection = function isEqualIntersection(a, b) {
+        return a.index == b.index && a.point.x == b.point.x && a.point.y == b.point.y;
+      };
+      var equal = curIntersection.size == intersection.length && curIntersection.every(function (curint, index) {
+        return isEqualIntersection(curint, intersection[index]);
+      });
+      if (!equal) state = state.mergeIn(['scene', 'layers', layerID, 'lines', lineID, 'relatedVertices'], intersection);
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "unselect",
+    value: function unselect(state, layerID, lineID) {
+      var line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
+      if (line) {
+        state = Layer.unselect(state, layerID, 'vertices', line.vertices.get(0)).updatedState;
+        state = Layer.unselect(state, layerID, 'vertices', line.vertices.get(1)).updatedState;
+        state = Layer.unselect(state, layerID, 'lines', lineID).updatedState;
+      }
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "split",
+    value: function split(state, layerID, lineID, x, y) {
+      var line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
+      var v0 = state.getIn(['scene', 'layers', layerID, 'vertices', line.vertices.get(0)]);
+      var v1 = state.getIn(['scene', 'layers', layerID, 'vertices', line.vertices.get(1)]);
+      var x0 = v0.x,
+        y0 = v0.y;
+      var x1 = v1.x,
+        y1 = v1.y;
+      var _Line$create = Line.create(state, layerID, line.type, x0, y0, x, y, line.get('properties'), line.createdDateTime !== undefined ? line.createdDateTime - 2 : new Date().getTime()),
+        stateL1 = _Line$create.updatedState,
+        line0 = _Line$create.line;
+      var _Line$create2 = Line.create(stateL1, layerID, line.type, x1, y1, x, y, line.get('properties'), line.createdDateTime !== undefined ? line.createdDateTime - 1 : new Date().getTime()),
+        stateL2 = _Line$create2.updatedState,
+        line1 = _Line$create2.line;
+      state = stateL2;
+      var splitPointOffset = GeometryUtils.pointPositionOnLineSegment(x0, y0, x1, y1, x, y);
+      var minVertex = GeometryUtils.minVertex(v0, v1);
+      line.holes.forEach(function (holeID) {
+        var hole = state.getIn(['scene', 'layers', layerID, 'holes', holeID]);
+        var holeOffset = hole.offset;
+        if (minVertex.x === x1 && minVertex.y === y1) {
+          splitPointOffset = 1 - splitPointOffset;
+          holeOffset = 1 - hole.offset;
+        }
+        if (holeOffset < splitPointOffset) {
+          var offset = holeOffset / splitPointOffset;
+          /*
+          if (minVertex.x === x1 && minVertex.y === y1) {
+            offset = 1 - offset;
+          }
+            */
+          state = Hole.create(state, layerID, hole.type, line0.id, offset, hole.properties).updatedState;
+        } else {
+          var _offset = (holeOffset - splitPointOffset) / (1 - splitPointOffset);
+          /*
+          if (minVertex.x === x1 && minVertex.y === y1) {
+            offset = 1 - offset;
+          }
+            */
+          state = Hole.create(state, layerID, hole.type, line1.id, _offset, hole.properties).updatedState;
+        }
+      });
+
+      //add splitted lines to the original line's group
+      var lineGroups = state.getIn(['scene', 'groups']).filter(function (group) {
+        var lines = group.getIn(['elements', layerID, 'lines']);
+        return lines && lines.contains(lineID);
+      });
+      lineGroups.forEach(function (group) {
+        state = Group.addElement(state, group.id, layerID, 'lines', line0.id).updatedState;
+        state = Group.addElement(state, group.id, layerID, 'lines', line1.id).updatedState;
+      });
+      state = Line.remove(state, layerID, lineID).updatedState;
+      return {
+        updatedState: state,
+        lines: new List([line0, line1])
+      };
+    }
+  }, {
+    key: "addFromPoints",
+    value: function addFromPoints(state, layerID, type, points, properties, holes) {
+      var _this = this;
+      var lineCreatedDateTime = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : new Date().getTime();
+      points = new List(points).sort(function (_ref, _ref2) {
+        var x1 = _ref.x,
+          y1 = _ref.y;
+        var x2 = _ref2.x,
+          y2 = _ref2.y;
+        return x1 === x2 ? y1 - y2 : x1 - x2;
+      });
+      var pointsPair = points.zip(points.skip(1)).filterNot(function (_ref3) {
+        var _ref4 = _slicedToArray(_ref3, 2),
+          _ref4$ = _ref4[0],
+          x1 = _ref4$.x,
+          y1 = _ref4$.y,
+          _ref4$2 = _ref4[1],
+          x2 = _ref4$2.x,
+          y2 = _ref4$2.y;
+        return x1 === x2 && y1 === y2;
+      });
+      var lines = [];
+      pointsPair.forEach(function (_ref5) {
+        var _ref6 = _slicedToArray(_ref5, 2),
+          _ref6$ = _ref6[0],
+          x1 = _ref6$.x,
+          y1 = _ref6$.y,
+          _ref6$2 = _ref6[1],
+          x2 = _ref6$2.x,
+          y2 = _ref6$2.y;
+        var _this$create = _this.create(state, layerID, type, x1, y1, x2, y2, properties, lineCreatedDateTime),
+          stateL = _this$create.updatedState,
+          line = _this$create.line;
+        state = stateL;
+        var lineLength = GeometryUtils.pointsDistance(x1, y1, x2, y2);
+        var alpha = GeometryUtils.absAngleBetweenTwoPoints(x1, y1, x2, y2);
+        var cosAlpha = GeometryUtils.cosWithThreshold(Math.abs(alpha), 0.0000001);
+        var sinAlpha = GeometryUtils.sinWithThreshold(Math.abs(alpha), 0.0000001);
+        if (holes) {
+          holes.forEach(function (holeWithOffsetPoint) {
+            var offset = holeWithOffsetPoint.hole.toJS().offset;
+            // if (invert) offset = 1 - offset;
+            var _holeWithOffsetPoint$ = holeWithOffsetPoint.offsetPosition,
+              xp = _holeWithOffsetPoint$.x,
+              yp = _holeWithOffsetPoint$.y;
+            if (GeometryUtils.isPointOnLineSegment(x1, y1, x2, y2, xp, yp)) {
+              var newOffset = GeometryUtils.pointPositionOnLineSegment(x1, y1, x2, y2, xp, yp);
+              if (newOffset >= 0 && newOffset <= 1) {
+                //add the position of hole
+                var temp = Hole.create(state, layerID, holeWithOffsetPoint.hole.type, line.id, newOffset, holeWithOffsetPoint.hole.properties, xp, yp);
+                state = temp.updatedState;
+                var holeX = 0,
+                  holeY = 0,
+                  holeID = temp.hole.id;
+                if (GeometryUtils.almostEqual(y1, y2)) {
+                  if (x1 > x2) {
+                    holeX = x1 - lineLength * newOffset;
+                    holeY = y1;
+                  } else {
+                    holeX = x1 + lineLength * newOffset;
+                    holeY = y1;
+                  }
+                } else if (GeometryUtils.almostEqual(x1, x2)) {
+                  if (y1 > y2) {
+                    holeX = x1;
+                    holeY = y1 - lineLength * newOffset;
+                  } else {
+                    holeX = x1;
+                    holeY = y1 + lineLength * newOffset;
+                  }
+                } else if (x1 > x2) {
+                  if (y1 > y2) {
+                    holeX = x1 - lineLength * newOffset * cosAlpha;
+                    holeY = y1 - lineLength * newOffset * sinAlpha;
+                  } else if (y1 < y2) {
+                    holeX = x1 - lineLength * newOffset * cosAlpha;
+                    holeY = y1 + lineLength * newOffset * sinAlpha;
+                  }
+                } else if (x1 < x2) {
+                  if (y1 > y2) {
+                    holeX = x1 + lineLength * newOffset * cosAlpha;
+                    holeY = y1 - lineLength * newOffset * sinAlpha;
+                  } else if (y1 < y2) {
+                    holeX = x1 + lineLength * newOffset * cosAlpha;
+                    holeY = y1 + lineLength * newOffset * sinAlpha;
+                  }
+                }
+                state = state.setIn(['scene', 'layers', layerID, 'holes', holeID, 'x'], holeX);
+                state = state.setIn(['scene', 'layers', layerID, 'holes', holeID, 'y'], holeY);
+              }
+            }
+          });
+        }
+        lines.push(line);
+      });
+      return {
+        updatedState: state,
+        lines: new List(lines),
+        newline: lines[0]
+      };
+    }
+  }, {
+    key: "createAvoidingIntersections",
+    value: function createAvoidingIntersections(state, layerID, type, x0, y0, x1, y1, oldProperties, oldHoles) {
+      var _this2 = this;
+      var lineCreatedDateTime = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : new Date().getTime();
+      var points = [{
+        x: x0,
+        y: y0
+      }, {
+        x: x1,
+        y: y1
+      }];
+      state = state.getIn(['scene', 'layers', layerID, 'lines']).reduce(function (reducedState, line) {
+        var _line$vertices$map$to = line.vertices.map(function (vertexID) {
+            return reducedState.getIn(['scene', 'layers', layerID, 'vertices']).get(vertexID);
+          }).toArray(),
+          _line$vertices$map$to2 = _slicedToArray(_line$vertices$map$to, 2),
+          v0 = _line$vertices$map$to2[0],
+          v1 = _line$vertices$map$to2[1];
+        var hasCommonEndpoint = GeometryUtils.samePoints(v0, points[0]) || GeometryUtils.samePoints(v0, points[1]) || GeometryUtils.samePoints(v1, points[0]) || GeometryUtils.samePoints(v1, points[1]);
+        var intersection = GeometryUtils.twoLineSegmentsIntersection(points[0], points[1], v0, v1);
+        if (intersection.type === 'colinear') {
+          if (!oldHoles) {
+            oldHoles = [];
+          }
+          var orderedVertices = GeometryUtils.orderVertices(points);
+          reducedState.getIn(['scene', 'layers', layerID, 'lines', line.id, 'holes']).forEach(function (holeID) {
+            var hole = reducedState.getIn(['scene', 'layers', layerID, 'holes', holeID]);
+            var oldLineLength = GeometryUtils.pointsDistance(v0.x, v0.y, v1.x, v1.y);
+            var offset = GeometryUtils.samePoints(orderedVertices[1], line.vertices.get(1)) ? 1 - hole.offset : hole.offset;
+            var offsetPosition = GeometryUtils.extendLine(v0.x, v0.y, v1.x, v1.y, oldLineLength * offset);
+            oldHoles.push({
+              hole: hole,
+              offsetPosition: offsetPosition
+            });
+          });
+          reducedState = _this2.remove(reducedState, layerID, line.id).updatedState;
+          points.push(v0, v1);
+        }
+        if (intersection.type === 'intersecting' && !hasCommonEndpoint) {
+          reducedState = _this2.split(reducedState, layerID, line.id, intersection.point.x, intersection.point.y).updatedState;
+          points.push(intersection.point);
+        }
+        return reducedState;
+      }, state);
+      var _Line$addFromPoints = Line.addFromPoints(state, layerID, type, points, oldProperties, oldHoles, lineCreatedDateTime),
+        updatedState = _Line$addFromPoints.updatedState,
+        lines = _Line$addFromPoints.lines,
+        newline = _Line$addFromPoints.newline;
+      return {
+        updatedState: updatedState,
+        lines: lines,
+        newline: newline
+      };
+    }
+  }, {
+    key: "replaceVertex",
+    value: function replaceVertex(state, layerID, lineID, vertexIndex, x, y) {
+      var vertexID = state.getIn(['scene', 'layers', layerID, 'lines', lineID, 'vertices', vertexIndex]);
+      state = Vertex.remove(state, layerID, vertexID, 'lines', lineID).updatedState;
+      var _Vertex$add3 = Vertex.add(state, layerID, x, y, 'lines', lineID),
+        stateV = _Vertex$add3.updatedState,
+        vertex = _Vertex$add3.vertex;
+      state = stateV;
+      state = state.setIn(['scene', 'layers', layerID, 'lines', lineID, 'vertices', vertexIndex], vertex.id);
+      state = state.setIn(['scene', 'layers', layerID, 'lines', lineID], state.getIn(['scene', 'layers', layerID, 'lines', lineID]));
+      return {
+        updatedState: state,
+        line: state.getIn(['scene', 'layers', layerID, 'lines', lineID]),
+        vertex: vertex
+      };
+    }
+  }, {
+    key: "selectToolDrawingLine",
+    value: function selectToolDrawingLine(state, sceneComponentType) {
+      state = state.merge({
+        mode: MODE_WAITING_DRAWING_LINE,
+        drawingSupport: new Map({
+          type: sceneComponentType
+        })
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "beginDrawingLine",
+    value: function beginDrawingLine(state, layerID, x, y) {
+      // if end drawing by created area
+      if (state.mode == MODE_IDLE) {
+        return {
+          updatedState: state
+        };
+      }
+      // ///////////////
+      var snapElements = SnapSceneUtils.sceneSnapElements(state.scene, new List(), state.snapMask);
+      var snap = null;
+      if (state.snapMask && !state.snapMask.isEmpty()) {
+        snap = SnapUtils.nearestSnap(snapElements, x, y, state.snapMask);
+        if (snap) {
+          var _snap$point = snap.point;
+          x = _snap$point.x;
+          y = _snap$point.y;
+        }
+        snapElements = snapElements.withMutations(function (snapElements) {
+          var a, b, c;
+          var _GeometryUtils$horizo = GeometryUtils.horizontalLine(y);
+          a = _GeometryUtils$horizo.a;
+          b = _GeometryUtils$horizo.b;
+          c = _GeometryUtils$horizo.c;
+          SnapUtils.addLineSnap(snapElements, a, b, c, 10, 3, null);
+          var _GeometryUtils$vertic = GeometryUtils.verticalLine(x);
+          a = _GeometryUtils$vertic.a;
+          b = _GeometryUtils$vertic.b;
+          c = _GeometryUtils$vertic.c;
+          SnapUtils.addLineSnap(snapElements, a, b, c, 10, 3, null);
+          var _GeometryUtils$upcros = GeometryUtils.upcrossLine(x, y);
+          a = _GeometryUtils$upcros.a;
+          b = _GeometryUtils$upcros.b;
+          c = _GeometryUtils$upcros.c;
+          SnapUtils.addLineSnap(snapElements, a, b, c, 10, 3, null);
+          var _GeometryUtils$downcr = GeometryUtils.downcrossLine(x, y);
+          a = _GeometryUtils$downcr.a;
+          b = _GeometryUtils$downcr.b;
+          c = _GeometryUtils$downcr.c;
+          SnapUtils.addLineSnap(snapElements, a, b, c, 10, 3, null);
+        });
+      }
+      var drawingSupport = state.get('drawingSupport').set('layerID', layerID);
+      state = Layer.unselectAll(state, layerID).updatedState;
+      var _Line$create3 = Line.create(state, layerID, drawingSupport.get('type'), x, y, x, y),
+        stateL = _Line$create3.updatedState,
+        line = _Line$create3.line;
+      state = Line.select(stateL, layerID, line.id).updatedState;
+      state = state.merge({
+        mode: MODE_DRAWING_LINE,
+        snapElements: snapElements,
+        activeSnapElement: snap ? snap.snap : null,
+        drawingSupport: drawingSupport
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "updateDrawingLine",
+    value: function updateDrawingLine(state, x, y, relatedLines) {
+      var snap = null;
+      if (state.snapMask && !state.snapMask.isEmpty()) {
+        snap = SnapUtils.nearestSnap(state.snapElements, x, y, state.snapMask);
+        if (snap) {
+          var _snap$point2 = snap.point;
+          x = _snap$point2.x;
+          y = _snap$point2.y;
+        }
+      }
+      var layerID = state.getIn(['drawingSupport', 'layerID']);
+      var lineID = state.getIn(['scene', 'layers', layerID, 'selected', 'lines']).first();
+
+      // let relatedLines = [];
+      var vertices = state.getIn(['scene', 'layers', layerID, 'vertices']).toJS();
+      var drawingLine = state.getIn(['scene', 'layers', layerID, 'lines', lineID]).toJS();
+      var moveFlag = [];
+      var tx = vertices[drawingLine.vertices[1]].x;
+      var ty = vertices[drawingLine.vertices[1]].y;
+      if (!isEmpty(relatedLines)) {
+        vertices[drawingLine.vertices[1]].x = x;
+        vertices[drawingLine.vertices[1]].y = y;
+      }
+      var absAngle, lineAngle;
+      var angles = [];
+
+      // get the angle of two lines and check the angle
+      if (drawingLine.vertices[0] !== drawingLine.vertices[1]) {
+        if (!isEmpty(relatedLines)) {
+          relatedLines.forEach(function (line) {
+            // get the points of two lines(drawing line and related line)
+            if (!isEmpty(line)) {
+              // the angle between two lines(line, drawingLine)
+              lineAngle = GeometryUtils.angleBetweenTwoLines(line, drawingLine, vertices);
+              // check whether the angle is less than or bigger than specific value.
+              absAngle = Math.abs(lineAngle);
+              angles.push(lineAngle);
+              if (absAngle < MIN_ANGLE_DISALLOW_DRAW_WALL || absAngle > 360 - MIN_ANGLE_DISALLOW_DRAW_WALL) {
+                moveFlag.push(false);
+              } else moveFlag.push(true);
+            }
+          });
+        } else {
+          var px = vertices[drawingLine.vertices[0]].x;
+          var py = vertices[drawingLine.vertices[0]].y;
+          lineAngle = GeometryUtils.angleBetweenTwoPointsAndOrigin(px, py, x, y);
+          absAngle = Math.abs(lineAngle);
+        }
+      }
+
+      // if the angle is bigger or less than specific value, the wall mustn't be drawn at new position
+      if (!moveFlag.some(function (flag) {
+        return flag === false;
+      })) {
+        tx = x;
+        ty = y;
+      } else {
+        // the origin point of rotation(snapping)
+        var ox = vertices[drawingLine.vertices[0]].x;
+        var oy = vertices[drawingLine.vertices[0]].y;
+        angles.forEach(function (angle, index) {
+          if (!moveFlag[index]) {
+            var absVal = Math.abs(angle);
+            var rest = MIN_ANGLE_DISALLOW_DRAW_WALL - absVal;
+            if (absVal > 360 - MIN_ANGLE_DISALLOW_DRAW_WALL) {
+              absVal = 360 - absVal;
+              rest = -(MIN_ANGLE_DISALLOW_DRAW_WALL - absVal);
+            }
+            // determine the direction of rotation.
+            rest = angle > 0 ? -rest : rest;
+            // rotate the current point to last point around the first point of drawing line.
+            var res = GeometryUtils.rotatePointAroundPoint(x, y, ox, oy, rest);
+            tx = res.x;
+            ty = res.y;
+          }
+        });
+      }
+      // angle snapping as a value of UNIT_ANGLE
+      if (!moveFlag.some(function (flag) {
+        return flag === false;
+      }) && !isEmpty(absAngle) && absAngle % UNIT_ANGLE !== 0) {
+        var result = GeometryUtils.snapAngleByUnit(lineAngle, vertices, drawingLine, tx, ty, drawingLine.vertices[1]);
+        tx = result.x;
+        ty = result.y;
+      }
+      var _Line$replaceVertex = Line.replaceVertex(state, layerID, lineID, 1, tx, ty),
+        stateLV = _Line$replaceVertex.updatedState,
+        vertex = _Line$replaceVertex.vertex;
+      state = stateLV;
+      state = this.select(state, layerID, lineID).updatedState;
+      state = state.merge({
+        activeSnapElement: snap ? snap.snap : null
+      });
+      state = state.setIn(['scene', 'setLineAttributes'], false);
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "stopDrawingLine",
+    value: function stopDrawingLine(state) {
+      console.log('line aCtion');
+    }
+
+    // Recalculate the hole position
+  }, {
+    key: "getHolePosition",
+    value: function getHolePosition(layer, lineID, nv0, nv1) {
+      var _layer$lines$get;
+      var holeOffset = [];
+      (_layer$lines$get = layer.lines.get(lineID)) === null || _layer$lines$get === void 0 || _layer$lines$get.holes.forEach(function (holeID) {
+        var lineLength = GeometryUtils.pointsDistance(nv0.x, nv0.y, nv1.x, nv1.y);
+        var minV = GeometryUtils.minVertex(nv0, nv1);
+        var maxV = GeometryUtils.maxVertex(nv0, nv1);
+        var alpha = Math.atan2(maxV.y - minV.y, maxV.x - minV.x);
+        var hole = layer.holes.get(holeID);
+        var pointOnLine = lineLength * hole.offset;
+        // Calculate the hole position
+        var offsetPosition = {
+          x: pointOnLine * Math.cos(alpha) + minV.x,
+          y: pointOnLine * Math.sin(alpha) + minV.y
+        };
+        holeOffset.push({
+          hole: hole,
+          offsetPosition: offsetPosition
+        });
+      });
+      return holeOffset;
+    }
+
+    /**
+     *
+     * @param {state} state
+     * @param {selectedLineInfo} selectedLineInfo
+     * @param {layerID} layerID
+     * @returns selectedLineInfo {
+     *    mergelines: [line1, line2,...], // lines that will be merged
+     *    points: [stpoint, edpoint] // start and end point of new line that merged.
+     * }
+     */
+  }, {
+    key: "mergeAllLines",
+    value: function mergeAllLines(state, selectedLineInfo, layerID) {
+      var _this3 = this;
+      var layer = state.getIn(['scene', 'layers', layerID]);
+      var allVertices = state.getIn(['scene', 'layers', layerID, 'vertices']);
+      selectedLineInfo.points.forEach(function (tvertex, index) {
+        var _tvertex$toJS, _vertex$lines;
+        var vertex = tvertex === null || tvertex === void 0 || (_tvertex$toJS = tvertex.toJS) === null || _tvertex$toJS === void 0 ? void 0 : _tvertex$toJS.call(tvertex);
+        if (vertex && !isEmpty(vertex) && ((_vertex$lines = vertex.lines) === null || _vertex$lines === void 0 ? void 0 : _vertex$lines.length) === 2) {
+          var relatedLineID = vertex.lines.filter(function (lineID) {
+            return !selectedLineInfo.mergelines.some(function (mgline) {
+              return mgline.id === lineID;
+            });
+          });
+          if (!isEmpty(relatedLineID)) {
+            var relatedLine = layer.lines.get(relatedLineID[0]);
+            if (!isEmpty(relatedLine)) {
+              var intersectionPoint = vertex;
+              var startPoint, endPoint;
+              var tstPoint = allVertices.get(relatedLine.vertices.get(0)).toJS();
+              var tedPoint = allVertices.get(relatedLine.vertices.get(1)).toJS();
+              if (!isEmpty(tstPoint) && !isEmpty(tedPoint)) {
+                if (relatedLine.vertices.get(0) === intersectionPoint.id) {
+                  endPoint = allVertices.get(relatedLine.vertices.get(1));
+                  startPoint = selectedLineInfo.points[1 - index];
+                } else {
+                  startPoint = allVertices.get(relatedLine.vertices.get(0));
+                  endPoint = selectedLineInfo.points[1 - index];
+                }
+                var tline1 = {
+                  vertices: [startPoint.id, intersectionPoint.id]
+                };
+                var tline2 = {
+                  vertices: [intersectionPoint.id, endPoint.id]
+                };
+                var angle = Math.abs(GeometryUtils.angleBetweenTwoLines(tline1, tline2, allVertices.toJS()));
+                if (Math.abs(angle - 180) <= EPSILON) {
+                  selectedLineInfo.mergelines.push(relatedLine);
+                  selectedLineInfo.points[0] = startPoint;
+                  selectedLineInfo.points[1] = endPoint;
+                  return _this3.mergeAllLines(state, selectedLineInfo, layerID);
+                }
+              }
+            }
+          }
+        }
+      });
+      return selectedLineInfo;
+    }
+  }, {
+    key: "mergeLines",
+    value: function mergeLines(state) {
+      var layerID = state.getIn(['scene', 'selectedLayer']);
+      var allVertices = state.getIn(['scene', 'layers', layerID, 'vertices']);
+      var lineID = state.getIn(['scene', 'layers', layerID, 'selected', 'lines']).first();
+      var line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
+      if (isEmpty(line)) {
+        return null;
+      }
+      var tmpStPoint = allVertices.get(line.vertices.get(0));
+      var tmpEdPoint = allVertices.get(line.vertices.get(1));
+      var selectedLineInfo = {
+        mergelines: [line],
+        points: [tmpStPoint, tmpEdPoint]
+      };
+      var mergeInfo = this.mergeAllLines(state, selectedLineInfo, layerID);
+      return mergeInfo;
+    }
+
+    /**
+     *
+     * @param {mode} mode
+     * @param {state} state
+     * @returns updatedState
+     */
+  }, {
+    key: "createLines",
+    value: function createLines(state, actionType, mergeInfo) {
+      var _this4 = this,
+        _ret2;
+      if (isEmpty(mergeInfo)) {
+        return {
+          updatedState: state
+        };
+      }
+      var layerID = state.getIn(['scene', 'selectedLayer']);
+      var layer = state.getIn(['scene', 'layers', layerID]);
+      var lineGroups = [];
+      var holesWithOffsetPosition = [];
+      var lineID = layer.getIn(['selected', 'lines']).first(); // lines : [id]
+      var line = layer.getIn(['lines', lineID]);
+      if (isEmpty(line)) {
+        return {
+          updatedState: state
+        };
+      }
+      mergeInfo.mergelines.forEach(function (line) {
+        var _nv0$toJS, _nv1$toJS;
+        if ([END_DRAGGING_LINE, END_DRAGGING_VERTEX].includes(actionType)) {
+          var tmpGroups = state //get groups membership if present
+          .getIn(['scene', 'groups']).filter(function (group) {
+            var lines = group.getIn(['elements', layerID, 'lines']);
+            return lines && lines.contains(line.id);
+          });
+          tmpGroups.forEach(function (group) {
+            return lineGroups.push(group);
+          });
+        }
+        var nv0 = layer.getIn(['vertices', line.vertices.get(0)]);
+        var nv1 = layer.getIn(['vertices', line.vertices.get(1)]);
+        if (!isEmpty(nv0 === null || nv0 === void 0 || (_nv0$toJS = nv0.toJS) === null || _nv0$toJS === void 0 ? void 0 : _nv0$toJS.call(nv0)) && !isEmpty(nv1 === null || nv1 === void 0 || (_nv1$toJS = nv1.toJS) === null || _nv1$toJS === void 0 ? void 0 : _nv1$toJS.call(nv1))) {
+          var tmpholeposition = _this4.getHolePosition(layer, line.id, nv0, nv1);
+          tmpholeposition.forEach(function (holeInfo) {
+            return holesWithOffsetPosition.push(holeInfo);
+          });
+        }
+        state = Line.remove(state, layerID, line.id).updatedState;
+      });
+      var ret;
+      if (!GeometryUtils.samePoints(mergeInfo.points[0], mergeInfo.points[1])) {
+        ret = Line.createAvoidingIntersections(state, layerID, line.type, mergeInfo.points[0].x, mergeInfo.points[0].y, mergeInfo.points[1].x, mergeInfo.points[1].y, line.properties, holesWithOffsetPosition, line.createdDateTime);
+        state = ret.updatedState;
+      }
+      if ([END_DRAGGING_LINE, END_DRAGGING_VERTEX].includes(actionType)) {
+        var _ret;
+        //re-add to old line's groups if present
+        (_ret = ret) === null || _ret === void 0 || _ret.lines.forEach(function (addedLine) {
+          lineGroups.forEach(function (oldLineGroup) {
+            state = Group.addElement(state, oldLineGroup.id, layerID, 'lines', addedLine.id).updatedState;
+          });
+        });
+      }
+      state = Layer.removeZeroLengthLines(state, layerID).updatedState;
+      if (!isEmpty((_ret2 = ret) === null || _ret2 === void 0 ? void 0 : _ret2.newline)) {
+        var _ret3;
+        state = this.select(state, layerID, (_ret3 = ret) === null || _ret3 === void 0 ? void 0 : _ret3.newline.get('id')).updatedState;
+      }
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "updateArea",
+    value: function updateArea(state) {
+      var layerID = state.getIn(['scene', 'selectedLayer']);
+      var layer = state.getIn(['scene', 'layers', layerID]);
+      var lineID = layer.getIn(['selected', 'lines']).first(); // lines : [id]
+      var line = layer.getIn(['lines', lineID]);
+      var drawingInfo = {};
+      if (!isEmpty(line)) {
+        drawingInfo.drawingLine = line;
+      }
+      state = Layer.detectAndUpdateAreas(state, layerID, drawingInfo).updatedState;
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "applyWallChanges",
+    value: function applyWallChanges(state, actionType) {
+      var mergeInfo = this.mergeLines(state); // merge lines
+      state = this.createLines(state, actionType, mergeInfo).updatedState; // creating lines
+      state = this.updateArea(state).updatedState; // detecting areas
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "prepareApplyWallChanges",
+    value: function prepareApplyWallChanges(v0, v1, state) {
+      var oldMode = state.getIn(['mode']);
+      var layerID = state.getIn(['scene', 'selectedLayer']);
+      var lineID = state.getIn(['scene', 'layers', layerID, 'selected', 'lines']).first();
+      var line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
+      if (isEmpty(line)) {
+        return {
+          updatedState: state
+        };
+      }
+      var tv0 = state.getIn(['scene', 'layers', layerID, 'vertices', line.vertices.get(0)]).toJS();
+      var tv1 = state.getIn(['scene', 'layers', layerID, 'vertices', line.vertices.get(1)]).toJS();
+      if (!isEmpty(v0) && !isEmpty(tv0)) {
+        state = state.setIn(['scene', 'layers', layerID, 'vertices', line.vertices.get(0), 'x'], v0.x);
+        state = state.setIn(['scene', 'layers', layerID, 'vertices', line.vertices.get(0), 'y'], v0.y);
+      }
+      if (!isEmpty(v1) && !isEmpty(tv1)) {
+        state = state.setIn(['scene', 'layers', layerID, 'vertices', line.vertices.get(1), 'x'], v1.x);
+        state = state.setIn(['scene', 'layers', layerID, 'vertices', line.vertices.get(1), 'y'], v1.y);
+      }
+      state = this.select(state, layerID, lineID).updatedState;
+      state = state.setIn(['mode'], oldMode);
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "endDrawingLine",
+    value: function endDrawingLine(state, x, y) {
+      if (state.snapMask && !state.snapMask.isEmpty()) {
+        var snap = SnapUtils.nearestSnap(state.snapElements, x, y, state.snapMask);
+        if (snap) {
+          var _snap$point3 = snap.point;
+          x = _snap$point3.x;
+          y = _snap$point3.y;
+        }
+      }
+      var layerID = state.getIn(['drawingSupport', 'layerID']);
+      var lineID = state.getIn(['scene', 'layers', layerID, 'selected', 'lines']).first();
+      var drawingLine = state.getIn(['scene', 'layers', layerID, 'lines', lineID]).toJS();
+      if (isEmpty(drawingLine)) {
+        return {
+          updatedState: state
+        };
+      }
+      if (drawingLine.vertices[0] === drawingLine.vertices[1]) {
+        state = Line.remove(state, layerID, lineID).updatedState;
+        state = state.merge({
+          mode: MODE_IDLE,
+          snapElements: new List(),
+          activeSnapElement: null
+        });
+        return {
+          updatedState: state
+        };
+      }
+      state = this.prepareApplyWallChanges({}, {
+        x: x,
+        y: y
+      }, state).updatedState;
+      state = this.applyWallChanges(state, END_DRAWING_LINE).updatedState;
+      state = state.merge({
+        mode: MODE_WAITING_DRAWING_LINE,
+        snapElements: new List(),
+        activeSnapElement: null
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "beginDraggingLine",
+    value: function beginDraggingLine(state, layerID, lineID, x, y) {
+      var snapElements = SnapSceneUtils.sceneSnapElements(state.scene, new List(), state.snapMask);
+      var layer = state.scene.layers.get(layerID);
+      var line = layer.lines.get(lineID);
+      var vertex0 = layer.vertices.get(line.vertices.get(0));
+      var vertex1 = layer.vertices.get(line.vertices.get(1));
+      state = state.merge({
+        mode: MODE_DRAGGING_LINE,
+        snapElements: snapElements,
+        draggingSupport: Map({
+          layerID: layerID,
+          lineID: lineID,
+          startPointX: x,
+          startPointY: y,
+          startVertex0X: vertex0.x,
+          startVertex0Y: vertex0.y,
+          startVertex1X: vertex1.x,
+          startVertex1Y: vertex1.y
+        })
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "getNewDraggedPoints",
+    value: function getNewDraggedPoints(newPoints, allVertices, draggingLine, relatedLines) {
+      if (!newPoints || !allVertices || !draggingLine || !Array.isArray(relatedLines)) {
+        return newPoints; // Invalid input, just return
+      }
+      var draggingVertices = Array.isArray(draggingLine.vertices) ? draggingLine.vertices : [];
+      var mvFlag = [];
+      relatedLines.forEach(function (relLine) {
+        if (!relLine || !Array.isArray(relLine.vertices)) return;
+        relLine.vertices.forEach(function (vertexId, i) {
+          var _newPoints$newVertex, _newPoints$newVertex2, _newPoints$newVertex3, _newPoints$newVertex4, _vData$x, _vData$y, _newPoints$newVertex5, _newPoints$newVertex6, _newPoints$newVertex7, _newPoints$newVertex8;
+          if (draggingVertices.includes(vertexId)) return; // skip shared vertices
+          var vData = allVertices[vertexId];
+          if (!vData) return; // guard: vertex missing
+
+          var center = i === 0 ? new Three.Vector2((_newPoints$newVertex = newPoints === null || newPoints === void 0 ? void 0 : newPoints.newVertex0X) !== null && _newPoints$newVertex !== void 0 ? _newPoints$newVertex : 0, (_newPoints$newVertex2 = newPoints === null || newPoints === void 0 ? void 0 : newPoints.newVertex0Y) !== null && _newPoints$newVertex2 !== void 0 ? _newPoints$newVertex2 : 0) : new Three.Vector2((_newPoints$newVertex3 = newPoints === null || newPoints === void 0 ? void 0 : newPoints.newVertex1X) !== null && _newPoints$newVertex3 !== void 0 ? _newPoints$newVertex3 : 0, (_newPoints$newVertex4 = newPoints === null || newPoints === void 0 ? void 0 : newPoints.newVertex1Y) !== null && _newPoints$newVertex4 !== void 0 ? _newPoints$newVertex4 : 0);
+          var pos1 = new Three.Vector2((_vData$x = vData.x) !== null && _vData$x !== void 0 ? _vData$x : 0, (_vData$y = vData.y) !== null && _vData$y !== void 0 ? _vData$y : 0);
+          var pos2 = i === 0 ? new Three.Vector2((_newPoints$newVertex5 = newPoints === null || newPoints === void 0 ? void 0 : newPoints.newVertex1X) !== null && _newPoints$newVertex5 !== void 0 ? _newPoints$newVertex5 : 0, (_newPoints$newVertex6 = newPoints === null || newPoints === void 0 ? void 0 : newPoints.newVertex1Y) !== null && _newPoints$newVertex6 !== void 0 ? _newPoints$newVertex6 : 0) : new Three.Vector2((_newPoints$newVertex7 = newPoints === null || newPoints === void 0 ? void 0 : newPoints.newVertex0X) !== null && _newPoints$newVertex7 !== void 0 ? _newPoints$newVertex7 : 0, (_newPoints$newVertex8 = newPoints === null || newPoints === void 0 ? void 0 : newPoints.newVertex0Y) !== null && _newPoints$newVertex8 !== void 0 ? _newPoints$newVertex8 : 0);
+          var cen = center.clone();
+          var vec1 = pos1.clone().sub(cen).normalize();
+          var vec2 = pos2.clone().sub(cen).normalize();
+          var angle = Math.floor(vec1.angle() * 180 / Math.PI - vec2.angle() * 180 / Math.PI + 0.5);
+          if (Math.abs(angle) < MIN_ANGLE_DISALLOW_DRAW_WALL || Math.abs(angle) > 360 - MIN_ANGLE_DISALLOW_DRAW_WALL) {
+            mvFlag.push(false);
+          } else {
+            mvFlag.push(true);
+          }
+        });
+      });
+
+      // If any flag is false, revert newPoints to original dragging line positions
+      if (mvFlag.includes(false) && draggingVertices.length >= 2) {
+        var v0 = allVertices[draggingVertices[0]];
+        var v1 = allVertices[draggingVertices[1]];
+        if (v0 && v1) {
+          newPoints.newVertex0X = v0.x;
+          newPoints.newVertex0Y = v0.y;
+          newPoints.newVertex1X = v1.x;
+          newPoints.newVertex1Y = v1.y;
+        }
+      }
+      return newPoints;
+    }
+  }, {
+    key: "updateDraggingLine",
+    value: function updateDraggingLine(state, x, y, relatedLines) {
+      var draggingSupport = state.draggingSupport;
+      var snapElements = state.snapElements;
+      var layerID = draggingSupport.get('layerID');
+      var lineID = draggingSupport.get('lineID');
+      var diffX = x - draggingSupport.get('startPointX');
+      var diffY = y - draggingSupport.get('startPointY');
+      var newVertex0X = draggingSupport.get('startVertex0X') + diffX;
+      var newVertex0Y = draggingSupport.get('startVertex0Y') + diffY;
+      var newVertex1X = draggingSupport.get('startVertex1X') + diffX;
+      var newVertex1Y = draggingSupport.get('startVertex1Y') + diffY;
+      var drawingLine = state.getIn(['scene', 'layers', layerID, 'lines', lineID]).toJS();
+      var allVertices = state.getIn(['scene', 'layers', layerID, 'vertices']).toJS();
+      var activeSnapElement = null;
+      var curSnap0 = null,
+        curSnap1 = null;
+      if (state.snapMask && !state.snapMask.isEmpty()) {
+        curSnap0 = SnapUtils.nearestSnap(snapElements, newVertex0X, newVertex0Y, state.snapMask);
+        curSnap1 = SnapUtils.nearestSnap(snapElements, newVertex1X, newVertex1Y, state.snapMask);
+      }
+      var deltaX = 0,
+        deltaY = 0;
+      if (curSnap0 && curSnap1) {
+        if (curSnap0.point.distance < curSnap1.point.distance) {
+          deltaX = curSnap0.point.x - newVertex0X;
+          deltaY = curSnap0.point.y - newVertex0Y;
+          activeSnapElement = curSnap0.snap;
+        } else {
+          deltaX = curSnap1.point.x - newVertex1X;
+          deltaY = curSnap1.point.y - newVertex1Y;
+          activeSnapElement = curSnap1.snap;
+        }
+      } else {
+        if (curSnap0) {
+          deltaX = curSnap0.point.x - newVertex0X;
+          deltaY = curSnap0.point.y - newVertex0Y;
+          activeSnapElement = curSnap0.snap;
+        }
+        if (curSnap1) {
+          deltaX = curSnap1.point.x - newVertex1X;
+          deltaY = curSnap1.point.y - newVertex1Y;
+          activeSnapElement = curSnap1.snap;
+        }
+      }
+      newVertex0X += deltaX;
+      newVertex0Y += deltaY;
+      newVertex1X += deltaX;
+      newVertex1Y += deltaY;
+      var newPoints = {
+        newVertex0X: newVertex0X,
+        newVertex0Y: newVertex0Y,
+        newVertex1X: newVertex1X,
+        newVertex1Y: newVertex1Y
+      };
+      var newResult = this.getNewDraggedPoints(newPoints, allVertices, drawingLine, relatedLines);
+      newVertex0X = newResult.newVertex0X;
+      newVertex0Y = newResult.newVertex0Y;
+      newVertex1X = newResult.newVertex1X;
+      newVertex1Y = newResult.newVertex1Y;
+      state = state.merge({
+        activeSnapElement: activeSnapElement,
+        scene: state.scene.updateIn(['layers', layerID], function (layer) {
+          return layer.withMutations(function (layer) {
+            var lineVertices = layer.getIn(['lines', lineID, 'vertices']);
+            layer.updateIn(['vertices', lineVertices.get(0)], function (vertex) {
+              return vertex.merge({
+                x: newVertex0X,
+                y: newVertex0Y
+              });
+            });
+            layer.updateIn(['vertices', lineVertices.get(1)], function (vertex) {
+              return vertex.merge({
+                x: newVertex1X,
+                y: newVertex1Y
+              });
+            });
+            return layer;
+          });
+        })
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "endDraggingLine",
+    value: function endDraggingLine(state, x, y, relatedLines) {
+      var _state = state,
+        draggingSupport = _state.draggingSupport;
+      var layerID = draggingSupport.get('layerID');
+      var layer = state.scene.layers.get(layerID);
+      var lineID = draggingSupport.get('lineID');
+      var line = layer.lines.get(lineID);
+      var drawedLine = line.toJS();
+      var allVertices = state.getIn(['scene', 'layers', layerID, 'vertices']).toJS();
+      if (isEmpty(drawedLine)) {
+        return {
+          updatedState: state
+        };
+      }
+      var diffX = x - draggingSupport.get('startPointX');
+      var diffY = y - draggingSupport.get('startPointY');
+      var newVertex0X = draggingSupport.get('startVertex0X') + diffX;
+      var newVertex0Y = draggingSupport.get('startVertex0Y') + diffY;
+      var newVertex1X = draggingSupport.get('startVertex1X') + diffX;
+      var newVertex1Y = draggingSupport.get('startVertex1Y') + diffY;
+      if (state.snapMask && !state.snapMask.isEmpty()) {
+        var curSnap0 = SnapUtils.nearestSnap(state.snapElements, newVertex0X, newVertex0Y, state.snapMask);
+        var curSnap1 = SnapUtils.nearestSnap(state.snapElements, newVertex1X, newVertex1Y, state.snapMask);
+        var deltaX = 0,
+          deltaY = 0;
+        if (curSnap0 && curSnap1) {
+          if (curSnap0.point.distance < curSnap1.point.distance) {
+            deltaX = curSnap0.point.x - newVertex0X;
+            deltaY = curSnap0.point.y - newVertex0Y;
+          } else {
+            deltaX = curSnap1.point.x - newVertex1X;
+            deltaY = curSnap1.point.y - newVertex1Y;
+          }
+        } else {
+          if (curSnap0) {
+            deltaX = curSnap0.point.x - newVertex0X;
+            deltaY = curSnap0.point.y - newVertex0Y;
+          }
+          if (curSnap1) {
+            deltaX = curSnap1.point.x - newVertex1X;
+            deltaY = curSnap1.point.y - newVertex1Y;
+          }
+        }
+        newVertex0X += deltaX;
+        newVertex0Y += deltaY;
+        newVertex1X += deltaX;
+        newVertex1Y += deltaY;
+      }
+      var newPoints = {
+        newVertex0X: newVertex0X,
+        newVertex0Y: newVertex0Y,
+        newVertex1X: newVertex1X,
+        newVertex1Y: newVertex1Y
+      };
+      var newResult = this.getNewDraggedPoints(newPoints, allVertices, drawedLine, relatedLines);
+      newVertex0X = newResult.newVertex0X;
+      newVertex0Y = newResult.newVertex0Y;
+      newVertex1X = newResult.newVertex1X;
+      newVertex1Y = newResult.newVertex1Y;
+      state = Layer.mergeEqualsVertices(state, layerID, line.vertices.get(0)).updatedState;
+      state = Layer.mergeEqualsVertices(state, layerID, line.vertices.get(1)).updatedState;
+      if (GeometryUtils.samePoints({
+        newVertex0X: newVertex0X,
+        newVertex0Y: newVertex0Y
+      }, {
+        newVertex1X: newVertex1X,
+        newVertex1Y: newVertex1Y
+      })) {
+        state = Line.remove(state, layerID, lineID).updatedState;
+      } else {
+        state = this.prepareApplyWallChanges({
+          x: newVertex0X,
+          y: newVertex0Y
+        }, {
+          x: newVertex1X,
+          y: newVertex1Y
+        }, state).updatedState;
+        state = this.applyWallChanges(state, END_DRAGGING_LINE).updatedState;
+      }
+      state = state.merge({
+        mode: MODE_IDLE,
+        draggingSupport: null,
+        activeSnapElement: null,
+        snapElements: new List()
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "setProperties",
+    value: function setProperties(state, layerID, lineID, properties) {
+      state = state.mergeIn(['scene', 'layers', layerID, 'lines', lineID, 'properties'], properties);
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "setJsProperties",
+    value: function setJsProperties(state, layerID, lineID, properties) {
+      return this.setProperties(state, layerID, lineID, fromJS(properties));
+    }
+  }, {
+    key: "updateProperties",
+    value: function updateProperties(state, layerID, lineID, properties) {
+      properties.forEach(function (v, k) {
+        if (state.hasIn(['scene', 'layers', layerID, 'lines', lineID, 'properties', k])) state = state.mergeIn(['scene', 'layers', layerID, 'lines', lineID, 'properties', k], v);
+      });
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "updateJsProperties",
+    value: function updateJsProperties(state, layerID, lineID, properties) {
+      return this.updateProperties(state, layerID, lineID, fromJS(properties));
+    }
+  }, {
+    key: "setAttributes",
+    value: function setAttributes(state, layerID, lineID, lineAttributes) {
+      var lAttr = lineAttributes.toJS();
+      var vertexOne = lAttr.vertexOne,
+        vertexTwo = lAttr.vertexTwo,
+        vertexThree = lAttr.vertexThree,
+        vertexFour = lAttr.vertexFour,
+        lineLength = lAttr.lineLength,
+        lineToExtend = lAttr.lineToExtend;
+      delete lAttr['vertexOne'];
+      delete lAttr['vertexTwo'];
+      delete lAttr['vertexThree'];
+      delete lAttr['vertexFour'];
+      delete lAttr['lineToExtend'];
+      delete lAttr['lineLength'];
+      var line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
+      state = state.mergeIn(['scene', 'layers', layerID, 'lines', lineID], fromJS(lAttr)).mergeIn(['scene', 'layers', layerID, 'vertices', vertexOne.id], {
+        x: vertexOne.x,
+        y: vertexOne.y
+      }).mergeIn(['scene', 'layers', layerID, 'vertices', vertexTwo.id], {
+        x: vertexTwo.x,
+        y: vertexTwo.y
+      }).mergeIn(['scene', 'layers', layerID, 'lines', lineID, 'misc'], new Map({
+        _unitLength: lineLength._unit
+      })).mergeIn(['scene', 'layers', layerID, 'lines', lineID, 'focus'], true);
+      if (lineToExtend) {
+        state = state.mergeIn(['scene', 'layers', layerID, 'lines', lineToExtend.id], fromJS(lAttr)).mergeIn(['scene', 'layers', layerID, 'lines', lineToExtend.id, 'misc'], new Map({
+          _unitLength: lineLength._unit
+        }));
+      }
+      if (vertexThree) {
+        state = state.mergeIn(['scene', 'layers', layerID, 'vertices', vertexThree.id], {
+          x: vertexThree.x,
+          y: vertexThree.y
+        });
+      }
+      if (vertexFour) {
+        state = state.mergeIn(['scene', 'layers', layerID, 'vertices', vertexFour.id], {
+          x: vertexFour.x,
+          y: vertexFour.y
+        });
+      }
+      state = Layer.mergeEqualsVertices(state, layerID, vertexOne.id).updatedState;
+      if (vertexOne.x != vertexTwo.x && vertexOne.y != vertexTwo.y) {
+        state = Layer.mergeEqualsVertices(state, layerID, vertexTwo.id).updatedState;
+      }
+      state = this.select(state, layerID, lineID).updatedState;
+      state = this.applyWallChanges(state, END_DRAWING_LINE).updatedState;
+      state = state.merge({
+        sceneHistory: history.historyPush(state.sceneHistory, state.scene)
+      });
+      if (state.mode.endsWith('_LINE')) {
+        state = state.setIn(['scene', 'setLineAttributes'], true);
+        state = this.beginDrawingLine(state, layerID, vertexTwo.x, vertexTwo.y).updatedState;
+      }
+      return {
+        updatedState: state
+      };
+    }
+  }, {
+    key: "setVerticesCoords",
+    value: function setVerticesCoords(state, layerID, lineID, x1, y1, x2, y2) {
+      var line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
+      state = Vertex.setAttributes(state, layerID, line.vertices.get(0), new Map({
+        x: x1,
+        y: y1
+      })).updatedState;
+      state = Vertex.setAttributes(state, layerID, line.vertices.get(1), new Map({
+        x: x2,
+        y: y2
+      })).updatedState;
+      return {
+        updatedState: state
+      };
+    }
+  }]);
+}();
+export { Line as default };