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

package/es/catalog/factories/wall-factory-3d.js

@@ -1,202 +0,0 @@
-import * as Three from 'three';
-import { BoxGeometry, Group, Mesh, MeshBasicMaterial, MeshStandardMaterial, RepeatWrapping, TextureLoader, Vector2 } from 'three';
-import { verticesDistance } from "../../utils/geometry";
-import { isElevationView } from "../../utils/helper";
-import * as SharedStyle from "../../shared-style";
-import { LINE_THICKNESS, UNIT_CENTIMETER } from "../../constants";
-import convert from 'convert-units';
-import ThreeBSP from "../../utils/threeCSG.es6";
-var params = {
-  envMap: 'HDR',
-  roughness: 0.1,
-  metalness: 0.1,
-  exposure: 0.1
-  // debug: false
-};
-var halfPI = Math.PI / 2;
-
-/**
- * Apply a texture to a wall face
- * @param material: The material of the face
- * @param texture: The texture to load
- * @param length: The lenght of the face
- * @param height: The height of the face
- */
-var applyTexture = function applyTexture(material, texture, length, height) {
-  var loader = new TextureLoader();
-  if (texture) {
-    material.map = loader.load(texture.uri["default"]);
-    material.map.colorSpace = Three.SRGBColorSpace, material.needsUpdate = true;
-    material.map.wrapS = RepeatWrapping;
-    material.map.wrapT = RepeatWrapping;
-    material.map.repeat.set(length * texture.lengthRepeatScale, height * texture.heightRepeatScale);
-    if (texture.normal) {
-      material.normalMap = loader.load(texture.normal.uri["default"]);
-      material.normalScale = new Vector2(texture.normal.normalScaleX, texture.normal.normalScaleY);
-      material.normalMap.wrapS = RepeatWrapping;
-      material.normalMap.wrapT = RepeatWrapping;
-      material.normalMap.repeat.set(length * texture.normal.lengthRepeatScale, height * texture.normal.heightRepeatScale);
-    }
-  }
-};
-export function buildWall(element, layer, scene, textures, mode) {
-  // Get the two vertices of the wall
-  var vetName0 = element.vertices.get(0);
-  var vetName1 = element.vertices.get(1);
-  // let invert = element.toJS().invert;
-
-  // As long as its two ending points is same. This is no longer a line.
-  if (vetName0 === vetName1) {
-    return Promise.resolve(null);
-  }
-  var wallColor;
-  layer.lines.forEach(function (data) {
-    wallColor = data.wallColor;
-  });
-  var vertex0 = layer.vertices.get(vetName0);
-  var vertex1 = layer.vertices.get(vetName1);
-
-  // Get height and thickness of the wall converting them into the current scene units
-  // let height = element.properties.getIn(['height', 'length']);
-  // let thickness = element.properties.getIn(['thickness', 'length']);
-  var height = convert(layer.ceilHeight).from(layer.unit).to(UNIT_CENTIMETER);
-  var thickness = 2.0;
-  var distance = verticesDistance(vertex0, vertex1);
-  var soulMaterial = new Three.MeshPhongMaterial({
-    color: new Three.Color(wallColor).convertLinearToSRGB()
-  }); //element.selected ? SharedStyle.MESH_SELECTED : 0xD3D3D3
-  var soulVertices = [];
-  soulVertices.push(new Three.Vector2(-distance / 2, height / 2));
-  soulVertices.push(new Three.Vector2(distance / 2, height / 2));
-  soulVertices.push(new Three.Vector2(distance / 2, -height / 2));
-  soulVertices.push(new Three.Vector2(-distance / 2, -height / 2));
-  var soulShape = new Three.Shape(soulVertices);
-  var soulMesh = new Mesh(new BoxGeometry(distance, height, thickness), soulMaterial);
-  if (element.userData.stateMode !== 'MODE_DRAWING_HOLE_3D') {
-    element.holes.forEach(function (holeID) {
-      var holeData = layer.holes.get(holeID);
-      if (holeData !== undefined) {
-        var holeWidth = holeData.properties.getIn(['width', 'length']);
-        var holeHeight = holeData.properties.getIn(['height', 'length']);
-        var holeAltitude = holeData.properties.getIn(['altitude', 'length']);
-        var offset = holeData.offset;
-        // if (vertex0.x > vertex1.x) offset = 1 - offset;
-        // if (invert) offset = 1 - offset;
-        var holeDistance = offset * distance;
-        var holeVertices = [];
-        holeVertices.push(new Three.Vector2(0, holeHeight));
-        holeVertices.push(new Three.Vector2(holeWidth, holeHeight));
-        holeVertices.push(new Three.Vector2(holeWidth, 0));
-        holeVertices.push(new Three.Vector2(0, 0));
-        for (var i = 0; i < holeVertices.length; i++) {
-          holeVertices[i].x += holeDistance - distance / 2 - holeWidth / 2;
-          holeVertices[i].y -= height / 2 - holeAltitude;
-        }
-        var shapeHole = new Three.Shape(holeVertices);
-        soulShape.holes.push(shapeHole);
-        var holeGeometry = new BoxGeometry(holeWidth, holeHeight, thickness);
-        var holeMesh = new Mesh(holeGeometry);
-        holeMesh.position.x += holeWidth / 2;
-        holeMesh.position.y += holeHeight / 2;
-        holeMesh.position.x += holeDistance - distance / 2 - holeWidth / 2;
-        holeMesh.position.y -= height / 2 - holeAltitude;
-        var wallBSP = new ThreeBSP(soulMesh);
-        var holeBSP = new ThreeBSP(holeMesh);
-        var wallWithHoleBSP = wallBSP.subtract(holeBSP);
-        soulMesh = wallWithHoleBSP.toMesh(soulMaterial);
-      }
-    });
-  }
-  var cAlpha = new Three.Vector2(vertex0.x - vertex1.x, vertex0.y - vertex1.y).angle();
-  var soulGeometry = new Three.ShapeGeometry(soulShape);
-  var soul = new Mesh(soulGeometry, soulMaterial);
-  soul.receiveShadow = true;
-  soul.castShadow = true;
-  soul.position.y += height / 2;
-  soul.rotation.y = cAlpha + Math.PI;
-  soul.name = 'soulFace';
-  soulMesh.position.y += height / 2;
-  soulMesh.rotation.y = cAlpha + Math.PI;
-  soulMesh.name = 'soul';
-  soulMesh.castShadow = true;
-  var frontMaterial = new MeshStandardMaterial({
-    color: new Three.Color(wallColor).convertLinearToSRGB(),
-    metalness: 0.1,
-    roughness: 0.9
-    // envMap: textureCube,
-  });
-  var backMaterial = new MeshStandardMaterial({
-    color: new Three.Color(wallColor).convertLinearToSRGB(),
-    metalness: 0.1,
-    roughness: 0.9
-    // envMap: textureCube,
-  });
-  applyTexture(frontMaterial, textures[element.properties.get('textureB')], distance, height);
-  applyTexture(backMaterial, textures[element.properties.get('textureB')], distance, height);
-  var frontFace = soul.clone();
-  frontFace.material = frontMaterial;
-  frontFace.name = 'frontFace';
-  soulMesh.material = frontMaterial;
-  var merged = new Group();
-  merged.add(frontFace, soulMesh);
-
-  // if this wall is front of camera, show/hide
-  if (!isElevationView(mode)) {
-    frontFace.onBeforeRender = function (renderer, scene, camera, geometry, material, group) {
-      var soulMesh = this.parent.getObjectByName('soul');
-      if (geometry.attributes.normal === undefined) return soulMesh.visible = false;
-      geometry.computeVertexNormals();
-      var normals = geometry.attributes.normal.array;
-      var pos = new Three.Vector4(0, 0, 0, 1);
-      pos = pos.applyMatrix4(this.matrixWorld);
-      pos = pos.applyMatrix4(camera.matrixWorldInverse);
-      var normal = new Three.Vector4(normals[0], normals[1], normals[2], 0);
-      normal = normal.applyMatrix4(this.matrixWorld);
-      normal = normal.applyMatrix4(camera.matrixWorldInverse);
-      if (soulMesh) {
-        if (pos.dot(normal) >= 0) soulMesh.visible = false;else soulMesh.visible = true;
-      }
-    };
-  }
-  return Promise.resolve(merged);
-}
-export function updatedWall(element, layer, scene, textures, mesh, oldElement, differences, selfDestroy, selfBuild) {
-  var noPerf = function noPerf() {
-    selfDestroy();
-    return selfBuild();
-  };
-  var soul = mesh.getObjectByName('soul');
-  var frontFace = mesh.getObjectByName('frontFace');
-  var backFace = mesh.getObjectByName('backFace');
-  if (differences[0] == 'selected') {
-    if (soul !== undefined) {
-      if (element.selected) {
-        soul.material = new MeshBasicMaterial({
-          color: new Three.Color(SharedStyle.MESH_SELECTED).convertLinearToSRGB()
-        });
-      } else {
-        var soulMaterial = frontFace ? frontFace.material : backFace.material;
-        soul.material = soulMaterial;
-      }
-    }
-  } else if (differences[0] == 'properties') {
-    if (differences[1] == 'thickness') {
-      var newThickness = LINE_THICKNESS / 2;
-      var oldThickness = LINE_THICKNESS / 2;
-      // let newThickness = element.getIn(['properties', 'thickness', 'length']);
-      // let oldThickness = oldElement.getIn(['properties', 'thickness', 'length']);
-      var halfNewThickness = newThickness / 2;
-      var texturedFaceDistance = halfNewThickness + 1;
-      var originalThickness = oldThickness / soul.scale.z;
-      var alpha = soul.rotation.y;
-      var xTemp = texturedFaceDistance * Math.cos(alpha - halfPI);
-      var zTemp = texturedFaceDistance * Math.sin(alpha - halfPI);
-      soul.scale.set(1, 1, newThickness / originalThickness);
-      frontFace.position.x = soul.position.x + xTemp;
-      frontFace.position.z = soul.position.z + zTemp;
-      backFace.position.x = soul.position.x - xTemp;
-      backFace.position.z = soul.position.z - zTemp;
-    } else return noPerf();
-  } else return noPerf();
-  return Promise.resolve(mesh);
-}

package/es/catalog/factories/wall-factory.js

@@ -1,268 +0,0 @@
-import React from 'react';
-import { buildWall, updatedWall } from "./wall-factory-3d";
-import * as SharedStyle from "../../shared-style";
-import * as Geometry from "../../utils/geometry";
-import Translator from "../../translator/translator";
-import { LINE_THICKNESS } from "../../constants";
-// import Line from 'src/class/line';
-import Line from "../../class/line";
-var epsilon = 20;
-var STYLE_TEXT = {
-  textAnchor: 'middle'
-};
-var STYLE_LINE = {
-  stroke: SharedStyle.LINE_MESH_COLOR.unselected
-  // stroke: "red" ,
-
-  // strokeWidth:1
-};
-var STYLE_INTERIOR_LINE = {
-  strokeWidth: 1,
-  stroke: SharedStyle.INTERIOR_LINE.unselected
-};
-var STYLE_INTERIOR_LINE_SELECTED = {
-  strokeWidth: 2,
-  stroke: SharedStyle.INTERIOR_LINE.selected,
-  fill: SharedStyle.INTERIOR_LINE.selected,
-  rx: '2px'
-};
-var STYLE = {
-  fill: '#0096fd',
-  stroke: SharedStyle.COLORS.white,
-  cursor: 'move'
-};
-var STYLE_POLYGON = {
-  strokeWidth: 1,
-  strokeLinejoin: 'round',
-  stroke: SharedStyle.LINE_MESH_COLOR.unselected,
-  rx: '2px',
-  fill: SharedStyle.LINE_MESH_COLOR.unselected
-};
-var STYLE_POLYGON_SELECTED = {
-  strokeWidth: 1,
-  strokeLinejoin: 'round',
-  rx: '2px',
-  stroke: SharedStyle.LINE_MESH_COLOR.selected,
-  fill: SharedStyle.LINE_MESH_COLOR.selected
-};
-var translator = new Translator();
-
-/** Create Lines from State */
-var createLineGeometry = function createLineGeometry(scene, state) {
-  var wall_thickness = LINE_THICKNESS / 2;
-  var layerID = scene.selectedLayer;
-  var layer = scene.getIn(['layers', layerID]);
-  var lines = layer.lines;
-  lines.toArray().forEach(function (line) {
-    var vertex0Id = line.vertices.get(0);
-    var vertex1Id = line.vertices.get(1);
-    var _layer$vertices$get = layer.vertices.get(vertex0Id),
-      x0 = _layer$vertices$get.x,
-      y0 = _layer$vertices$get.y;
-    var _layer$vertices$get2 = layer.vertices.get(vertex1Id),
-      x1 = _layer$vertices$get2.x,
-      y1 = _layer$vertices$get2.y;
-    if (x0 == x1 && y0 == y1) return;
-    var allLines = layer.lines.toArray();
-    var relatedLineArray = [];
-    var relatedLine0 = allLines.filter(function (allLine) {
-      return allLine.vertices.toArray().includes(vertex0Id) && line.id != allLine.id;
-    })[0];
-    var relatedLine1 = allLines.filter(function (allLine) {
-      return allLine.vertices.toArray().includes(vertex1Id) && line.id != allLine.id;
-    })[0];
-    var normalVertice = Geometry.getNormaline(x0, y0, x1, y1);
-    var rx0 = x0 + normalVertice.x * wall_thickness;
-    var ry0 = y0 + normalVertice.y * wall_thickness;
-    var rx1 = x1 + normalVertice.x * wall_thickness;
-    var ry1 = y1 + normalVertice.y * wall_thickness;
-    var intersection = [];
-    relatedLine0 ? relatedLineArray.push({
-      index: 0,
-      line: relatedLine0
-    }) : intersection.push({
-      index: 0,
-      point: {
-        x: rx0,
-        y: ry0
-      }
-    });
-    relatedLine1 ? relatedLineArray.push({
-      index: 1,
-      line: relatedLine1
-    }) : intersection.push({
-      index: 1,
-      point: {
-        x: rx1,
-        y: ry1
-      }
-    });
-    var originalLineFunction = Geometry.linePassingThroughTwoPoints(x0, y0, x1, y1);
-    originalLineFunction.c -= Math.sqrt(originalLineFunction.b * originalLineFunction.b + originalLineFunction.a * originalLineFunction.a) * wall_thickness;
-    relatedLineArray.forEach(function (lineInfo) {
-      var vertexId, originx, originy;
-      var index = lineInfo.index,
-        relatedLine = lineInfo.line;
-      index == 0 ? (vertexId = vertex0Id, originx = x0, originy = y0) : (vertexId = vertex1Id, originx = x1, originy = y1);
-      var relatedVertices = relatedLine.vertices.toArray();
-      var relatedOtherVertexID = relatedVertices[0] == vertexId ? relatedVertices[1] : relatedVertices[0];
-      var relatedVertex = layer.getIn(['vertices', relatedOtherVertexID]);
-      if (originx == relatedVertex.x && originy == relatedVertex.y) return;
-      var relatedLineFunction = Geometry.linePassingThroughTwoPoints(originx, originy, relatedVertex.x, relatedVertex.y);
-      var delta = Geometry.distancePointFromLine(relatedLineFunction.a, relatedLineFunction.b, relatedLineFunction.c, index == 0 ? x1 : x0, index == 0 ? y1 : y0);
-      // console.log(relatedLineFunction,"relatedLinefunction")
-      if (delta < 0.01) {
-        // if the directions of the current line and related line, then no need to calculate the inteersection point
-        // let rx = originx + normalVertice.x * wall_thickness;
-        // let ry = originy + normalVertice.y * wall_thickness;
-        var rx = originx + normalVertice.x * wall_thickness;
-        var ry = originy + normalVertice.y * wall_thickness;
-        intersection.push({
-          index: index,
-          point: {
-            x: rx,
-            y: ry
-          }
-        });
-      } else {
-        relatedLineFunction.c -= (relatedVertices[0] == vertexId ? 1 : -1) * Math.sqrt(relatedLineFunction.b * relatedLineFunction.b + relatedLineFunction.a * relatedLineFunction.a) * wall_thickness;
-        var point = Geometry.twoLinesIntersection(originalLineFunction.a, originalLineFunction.b, originalLineFunction.c, relatedLineFunction.a, relatedLineFunction.b, relatedLineFunction.c);
-        point && intersection.push({
-          index: index,
-          point: point
-        });
-      }
-    });
-    state = Line.setRelatedLine(state, layer.id, line.id, intersection).updatedState;
-  });
-  return {
-    updatedState: state
-  };
-};
-export default function WallFactory(name, info, textures) {
-  var wallElement = {
-    name: name,
-    prototype: 'lines',
-    info: info,
-    height: {
-      label: translator.t('height'),
-      type: 'length-measure',
-      defaultValue: {
-        length: 243.84
-      }
-    },
-    thickness: {
-      label: translator.t('thickness'),
-      type: 'length-measure',
-      defaultValue: {
-        length: LINE_THICKNESS / 2
-      }
-    },
-    properties: {},
-    render2D: function render2D(element, layer, scene, state) {
-      state = createLineGeometry(scene, state).updatedState;
-      scene = state.getIn(['scene']);
-      layer = scene.getIn(['layers', scene.selectedLayer]);
-      element = layer.getIn(['lines', element['id']]);
-      // let element = layer.lines[telement.id];
-      var _layer$vertices$get3 = layer.vertices.get(element.vertices.get(0)),
-        x1 = _layer$vertices$get3.x,
-        y1 = _layer$vertices$get3.y;
-      var _layer$vertices$get4 = layer.vertices.get(element.vertices.get(1)),
-        x2 = _layer$vertices$get4.x,
-        y2 = _layer$vertices$get4.y;
-      var layertemp = state.sceneHistory.getIn(['last', 'layers', 'layer-1']);
-      var verticesinfo = layer.vertices.get(element.vertices.get(0));
-      var length = Geometry.pointsDistance(x1, y1, x2, y2);
-      var length_5 = length / 5;
-      var thickness = LINE_THICKNESS;
-      // let thickness = element.getIn(['properties', 'thickness', 'length']);
-      var half_thickness = thickness / 2;
-      var half_thickness_eps = half_thickness + epsilon;
-      var char_height = 11;
-      var extra_epsilon = 5;
-      var textDistance = half_thickness + epsilon + extra_epsilon;
-      var related0x = x1,
-        related0y = y1,
-        related1x = x2,
-        related1y = y2;
-      element.relatedVertices.forEach(function (relatedVertice, index) {
-        if (relatedVertice.index == undefined) relatedVertice = relatedVertice.toJSON();
-        if (relatedVertice.index == 0) {
-          related0x = relatedVertice.point.x;
-          related0y = relatedVertice.point.y;
-        } else {
-          related1x = relatedVertice.point.x;
-          related1y = relatedVertice.point.y;
-        }
-      });
-
-      //Fill a polygon with the pattern specified by the polygon's id.(For example:fill='url(#pat) =><pattern id="pat">)
-      var outwall = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("pattern", {
-        id: "pat",
-        x: "0",
-        y: "0",
-        width: "5",
-        height: "5",
-        patternUnits: "userSpaceOnUse"
-      }, /*#__PURE__*/React.createElement("line", {
-        x1: "0",
-        y1: "0",
-        x2: "3",
-        y2: "3",
-        style: STYLE_LINE
-      })));
-      return !element.selected ? /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("polygon", {
-        points: "".concat(x1, ",").concat(y1, " ").concat(related0x, ",").concat(related0y, " ").concat(related1x, ",").concat(related1y, " ").concat(x2, ",").concat(y2),
-        fill: "url(#pat)",
-        fillRule: "evenodd"
-      }), outwall, /*#__PURE__*/React.createElement("line", {
-        x1: x1,
-        y1: y1,
-        x2: x2,
-        y2: y2,
-        style: STYLE_INTERIOR_LINE
-      })) : /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("polygon", {
-        points: "".concat(x1, ",").concat(y1, " ").concat(related0x, ",").concat(related0y, " ").concat(related1x, ",").concat(related1y, " ").concat(x2, ",").concat(y2),
-        fill: "url(#pat)",
-        fillRule: "evenodd"
-      }), outwall, /*#__PURE__*/React.createElement("line", {
-        x1: x1,
-        y1: y1,
-        x2: x2,
-        y2: y2,
-        style: STYLE_INTERIOR_LINE_SELECTED
-      }));
-    },
-    render3D: function render3D(element, layer, scene, mode) {
-      return buildWall(element, layer, scene, textures, mode);
-    },
-    updateRender3D: function updateRender3D(element, layer, scene, mesh, oldElement, differences, selfDestroy, selfBuild) {
-      return updatedWall(element, layer, scene, textures, mesh, oldElement, differences, selfDestroy, selfBuild);
-    }
-  };
-  if (textures && textures !== {}) {
-    var textureValues = {
-      none: 'None'
-    };
-    for (var textureName in textures) {
-      textureValues[textureName] = textures[textureName].name;
-    }
-
-    /*    wallElement.properties.textureA = {
-      label:'Fronts ' + translator.t('texture'),
-      type: 'enum',
-      defaultValue: textureValues.bricks ? 'bricks' : 'none',
-      values: textureValues
-    };
-    */
-    wallElement.properties.textureB = {
-      //label:'Back ' + translator.t('texture'),
-      label: 'Walls',
-      type: 'enum',
-      defaultValue: textureValues.bricks ? 'bricks' : 'none',
-      values: textureValues
-    };
-  }
-  return wallElement;
-}

package/es/catalog/holes/door-closet/planner-element.js

@@ -1,222 +0,0 @@
-import React from 'react';
-import * as Three from 'three';
-import { loadGLTF } from "../../utils/load-obj";
-import { OBJTYPE_MESH } from "../../../constants";
-var cached3DDoor = null;
-var STYLE_HOLE_BASE = {
-  stroke: 'rgb(73, 73, 73)',
-  strokeWidth: '1px',
-  strokeDasharray: '9,5',
-  fill: 'rgb(73, 73, 73)'
-};
-var STYLE_HOLE_SELECTED = {
-  stroke: '#0096fd',
-  strokeWidth: '1px',
-  strokeDasharray: '9,5',
-  fill: '#0096fd',
-  cursor: 'move'
-};
-var STYLE_ARC_BASE = {
-  stroke: 'rgb(73, 73, 73)',
-  strokeWidth: '1px',
-  strokeDasharray: '9,5',
-  fill: 'none'
-};
-var STYLE_ARC_SELECTED = {
-  stroke: '#0096fd',
-  strokeWidth: '1px',
-  strokeDasharray: '9,5',
-  fill: 'none',
-  cursor: 'move'
-};
-var STYLE_STR0 = {
-  fill: 'rgb(185, 185, 185)',
-  stroke: '#494949',
-  strokeWidth: '1',
-  strokeMiterlimit: '2.61313'
-};
-var STYLE_STR0_S = {
-  fill: 'rgb(185, 185, 185)',
-  stroke: '#0096fd',
-  strokeWidth: '1',
-  strokeMiterlimit: '2.61313'
-};
-var STYLE_STR1 = {
-  fill: 'none',
-  stroke: '#494949',
-  strokeWidth: '1',
-  strokeLinecap: 'round',
-  strokeLinejoin: 'round',
-  strokeMiterlimit: '2.61313',
-  strokeDasharray: '23.860041 11.930021'
-};
-var STYLE_FILL2 = {
-  fill: '#1183B7'
-};
-var STYLE_FNT0 = {
-  fill: 'white',
-  fontWeight: 'normal',
-  fontSize: '13px',
-  fontFamily: 'Proxima Nova Rg'
-};
-var EPSILON = 3;
-export default {
-  name: 'Closet',
-  prototype: 'holes',
-  info: {
-    title: 'Closet',
-    tag: ['door'],
-    description: 'Closet door(Wooden)',
-    image: '/assets/img/svg/door/Closet.svg',
-    url: '/assets/gltf/door_closet.gltf'
-  },
-  properties: {
-    width: {
-      label: 'Width',
-      type: 'length-measure',
-      defaultValue: {
-        length: 91.44
-      }
-    },
-    height: {
-      label: 'Height',
-      type: 'length-measure',
-      defaultValue: {
-        length: 215
-      },
-      length: 215
-    },
-    altitude: {
-      label: 'Altitude',
-      type: 'length-measure',
-      defaultValue: {
-        length: 0
-      }
-    },
-    thickness: {
-      label: 'Thickness',
-      type: 'length-measure',
-      defaultValue: {
-        length: 6
-      }
-    },
-    flip_orizzontal: {
-      label: 'Flip Door',
-      type: 'checkbox',
-      defaultValue: false,
-      values: {
-        none: false,
-        yes: true
-      }
-    }
-  },
-  render2D: function render2D(element, layer, scene) {
-    var flip = element.properties.get('flip_orizzontal');
-    var lineWidth = 6;
-    var holeWidth = element.properties.get('width').get('length');
-    var holePath = "M".concat(0, " ", -EPSILON, "  L").concat(holeWidth, " ").concat(-EPSILON, "  L").concat(holeWidth, " ").concat(EPSILON, "  L", 0, " ").concat(EPSILON, "  z");
-    var arcPath = "M".concat(0, ",", 0, "  A", holeWidth, ",").concat(holeWidth, " 0 0,1 ").concat(holeWidth, ",").concat(holeWidth);
-    var holeStyle = element.selected ? STYLE_HOLE_SELECTED : STYLE_HOLE_BASE;
-    var arcStyle = element.selected ? STYLE_ARC_SELECTED : STYLE_ARC_BASE;
-    var rectStyle = element.selected ? STYLE_STR0_S : STYLE_STR0;
-    var length = element.properties.get('width').get('length');
-    if (flip == false) {
-      return /*#__PURE__*/React.createElement("g", {
-        transform: "translate(".concat(-length / 2, ", 0)")
-      }, /*#__PURE__*/React.createElement("path", {
-        d: arcPath,
-        style: arcStyle,
-        transform: "translate(".concat(0, ",", holeWidth, ") scale(", 1, ",").concat(-1, ") rotate(", 0, ")")
-      }), /*#__PURE__*/React.createElement("line", {
-        x1: 0,
-        y1: holeWidth - EPSILON,
-        x2: 0,
-        y2: 0 - EPSILON,
-        style: holeStyle,
-        transform: "scale(".concat(-1, ",", 1, ")")
-      }), /*#__PURE__*/React.createElement("rect", {
-        style: rectStyle,
-        x: "0",
-        y: -lineWidth / 2,
-        width: holeWidth,
-        height: lineWidth
-      }));
-    } else {
-      return /*#__PURE__*/React.createElement("g", {
-        transform: "translate(".concat(-length / 2, ", 0)")
-      }, /*#__PURE__*/React.createElement("path", {
-        d: arcPath,
-        style: arcStyle,
-        transform: "translate(".concat(0, ",", -holeWidth, ") scale(", 1, ",", 1, ") rotate(", 0, ")")
-      }), /*#__PURE__*/React.createElement("line", {
-        x1: 0,
-        y1: -holeWidth - EPSILON,
-        x2: 0,
-        y2: 0 - EPSILON,
-        style: holeStyle,
-        transform: "scale(".concat(1, ",", 1, ")")
-      }), /*#__PURE__*/React.createElement("rect", {
-        style: rectStyle,
-        x: "0",
-        y: -lineWidth / 2,
-        width: holeWidth,
-        height: lineWidth
-      }));
-    }
-  },
-  render3D: function render3D(element, layer, scene) {
-    var onLoadItem = function onLoadItem(object) {
-      var boundingBox = new Three.Box3().setFromObject(object);
-      var initialWidth = boundingBox.max.x - boundingBox.min.x;
-      var initialHeight = boundingBox.max.y - boundingBox.min.y;
-      var initialThickness = boundingBox.max.z - boundingBox.min.z;
-      if (element.selected) {
-        var box = new Three.BoxHelper(object, 0x99c3fb);
-        box.material.linewidth = 2;
-        box.material.depthTest = false;
-        box.renderOrder = 1000;
-        object.add(box);
-      }
-      var params = {
-        envMap: 'HDR',
-        roughness: 0.9,
-        metalness: 0.1,
-        exposure: 1.0
-      };
-      var examplecolor = new Three.Color(0xffffff);
-      var mat2 = new Three.MeshStandardMaterial({
-        color: examplecolor,
-        metalness: params.metalness,
-        roughness: params.roughness
-      });
-      // let normalMap = require('./texture.png');
-      // let t = new Three.TextureLoader().load(normalMap);
-      // let mat2 = new Three.MeshStandardMaterial({
-      //   metalness: params.metalness,
-      //   roughness: params.roughness
-      // });
-      // mat2.map = t;
-      // mat2.envMap = textureCube;
-      for (var j = 0; j < object.children.length; j++) {
-        if (object.children[j].type === OBJTYPE_MESH) {
-          object.children[j].material = mat2;
-          object.children[j].receiveShadow = true;
-        }
-      }
-      var width = element.properties.get('width').get('length');
-      var height = element.properties.get('height').get('length');
-      var thickness = element.properties.get('thickness').get('length');
-      // console.log(width, height, thickness)
-
-      object.scale.set(width / initialWidth, height / initialHeight, thickness / initialThickness);
-      return object;
-    };
-    if (cached3DDoor) {
-      return Promise.resolve(onLoadItem(cached3DDoor.clone()));
-    }
-    return loadGLTF(element.url).then(function (object) {
-      cached3DDoor = object;
-      return onLoadItem(cached3DDoor.clone());
-    });
-  }
-};