kitchen-simulator 5.0.0-test.7 → 5.0.0-test.71

package/src/utils/molding.js

@@ -1,973 +1,973 @@
-import {
-  BASE_CABINET_LAYOUTPOS,
-  BOTTOM_MOLDING_LOCATION,
-  EPSILON,
-  MIDDLE_MOLDING_LOCATION,
-  MOLDING_LOCATIONS,
-  OVERLAP_INCLUDED,
-  OVERLAP_LINK,
-  OVERLAP_SAME,
-  OVERLAP_SOME,
-  TALL_CABINET_LAYOUTPOS,
-  TOP_MOLDING_LOCATION,
-  WALL_CABINET_LAYOUTPOS
-} from '../constants';
-import * as Three from 'three';
-import convert from 'convert-units';
-import IDBroker from './id-broker';
-import { returnReplaceableDeepSearchType } from '../components/viewer2d/utils';
-import { GeometryUtils } from './export';
-import { isEmpty } from './helper';
-
-export function getItemRect(item) {
-  let x = item.x;
-  let y = item.y;
-  let rotRad = (item.rotation / 180) * Math.PI;
-  let itemWidth = item.properties.get('width').get('_length');
-  let itemWidthUnit = item.properties.get('width').get('_unit') || 'cm';
-  itemWidth = convert(itemWidth / 2)
-    .from(itemWidthUnit)
-    .to('cm');
-  let itemDepth = item.properties.get('depth').get('_length');
-  let itemDepthUnit = item.properties.get('depth').get('_unit') || 'cm';
-  itemDepth = convert(itemDepth / 2)
-    .from(itemDepthUnit)
-    .to('cm');
-  let mx = x - itemWidth * Math.cos(rotRad);
-  let my = y - itemWidth * Math.sin(rotRad);
-  let x0 = mx + itemDepth * Math.sin(rotRad);
-  let y0 = my - itemDepth * Math.cos(rotRad);
-  let x3 = mx * 2 - x0;
-  let y3 = my * 2 - y0;
-  let x1 = x * 2 - x3;
-  let y1 = y * 2 - y3;
-  let x2 = x * 2 - x0;
-  let y2 = y * 2 - y0;
-  return {
-    rect: [
-      { x: x0, y: y0 },
-      { x: x1, y: y1 },
-      { x: x2, y: y2 },
-      { x: x3, y: y3 }
-    ]
-  };
-}
-
-export function hasMoldingLayout(molding, layoutpos) {
-  const types = molding?.molding_type;
-  return (
-    (Array.isArray(types) || typeof types === 'string') &&
-    types.includes(layoutpos)
-  );
-}
-
-export function isEnableItemForMolding(layer, selItem, molding = null) {
-  let allLineRects = GeometryUtils.buildRectFromLines(
-    layer,
-    GeometryUtils.getAllLines(layer)
-  );
-  let result =
-    !isEmpty(selItem) &&
-    selItem.category === 'cabinet' &&
-    ((selItem.layoutpos === BASE_CABINET_LAYOUTPOS &&
-      !GeometryUtils.isSnappedLine(getItemRect(selItem), allLineRects)) ||
-      ((selItem.layoutpos === WALL_CABINET_LAYOUTPOS ||
-        selItem.layoutpos === TALL_CABINET_LAYOUTPOS) &&
-        GeometryUtils.isSnappedLine(getItemRect(selItem), allLineRects)));
-
-  // check this item is enable for any molding
-  if (isEmpty(molding)) return result;
-  // check this item is enable for specified molding
-  else return result && hasMoldingLayout(molding, selItem.layoutpos);
-}
-
-/**
- * Check two line segments are overlap. The direction of the two line segments must be opposite.
- * s1       c2     s2          c1
- * |--------|------|-----------|
- * Decision Formular: L(s1,c1) + L(s2, c2) = L(s1, s2) + L(c1, c2)
- * @param {*} selRectPos1
- * @param {*} selRectPos2
- * @param {*} curRectPos1
- * @param {*} curRectPos2
- * @returns L(s1,c1) + L(s2, c2) - L(s1, s2) - L(c1, c2)
- */
-function getDelta(selRectPos1, selRectPos2, curRectPos1, curRectPos2) {
-  return (
-    // GeometryUtils.verticesDistance(curRectPos1, selRectPos2) +
-    // GeometryUtils.verticesDistance(selRectPos1, curRectPos2) -
-    // Math.abs(
-    //   GeometryUtils.verticesDistance(curRectPos2, curRectPos1) -
-    //     GeometryUtils.verticesDistance(selRectPos1, selRectPos2)
-    // )
-    Math.abs(
-      GeometryUtils.verticesDistance(curRectPos1, selRectPos1) +
-        GeometryUtils.verticesDistance(selRectPos2, curRectPos2) -
-        GeometryUtils.verticesDistance(curRectPos2, curRectPos1) -
-        GeometryUtils.verticesDistance(selRectPos1, selRectPos2)
-    )
-  );
-}
-
-export function isItemSnappedItem(selItem, curItem) {
-  const selRect = getItemRect(selItem).rect;
-  const curRect = getItemRect(curItem).rect;
-  const flag30 =
-    getDelta(selRect[3], selRect[0], curRect[1], curRect[2]) < EPSILON;
-  const flag21 =
-    getDelta(selRect[2], selRect[1], curRect[0], curRect[3]) < EPSILON;
-  const flag23 =
-    getDelta(selRect[2], selRect[3], curRect[2], curRect[3]) < EPSILON;
-  const flag01 =
-    getDelta(selRect[1], selRect[0], curRect[0], curRect[3]) < EPSILON;
-  const flag03 =
-    getDelta(selRect[0], selRect[3], curRect[1], curRect[0]) < EPSILON;
-  return flag30 || flag21 || flag23 || flag01 || flag03;
-}
-
-export function isItemSnappedGroup(selItem, itemGroup) {
-  return itemGroup.some(curItem => isItemSnappedItem(selItem, curItem));
-}
-
-export function sortItemsByDistance(items, selItem) {
-  items.sort((a, b) => {
-    return (
-      GeometryUtils.pointsDistance(a.x, a.y, selItem.x, selItem.y) -
-      GeometryUtils.pointsDistance(b.x, b.y, selItem.x, selItem.y)
-    );
-  });
-  return items;
-}
-
-export function isSameMoldingLayoutpos(curItem, item) {
-  return (
-    (curItem.layoutpos === BASE_CABINET_LAYOUTPOS &&
-      curItem.layoutpos === item.layoutpos) ||
-    ([WALL_CABINET_LAYOUTPOS, TALL_CABINET_LAYOUTPOS].includes(
-      curItem.layoutpos
-    ) &&
-      [WALL_CABINET_LAYOUTPOS, TALL_CABINET_LAYOUTPOS].includes(item.layoutpos))
-  );
-}
-
-export function isItemSameItemByLocation(item1, item2, location) {
-  let item1Altitude = item1.properties.get('altitude').get('_length');
-  let item1AltitudeUnit = item1.properties.get('altitude').get('_unit');
-  item1Altitude = convert(item1Altitude).from(item1AltitudeUnit).to('cm');
-  let item1Height = item1.properties.get('height').get('_length');
-  let item1HeightUnit = item1.properties.get('height').get('_unit');
-  item1Height = convert(item1Height).from(item1HeightUnit).to('cm');
-  let item2Altitude = item2.properties.get('altitude').get('_length');
-  let item2AltitudeUnit = item2.properties.get('altitude').get('_unit');
-  item2Altitude = convert(item2Altitude).from(item2AltitudeUnit).to('cm');
-  let item2Height = item2.properties.get('height').get('_length');
-  let item2HeightUnit = item2.properties.get('height').get('_unit');
-  item2Height = convert(item2Height).from(item2HeightUnit).to('cm');
-  let flag = false;
-  switch (location) {
-    case TOP_MOLDING_LOCATION:
-      if (
-        GeometryUtils.sameDistances(
-          item1Altitude + item1Height,
-          item2Altitude + item2Height
-        )
-      )
-        flag = true;
-      break;
-    case MIDDLE_MOLDING_LOCATION:
-      if (
-        GeometryUtils.sameDistances(
-          item1Altitude + item1Height / 2,
-          item2Altitude + item2Height / 2
-        )
-      )
-        flag = true;
-      break;
-    case BOTTOM_MOLDING_LOCATION:
-      if (GeometryUtils.sameDistances(item1Altitude, item2Altitude))
-        flag = true;
-      break;
-  }
-  return flag;
-}
-
-export function tryMergeMDItem(layer, selItem, curItem, itemGroup, molding) {
-  return (
-    isSameMoldingLayoutpos(selItem, curItem) &&
-    isEnableItemForMolding(layer, curItem, molding) &&
-    isItemSnappedGroup(curItem, itemGroup) &&
-    !itemGroup.some(item => item.id === curItem.id) &&
-    isItemSameItemByLocation(selItem, curItem, molding.location_type)
-  );
-}
-
-export function getItemGroupFromMolding(layer, curItem, molding) {
-  const selectedItem = layer.getIn(['items', layer.selected.toJS().items[0]]);
-  let itemGroup = [curItem];
-  let temp_layer_items = layer.items.toArray().filter(item => {
-    return (
-      item.category === 'cabinet' &&
-      item.id !== curItem.id &&
-      item.id !== selectedItem?.id
-    );
-  });
-  temp_layer_items = sortItemsByDistance(temp_layer_items, curItem);
-  for (let idx = 0; idx < temp_layer_items.length; idx++) {
-    if (
-      tryMergeMDItem(layer, curItem, temp_layer_items[idx], itemGroup, molding)
-    ) {
-      itemGroup.push(temp_layer_items[idx]);
-      idx = 0;
-    }
-  }
-  return itemGroup;
-}
-
-function tryMergeItemWithLocation(curItem, itemGroup, location) {
-  return itemGroup.some(item => {
-    return (
-      isItemSnappedItem(curItem, item) &&
-      isItemSameItemByLocation(curItem, item, location)
-    );
-  });
-}
-
-export function getAllMoldingGroups(layer, items = null) {
-  if (items === null) items = layer.items.toArray();
-  let itemGroups = [];
-  items.forEach(curItem => {
-    // let allLineRects = GeometryUtils.buildRectFromLines(
-    //   layer,
-    //   GeometryUtils.getAllLines(layer)
-    // );
-    // if (
-    //   (curItem.category === 'cabinet' &&
-    //     curItem.layoutpos === BASE_CABINET_LAYOUTPOS &&
-    //     !GeometryUtils.isSnappedLine(getItemRect(curItem), allLineRects)) ||
-    //   ((curItem.layoutpos === WALL_CABINET_LAYOUTPOS ||
-    //     curItem.layoutpos === TALL_CABINET_LAYOUTPOS) &&
-    //     GeometryUtils.isSnappedLine(getItemRect(curItem), allLineRects))
-    // ) {
-    if (curItem.category === 'cabinet') {
-      let temp_items = items.filter(it => {
-        return (
-          it.category === 'cabinet' &&
-          isSameMoldingLayoutpos(curItem, it) &&
-          it.id !== curItem.id
-        );
-      });
-      temp_items = sortItemsByDistance(temp_items, curItem);
-      MOLDING_LOCATIONS.forEach(location => {
-        if (
-          !itemGroups.some(
-            ig =>
-              ig.items.some(it => it.id === curItem.id) &&
-              ig.location_type === location
-          )
-        ) {
-          let itemGroup = [curItem];
-          for (let idx = 0; idx < temp_items.length; idx++) {
-            if (
-              tryMergeItemWithLocation(temp_items[idx], itemGroup, location)
-            ) {
-              itemGroup.push(temp_items[idx]);
-            }
-          }
-          itemGroups.push({
-            id: IDBroker.acquireID(),
-            items: itemGroup,
-            location_type: location,
-            molding: null,
-            lines: null,
-            pointGroups: null,
-            meshes: [],
-            rot: 0,
-            pos: 0
-          });
-        }
-      });
-    }
-    // }
-  });
-  return itemGroups;
-}
-
-export function getLinesOfItem(item, allLineRects, catalog) {
-  let lines = [];
-  let outline = null;
-  let element = catalog.elements[item.get('type')];
-  if (!element)
-    element =
-      catalog.elements[returnReplaceableDeepSearchType(item.get('type'))];
-  // get edge lines
-  let newWidth = item.properties.get('width').get('_length');
-  let wUnit = item.properties.get('width').get('_unit') || 'cm';
-  newWidth = convert(newWidth).from(wUnit).to('cm');
-  let newDepth = item.properties.get('depth').get('_length');
-  let hUnit = item.properties.get('depth').get('_unit') || 'cm';
-  newDepth = convert(newDepth).from(hUnit).to('cm');
-  if (item) {
-    // Get Outline Data of Selected Item
-    outline = element.info.outline;
-
-    if (outline) {
-      // Extract Points from `outline`
-      var outlinePaths = outline.paths;
-      var outlineWidth = outline.svgWidth;
-      var outlineHeight = outline.svgHeight;
-      var outlinePoints = []; // Hold Points Of SVG
-      for (let path of outlinePaths) {
-        for (let subPath of path.subPaths) {
-          outlinePoints = outlinePoints.concat(subPath.getPoints());
-        }
-      }
-      outline.reverse && outlinePoints.reverse();
-      for (let i = 0; i < outlinePoints.length - 1; i++) {
-        lines.push([
-          GeometryUtils.rotatePointAroundPoint(
-            (outlinePoints[i].x / outlineWidth - 0.5) * newWidth + item.x,
-            (outlinePoints[i].y / outlineHeight - 0.5) * newDepth + item.y,
-            item.x,
-            item.y,
-            item.rotation + 90
-          ),
-          GeometryUtils.rotatePointAroundPoint(
-            (outlinePoints[i + 1].x / outlineWidth - 0.5) * newWidth + item.x,
-            (outlinePoints[i + 1].y / outlineHeight - 0.5) * newDepth + item.y,
-            item.x,
-            item.y,
-            item.rotation + 90
-          ),
-          IDBroker.acquireID()
-        ]);
-      }
-    } else {
-      let pos = [
-        [-1, -1],
-        [1, -1],
-        [1, 1],
-        [-1, 1]
-      ];
-      for (let i = 0; i < 4; i++) {
-        lines.push([
-          GeometryUtils.rotatePointAroundPoint(
-            (pos[i][0] * newWidth) / 2 + item.x,
-            (pos[i][1] * newDepth) / 2 + item.y,
-            item.x,
-            item.y,
-            item.rotation
-          ),
-          GeometryUtils.rotatePointAroundPoint(
-            (pos[(i + 1) % 4][0] * newWidth) / 2 + item.x,
-            (pos[(i + 1) % 4][1] * newDepth) / 2 + item.y,
-            item.x,
-            item.y,
-            item.rotation
-          ),
-          IDBroker.acquireID()
-        ]);
-      }
-    }
-  }
-  if (item.layoutpos !== BASE_CABINET_LAYOUTPOS) {
-    lines = lines.filter(
-      line =>
-        !GeometryUtils.isSnappedLine(
-          { rect: [{ x: 0, y: 0 }, { x: 0, y: 0 }, line[0], line[1]] },
-          allLineRects
-        )
-    );
-  }
-  return lines;
-}
-
-function isParallelLines(line1, line2) {
-  let isParallel = false;
-  if (
-    Math.abs(line1[0].y - line1[1].y) <= EPSILON &&
-    Math.abs(line2[0].y - line2[1].y) <= EPSILON
-  )
-    isParallel = true;
-  if (
-    Math.abs(line1[0].x - line1[1].x) <= EPSILON &&
-    Math.abs(line2[0].x - line2[1].x) <= EPSILON
-  )
-    isParallel = true;
-  if (
-    Math.abs(
-      (line1[0].x - line1[1].x) / (line1[0].y - line1[1].y) -
-        (line2[0].x - line2[1].x) / (line2[0].y - line2[1].y)
-    ) <= EPSILON
-  )
-    isParallel = true;
-  if (isParallel) {
-    return true;
-  }
-  return false;
-}
-
-export function isLinesOverlapped(line1, line2) {
-  return (
-    isParallelLines(line1, line2) &&
-    line1.some(l1 => line2.some(l2 => GeometryUtils.samePoints(l1, l2)))
-  );
-}
-
-export function mergeOverlappedLines(line1, line2) {
-  let line1_idx = 0,
-    line2_idx = 0;
-  line1.forEach((l1, idx1) => {
-    if (idx1 !== line1.length - 1) {
-      line2.forEach((l2, idx2) => {
-        if (idx2 !== line2.length - 1) {
-          if (GeometryUtils.samePoints(l1, l2)) {
-            line1_idx = idx1;
-            line2_idx = idx2;
-          }
-        }
-      });
-    }
-  });
-  //If line1 's end point and line2 's start point is same, two lines merge into a line with
-  //the line1's start point as the start point and line2's end point as the end point.
-  if (line1_idx === 1) {
-    return [line1[1 - line1_idx], line2[1 - line2_idx], IDBroker.acquireID()];
-  } else {
-    return [line2[1 - line2_idx], line1[1 - line1_idx], IDBroker.acquireID()];
-  }
-}
-
-/**
- * Get the contour line array of moldingGroup items
- * @param {*} moldingGroup
- * @param {*} layer
- * @param {*} catalog
- * @returns contour line array of moldingGroup items
- */
-export function getLinesFromItems2(moldingGroup, layer, catalog) {
-  // wall lines
-  let allLineRects = GeometryUtils.buildRectFromLines(
-    layer,
-    GeometryUtils.getAllLines(layer)
-  );
-  let MGlines = [];
-  let MGlinesOtherSnapped = [];
-
-  let items = [...moldingGroup.items];
-  // The other item's lines (these items are snapped to the moldingGroup items)
-  let itemsOtherSnapped = layer.items.toArray().filter(item => {
-    if (items.some(it => item.id === it.id)) return false;
-    if (isItemSnappedGroup(item, items)) {
-      const itemLines = getLinesOfItem(item, allLineRects, catalog);
-      let itemAltitude = item.properties.get('altitude').get('_length');
-      let itemAltitudeUnit = item.properties.get('altitude').get('_unit');
-      itemAltitude = convert(itemAltitude).from(itemAltitudeUnit).to('cm');
-      let itemHeight = item.properties.get('height').get('_length');
-      let itemHeightUnit = item.properties.get('height').get('_unit');
-      itemHeight = convert(itemHeight).from(itemHeightUnit).to('cm');
-      itemLines.forEach(line => {
-        line.push({ altitude: itemAltitude, height: itemHeight });
-      });
-      MGlinesOtherSnapped = [...MGlinesOtherSnapped, ...itemLines];
-      return true;
-    } else return false;
-  });
-
-  // get all lines of moldingGroup items
-  items.forEach(item => {
-    let itemAltitude = item.properties.get('altitude').get('_length');
-    let itemAltitudeUnit = item.properties.get('altitude').get('_unit');
-    itemAltitude = convert(itemAltitude).from(itemAltitudeUnit).to('cm');
-    let itemHeight = item.properties.get('height').get('_length');
-    let itemHeightUnit = item.properties.get('height').get('_unit');
-    itemHeight = convert(itemHeight).from(itemHeightUnit).to('cm');
-
-    let itemLines = getLinesOfItem(item, allLineRects, catalog);
-
-    // remove the edge that overlapped with other snapped items
-    itemLines = itemLines.filter(itLine => {
-      let ret = true;
-      const srcLine = {
-        x1: itLine[0].x,
-        y1: itLine[0].y,
-        x2: itLine[1].x,
-        y2: itLine[1].y
-      };
-      for (let j = 0; j < MGlinesOtherSnapped.length; j++) {
-        let bCheck = false;
-        switch (moldingGroup.location_type) {
-          case TOP_MOLDING_LOCATION:
-            bCheck =
-              MGlinesOtherSnapped[j][3].altitude +
-                MGlinesOtherSnapped[j][3].height >
-              itemAltitude + itemHeight;
-            break;
-          case MIDDLE_MOLDING_LOCATION:
-            bCheck = true;
-            break;
-          case BOTTOM_MOLDING_LOCATION:
-            bCheck = MGlinesOtherSnapped[j][3].altitude < itemAltitude;
-            break;
-        }
-        if (
-          item.category !== 'cabinet' ||
-          ![
-            BASE_CABINET_LAYOUTPOS,
-            WALL_CABINET_LAYOUTPOS,
-            TALL_CABINET_LAYOUTPOS
-          ].includes(item.layoutpos)
-        )
-          bCheck = true;
-        if (bCheck) {
-          const destLine = {
-            x1: MGlinesOtherSnapped[j][0].x,
-            y1: MGlinesOtherSnapped[j][0].y,
-            x2: MGlinesOtherSnapped[j][1].x,
-            y2: MGlinesOtherSnapped[j][1].y
-          };
-          const rst = GeometryUtils.relationshipOfTwoOverlappedLines(
-            srcLine,
-            destLine
-          );
-          if (rst.result === OVERLAP_SAME || rst.result === OVERLAP_INCLUDED) {
-            ret = false;
-            break;
-          }
-        }
-      }
-      return ret;
-    });
-    MGlines = [...MGlines, ...itemLines];
-  });
-
-  // Filtering overlapped edges and get contour edges
-  let removeLineIds = []; // remove the edge that fully overlapped to other edge
-  let newLines = []; // new countour edge segment that except the overlapped part
-  for (let i = 0; i < MGlines.length; i++) {
-    const srcLine = {
-      x1: MGlines[i][0].x,
-      y1: MGlines[i][0].y,
-      x2: MGlines[i][1].x,
-      y2: MGlines[i][1].y
-    };
-    for (let j = 0; j < MGlines.length; j++) {
-      if (i === j) continue;
-      const destLine = {
-        x1: MGlines[j][0].x,
-        y1: MGlines[j][0].y,
-        x2: MGlines[j][1].x,
-        y2: MGlines[j][1].y
-      };
-      const rst = GeometryUtils.relationshipOfTwoOverlappedLines(
-        srcLine,
-        destLine
-      );
-      if (rst.result === OVERLAP_SAME || rst.result === OVERLAP_INCLUDED) {
-        removeLineIds.push(i);
-        break;
-      } else if (rst.result === OVERLAP_SOME) {
-        removeLineIds.push(i);
-        const lineSegs = getTrimmedContourLineSegs(
-          rst.trimmedSegs,
-          MGlines.filter((v, idx) => idx !== i && idx !== j),
-          0
-        );
-        if (lineSegs.length > 0) newLines = [...newLines, ...lineSegs];
-        break;
-      }
-    }
-  }
-
-  MGlines = MGlines.filter(
-    (line, idx) => !removeLineIds.some(id => idx === id)
-  );
-  if (newLines.length > 0) MGlines = [...MGlines, ...newLines];
-
-  // merge the collinear linked lines to one line
-  let newMGlines = [];
-  let filteredMGlines = MGlines;
-  for (let i = 0; i < MGlines.length; i++) {
-    if (filteredMGlines.length < 1) break;
-    if (!filteredMGlines.some(v => v[2] === MGlines[i][2])) continue;
-    let mergedResult = getMergedLine(MGlines[i], filteredMGlines);
-    newMGlines.push(mergedResult.mergedLine);
-    filteredMGlines = mergedResult.filteredMGlines;
-  }
-
-  return newMGlines;
-}
-
-/**
- * Get the line that colinear linked with [line], and merge them to a new line
- * @param {*} line
- * @param {*} MGlines
- * @returns
- *  - returns merged new line
- *  - returns filtered new line group (remove linked line from [MGlines])
- */
-function getMergedLine(line, MGlines) {
-  let newMGlines = MGlines.filter(v => line[2] !== v[2]);
-  let mergeResult = {
-    mergedLine: line,
-    filteredMGlines: newMGlines
-  };
-  const srcLine = {
-    x1: line[0].x,
-    y1: line[0].y,
-    x2: line[1].x,
-    y2: line[1].y
-  };
-  for (let i = 0; i < newMGlines.length; i++) {
-    const destLine = {
-      x1: newMGlines[i][0].x,
-      y1: newMGlines[i][0].y,
-      x2: newMGlines[i][1].x,
-      y2: newMGlines[i][1].y
-    };
-    const rst = GeometryUtils.relationshipOfTwoOverlappedLines(
-      srcLine,
-      destLine
-    );
-    if (rst.result === OVERLAP_LINK) {
-      let mergedLine = [
-        { x: rst.linkedLine.x1, y: rst.linkedLine.y1 },
-        { x: rst.linkedLine.x2, y: rst.linkedLine.y2 },
-        IDBroker.acquireID()
-      ];
-      mergeResult = getMergedLine(
-        mergedLine,
-        newMGlines.filter((v, idx) => idx !== i)
-      );
-    }
-  }
-  return mergeResult;
-}
-
-/**
- * Get the contour line segments from [lineSegs]
- * @param {*} lineSegs
- * @param {*} otherLines
- * @returns
- */
-function getTrimmedContourLineSegs(lineSegs, otherLines, cnt) {
-  try {
-    cnt++;
-    if (cnt > 5000) return [];
-    let returnSegs = [];
-    for (let i = 0; i < lineSegs.length; i++) {
-      const srcLine = {
-        x1: lineSegs[i].x1,
-        y1: lineSegs[i].y1,
-        x2: lineSegs[i].x2,
-        y2: lineSegs[i].y2
-      };
-      let bContourSeg = true;
-      for (let j = 0; j < otherLines.length; j++) {
-        const destLine = {
-          x1: otherLines[j][0].x,
-          y1: otherLines[j][0].y,
-          x2: otherLines[j][1].x,
-          y2: otherLines[j][1].y
-        };
-        const rst = GeometryUtils.relationshipOfTwoOverlappedLines(
-          srcLine,
-          destLine
-        );
-        if (rst.result == OVERLAP_SAME || rst.result == OVERLAP_INCLUDED) {
-          bContourSeg = false;
-          break;
-        } else if (rst.result == OVERLAP_SOME) {
-          const tLineSegs = getTrimmedContourLineSegs(
-            rst.trimmedSegs,
-            otherLines.filter((v, idx) => idx !== j),
-            cnt
-          );
-          if (tLineSegs.length > 0) returnSegs = [...returnSegs, ...tLineSegs];
-          bContourSeg = false;
-          break;
-        }
-      }
-      if (bContourSeg)
-        returnSegs.push([
-          { x: lineSegs[i].x1, y: lineSegs[i].y1 },
-          { x: lineSegs[i].x2, y: lineSegs[i].y2 },
-          IDBroker.acquireID()
-        ]);
-    }
-    return returnSegs;
-  } catch (e) {
-    console.log('molding catched :', e);
-    return [];
-  }
-}
-
-export function getLinesFromItems(moldingGroup, layer, catalog) {
-  let allLineRects = GeometryUtils.buildRectFromLines(
-    layer,
-    GeometryUtils.getAllLines(layer)
-  );
-  let items = [...moldingGroup.items];
-  let MGlines = getLinesOfItem(items[0], allLineRects, catalog);
-  items = sortItemsByDistance(items, items[0]);
-  for (let i = 1; i < items.length; i++) {
-    let itemLines = getLinesOfItem(items[i], allLineRects, catalog);
-    let temp_MGLines = [];
-    MGlines.forEach(line => {
-      let idx = itemLines.findIndex(itemLine =>
-        isLinesOverlapped(line, itemLine)
-      );
-      const curItemLine = itemLines[idx];
-      if (idx > -1) {
-        if (
-          !(
-            (GeometryUtils.samePoints(line[0], curItemLine[0]) &&
-              GeometryUtils.samePoints(line[1], curItemLine[1])) ||
-            (GeometryUtils.samePoints(line[0], curItemLine[1]) &&
-              GeometryUtils.samePoints(line[1], curItemLine[0]))
-          )
-        ) {
-          let MGLine = mergeOverlappedLines(line, curItemLine);
-          temp_MGLines.push(MGLine);
-        }
-        itemLines.splice(idx, 1);
-      } else {
-        temp_MGLines.push(line);
-      }
-    });
-    itemLines.forEach(itemLine => temp_MGLines.push(itemLine));
-    MGlines = [...temp_MGLines];
-  }
-  // return MGlines;
-  let snapped_other_items = layer.items.toArray().filter(item => {
-    if (items.some(it => item.id === it.id)) return false;
-    return isItemSnappedGroup(item, items);
-  });
-  snapped_other_items.forEach(item => {
-    let itemAltitude = item.properties.get('altitude').get('_length');
-    let itemAltitudeUnit = item.properties.get('altitude').get('_unit');
-    itemAltitude = convert(itemAltitude).from(itemAltitudeUnit).to('cm');
-    let itemHeight = item.properties.get('height').get('_length');
-    let itemHeightUnit = item.properties.get('height').get('_unit');
-    itemHeight = convert(itemHeight).from(itemHeightUnit).to('cm');
-    let mgroupAltitude = items[0].properties.get('altitude').get('_length');
-    let mgroupAltitudeUnit = items[0].properties.get('altitude').get('_unit');
-    mgroupAltitude = convert(mgroupAltitude).from(mgroupAltitudeUnit).to('cm');
-    let mgroupHeight = items[0].properties.get('height').get('_length');
-    let mgroupHeightUnit = items[0].properties.get('height').get('_unit');
-    mgroupHeight = convert(mgroupHeight).from(mgroupHeightUnit).to('cm');
-    let flag = false;
-    switch (moldingGroup.location_type) {
-      case TOP_MOLDING_LOCATION:
-        flag = itemAltitude + itemHeight > mgroupAltitude + mgroupHeight;
-        break;
-      case MIDDLE_MOLDING_LOCATION:
-        flag = true;
-        break;
-      case BOTTOM_MOLDING_LOCATION:
-        flag = itemAltitude < mgroupAltitude;
-        break;
-    }
-    if (
-      item.category !== 'cabinet' ||
-      ![
-        BASE_CABINET_LAYOUTPOS,
-        WALL_CABINET_LAYOUTPOS,
-        TALL_CABINET_LAYOUTPOS
-      ].includes(item.layoutpos)
-    )
-      flag = true;
-    if (flag) {
-      let itemLines = getLinesOfItem(item, allLineRects, catalog);
-      let temp_MGLines = [];
-      MGlines.forEach(mgl => {
-        let idx = itemLines.findIndex(itl => isLinesOverlapped(mgl, itl));
-        const curITL = itemLines[idx];
-        if (idx > -1) {
-          if (
-            getDelta(mgl[0], mgl[1], curITL[1], curITL[0]) < EPSILON ||
-            getDelta(mgl[0], mgl[1], curITL[0], curITL[1]) < EPSILON
-          ) {
-            if (
-              GeometryUtils.verticesDistance(mgl[0], mgl[1]) >
-              GeometryUtils.verticesDistance(curITL[0], curITL[1])
-            ) {
-              let MGLine = mergeOverlappedLines(mgl, curITL);
-              temp_MGLines.push(MGLine);
-            }
-            itemLines.splice(idx, 1);
-          } else {
-            temp_MGLines.push(mgl);
-          }
-        } else {
-          temp_MGLines.push(mgl);
-        }
-      });
-      MGlines = [...temp_MGLines];
-    }
-  });
-  return MGlines;
-}
-
-function getMDPoints(newMD) {
-  if (newMD.lines.length < 1)
-    return {
-      ...newMD,
-      pointGroups: []
-    };
-  // let maxX = newMD.lines[0][0].x,
-  let maxX = newMD.lines[0][0].x,
-    minX = newMD.lines[0][0].x;
-  let maxY = newMD.lines[0][0].y,
-    minY = newMD.lines[0][0].y;
-
-  newMD.lines.forEach(line => {
-    if (line[0].x > maxX) {
-      maxX = line[0].x;
-    }
-    if (line[0].x < minX) {
-      minX = line[0].x;
-    }
-    if (line[1].x > maxX) {
-      maxX = line[1].x;
-    }
-    if (line[1].x < minX) {
-      minX = line[1].x;
-    }
-    if (line[0].y > maxY) {
-      maxY = line[0].y;
-    }
-    if (line[0].y < minY) {
-      minY = line[0].y;
-    }
-    if (line[1].y > maxY) {
-      maxY = line[1].y;
-    }
-    if (line[1].y < minY) {
-      minY = line[1].y;
-    }
-  });
-
-  let cPos = {
-    x: (maxX + minX) / 2,
-    y: (maxY + minY) / 2
-  };
-
-  let newSize = { ...newMD.size, width: maxX - minX, depth: maxY - minY };
-
-  // get vertex points
-  let MDlines = [...newMD.lines];
-  let pointGroups = [[]];
-  let flag = 1;
-  let i = 0;
-  while (MDlines.length !== 0) {
-    if (pointGroups[i].length === 0) {
-      pointGroups[i].push(
-        new Three.Vector2(MDlines[0][0].x - cPos.x, MDlines[0][0].y - cPos.y),
-        new Three.Vector2(MDlines[0][1].x - cPos.x, MDlines[0][1].y - cPos.y)
-      );
-      MDlines.splice(0, 1);
-    } else {
-      if (flag) {
-        let lastPoint = pointGroups[i][pointGroups[i].length - 1];
-        let res = MDlines.findIndex(
-          a =>
-            GeometryUtils.samePoints(
-              { x: a[0].x - cPos.x, y: a[0].y - cPos.y },
-              lastPoint
-            ) ||
-            GeometryUtils.samePoints(
-              { x: a[1].x - cPos.x, y: a[1].y - cPos.y },
-              lastPoint
-            )
-        );
-        if (res > -1) {
-          let newPos = {
-            x: MDlines[res][0].x - cPos.x,
-            y: MDlines[res][0].y - cPos.y
-          };
-          if (GeometryUtils.samePoints(newPos, lastPoint)) {
-            newPos = {
-              x: MDlines[res][1].x - cPos.x,
-              y: MDlines[res][1].y - cPos.y
-            };
-          }
-          pointGroups[i].push(new Three.Vector2(newPos.x, newPos.y));
-          MDlines.splice(res, 1);
-        } else {
-          flag = 0;
-        }
-      } else {
-        let firstPoint = pointGroups[i][0];
-        let res = MDlines.findIndex(
-          a =>
-            GeometryUtils.samePoints(
-              { x: a[0].x - cPos.x, y: a[0].y - cPos.y },
-              firstPoint
-            ) ||
-            GeometryUtils.samePoints(
-              { x: a[1].x - cPos.x, y: a[1].y - cPos.y },
-              firstPoint
-            )
-        );
-        if (res > -1) {
-          let newPos = {
-            x: MDlines[res][0].x - cPos.x,
-            y: MDlines[res][0].y - cPos.y
-          };
-          if (GeometryUtils.samePoints(newPos, firstPoint)) {
-            newPos = {
-              x: MDlines[res][1].x - cPos.x,
-              y: MDlines[res][1].y - cPos.y
-            };
-          }
-          pointGroups[i] = [
-            new Three.Vector2(newPos.x, newPos.y),
-            ...pointGroups[i]
-          ];
-          MDlines.splice(res, 1);
-        } else {
-          flag = 1;
-          i++;
-          if (MDlines.length !== 0) pointGroups.push([]);
-        }
-      }
-    }
-  }
-
-  let z = newMD.items[0].properties.get('altitude').get('_length');
-  let zUnit = newMD.items[0].properties.get('altitude').get('_unit') || 'cm';
-  z = convert(z).from(zUnit).to('cm');
-  let height = newMD.items[0].properties.get('height').get('_length');
-  let heightUnit = newMD.items[0].properties.get('height').get('_unit') || 'cm';
-  height = convert(height).from(heightUnit).to('cm');
-
-  switch (newMD.location_type) {
-    case TOP_MOLDING_LOCATION:
-      z += height;
-      break;
-    case MIDDLE_MOLDING_LOCATION:
-      z += height / 2;
-      break;
-    case BOTTOM_MOLDING_LOCATION:
-      z += 0;
-      break;
-    default:
-      break;
-  }
-
-  return {
-    ...newMD,
-    pointGroups,
-    pos: { ...cPos, z: z },
-    size: newSize
-  };
-}
-
-export function createMonldingGroup(oldMG, layer, molding, catalog) {
-  let newMG = { ...oldMG };
-  newMG.molding = molding;
-  newMG.lines = getLinesFromItems2(oldMG, layer, catalog);
-  newMG.lines.reverse();
-  newMG = getMDPoints(newMG);
-  return newMG;
-}
+import {
+  BASE_CABINET_LAYOUTPOS,
+  BOTTOM_MOLDING_LOCATION,
+  EPSILON,
+  MIDDLE_MOLDING_LOCATION,
+  MOLDING_LOCATIONS,
+  OVERLAP_INCLUDED,
+  OVERLAP_LINK,
+  OVERLAP_SAME,
+  OVERLAP_SOME,
+  TALL_CABINET_LAYOUTPOS,
+  TOP_MOLDING_LOCATION,
+  WALL_CABINET_LAYOUTPOS
+} from '../constants';
+import * as Three from 'three';
+import * as convert from 'convert-units';
+import IDBroker from './id-broker';
+import { returnReplaceableDeepSearchType } from '../components/viewer2d/utils';
+import { GeometryUtils } from './export';
+import { isEmpty } from './helper';
+
+export function getItemRect(item) {
+  let x = item.x;
+  let y = item.y;
+  let rotRad = (item.rotation / 180) * Math.PI;
+  let itemWidth = item.properties.get('width').get('_length');
+  let itemWidthUnit = item.properties.get('width').get('_unit') || 'cm';
+  itemWidth = convert(itemWidth / 2)
+    .from(itemWidthUnit)
+    .to('cm');
+  let itemDepth = item.properties.get('depth').get('_length');
+  let itemDepthUnit = item.properties.get('depth').get('_unit') || 'cm';
+  itemDepth = convert(itemDepth / 2)
+    .from(itemDepthUnit)
+    .to('cm');
+  let mx = x - itemWidth * Math.cos(rotRad);
+  let my = y - itemWidth * Math.sin(rotRad);
+  let x0 = mx + itemDepth * Math.sin(rotRad);
+  let y0 = my - itemDepth * Math.cos(rotRad);
+  let x3 = mx * 2 - x0;
+  let y3 = my * 2 - y0;
+  let x1 = x * 2 - x3;
+  let y1 = y * 2 - y3;
+  let x2 = x * 2 - x0;
+  let y2 = y * 2 - y0;
+  return {
+    rect: [
+      { x: x0, y: y0 },
+      { x: x1, y: y1 },
+      { x: x2, y: y2 },
+      { x: x3, y: y3 }
+    ]
+  };
+}
+
+export function hasMoldingLayout(molding, layoutpos) {
+  const types = molding?.molding_type;
+  return (
+    (Array.isArray(types) || typeof types === 'string') &&
+    types.includes(layoutpos)
+  );
+}
+
+export function isEnableItemForMolding(layer, selItem, molding = null) {
+  let allLineRects = GeometryUtils.buildRectFromLines(
+    layer,
+    GeometryUtils.getAllLines(layer)
+  );
+  let result =
+    !isEmpty(selItem) &&
+    selItem.category === 'cabinet' &&
+    ((selItem.layoutpos === BASE_CABINET_LAYOUTPOS &&
+      !GeometryUtils.isSnappedLine(getItemRect(selItem), allLineRects)) ||
+      ((selItem.layoutpos === WALL_CABINET_LAYOUTPOS ||
+        selItem.layoutpos === TALL_CABINET_LAYOUTPOS) &&
+        GeometryUtils.isSnappedLine(getItemRect(selItem), allLineRects)));
+
+  // check this item is enable for any molding
+  if (isEmpty(molding)) return result;
+  // check this item is enable for specified molding
+  else return result && hasMoldingLayout(molding, selItem.layoutpos);
+}
+
+/**
+ * Check two line segments are overlap. The direction of the two line segments must be opposite.
+ * s1       c2     s2          c1
+ * |--------|------|-----------|
+ * Decision Formular: L(s1,c1) + L(s2, c2) = L(s1, s2) + L(c1, c2)
+ * @param {*} selRectPos1
+ * @param {*} selRectPos2
+ * @param {*} curRectPos1
+ * @param {*} curRectPos2
+ * @returns L(s1,c1) + L(s2, c2) - L(s1, s2) - L(c1, c2)
+ */
+function getDelta(selRectPos1, selRectPos2, curRectPos1, curRectPos2) {
+  return (
+    // GeometryUtils.verticesDistance(curRectPos1, selRectPos2) +
+    // GeometryUtils.verticesDistance(selRectPos1, curRectPos2) -
+    // Math.abs(
+    //   GeometryUtils.verticesDistance(curRectPos2, curRectPos1) -
+    //     GeometryUtils.verticesDistance(selRectPos1, selRectPos2)
+    // )
+    Math.abs(
+      GeometryUtils.verticesDistance(curRectPos1, selRectPos1) +
+        GeometryUtils.verticesDistance(selRectPos2, curRectPos2) -
+        GeometryUtils.verticesDistance(curRectPos2, curRectPos1) -
+        GeometryUtils.verticesDistance(selRectPos1, selRectPos2)
+    )
+  );
+}
+
+export function isItemSnappedItem(selItem, curItem) {
+  const selRect = getItemRect(selItem).rect;
+  const curRect = getItemRect(curItem).rect;
+  const flag30 =
+    getDelta(selRect[3], selRect[0], curRect[1], curRect[2]) < EPSILON;
+  const flag21 =
+    getDelta(selRect[2], selRect[1], curRect[0], curRect[3]) < EPSILON;
+  const flag23 =
+    getDelta(selRect[2], selRect[3], curRect[2], curRect[3]) < EPSILON;
+  const flag01 =
+    getDelta(selRect[1], selRect[0], curRect[0], curRect[3]) < EPSILON;
+  const flag03 =
+    getDelta(selRect[0], selRect[3], curRect[1], curRect[0]) < EPSILON;
+  return flag30 || flag21 || flag23 || flag01 || flag03;
+}
+
+export function isItemSnappedGroup(selItem, itemGroup) {
+  return itemGroup.some(curItem => isItemSnappedItem(selItem, curItem));
+}
+
+export function sortItemsByDistance(items, selItem) {
+  items.sort((a, b) => {
+    return (
+      GeometryUtils.pointsDistance(a.x, a.y, selItem.x, selItem.y) -
+      GeometryUtils.pointsDistance(b.x, b.y, selItem.x, selItem.y)
+    );
+  });
+  return items;
+}
+
+export function isSameMoldingLayoutpos(curItem, item) {
+  return (
+    (curItem.layoutpos === BASE_CABINET_LAYOUTPOS &&
+      curItem.layoutpos === item.layoutpos) ||
+    ([WALL_CABINET_LAYOUTPOS, TALL_CABINET_LAYOUTPOS].includes(
+      curItem.layoutpos
+    ) &&
+      [WALL_CABINET_LAYOUTPOS, TALL_CABINET_LAYOUTPOS].includes(item.layoutpos))
+  );
+}
+
+export function isItemSameItemByLocation(item1, item2, location) {
+  let item1Altitude = item1.properties.get('altitude').get('_length');
+  let item1AltitudeUnit = item1.properties.get('altitude').get('_unit');
+  item1Altitude = convert(item1Altitude).from(item1AltitudeUnit).to('cm');
+  let item1Height = item1.properties.get('height').get('_length');
+  let item1HeightUnit = item1.properties.get('height').get('_unit');
+  item1Height = convert(item1Height).from(item1HeightUnit).to('cm');
+  let item2Altitude = item2.properties.get('altitude').get('_length');
+  let item2AltitudeUnit = item2.properties.get('altitude').get('_unit');
+  item2Altitude = convert(item2Altitude).from(item2AltitudeUnit).to('cm');
+  let item2Height = item2.properties.get('height').get('_length');
+  let item2HeightUnit = item2.properties.get('height').get('_unit');
+  item2Height = convert(item2Height).from(item2HeightUnit).to('cm');
+  let flag = false;
+  switch (location) {
+    case TOP_MOLDING_LOCATION:
+      if (
+        GeometryUtils.sameDistances(
+          item1Altitude + item1Height,
+          item2Altitude + item2Height
+        )
+      )
+        flag = true;
+      break;
+    case MIDDLE_MOLDING_LOCATION:
+      if (
+        GeometryUtils.sameDistances(
+          item1Altitude + item1Height / 2,
+          item2Altitude + item2Height / 2
+        )
+      )
+        flag = true;
+      break;
+    case BOTTOM_MOLDING_LOCATION:
+      if (GeometryUtils.sameDistances(item1Altitude, item2Altitude))
+        flag = true;
+      break;
+  }
+  return flag;
+}
+
+export function tryMergeMDItem(layer, selItem, curItem, itemGroup, molding) {
+  return (
+    isSameMoldingLayoutpos(selItem, curItem) &&
+    isEnableItemForMolding(layer, curItem, molding) &&
+    isItemSnappedGroup(curItem, itemGroup) &&
+    !itemGroup.some(item => item.id === curItem.id) &&
+    isItemSameItemByLocation(selItem, curItem, molding.location_type)
+  );
+}
+
+export function getItemGroupFromMolding(layer, curItem, molding) {
+  const selectedItem = layer.getIn(['items', layer.selected.toJS().items[0]]);
+  let itemGroup = [curItem];
+  let temp_layer_items = layer.items.toArray().filter(item => {
+    return (
+      item.category === 'cabinet' &&
+      item.id !== curItem.id &&
+      item.id !== selectedItem?.id
+    );
+  });
+  temp_layer_items = sortItemsByDistance(temp_layer_items, curItem);
+  for (let idx = 0; idx < temp_layer_items.length; idx++) {
+    if (
+      tryMergeMDItem(layer, curItem, temp_layer_items[idx], itemGroup, molding)
+    ) {
+      itemGroup.push(temp_layer_items[idx]);
+      idx = 0;
+    }
+  }
+  return itemGroup;
+}
+
+function tryMergeItemWithLocation(curItem, itemGroup, location) {
+  return itemGroup.some(item => {
+    return (
+      isItemSnappedItem(curItem, item) &&
+      isItemSameItemByLocation(curItem, item, location)
+    );
+  });
+}
+
+export function getAllMoldingGroups(layer, items = null) {
+  if (items === null) items = layer.items.toArray();
+  let itemGroups = [];
+  items.forEach(curItem => {
+    // let allLineRects = GeometryUtils.buildRectFromLines(
+    //   layer,
+    //   GeometryUtils.getAllLines(layer)
+    // );
+    // if (
+    //   (curItem.category === 'cabinet' &&
+    //     curItem.layoutpos === BASE_CABINET_LAYOUTPOS &&
+    //     !GeometryUtils.isSnappedLine(getItemRect(curItem), allLineRects)) ||
+    //   ((curItem.layoutpos === WALL_CABINET_LAYOUTPOS ||
+    //     curItem.layoutpos === TALL_CABINET_LAYOUTPOS) &&
+    //     GeometryUtils.isSnappedLine(getItemRect(curItem), allLineRects))
+    // ) {
+    if (curItem.category === 'cabinet') {
+      let temp_items = items.filter(it => {
+        return (
+          it.category === 'cabinet' &&
+          isSameMoldingLayoutpos(curItem, it) &&
+          it.id !== curItem.id
+        );
+      });
+      temp_items = sortItemsByDistance(temp_items, curItem);
+      MOLDING_LOCATIONS.forEach(location => {
+        if (
+          !itemGroups.some(
+            ig =>
+              ig.items.some(it => it.id === curItem.id) &&
+              ig.location_type === location
+          )
+        ) {
+          let itemGroup = [curItem];
+          for (let idx = 0; idx < temp_items.length; idx++) {
+            if (
+              tryMergeItemWithLocation(temp_items[idx], itemGroup, location)
+            ) {
+              itemGroup.push(temp_items[idx]);
+            }
+          }
+          itemGroups.push({
+            id: IDBroker.acquireID(),
+            items: itemGroup,
+            location_type: location,
+            molding: null,
+            lines: null,
+            pointGroups: null,
+            meshes: [],
+            rot: 0,
+            pos: 0
+          });
+        }
+      });
+    }
+    // }
+  });
+  return itemGroups;
+}
+
+export function getLinesOfItem(item, allLineRects, catalog) {
+  let lines = [];
+  let outline = null;
+  let element = catalog.elements[item.get('type')];
+  if (!element)
+    element =
+      catalog.elements[returnReplaceableDeepSearchType(item.get('type'))];
+  // get edge lines
+  let newWidth = item.properties.get('width').get('_length');
+  let wUnit = item.properties.get('width').get('_unit') || 'cm';
+  newWidth = convert(newWidth).from(wUnit).to('cm');
+  let newDepth = item.properties.get('depth').get('_length');
+  let hUnit = item.properties.get('depth').get('_unit') || 'cm';
+  newDepth = convert(newDepth).from(hUnit).to('cm');
+  if (item) {
+    // Get Outline Data of Selected Item
+    outline = element.info.outline;
+
+    if (outline) {
+      // Extract Points from `outline`
+      var outlinePaths = outline.paths;
+      var outlineWidth = outline.svgWidth;
+      var outlineHeight = outline.svgHeight;
+      var outlinePoints = []; // Hold Points Of SVG
+      for (let path of outlinePaths) {
+        for (let subPath of path.subPaths) {
+          outlinePoints = outlinePoints.concat(subPath.getPoints());
+        }
+      }
+      outline.reverse && outlinePoints.reverse();
+      for (let i = 0; i < outlinePoints.length - 1; i++) {
+        lines.push([
+          GeometryUtils.rotatePointAroundPoint(
+            (outlinePoints[i].x / outlineWidth - 0.5) * newWidth + item.x,
+            (outlinePoints[i].y / outlineHeight - 0.5) * newDepth + item.y,
+            item.x,
+            item.y,
+            item.rotation + 90
+          ),
+          GeometryUtils.rotatePointAroundPoint(
+            (outlinePoints[i + 1].x / outlineWidth - 0.5) * newWidth + item.x,
+            (outlinePoints[i + 1].y / outlineHeight - 0.5) * newDepth + item.y,
+            item.x,
+            item.y,
+            item.rotation + 90
+          ),
+          IDBroker.acquireID()
+        ]);
+      }
+    } else {
+      let pos = [
+        [-1, -1],
+        [1, -1],
+        [1, 1],
+        [-1, 1]
+      ];
+      for (let i = 0; i < 4; i++) {
+        lines.push([
+          GeometryUtils.rotatePointAroundPoint(
+            (pos[i][0] * newWidth) / 2 + item.x,
+            (pos[i][1] * newDepth) / 2 + item.y,
+            item.x,
+            item.y,
+            item.rotation
+          ),
+          GeometryUtils.rotatePointAroundPoint(
+            (pos[(i + 1) % 4][0] * newWidth) / 2 + item.x,
+            (pos[(i + 1) % 4][1] * newDepth) / 2 + item.y,
+            item.x,
+            item.y,
+            item.rotation
+          ),
+          IDBroker.acquireID()
+        ]);
+      }
+    }
+  }
+  if (item.layoutpos !== BASE_CABINET_LAYOUTPOS) {
+    lines = lines.filter(
+      line =>
+        !GeometryUtils.isSnappedLine(
+          { rect: [{ x: 0, y: 0 }, { x: 0, y: 0 }, line[0], line[1]] },
+          allLineRects
+        )
+    );
+  }
+  return lines;
+}
+
+function isParallelLines(line1, line2) {
+  let isParallel = false;
+  if (
+    Math.abs(line1[0].y - line1[1].y) <= EPSILON &&
+    Math.abs(line2[0].y - line2[1].y) <= EPSILON
+  )
+    isParallel = true;
+  if (
+    Math.abs(line1[0].x - line1[1].x) <= EPSILON &&
+    Math.abs(line2[0].x - line2[1].x) <= EPSILON
+  )
+    isParallel = true;
+  if (
+    Math.abs(
+      (line1[0].x - line1[1].x) / (line1[0].y - line1[1].y) -
+        (line2[0].x - line2[1].x) / (line2[0].y - line2[1].y)
+    ) <= EPSILON
+  )
+    isParallel = true;
+  if (isParallel) {
+    return true;
+  }
+  return false;
+}
+
+export function isLinesOverlapped(line1, line2) {
+  return (
+    isParallelLines(line1, line2) &&
+    line1.some(l1 => line2.some(l2 => GeometryUtils.samePoints(l1, l2)))
+  );
+}
+
+export function mergeOverlappedLines(line1, line2) {
+  let line1_idx = 0,
+    line2_idx = 0;
+  line1.forEach((l1, idx1) => {
+    if (idx1 !== line1.length - 1) {
+      line2.forEach((l2, idx2) => {
+        if (idx2 !== line2.length - 1) {
+          if (GeometryUtils.samePoints(l1, l2)) {
+            line1_idx = idx1;
+            line2_idx = idx2;
+          }
+        }
+      });
+    }
+  });
+  //If line1 's end point and line2 's start point is same, two lines merge into a line with
+  //the line1's start point as the start point and line2's end point as the end point.
+  if (line1_idx === 1) {
+    return [line1[1 - line1_idx], line2[1 - line2_idx], IDBroker.acquireID()];
+  } else {
+    return [line2[1 - line2_idx], line1[1 - line1_idx], IDBroker.acquireID()];
+  }
+}
+
+/**
+ * Get the contour line array of moldingGroup items
+ * @param {*} moldingGroup
+ * @param {*} layer
+ * @param {*} catalog
+ * @returns contour line array of moldingGroup items
+ */
+export function getLinesFromItems2(moldingGroup, layer, catalog) {
+  // wall lines
+  let allLineRects = GeometryUtils.buildRectFromLines(
+    layer,
+    GeometryUtils.getAllLines(layer)
+  );
+  let MGlines = [];
+  let MGlinesOtherSnapped = [];
+
+  let items = [...moldingGroup.items];
+  // The other item's lines (these items are snapped to the moldingGroup items)
+  let itemsOtherSnapped = layer.items.toArray().filter(item => {
+    if (items.some(it => item.id === it.id)) return false;
+    if (isItemSnappedGroup(item, items)) {
+      const itemLines = getLinesOfItem(item, allLineRects, catalog);
+      let itemAltitude = item.properties.get('altitude').get('_length');
+      let itemAltitudeUnit = item.properties.get('altitude').get('_unit');
+      itemAltitude = convert(itemAltitude).from(itemAltitudeUnit).to('cm');
+      let itemHeight = item.properties.get('height').get('_length');
+      let itemHeightUnit = item.properties.get('height').get('_unit');
+      itemHeight = convert(itemHeight).from(itemHeightUnit).to('cm');
+      itemLines.forEach(line => {
+        line.push({ altitude: itemAltitude, height: itemHeight });
+      });
+      MGlinesOtherSnapped = [...MGlinesOtherSnapped, ...itemLines];
+      return true;
+    } else return false;
+  });
+
+  // get all lines of moldingGroup items
+  items.forEach(item => {
+    let itemAltitude = item.properties.get('altitude').get('_length');
+    let itemAltitudeUnit = item.properties.get('altitude').get('_unit');
+    itemAltitude = convert(itemAltitude).from(itemAltitudeUnit).to('cm');
+    let itemHeight = item.properties.get('height').get('_length');
+    let itemHeightUnit = item.properties.get('height').get('_unit');
+    itemHeight = convert(itemHeight).from(itemHeightUnit).to('cm');
+
+    let itemLines = getLinesOfItem(item, allLineRects, catalog);
+
+    // remove the edge that overlapped with other snapped items
+    itemLines = itemLines.filter(itLine => {
+      let ret = true;
+      const srcLine = {
+        x1: itLine[0].x,
+        y1: itLine[0].y,
+        x2: itLine[1].x,
+        y2: itLine[1].y
+      };
+      for (let j = 0; j < MGlinesOtherSnapped.length; j++) {
+        let bCheck = false;
+        switch (moldingGroup.location_type) {
+          case TOP_MOLDING_LOCATION:
+            bCheck =
+              MGlinesOtherSnapped[j][3].altitude +
+                MGlinesOtherSnapped[j][3].height >
+              itemAltitude + itemHeight;
+            break;
+          case MIDDLE_MOLDING_LOCATION:
+            bCheck = true;
+            break;
+          case BOTTOM_MOLDING_LOCATION:
+            bCheck = MGlinesOtherSnapped[j][3].altitude < itemAltitude;
+            break;
+        }
+        if (
+          item.category !== 'cabinet' ||
+          ![
+            BASE_CABINET_LAYOUTPOS,
+            WALL_CABINET_LAYOUTPOS,
+            TALL_CABINET_LAYOUTPOS
+          ].includes(item.layoutpos)
+        )
+          bCheck = true;
+        if (bCheck) {
+          const destLine = {
+            x1: MGlinesOtherSnapped[j][0].x,
+            y1: MGlinesOtherSnapped[j][0].y,
+            x2: MGlinesOtherSnapped[j][1].x,
+            y2: MGlinesOtherSnapped[j][1].y
+          };
+          const rst = GeometryUtils.relationshipOfTwoOverlappedLines(
+            srcLine,
+            destLine
+          );
+          if (rst.result === OVERLAP_SAME || rst.result === OVERLAP_INCLUDED) {
+            ret = false;
+            break;
+          }
+        }
+      }
+      return ret;
+    });
+    MGlines = [...MGlines, ...itemLines];
+  });
+
+  // Filtering overlapped edges and get contour edges
+  let removeLineIds = []; // remove the edge that fully overlapped to other edge
+  let newLines = []; // new countour edge segment that except the overlapped part
+  for (let i = 0; i < MGlines.length; i++) {
+    const srcLine = {
+      x1: MGlines[i][0].x,
+      y1: MGlines[i][0].y,
+      x2: MGlines[i][1].x,
+      y2: MGlines[i][1].y
+    };
+    for (let j = 0; j < MGlines.length; j++) {
+      if (i === j) continue;
+      const destLine = {
+        x1: MGlines[j][0].x,
+        y1: MGlines[j][0].y,
+        x2: MGlines[j][1].x,
+        y2: MGlines[j][1].y
+      };
+      const rst = GeometryUtils.relationshipOfTwoOverlappedLines(
+        srcLine,
+        destLine
+      );
+      if (rst.result === OVERLAP_SAME || rst.result === OVERLAP_INCLUDED) {
+        removeLineIds.push(i);
+        break;
+      } else if (rst.result === OVERLAP_SOME) {
+        removeLineIds.push(i);
+        const lineSegs = getTrimmedContourLineSegs(
+          rst.trimmedSegs,
+          MGlines.filter((v, idx) => idx !== i && idx !== j),
+          0
+        );
+        if (lineSegs.length > 0) newLines = [...newLines, ...lineSegs];
+        break;
+      }
+    }
+  }
+
+  MGlines = MGlines.filter(
+    (line, idx) => !removeLineIds.some(id => idx === id)
+  );
+  if (newLines.length > 0) MGlines = [...MGlines, ...newLines];
+
+  // merge the collinear linked lines to one line
+  let newMGlines = [];
+  let filteredMGlines = MGlines;
+  for (let i = 0; i < MGlines.length; i++) {
+    if (filteredMGlines.length < 1) break;
+    if (!filteredMGlines.some(v => v[2] === MGlines[i][2])) continue;
+    let mergedResult = getMergedLine(MGlines[i], filteredMGlines);
+    newMGlines.push(mergedResult.mergedLine);
+    filteredMGlines = mergedResult.filteredMGlines;
+  }
+
+  return newMGlines;
+}
+
+/**
+ * Get the line that colinear linked with [line], and merge them to a new line
+ * @param {*} line
+ * @param {*} MGlines
+ * @returns
+ *  - returns merged new line
+ *  - returns filtered new line group (remove linked line from [MGlines])
+ */
+function getMergedLine(line, MGlines) {
+  let newMGlines = MGlines.filter(v => line[2] !== v[2]);
+  let mergeResult = {
+    mergedLine: line,
+    filteredMGlines: newMGlines
+  };
+  const srcLine = {
+    x1: line[0].x,
+    y1: line[0].y,
+    x2: line[1].x,
+    y2: line[1].y
+  };
+  for (let i = 0; i < newMGlines.length; i++) {
+    const destLine = {
+      x1: newMGlines[i][0].x,
+      y1: newMGlines[i][0].y,
+      x2: newMGlines[i][1].x,
+      y2: newMGlines[i][1].y
+    };
+    const rst = GeometryUtils.relationshipOfTwoOverlappedLines(
+      srcLine,
+      destLine
+    );
+    if (rst.result === OVERLAP_LINK) {
+      let mergedLine = [
+        { x: rst.linkedLine.x1, y: rst.linkedLine.y1 },
+        { x: rst.linkedLine.x2, y: rst.linkedLine.y2 },
+        IDBroker.acquireID()
+      ];
+      mergeResult = getMergedLine(
+        mergedLine,
+        newMGlines.filter((v, idx) => idx !== i)
+      );
+    }
+  }
+  return mergeResult;
+}
+
+/**
+ * Get the contour line segments from [lineSegs]
+ * @param {*} lineSegs
+ * @param {*} otherLines
+ * @returns
+ */
+function getTrimmedContourLineSegs(lineSegs, otherLines, cnt) {
+  try {
+    cnt++;
+    if (cnt > 5000) return [];
+    let returnSegs = [];
+    for (let i = 0; i < lineSegs.length; i++) {
+      const srcLine = {
+        x1: lineSegs[i].x1,
+        y1: lineSegs[i].y1,
+        x2: lineSegs[i].x2,
+        y2: lineSegs[i].y2
+      };
+      let bContourSeg = true;
+      for (let j = 0; j < otherLines.length; j++) {
+        const destLine = {
+          x1: otherLines[j][0].x,
+          y1: otherLines[j][0].y,
+          x2: otherLines[j][1].x,
+          y2: otherLines[j][1].y
+        };
+        const rst = GeometryUtils.relationshipOfTwoOverlappedLines(
+          srcLine,
+          destLine
+        );
+        if (rst.result == OVERLAP_SAME || rst.result == OVERLAP_INCLUDED) {
+          bContourSeg = false;
+          break;
+        } else if (rst.result == OVERLAP_SOME) {
+          const tLineSegs = getTrimmedContourLineSegs(
+            rst.trimmedSegs,
+            otherLines.filter((v, idx) => idx !== j),
+            cnt
+          );
+          if (tLineSegs.length > 0) returnSegs = [...returnSegs, ...tLineSegs];
+          bContourSeg = false;
+          break;
+        }
+      }
+      if (bContourSeg)
+        returnSegs.push([
+          { x: lineSegs[i].x1, y: lineSegs[i].y1 },
+          { x: lineSegs[i].x2, y: lineSegs[i].y2 },
+          IDBroker.acquireID()
+        ]);
+    }
+    return returnSegs;
+  } catch (e) {
+    console.log('molding catched :', e);
+    return [];
+  }
+}
+
+export function getLinesFromItems(moldingGroup, layer, catalog) {
+  let allLineRects = GeometryUtils.buildRectFromLines(
+    layer,
+    GeometryUtils.getAllLines(layer)
+  );
+  let items = [...moldingGroup.items];
+  let MGlines = getLinesOfItem(items[0], allLineRects, catalog);
+  items = sortItemsByDistance(items, items[0]);
+  for (let i = 1; i < items.length; i++) {
+    let itemLines = getLinesOfItem(items[i], allLineRects, catalog);
+    let temp_MGLines = [];
+    MGlines.forEach(line => {
+      let idx = itemLines.findIndex(itemLine =>
+        isLinesOverlapped(line, itemLine)
+      );
+      const curItemLine = itemLines[idx];
+      if (idx > -1) {
+        if (
+          !(
+            (GeometryUtils.samePoints(line[0], curItemLine[0]) &&
+              GeometryUtils.samePoints(line[1], curItemLine[1])) ||
+            (GeometryUtils.samePoints(line[0], curItemLine[1]) &&
+              GeometryUtils.samePoints(line[1], curItemLine[0]))
+          )
+        ) {
+          let MGLine = mergeOverlappedLines(line, curItemLine);
+          temp_MGLines.push(MGLine);
+        }
+        itemLines.splice(idx, 1);
+      } else {
+        temp_MGLines.push(line);
+      }
+    });
+    itemLines.forEach(itemLine => temp_MGLines.push(itemLine));
+    MGlines = [...temp_MGLines];
+  }
+  // return MGlines;
+  let snapped_other_items = layer.items.toArray().filter(item => {
+    if (items.some(it => item.id === it.id)) return false;
+    return isItemSnappedGroup(item, items);
+  });
+  snapped_other_items.forEach(item => {
+    let itemAltitude = item.properties.get('altitude').get('_length');
+    let itemAltitudeUnit = item.properties.get('altitude').get('_unit');
+    itemAltitude = convert(itemAltitude).from(itemAltitudeUnit).to('cm');
+    let itemHeight = item.properties.get('height').get('_length');
+    let itemHeightUnit = item.properties.get('height').get('_unit');
+    itemHeight = convert(itemHeight).from(itemHeightUnit).to('cm');
+    let mgroupAltitude = items[0].properties.get('altitude').get('_length');
+    let mgroupAltitudeUnit = items[0].properties.get('altitude').get('_unit');
+    mgroupAltitude = convert(mgroupAltitude).from(mgroupAltitudeUnit).to('cm');
+    let mgroupHeight = items[0].properties.get('height').get('_length');
+    let mgroupHeightUnit = items[0].properties.get('height').get('_unit');
+    mgroupHeight = convert(mgroupHeight).from(mgroupHeightUnit).to('cm');
+    let flag = false;
+    switch (moldingGroup.location_type) {
+      case TOP_MOLDING_LOCATION:
+        flag = itemAltitude + itemHeight > mgroupAltitude + mgroupHeight;
+        break;
+      case MIDDLE_MOLDING_LOCATION:
+        flag = true;
+        break;
+      case BOTTOM_MOLDING_LOCATION:
+        flag = itemAltitude < mgroupAltitude;
+        break;
+    }
+    if (
+      item.category !== 'cabinet' ||
+      ![
+        BASE_CABINET_LAYOUTPOS,
+        WALL_CABINET_LAYOUTPOS,
+        TALL_CABINET_LAYOUTPOS
+      ].includes(item.layoutpos)
+    )
+      flag = true;
+    if (flag) {
+      let itemLines = getLinesOfItem(item, allLineRects, catalog);
+      let temp_MGLines = [];
+      MGlines.forEach(mgl => {
+        let idx = itemLines.findIndex(itl => isLinesOverlapped(mgl, itl));
+        const curITL = itemLines[idx];
+        if (idx > -1) {
+          if (
+            getDelta(mgl[0], mgl[1], curITL[1], curITL[0]) < EPSILON ||
+            getDelta(mgl[0], mgl[1], curITL[0], curITL[1]) < EPSILON
+          ) {
+            if (
+              GeometryUtils.verticesDistance(mgl[0], mgl[1]) >
+              GeometryUtils.verticesDistance(curITL[0], curITL[1])
+            ) {
+              let MGLine = mergeOverlappedLines(mgl, curITL);
+              temp_MGLines.push(MGLine);
+            }
+            itemLines.splice(idx, 1);
+          } else {
+            temp_MGLines.push(mgl);
+          }
+        } else {
+          temp_MGLines.push(mgl);
+        }
+      });
+      MGlines = [...temp_MGLines];
+    }
+  });
+  return MGlines;
+}
+
+function getMDPoints(newMD) {
+  if (newMD.lines.length < 1)
+    return {
+      ...newMD,
+      pointGroups: []
+    };
+  // let maxX = newMD.lines[0][0].x,
+  let maxX = newMD.lines[0][0].x,
+    minX = newMD.lines[0][0].x;
+  let maxY = newMD.lines[0][0].y,
+    minY = newMD.lines[0][0].y;
+
+  newMD.lines.forEach(line => {
+    if (line[0].x > maxX) {
+      maxX = line[0].x;
+    }
+    if (line[0].x < minX) {
+      minX = line[0].x;
+    }
+    if (line[1].x > maxX) {
+      maxX = line[1].x;
+    }
+    if (line[1].x < minX) {
+      minX = line[1].x;
+    }
+    if (line[0].y > maxY) {
+      maxY = line[0].y;
+    }
+    if (line[0].y < minY) {
+      minY = line[0].y;
+    }
+    if (line[1].y > maxY) {
+      maxY = line[1].y;
+    }
+    if (line[1].y < minY) {
+      minY = line[1].y;
+    }
+  });
+
+  let cPos = {
+    x: (maxX + minX) / 2,
+    y: (maxY + minY) / 2
+  };
+
+  let newSize = { ...newMD.size, width: maxX - minX, depth: maxY - minY };
+
+  // get vertex points
+  let MDlines = [...newMD.lines];
+  let pointGroups = [[]];
+  let flag = 1;
+  let i = 0;
+  while (MDlines.length !== 0) {
+    if (pointGroups[i].length === 0) {
+      pointGroups[i].push(
+        new Three.Vector2(MDlines[0][0].x - cPos.x, MDlines[0][0].y - cPos.y),
+        new Three.Vector2(MDlines[0][1].x - cPos.x, MDlines[0][1].y - cPos.y)
+      );
+      MDlines.splice(0, 1);
+    } else {
+      if (flag) {
+        let lastPoint = pointGroups[i][pointGroups[i].length - 1];
+        let res = MDlines.findIndex(
+          a =>
+            GeometryUtils.samePoints(
+              { x: a[0].x - cPos.x, y: a[0].y - cPos.y },
+              lastPoint
+            ) ||
+            GeometryUtils.samePoints(
+              { x: a[1].x - cPos.x, y: a[1].y - cPos.y },
+              lastPoint
+            )
+        );
+        if (res > -1) {
+          let newPos = {
+            x: MDlines[res][0].x - cPos.x,
+            y: MDlines[res][0].y - cPos.y
+          };
+          if (GeometryUtils.samePoints(newPos, lastPoint)) {
+            newPos = {
+              x: MDlines[res][1].x - cPos.x,
+              y: MDlines[res][1].y - cPos.y
+            };
+          }
+          pointGroups[i].push(new Three.Vector2(newPos.x, newPos.y));
+          MDlines.splice(res, 1);
+        } else {
+          flag = 0;
+        }
+      } else {
+        let firstPoint = pointGroups[i][0];
+        let res = MDlines.findIndex(
+          a =>
+            GeometryUtils.samePoints(
+              { x: a[0].x - cPos.x, y: a[0].y - cPos.y },
+              firstPoint
+            ) ||
+            GeometryUtils.samePoints(
+              { x: a[1].x - cPos.x, y: a[1].y - cPos.y },
+              firstPoint
+            )
+        );
+        if (res > -1) {
+          let newPos = {
+            x: MDlines[res][0].x - cPos.x,
+            y: MDlines[res][0].y - cPos.y
+          };
+          if (GeometryUtils.samePoints(newPos, firstPoint)) {
+            newPos = {
+              x: MDlines[res][1].x - cPos.x,
+              y: MDlines[res][1].y - cPos.y
+            };
+          }
+          pointGroups[i] = [
+            new Three.Vector2(newPos.x, newPos.y),
+            ...pointGroups[i]
+          ];
+          MDlines.splice(res, 1);
+        } else {
+          flag = 1;
+          i++;
+          if (MDlines.length !== 0) pointGroups.push([]);
+        }
+      }
+    }
+  }
+
+  let z = newMD.items[0].properties.get('altitude').get('_length');
+  let zUnit = newMD.items[0].properties.get('altitude').get('_unit') || 'cm';
+  z = convert(z).from(zUnit).to('cm');
+  let height = newMD.items[0].properties.get('height').get('_length');
+  let heightUnit = newMD.items[0].properties.get('height').get('_unit') || 'cm';
+  height = convert(height).from(heightUnit).to('cm');
+
+  switch (newMD.location_type) {
+    case TOP_MOLDING_LOCATION:
+      z += height;
+      break;
+    case MIDDLE_MOLDING_LOCATION:
+      z += height / 2;
+      break;
+    case BOTTOM_MOLDING_LOCATION:
+      z += 0;
+      break;
+    default:
+      break;
+  }
+
+  return {
+    ...newMD,
+    pointGroups,
+    pos: { ...cPos, z: z },
+    size: newSize
+  };
+}
+
+export function createMonldingGroup(oldMG, layer, molding, catalog) {
+  let newMG = { ...oldMG };
+  newMG.molding = molding;
+  newMG.lines = getLinesFromItems2(oldMG, layer, catalog);
+  newMG.lines.reverse();
+  newMG = getMDPoints(newMG);
+  return newMG;
+}