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

package/src/class/line.js

@@ -1,1780 +0,0 @@
-import { Map, List, fromJS } from 'immutable';
-import { Group, Layer, Hole, Vertex } from './export';
-import {
-  IDBroker,
-  NameGenerator,
-  GeometryUtils,
-  history,
-  SnapUtils,
-  SnapSceneUtils
-} from '../utils/export';
-import * as Three from 'three';
-import {
-  MODE_IDLE,
-  MODE_WAITING_DRAWING_LINE,
-  MODE_DRAWING_LINE,
-  MODE_DRAGGING_LINE,
-  MIN_ANGLE_DISALLOW_DRAW_WALL,
-  UNIT_ANGLE
-} from '../constants';
-import { getRelatedLines } from '../../src/utils/geometry';
-import { isEmpty } from '../../src/utils/helper';
-
-let timeGlobal = 0;
-
-class TimeRecorder {
-  constructor(name) {
-    this.name = name;
-
-    if (name === "beginDrawingLine") {
-      console.log("time__  Start Drawing");
-    }
-  }
-
-  start() {
-    this.first = Date.now();
-  }
-
-  end() {
-    this.second = Date.now();
-    const 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;
-    }
-  }
-}
-
-class Line {
-  static create(
-    state,
-    layerID,
-    type,
-    x0,
-    y0,
-    x1,
-    y1,
-    properties,
-    lineCreatedDateTime = new Date().getTime()
-  ) {
-    // if end drawing by created area
-    // if (state.mode == MODE_IDLE) {
-    //   return { updatedState: state };
-    // }
-    // ///////////////
-    let lineID = IDBroker.acquireID();
-    let { updatedState: stateV0, vertex: v0 } = Vertex.add(
-      state,
-      layerID,
-      x0,
-      y0,
-      'lines',
-      lineID
-    );
-    let { updatedState: stateV1, vertex: v1 } = Vertex.add(
-      stateV0,
-      layerID,
-      x1,
-      y1,
-      'lines',
-      lineID
-    );
-    state = stateV1;
-
-    let 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
-      },
-      properties
-    );
-    line = line.set(
-      'createdDateTime',
-      lineCreatedDateTime !== undefined
-        ? lineCreatedDateTime
-        : new Date().getTime()
-    );
-    state = state.setIn(['scene', 'layers', layerID, 'lines', lineID], line);
-    // set default texture//
-    let defaultTexture = {
-      textureA: 'plaster',
-      textureB: 'plaster'
-    };
-    state = this.setJsProperties(
-      state,
-      layerID,
-      lineID,
-      defaultTexture
-    ).updatedState;
-    // /////////////////////
-    return { updatedState: state, line };
-  }
-
-  static select(state, layerID, lineID) {
-    // Try selecting the layer first
-    const 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
-    const line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
-    if (!line) {
-      return { updatedState: state }; // no update if line not found
-    }
-
-    // Select the line element
-    const lineSelectResult = Layer.selectElement(
-      state,
-      layerID,
-      'lines',
-      lineID
-    );
-    if (lineSelectResult?.updatedState) {
-      state = lineSelectResult.updatedState;
-    }
-
-    // Select the first vertex (if available)
-    const firstVertex = line.vertices?.get?.(0);
-    if (firstVertex !== undefined) {
-      const v1Result = Layer.selectElement(
-        state,
-        layerID,
-        'vertices',
-        firstVertex
-      );
-      if (v1Result?.updatedState) {
-        state = v1Result.updatedState;
-      }
-    }
-
-    // Select the second vertex (if available)
-    const secondVertex = line.vertices?.get?.(1);
-    if (secondVertex !== undefined) {
-      const v2Result = Layer.selectElement(
-        state,
-        layerID,
-        'vertices',
-        secondVertex
-      );
-      if (v2Result?.updatedState) {
-        state = v2Result.updatedState;
-      }
-    }
-
-    return { updatedState: state };
-  }
-
-  static remove(state, layerID, lineID) {
-    let line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
-
-    if (line) {
-      state = this.unselect(state, layerID, lineID).updatedState;
-      line.holes.forEach(
-        holeID => (state = Hole.remove(state, layerID, holeID).updatedState)
-      );
-      state = Layer.removeElement(state, layerID, 'lines', lineID).updatedState;
-
-      line.vertices.forEach(
-        vertexID =>
-          (state = Vertex.remove(
-            state,
-            layerID,
-            vertexID,
-            'lines',
-            lineID
-          ).updatedState)
-      );
-
-      state
-        .getIn(['scene', 'groups'])
-        .forEach(
-          group =>
-            (state = Group.removeElement(
-              state,
-              group.id,
-              layerID,
-              'lines',
-              lineID
-            ).updatedState)
-        );
-    }
-
-    return { updatedState: state };
-  }
-
-  static setRelatedLine(state, layerID, lineID, intersection) {
-    let curIntersection = state.getIn([
-      'scene',
-      'layers',
-      layerID,
-      'lines',
-      lineID,
-      'relatedVertices'
-    ]);
-    if (curIntersection == undefined) return { updatedState: state };
-
-    let isEqualIntersection = (a, b) => {
-      return (
-        a.index == b.index && a.point.x == b.point.x && a.point.y == b.point.y
-      );
-    };
-    let equal =
-      curIntersection.size == intersection.length &&
-      curIntersection.every((curint, index) => {
-        return isEqualIntersection(curint, intersection[index]);
-      });
-    if (!equal)
-      state = state.mergeIn(
-        ['scene', 'layers', layerID, 'lines', lineID, 'relatedVertices'],
-        intersection
-      );
-    return { updatedState: state };
-  }
-
-  static unselect(state, layerID, lineID) {
-    let 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 };
-  }
-
-  static split(state, layerID, lineID, x, y) {
-    let line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
-    let v0 = state.getIn([
-      'scene',
-      'layers',
-      layerID,
-      'vertices',
-      line.vertices.get(0)
-    ]);
-    let v1 = state.getIn([
-      'scene',
-      'layers',
-      layerID,
-      'vertices',
-      line.vertices.get(1)
-    ]);
-    let { x: x0, y: y0 } = v0;
-    let { x: x1, y: y1 } = v1;
-
-    let { updatedState: stateL1, line: line0 } = Line.create(
-      state,
-      layerID,
-      line.type,
-      x0,
-      y0,
-      x,
-      y,
-      line.get('properties'),
-      line.createdDateTime !== undefined
-        ? line.createdDateTime - 2
-        : new Date().getTime()
-    );
-    let { updatedState: stateL2, line: line1 } = Line.create(
-      stateL1,
-      layerID,
-      line.type,
-      x1,
-      y1,
-      x,
-      y,
-      line.get('properties'),
-      line.createdDateTime !== undefined
-        ? line.createdDateTime - 1
-        : new Date().getTime()
-    );
-    state = stateL2;
-
-    let splitPointOffset = GeometryUtils.pointPositionOnLineSegment(
-      x0,
-      y0,
-      x1,
-      y1,
-      x,
-      y
-    );
-    let minVertex = GeometryUtils.minVertex(v0, v1);
-
-    line.holes.forEach(holeID => {
-      let hole = state.getIn(['scene', 'layers', layerID, 'holes', holeID]);
-
-      let holeOffset = hole.offset;
-      if (minVertex.x === x1 && minVertex.y === y1) {
-        splitPointOffset = 1 - splitPointOffset;
-        holeOffset = 1 - hole.offset;
-      }
-
-      if (holeOffset < splitPointOffset) {
-        let 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 {
-        let 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
-    let lineGroups = state.getIn(['scene', 'groups']).filter(group => {
-      const lines = group.getIn(['elements', layerID, 'lines']);
-      return lines && lines.contains(lineID);
-    });
-
-    lineGroups.forEach(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]) };
-  }
-
-  static addFromPoints(
-    state,
-    layerID,
-    type,
-    points,
-    properties,
-    holes,
-    lineCreatedDateTime = new Date().getTime()
-  ) {
-    points = new List(points);
-    //.sort(({ x: x1, y: y1 }, { x: x2, y: y2 }) => x1 === x2 ? y1 - y2 : x1 - x2);
-
-    let pointsPair = points
-      .zip(points.skip(1))
-      .filterNot(
-        ([{ x: x1, y: y1 }, { x: x2, y: y2 }]) => x1 === x2 && y1 === y2
-      );
-
-    let usedObjects = {};
-    let objectsArray = pointsPair;
-    pointsPair = objectsArray.filter(element => {
-      let so = JSON.stringify(element[0]);
-      let so1 = JSON.stringify(element[1]);
-      if (!usedObjects[so] && !usedObjects[so1]) {
-        usedObjects[so] = true;
-        usedObjects[so1] = true;
-        return element;
-      }
-    });
-
-    let lines = [];
-    let newLine;
-
-    pointsPair.forEach(([{ x: x1, y: y1 }, { x: x2, y: y2 }]) => {
-      let { updatedState: stateL, line } = this.create(
-        state,
-        layerID,
-        type,
-        x1,
-        y1,
-        x2,
-        y2,
-        properties,
-        lineCreatedDateTime
-      );
-      state = stateL;
-      let lineLength = GeometryUtils.pointsDistance(x1, y1, x2, y2);
-      let alpha = GeometryUtils.absAngleBetweenTwoPoints(x1, y1, x2, y2);
-      let cosAlpha = GeometryUtils.cosWithThreshold(Math.abs(alpha), 0.0000001);
-      let sinAlpha = GeometryUtils.sinWithThreshold(Math.abs(alpha), 0.0000001);
-
-      if (holes) {
-        holes.forEach(holeWithOffsetPoint => {
-          let offset = holeWithOffsetPoint.hole.toJS().offset;
-          // if (invert) offset = 1 - offset;
-          let { x: xp, y: yp } = holeWithOffsetPoint.offsetPosition;
-
-          if (GeometryUtils.isPointOnLineSegment(x1, y1, x2, y2, xp, yp)) {
-            let newOffset = GeometryUtils.pointPositionOnLineSegment(
-              x1,
-              y1,
-              x2,
-              y2,
-              xp,
-              yp
-            );
-
-            if (newOffset >= 0 && newOffset <= 1) {
-              //add the position of hole
-              let temp = Hole.create(
-                state,
-                layerID,
-                holeWithOffsetPoint.hole.type,
-                line.id,
-                newOffset,
-                holeWithOffsetPoint.hole.properties,
-                xp,
-                yp
-              );
-              state = temp.updatedState;
-              let 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);
-      newLine = line;
-    });
-
-    return { updatedState: state, lines: new List(lines), newline: newLine };
-  }
-
-  static createAvoidingIntersections(
-    state,
-    layerID,
-    type,
-    x0,
-    y0,
-    x1,
-    y1,
-    oldProperties,
-    oldHoles,
-    lineCreatedDateTime = new Date().getTime()
-  ) {
-    let points = [
-      { x: x0, y: y0 },
-      { x: x1, y: y1 }
-    ];
-
-    state = state
-      .getIn(['scene', 'layers', layerID, 'lines'])
-      .reduce((reducedState, line) => {
-        let [v0, v1] = line.vertices
-          .map(vertexID =>
-            reducedState
-              .getIn(['scene', 'layers', layerID, 'vertices'])
-              .get(vertexID)
-          )
-          .toArray();
-
-        let hasCommonEndpoint =
-          GeometryUtils.samePoints(v0, points[0]) ||
-          GeometryUtils.samePoints(v0, points[1]) ||
-          GeometryUtils.samePoints(v1, points[0]) ||
-          GeometryUtils.samePoints(v1, points[1]);
-
-        let intersection = GeometryUtils.twoLineSegmentsIntersection(
-          points[0],
-          points[1],
-          v0,
-          v1
-        );
-
-        if (intersection.type === 'colinear' && !hasCommonEndpoint) {
-          if (!oldHoles) {
-            oldHoles = [];
-          }
-
-          let orderedVertices = GeometryUtils.orderVertices(points);
-
-          reducedState
-            .getIn(['scene', 'layers', layerID, 'lines', line.id, 'holes'])
-            .forEach(holeID => {
-              let hole = reducedState.getIn([
-                'scene',
-                'layers',
-                layerID,
-                'holes',
-                holeID
-              ]);
-              let oldLineLength = GeometryUtils.pointsDistance(
-                v0.x,
-                v0.y,
-                v1.x,
-                v1.y
-              );
-              let offset = GeometryUtils.samePoints(
-                orderedVertices[1],
-                line.vertices.get(1)
-              )
-                ? 1 - hole.offset
-                : hole.offset;
-              let offsetPosition = GeometryUtils.extendLine(
-                v0.x,
-                v0.y,
-                v1.x,
-                v1.y,
-                oldLineLength * offset
-              );
-
-              oldHoles.push({ hole, offsetPosition });
-            });
-
-          reducedState = this.remove(
-            reducedState,
-            layerID,
-            line.id
-          ).updatedState;
-
-          points.push(v0, v1);
-        }
-
-        if (intersection.type === 'intersecting' && !hasCommonEndpoint) {
-          reducedState = this.split(
-            reducedState,
-            layerID,
-            line.id,
-            intersection.point.x,
-            intersection.point.y
-          ).updatedState;
-          points.push(intersection.point);
-        }
-
-        return reducedState;
-      }, state);
-
-    let { updatedState, lines, newline } = Line.addFromPoints(
-      state,
-      layerID,
-      type,
-      points,
-      oldProperties,
-      oldHoles,
-      lineCreatedDateTime
-    );
-
-    return { updatedState, lines, newline };
-  }
-
-  static replaceVertex(state, layerID, lineID, vertexIndex, x, y) {
-    let vertexID = state.getIn([
-      'scene',
-      'layers',
-      layerID,
-      'lines',
-      lineID,
-      'vertices',
-      vertexIndex
-    ]);
-
-    state = Vertex.remove(
-      state,
-      layerID,
-      vertexID,
-      'lines',
-      lineID
-    ).updatedState;
-    let { updatedState: stateV, vertex } = Vertex.add(
-      state,
-      layerID,
-      x,
-      y,
-      'lines',
-      lineID
-    );
-    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
-    };
-  }
-
-  static selectToolDrawingLine(state, sceneComponentType) {
-    state = state.merge({
-      mode: MODE_WAITING_DRAWING_LINE,
-      drawingSupport: new Map({
-        type: sceneComponentType
-      })
-    });
-
-    return { updatedState: state };
-  }
-
-  static beginDrawingLine(state, layerID, x, y) {
-    // if end drawing by created area
-    if (state.mode == MODE_IDLE) {
-      return { updatedState: state };
-    }
-    // ///////////////
-    let snapElements = SnapSceneUtils.sceneSnapElements(
-      state.scene,
-      new List(),
-      state.snapMask
-    );
-    let snap = null;
-    if (state.snapMask && !state.snapMask.isEmpty()) {
-      snap = SnapUtils.nearestSnap(snapElements, x, y, state.snapMask);
-      if (snap) ({ x, y } = snap.point);
-
-      snapElements = snapElements.withMutations(snapElements => {
-        let a, b, c;
-        ({ a, b, c } = GeometryUtils.horizontalLine(y));
-        SnapUtils.addLineSnap(snapElements, a, b, c, 10, 3, null);
-        ({ a, b, c } = GeometryUtils.verticalLine(x));
-        SnapUtils.addLineSnap(snapElements, a, b, c, 10, 3, null);
-        ({ a, b, c } = GeometryUtils.upcrossLine(x, y));
-        SnapUtils.addLineSnap(snapElements, a, b, c, 10, 3, null);
-        ({ a, b, c } = GeometryUtils.downcrossLine(x, y));
-        SnapUtils.addLineSnap(snapElements, a, b, c, 10, 3, null);
-      });
-    }
-
-    let drawingSupport = state.get('drawingSupport').set('layerID', layerID);
-
-    state = Layer.unselectAll(state, layerID).updatedState;
-
-    let { updatedState: stateL, line } = Line.create(
-      state,
-      layerID,
-      drawingSupport.get('type'),
-      x,
-      y,
-      x,
-      y
-    );
-    state = Line.select(stateL, layerID, line.id).updatedState;
-
-    state = state.merge({
-      mode: MODE_DRAWING_LINE,
-      snapElements,
-      activeSnapElement: snap ? snap.snap : null,
-      drawingSupport
-    });
-
-    return { updatedState: state };
-  }
-
-  static updateDrawingLine(state, x, y, relatedLines) {
-    let snap = null;
-    if (state.snapMask && !state.snapMask.isEmpty()) {
-      snap = SnapUtils.nearestSnap(state.snapElements, x, y, state.snapMask);
-      if (snap) ({ x, y } = snap.point);
-    }
-    let layerID = state.getIn(['drawingSupport', 'layerID']);
-    let lineID = state
-      .getIn(['scene', 'layers', layerID, 'selected', 'lines'])
-      .first();
-
-    // let relatedLines = [];
-    let vertices = state.getIn(['scene', 'layers', layerID, 'vertices']).toJS();
-    let drawingLine = state
-      .getIn(['scene', 'layers', layerID, 'lines', lineID])
-      .toJS();
-    let moveFlag = true;
-    let tx = vertices[drawingLine.vertices[1]].x;
-    let ty = vertices[drawingLine.vertices[1]].y;
-
-    if (!isEmpty(relatedLines)) {
-      vertices[drawingLine.vertices[1]].x = x;
-      vertices[drawingLine.vertices[1]].y = y;
-    }
-
-    let absAngle, lineAngle;
-
-    // get the angle of two lines and check the angle
-    if (drawingLine.vertices[0] !== drawingLine.vertices[1]) {
-      relatedLines.forEach(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);
-          if (
-            absAngle < MIN_ANGLE_DISALLOW_DRAW_WALL ||
-            absAngle > 360 - MIN_ANGLE_DISALLOW_DRAW_WALL
-          ) {
-            moveFlag = false;
-          } else moveFlag = true;
-        }
-      });
-    }
-
-    // if the angle is bigger or less than specific value, the wall mustn't be drawn at new position
-    if (moveFlag) {
-      tx = x;
-      ty = y;
-    } else {
-      let rest = MIN_ANGLE_DISALLOW_DRAW_WALL - absAngle;
-      // the origin point of rotation(snapping)
-      let ox = vertices[drawingLine.vertices[0]].x;
-      let oy = vertices[drawingLine.vertices[0]].y;
-      // determine the direction of rotation.
-      rest = lineAngle > 0 ? -rest : rest;
-      // rotate the current point to last point around the first point of drawing line.
-      let res = GeometryUtils.rotatePointAroundPoint(x, y, ox, oy, rest);
-      tx = res.x;
-      ty = res.y;
-    }
-    // angle snapping as a value of UNIT_ANGLE
-    if (moveFlag && !isEmpty(absAngle) && absAngle % UNIT_ANGLE !== 0) {
-      let result = GeometryUtils.snapAngleByUnit(
-        lineAngle,
-        vertices,
-        drawingLine,
-        tx,
-        ty,
-        drawingLine.vertices[1]
-      );
-      tx = result.x;
-      ty = result.y;
-    }
-    let { updatedState: stateLV, vertex } = Line.replaceVertex(
-      state,
-      layerID,
-      lineID,
-      1,
-      tx,
-      ty
-    );
-    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 };
-  }
-
-  static drawLineByAttributes(state, layerID, lineID, lineAttributes) {
-    let lAttr = lineAttributes.toJS();
-    let { vertexOne, vertexTwo } = lAttr;
-    // state = state.mergeIn(
-    //   ['scene', 'layers', layerID, 'lines', lineID],
-    //   fromJS(lAttr)
-    // );
-
-    let layer = state.getIn(['scene', 'layers', layerID]);
-    let line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
-
-    // let relatedLines = layer.lines.toArray().filter(line => {
-    //   return line.vertices.includes(vertexOne.id) && line.id != lineID;
-    // });
-    let lines = state.getIn(['scene', 'layers', layerID, 'lines']).toJS();
-    let vertices = state.getIn(['scene', 'layers', layerID, 'vertices']).toJS();
-    let relatedLines = [];
-    let drawingLine = line.toJS();
-    getRelatedLines(relatedLines, drawingLine, vertices, lines);
-
-    //if lineAngle is 180 degree between two lines
-    let lineAngle;
-    let holesWithOffsetPosition = [];
-    let v0;
-    for (let i = 0; i < relatedLines.length; i++) {
-      // A variable j, k is the number of points in the line
-      for (let j = 0; j < 2; j++) {
-        for (let k = 0; k < 2; k++) {
-          // lineAngle is that angle between the two lines
-          lineAngle = Math.abs(
-            GeometryUtils.angleBetweenTwoLines(
-              relatedLines[i],
-              drawingLine,
-              vertices
-            )
-          );
-          //when the related line is one, drawing a new line
-          if (lineAngle === 180 && relatedLines.length === 1) {
-            if (relatedLines[i].vertices[j] !== drawingLine.vertices[k]) {
-              continue;
-            } else {
-              v0 = layer.vertices.get(relatedLines[i].vertices[1 - j]);
-              let v1 = layer.vertices.get(relatedLines[i].vertices[j]);
-              //remove the drawing line and related line
-              state = Line.remove(
-                state,
-                layerID,
-                relatedLines[i].id
-              ).updatedState;
-              //get the data of hole included in the related line
-              layer.lines.get(relatedLines[i].id).holes.forEach(holeID => {
-                let lineLength = GeometryUtils.pointsDistance(
-                  v0.x,
-                  v0.y,
-                  v1.x,
-                  v1.y
-                );
-                let minV = GeometryUtils.minVertex(v0, v1);
-                let maxV = GeometryUtils.maxVertex(v0, v1);
-                let alpha = Math.atan2(maxV.y - minV.y, maxV.x - minV.x);
-                let hole = layer.holes.get(holeID);
-                let pointOnLine = lineLength * hole.offset;
-                // Calculate the hole position
-                let offsetPosition = {
-                  x: pointOnLine * Math.cos(alpha) + minV.x,
-                  y: pointOnLine * Math.sin(alpha) + minV.y
-                };
-
-                holesWithOffsetPosition.push({ hole, offsetPosition });
-              });
-            }
-          }
-        }
-      }
-    }
-    // state = state.mergeIn(
-    //   ['scene', 'layers', layerID, 'lines', lineID, 'focus'],
-    //   true
-    // );
-    let v2 = layer.vertices.get(line.vertices.get(0));
-    let v3 = layer.vertices.get(line.vertices.get(1));
-    state = this.select(state, layerID, lineID).updatedState;
-    state = Line.remove(state, layerID, lineID).updatedState;
-    let minV = GeometryUtils.minVertex(v2, v3);
-    let maxV = GeometryUtils.maxVertex(v2, v3);
-    let alpha = Math.atan2(maxV.y - minV.y, maxV.x - minV.x);
-    layer.lines.get(lineID).holes.forEach(holeID => {
-      let lineLength = GeometryUtils.pointsDistance(v2.x, v2.y, v3.x, v3.y);
-      let hole = layer.holes.get(holeID);
-      let pointOnLine = lineLength * hole.offset;
-
-      let offsetPosition = {
-        x: pointOnLine * Math.cos(alpha) + minV.x,
-        y: pointOnLine * Math.sin(alpha) + minV.y
-      };
-
-      holesWithOffsetPosition.push({ hole, offsetPosition });
-    });
-    let checkVertex = lineAngle === 180 && relatedLines.length === 1 ? v0 : v2;
-    if (
-      !GeometryUtils.samePoints(checkVertex, {
-        x: vertexTwo.x,
-        y: vertexTwo.y
-      })
-    ) {
-      let ret = Line.createAvoidingIntersections(
-        state,
-        layerID,
-        line.type,
-        checkVertex.x,
-        checkVertex.y,
-        vertexTwo.x,
-        vertexTwo.y,
-        line.properties,
-        holesWithOffsetPosition,
-        line.createdDateTime
-      );
-      state = ret.updatedState;
-    }
-    // state = Line.createAvoidingIntersections(state, layerID, line.type, v0.x, v0.y, x, y).updatedState;
-
-    // origin area count
-    let areaCount = layer.areas.size;
-
-    state = Layer.detectAndUpdateAreas(state, layerID).updatedState;
-
-    state = state.merge({
-      sceneHistory: history.historyPush(state.sceneHistory, state.scene)
-    });
-
-    // state = state.merge({
-    //   mode: MODE_WAITING_DRAWING_LINE,
-    //   snapElements: new List(),
-    //   activeSnapElement: null
-    // });
-
-    if (state.mode.endsWith('_LINE')) {
-      state = state.setIn(['scene', 'setLineAttributes'], true);
-      state = this.beginDrawingLine(
-        state,
-        layerID,
-        vertexTwo.x,
-        vertexTwo.y
-      ).updatedState;
-    }
-
-    // update area//
-    layer = state.getIn(['scene', 'layers', layerID]);
-    // if new area created
-    // this.interiorsurfacedetect(state);
-
-    return { updatedState: state };
-  }
-
-  static stopDrawingLine(state) {
-    console.log('line aCtion');
-  }
-
-  /**
-   * check the [curVertId] point
-   * @param {*} state scene state
-   * @param {*} curVertId id of vertex
-   * returns colinear two line array - [line1, line2]
-   * if there is no colinear lines or the count of colinear lines more than
-   */
-  static hasColinearTwoLines(state, curVertId, layerID) {
-    let lineGroup = [];
-    let layer = state.getIn(['scene', 'layers', layerID]);
-    let vertices = state.getIn(['scene', 'layers', layerID, 'vertices']).toJS();
-
-    layer.lines.forEach(line => {
-      if (line.vertices.some(v => v === curVertId)) lineGroup.push(line.toJS());
-    });
-    if (lineGroup.length !== 2) return null;
-
-    let lineAngle = Math.abs(
-      GeometryUtils.angleBetweenTwoLines(lineGroup[0], lineGroup[1], vertices)
-    );
-    if (lineAngle === 180) return lineGroup;
-
-    return null;
-  }
-
-  static mergeTwoColinearLines(state, line1, line2, layerID, lineProperties) {
-    let nv0, nv1, nv2;
-    let layer = state.getIn(['scene', 'layers', layerID]);
-
-    let holesWithOffsetPosition = [];
-
-    line1.vertices.forEach(v1 => {
-      line2.vertices.forEach(v2 => {
-        if (v2 === v1) {
-          nv1 = layer.vertices.get(v1);
-        }
-      });
-    });
-    line1.vertices.forEach(v1 => {
-      if (v1 !== nv1.id) nv0 = layer.vertices.get(v1);
-    });
-    line2.vertices.forEach(v2 => {
-      if (v2 !== nv1.id) nv2 = layer.vertices.get(v2);
-    });
-
-    state = Line.remove(state, layerID, line1.id).updatedState;
-    //get the data of hole included in the related line
-    layer.lines.get(line1.id).holes.forEach(holeID => {
-      let lineLength = GeometryUtils.pointsDistance(nv0.x, nv0.y, nv1.x, nv1.y);
-      let minV = GeometryUtils.minVertex(nv0, nv1);
-      let maxV = GeometryUtils.maxVertex(nv0, nv1);
-      let alpha = Math.atan2(maxV.y - minV.y, maxV.x - minV.x);
-      let hole = layer.holes.get(holeID);
-      let pointOnLine = lineLength * hole.offset;
-      // Calculate the hole position
-      let offsetPosition = {
-        x: pointOnLine * Math.cos(alpha) + minV.x,
-        y: pointOnLine * Math.sin(alpha) + minV.y
-      };
-
-      holesWithOffsetPosition.push({ hole, offsetPosition });
-    });
-    state = Line.remove(state, layerID, line2.id).updatedState;
-    layer.lines.get(line2.id).holes.forEach(holeID => {
-      let lineLength = GeometryUtils.pointsDistance(nv1.x, nv1.y, nv2.x, nv2.y);
-      let minV = GeometryUtils.minVertex(nv1, nv2);
-      let maxV = GeometryUtils.maxVertex(nv1, nv2);
-      let alpha = Math.atan2(maxV.y - minV.y, maxV.x - minV.x);
-      let hole = layer.holes.get(holeID);
-      let pointOnLine = lineLength * hole.offset;
-      // Calculate the hole position
-      let offsetPosition = {
-        x: pointOnLine * Math.cos(alpha) + minV.x,
-        y: pointOnLine * Math.sin(alpha) + minV.y
-      };
-
-      holesWithOffsetPosition.push({ hole, offsetPosition });
-    });
-    let ret = Line.createAvoidingIntersections(
-      state,
-      layerID,
-      line1.type,
-      nv0.x,
-      nv0.y,
-      nv2.x,
-      nv2.y,
-      lineProperties,
-      holesWithOffsetPosition,
-      line1.createdDateTime
-    );
-    state = ret.updatedState;
-
-    // origin area count
-    let areaCount = layer.areas.size;
-
-    let drawingInfor = {
-      drawingLine: ret.newline,
-      vertices: layer.vertices
-    };
-    state = Layer.detectAndUpdateAreas(
-      state,
-      layerID,
-      drawingInfor
-    ).updatedState;
-
-    //update area//
-    layer = state.getIn(['scene', 'layers', layerID]);
-    // if new area created
-    // this.interiorsurfacedetect(state);
-
-    return { updatedState: state, drawingInfor };
-  }
-
-  static endDrawingLine(state, x, y, relatedLines) {
-    if (state.snapMask && !state.snapMask.isEmpty()) {
-      let snap = SnapUtils.nearestSnap(
-        state.snapElements,
-        x,
-        y,
-        state.snapMask
-      );
-      if (snap) ({ x, y } = snap.point);
-    }
-
-    let layerID = state.getIn(['drawingSupport', 'layerID']);
-    let layer = state.getIn(['scene', 'layers', layerID]);
-    let lineID = state
-      .getIn(['scene', 'layers', layerID, 'selected', 'lines'])
-      .first();
-    let line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
-
-    let drawingLine = line.toJS();
-
-    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 };
-    }
-
-
-    /// 180 merge lines - start ////
-    let vertexGroup = [];
-    let drawingInfor = {};
-
-    line.vertices.forEach(vertexID => {
-      let colinearLines = state.getIn([
-        'scene',
-        'layers',
-        layerID,
-        'vertices',
-        vertexID,
-        'lines'
-      ]);
-      colinearLines.forEach(lineID => {
-        let line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
-
-        line.vertices.forEach(vertex => {
-          if (vertex !== vertexID) vertexGroup.push(vertex);
-        });
-      });
-    });
-
-    vertexGroup.forEach(vertexId => {
-      let lineGroup = [];
-
-      lineGroup = this.hasColinearTwoLines(state, vertexId, layerID);
-      if (!isEmpty(lineGroup)) {
-        let ret = this.mergeTwoColinearLines(
-          state,
-          lineGroup[0],
-          lineGroup[1],
-          layerID,
-          line.properties
-        );
-        state = ret.updatedState;
-        drawingInfor = ret.drawingInfor;
-      }
-    });
-
-    /// 180 merge lines - end ////
-
-    if (isEmpty(drawingInfor)) {
-      drawingInfor = {
-        drawingLine: line,
-        vertices: layer.vertices
-      };
-      state = Layer.detectAndUpdateAreas(
-        state,
-        layerID,
-        drawingInfor
-      ).updatedState;
-    }
-
-    //update area//
-    layer = state.getIn(['scene', 'layers', layerID]);
-    // if new area created
-    // this.interiorsurfacedetect(state);
-
-    state = state.merge({
-      mode: MODE_WAITING_DRAWING_LINE,
-      snapElements: new List(),
-      activeSnapElement: null
-    });
-    return { updatedState: state };
-  }
-
-  static beginDraggingLine(state, layerID, lineID, x, y) {
-    let snapElements = SnapSceneUtils.sceneSnapElements(
-      state.scene,
-      new List(),
-      state.snapMask
-    );
-
-    let layer = state.scene.layers.get(layerID);
-    let line = layer.lines.get(lineID);
-
-    let vertex0 = layer.vertices.get(line.vertices.get(0));
-    let vertex1 = layer.vertices.get(line.vertices.get(1));
-
-    state = state.merge({
-      mode: MODE_DRAGGING_LINE,
-      snapElements,
-      draggingSupport: Map({
-        layerID,
-        lineID,
-        startPointX: x,
-        startPointY: y,
-        startVertex0X: vertex0.x,
-        startVertex0Y: vertex0.y,
-        startVertex1X: vertex1.x,
-        startVertex1Y: vertex1.y
-      })
-    });
-
-    return { updatedState: state };
-  }
-
-  static getNewDraggedPoints(
-    newPoints,
-    allVertices,
-    draggingLine,
-    relatedLines
-  ) {
-    if (
-      !newPoints ||
-      !allVertices ||
-      !draggingLine ||
-      !Array.isArray(relatedLines)
-    ) {
-      return newPoints; // Invalid input, just return
-    }
-
-    const draggingVertices = Array.isArray(draggingLine.vertices)
-      ? draggingLine.vertices
-      : [];
-    const mvFlag = [];
-
-    relatedLines.forEach(relLine => {
-      if (!relLine || !Array.isArray(relLine.vertices)) return;
-
-      relLine.vertices.forEach((vertexId, i) => {
-        if (draggingVertices.includes(vertexId)) return; // skip shared vertices
-        const vData = allVertices[vertexId];
-        if (!vData) return; // guard: vertex missing
-
-        const center =
-          i === 0
-            ? new Three.Vector2(
-                newPoints?.newVertex0X ?? 0,
-                newPoints?.newVertex0Y ?? 0
-              )
-            : new Three.Vector2(
-                newPoints?.newVertex1X ?? 0,
-                newPoints?.newVertex1Y ?? 0
-              );
-
-        const pos1 = new Three.Vector2(vData.x ?? 0, vData.y ?? 0);
-        const pos2 =
-          i === 0
-            ? new Three.Vector2(
-                newPoints?.newVertex1X ?? 0,
-                newPoints?.newVertex1Y ?? 0
-              )
-            : new Three.Vector2(
-                newPoints?.newVertex0X ?? 0,
-                newPoints?.newVertex0Y ?? 0
-              );
-
-        const cen = center.clone();
-        const vec1 = pos1.clone().sub(cen).normalize();
-        const vec2 = pos2.clone().sub(cen).normalize();
-
-        const 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) {
-      const v0 = allVertices[draggingVertices[0]];
-      const 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;
-  }
-
-  static updateDraggingLine(state, x, y, relatedLines) {
-    let draggingSupport = state.draggingSupport;
-    let snapElements = state.snapElements;
-
-    let layerID = draggingSupport.get('layerID');
-    let lineID = draggingSupport.get('lineID');
-    let diffX = x - draggingSupport.get('startPointX');
-    let diffY = y - draggingSupport.get('startPointY');
-    let newVertex0X = draggingSupport.get('startVertex0X') + diffX;
-    let newVertex0Y = draggingSupport.get('startVertex0Y') + diffY;
-    let newVertex1X = draggingSupport.get('startVertex1X') + diffX;
-    let newVertex1Y = draggingSupport.get('startVertex1Y') + diffY;
-    let drawingLine = state
-      .getIn(['scene', 'layers', layerID, 'lines', lineID])
-      .toJS();
-    let allVertices = state
-      .getIn(['scene', 'layers', layerID, 'vertices'])
-      .toJS();
-
-    let activeSnapElement = null;
-    let 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
-      );
-    }
-
-    let 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;
-    let newPoints = {
-      newVertex0X: newVertex0X,
-      newVertex0Y: newVertex0Y,
-      newVertex1X: newVertex1X,
-      newVertex1Y: newVertex1Y
-    };
-    let newResult = this.getNewDraggedPoints(
-      newPoints,
-      allVertices,
-      drawingLine,
-      relatedLines
-    );
-    newVertex0X = newResult.newVertex0X;
-    newVertex0Y = newResult.newVertex0Y;
-    newVertex1X = newResult.newVertex1X;
-    newVertex1Y = newResult.newVertex1Y;
-
-    state = state.merge({
-      activeSnapElement,
-      scene: state.scene.updateIn(['layers', layerID], layer =>
-        layer.withMutations(layer => {
-          let lineVertices = layer.getIn(['lines', lineID, 'vertices']);
-          layer.updateIn(['vertices', lineVertices.get(0)], vertex =>
-            vertex.merge({ x: newVertex0X, y: newVertex0Y })
-          );
-          layer.updateIn(['vertices', lineVertices.get(1)], vertex =>
-            vertex.merge({ x: newVertex1X, y: newVertex1Y })
-          );
-          return layer;
-        })
-      )
-    });
-
-    return { updatedState: state };
-  }
-
-  static endDraggingLine(state, x, y, relatedLines) {
-    let { draggingSupport } = state;
-
-    let layerID = draggingSupport.get('layerID');
-    let layer = state.scene.layers.get(layerID);
-    let lineID = draggingSupport.get('lineID');
-    let line = layer.lines.get(lineID);
-    let drawedLine = line.toJS();
-    let allVertices = state
-      .getIn(['scene', 'layers', layerID, 'vertices'])
-      .toJS();
-
-    let vertex0 = layer.vertices.get(line.vertices.get(0));
-    let vertex1 = layer.vertices.get(line.vertices.get(1));
-    let maxV = GeometryUtils.maxVertex(vertex0, vertex1);
-    let minV = GeometryUtils.minVertex(vertex0, vertex1);
-    let lineLength = GeometryUtils.verticesDistance(minV, maxV);
-    let alpha = Math.atan2(maxV.y - minV.y, maxV.x - minV.x);
-    let holesWithOffsetPosition = [];
-    layer.lines.get(lineID).holes.forEach(holeID => {
-      let hole = layer.holes.get(holeID);
-      let pointOnLine = lineLength * hole.offset;
-      let offsetPosition = {
-        x: pointOnLine * Math.cos(alpha) + minV.x,
-        y: pointOnLine * Math.sin(alpha) + minV.y
-      };
-      holesWithOffsetPosition.push({ hole, offsetPosition });
-    });
-
-    let diffX = x - draggingSupport.get('startPointX');
-    let diffY = y - draggingSupport.get('startPointY');
-    let newVertex0X = draggingSupport.get('startVertex0X') + diffX;
-    let newVertex0Y = draggingSupport.get('startVertex0Y') + diffY;
-    let newVertex1X = draggingSupport.get('startVertex1X') + diffX;
-    let newVertex1Y = draggingSupport.get('startVertex1Y') + diffY;
-
-    if (state.snapMask && !state.snapMask.isEmpty()) {
-      let curSnap0 = SnapUtils.nearestSnap(
-        state.snapElements,
-        newVertex0X,
-        newVertex0Y,
-        state.snapMask
-      );
-      let curSnap1 = SnapUtils.nearestSnap(
-        state.snapElements,
-        newVertex1X,
-        newVertex1Y,
-        state.snapMask
-      );
-
-      let 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;
-    }
-    let newPoints = {
-      newVertex0X: newVertex0X,
-      newVertex0Y: newVertex0Y,
-      newVertex1X: newVertex1X,
-      newVertex1Y: newVertex1Y
-    };
-    let newResult = this.getNewDraggedPoints(
-      newPoints,
-      allVertices,
-      drawedLine,
-      relatedLines
-    );
-    newVertex0X = newResult.newVertex0X;
-    newVertex0Y = newResult.newVertex0Y;
-    newVertex1X = newResult.newVertex1X;
-    newVertex1Y = newResult.newVertex1Y;
-
-    let lineGroups = state //get groups membership if present
-      .getIn(['scene', 'groups'])
-      .filter(group => {
-        const lines = group.getIn(['elements', layerID, 'lines']);
-        return lines && lines.contains(lineID);
-      });
-
-    state = Layer.mergeEqualsVertices(
-      state,
-      layerID,
-      line.vertices.get(0)
-    ).updatedState;
-    state = Layer.mergeEqualsVertices(
-      state,
-      layerID,
-      line.vertices.get(1)
-    ).updatedState;
-    state = Line.remove(state, layerID, lineID).updatedState;
-    if (
-      !GeometryUtils.samePoints(
-        { newVertex0X, newVertex0Y },
-        { newVertex1X, newVertex1Y }
-      )
-    ) {
-      let ret = Line.createAvoidingIntersections(
-        state,
-        layerID,
-        line.type,
-        newVertex0X,
-        newVertex0Y,
-        newVertex1X,
-        newVertex1Y,
-        line.properties,
-        holesWithOffsetPosition,
-        line.createdDateTime
-      );
-
-      state = ret.updatedState;
-      //re-add to old line's groups if present
-      ret.lines.forEach(addedLine => {
-        lineGroups.forEach(oldLineGroup => {
-          state = Group.addElement(
-            state,
-            oldLineGroup.id,
-            layerID,
-            'lines',
-            addedLine.id
-          ).updatedState;
-        });
-      });
-    }
-
-    /// merge line if line angle is 180 degree ----> start
-    let draggingLineID = state.draggingSupport.get('lineID');
-    let draggingLine = layer.lines.get(draggingLineID);
-    let vertexGroup = [];
-
-    draggingLine.vertices.forEach(vertexID => {
-      let colinearLines = state.getIn([
-        'scene',
-        'layers',
-        layerID,
-        'vertices',
-        vertexID,
-        'lines'
-      ]);
-      if (!isEmpty(colinearLines)) {
-        colinearLines.forEach(lineID => {
-          let line = state.getIn(['scene', 'layers', layerID, 'lines', lineID]);
-
-          line.vertices.forEach(vertex => {
-            if (vertex !== vertexID) vertexGroup.push(vertex);
-          });
-        });
-      }
-    });
-
-    vertexGroup.forEach(vertexId => {
-      let lineGroup = [];
-
-      lineGroup = this.hasColinearTwoLines(state, vertexId, layerID);
-      if (!isEmpty(lineGroup)) {
-        state = this.mergeTwoColinearLines(
-          state,
-          lineGroup[0],
-          lineGroup[1],
-          layerID,
-          line.properties
-        ).updatedState;
-      }
-    });
-
-    /// ------> end
-    state = Layer.detectAndUpdateAreas(state, layerID, {}).updatedState;
-
-    state = state.merge({
-      mode: MODE_IDLE,
-      draggingSupport: null,
-      activeSnapElement: null,
-      snapElements: new List()
-    });
-
-    return { updatedState: state };
-  }
-
-  static setProperties(state, layerID, lineID, properties) {
-    state = state.mergeIn(
-      ['scene', 'layers', layerID, 'lines', lineID, 'properties'],
-      properties
-    );
-
-    return { updatedState: state };
-  }
-
-  static setJsProperties(state, layerID, lineID, properties) {
-    return this.setProperties(state, layerID, lineID, fromJS(properties));
-  }
-
-  static updateProperties(state, layerID, lineID, properties) {
-    properties.forEach((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 };
-  }
-
-  static updateJsProperties(state, layerID, lineID, properties) {
-    return this.updateProperties(state, layerID, lineID, fromJS(properties));
-  }
-
-  static setAttributes(state, layerID, lineID, lineAttributes) {
-    if (state.mode === MODE_WAITING_DRAWING_LINE)
-      return this.drawLineByAttributes(state, layerID, lineID, lineAttributes);
-
-    let lAttr = lineAttributes.toJS();
-    let {
-      vertexOne,
-      vertexTwo,
-      vertexThree,
-      vertexFour,
-      lineLength,
-      lineToExtend
-    } = lAttr;
-    delete lAttr['vertexOne'];
-    delete lAttr['vertexTwo'];
-    delete lAttr['vertexThree'];
-    delete lAttr['vertexFour'];
-    delete lAttr['lineToExtend'];
-    delete lAttr['lineLength'];
-    let 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 = Layer.detectAndUpdateAreas(state, layerID, {}).updatedState;
-    state = state.merge({
-      sceneHistory: history.historyPush(state.sceneHistory, state.scene)
-    });
-    if (state.mode.endsWith('_LINE')) {
-      state = this.beginDrawingLine(
-        state,
-        layerID,
-        vertexTwo.x,
-        vertexTwo.y
-      ).updatedState;
-    }
-
-    return { updatedState: state };
-  }
-
-  static setVerticesCoords(state, layerID, lineID, x1, y1, x2, y2) {
-    let 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 };