@shopware-ag/dive 1.7.0 → 1.9.0

package/build/dive.js

@@ -449,7 +449,12 @@ var init_PerspectiveCamera = __esm({
     };
     _DIVEPerspectiveCamera = class _DIVEPerspectiveCamera extends PerspectiveCamera {
       constructor(settings = DIVEPerspectiveCameraDefaultSettings) {
-        super(settings.fov, 1, settings.near, settings.far);
+        super(
+          settings.fov || DIVEPerspectiveCameraDefaultSettings.fov,
+          1,
+          settings.near || DIVEPerspectiveCameraDefaultSettings.near,
+          settings.far || DIVEPerspectiveCameraDefaultSettings.far
+        );
         this.onSetCameraLayer = () => {
         };
         this.layers.mask = _DIVEPerspectiveCamera.EDITOR_VIEW_LAYER_MASK;
@@ -524,14 +529,16 @@ var DIVERendererDefaultSettings = {
   stencil: false,
   shadowMapEnabled: true,
   shadowMapType: PCFSoftShadowMap,
-  toneMapping: NoToneMapping
+  toneMapping: NoToneMapping,
+  canvas: void 0
 };
 var DIVERenderer = class extends WebGLRenderer {
   constructor(rendererSettings = DIVERendererDefaultSettings) {
     super({
-      antialias: rendererSettings.antialias,
-      alpha: rendererSettings.alpha,
-      preserveDrawingBuffer: true
+      antialias: rendererSettings.antialias || DIVERendererDefaultSettings.antialias,
+      alpha: rendererSettings.alpha || DIVERendererDefaultSettings.alpha,
+      preserveDrawingBuffer: true,
+      canvas: rendererSettings.canvas
     });
     // basic functionality members
     this.paused = false;
@@ -541,9 +548,9 @@ var DIVERenderer = class extends WebGLRenderer {
     this.preRenderCallbacks = /* @__PURE__ */ new Map();
     this.postRenderCallbacks = /* @__PURE__ */ new Map();
     this.setPixelRatio(window.devicePixelRatio);
-    this.shadowMap.enabled = rendererSettings.shadowMapEnabled;
-    this.shadowMap.type = rendererSettings.shadowMapType;
-    this.toneMapping = rendererSettings.toneMapping;
+    this.shadowMap.enabled = rendererSettings.shadowMapEnabled || DIVERendererDefaultSettings.shadowMapEnabled;
+    this.shadowMap.type = rendererSettings.shadowMapType || DIVERendererDefaultSettings.shadowMapType;
+    this.toneMapping = rendererSettings.toneMapping || DIVERendererDefaultSettings.toneMapping;
     this.debug.checkShaderErrors = false;
   }
   // Stops renderings and disposes the renderer.
@@ -642,10 +649,10 @@ var DIVERenderer = class extends WebGLRenderer {
 };
 
 // src/scene/Scene.ts
-import { Color as Color6, Scene as Scene2 } from "three";
+import { Color as Color7, Scene as Scene2 } from "three";
 
 // src/scene/root/Root.ts
-import { Box3 as Box32, Object3D as Object3D9 } from "three";
+import { Box3 as Box33, Object3D as Object3D11 } from "three";
 
 // src/scene/root/lightroot/LightRoot.ts
 import { Color as Color4, Object3D as Object3D5 } from "three";
@@ -1381,12 +1388,265 @@ var DIVEModelRoot = class extends Object3D7 {
   }
 };
 
+// src/scene/root/primitiveroot/PrimitiveRoot.ts
+import { Object3D as Object3D9 } from "three";
+
+// src/primitive/Primitive.ts
+import { Box3 as Box32, BoxGeometry, BufferGeometry, Color as Color5, CylinderGeometry, Float32BufferAttribute, Mesh as Mesh2, Object3D as Object3D8, Raycaster as Raycaster3, SphereGeometry as SphereGeometry2, Uint32BufferAttribute, Vector3 as Vector33 } from "three";
+init_VisibilityLayerMask();
+var DIVEPrimitive = class extends Object3D8 {
+  constructor() {
+    super();
+    this.isSelectable = true;
+    this.isMoveable = true;
+    this.gizmo = null;
+    this.layers.mask = PRODUCT_LAYER_MASK;
+    this._mesh = new Mesh2();
+    this._mesh.layers.mask = PRODUCT_LAYER_MASK;
+    this._mesh.castShadow = true;
+    this._mesh.receiveShadow = true;
+    this.add(this._mesh);
+    this._boundingBox = new Box32();
+  }
+  SetGeometry(geometry) {
+    this.clear();
+    this._mesh.geometry = this.assembleGeometry(geometry);
+    this._boundingBox.setFromObject(this._mesh);
+  }
+  SetPosition(position) {
+    this.position.set(position.x, position.y, position.z);
+  }
+  SetRotation(rotation) {
+    this.rotation.setFromVector3(new Vector33(rotation.x, rotation.y, rotation.z));
+  }
+  SetScale(scale) {
+    this.scale.set(scale.x, scale.y, scale.z);
+  }
+  SetVisibility(visible) {
+    this.traverse((child) => {
+      child.visible = visible;
+    });
+  }
+  SetMaterial(material) {
+    const primitiveMaterial = this._mesh.material;
+    primitiveMaterial.color = new Color5(material.color);
+    if (material.roughnessMap) {
+      primitiveMaterial.roughnessMap = material.roughnessMap;
+      primitiveMaterial.roughness = 1;
+    } else {
+      primitiveMaterial.roughness = material.roughness;
+    }
+    if (material.metalnessMap) {
+      primitiveMaterial.metalnessMap = material.metalnessMap;
+      primitiveMaterial.metalness = 0;
+    } else {
+      primitiveMaterial.metalness = material.metalness;
+    }
+  }
+  SetToWorldOrigin() {
+    var _a;
+    this.position.set(0, 0, 0);
+    (_a = DIVECommunication.get(this.userData.id)) == null ? void 0 : _a.PerformAction("UPDATE_OBJECT", { id: this.userData.id, position: this.position, rotation: this.rotation, scale: this.scale });
+  }
+  PlaceOnFloor() {
+    var _a;
+    this.position.y = -this._boundingBox.min.y * this.scale.y;
+    (_a = DIVECommunication.get(this.userData.id)) == null ? void 0 : _a.PerformAction("UPDATE_OBJECT", { id: this.userData.id, position: this.position, rotation: this.rotation, scale: this.scale });
+  }
+  DropIt() {
+    var _a;
+    if (!this.parent) {
+      console.warn("DIVEModel: DropIt() called on a model that is not in the scene.", this);
+      return;
+    }
+    const bottomY = this._boundingBox.min.y * this.scale.y;
+    const bbBottomCenter = this.localToWorld(this._boundingBox.getCenter(new Vector33()).multiply(this.scale));
+    bbBottomCenter.y = bottomY + this.position.y;
+    const raycaster = new Raycaster3(bbBottomCenter, new Vector33(0, -1, 0));
+    raycaster.layers.mask = PRODUCT_LAYER_MASK;
+    const intersections = raycaster.intersectObjects(findSceneRecursive(this).Root.children, true);
+    if (intersections.length > 0) {
+      const mesh = intersections[0].object;
+      mesh.geometry.computeBoundingBox();
+      const meshBB = mesh.geometry.boundingBox;
+      const worldPos = mesh.localToWorld(meshBB.max.clone());
+      const oldPos = this.position.clone();
+      const newPos = this.position.clone().setY(worldPos.y).sub(new Vector33(0, bottomY, 0));
+      this.position.copy(newPos);
+      if (this.position.y === oldPos.y) return;
+      (_a = DIVECommunication.get(this.userData.id)) == null ? void 0 : _a.PerformAction("UPDATE_OBJECT", { id: this.userData.id, position: this.position, rotation: this.rotation, scale: this.scale });
+    }
+  }
+  onMove() {
+    var _a;
+    (_a = DIVECommunication.get(this.userData.id)) == null ? void 0 : _a.PerformAction("UPDATE_OBJECT", { id: this.userData.id, position: this.position, rotation: this.rotation, scale: this.scale });
+  }
+  onSelect() {
+    var _a;
+    (_a = DIVECommunication.get(this.userData.id)) == null ? void 0 : _a.PerformAction("SELECT_OBJECT", { id: this.userData.id });
+  }
+  onDeselect() {
+    var _a;
+    (_a = DIVECommunication.get(this.userData.id)) == null ? void 0 : _a.PerformAction("DESELECT_OBJECT", { id: this.userData.id });
+  }
+  assembleGeometry(geometry) {
+    switch (geometry.name) {
+      case "cylinder":
+        return this.createCylinderGeometry(geometry);
+      case "sphere":
+        return this.createSphereGeometry(geometry);
+      case "pyramid":
+        return this.createPyramidGeometry(geometry);
+      case "box":
+        return this.createBoxGeometry(geometry);
+      case "cone":
+        return this.createConeGeometry(geometry);
+      case "wall":
+        return this.createWallGeometry(geometry);
+      case "plane":
+        return this.createPlaneGeometry(geometry);
+      default:
+        return new BufferGeometry();
+    }
+  }
+  createCylinderGeometry(geometry) {
+    return new CylinderGeometry(geometry.width * 2, geometry.width * 2, geometry.height, 64);
+  }
+  createSphereGeometry(geometry) {
+    return new SphereGeometry2(geometry.width * 2, 64);
+  }
+  createPyramidGeometry(geometry) {
+    const geo = new BufferGeometry();
+    const { width, height, depth } = geometry;
+    geo.setAttribute("position", new Float32BufferAttribute([
+      width / 2,
+      0,
+      depth / 2,
+      // right back
+      width / 2,
+      0,
+      -depth / 2,
+      // right front
+      -width / 2,
+      0,
+      -depth / 2,
+      // left front
+      -width / 2,
+      0,
+      depth / 2,
+      // left back
+      0,
+      height,
+      0
+      // top
+    ], 3));
+    geo.setIndex(new Uint32BufferAttribute([
+      1,
+      0,
+      4,
+      2,
+      1,
+      4,
+      3,
+      2,
+      4,
+      3,
+      0,
+      4,
+      0,
+      1,
+      2,
+      0,
+      2,
+      3
+    ], 1));
+    return geo;
+  }
+  createBoxGeometry(geometry) {
+    return new BoxGeometry(geometry.width, geometry.height, geometry.depth);
+  }
+  createConeGeometry(geometry) {
+    return new CylinderGeometry(0, geometry.width * 2, geometry.height, 64);
+  }
+  createWallGeometry(geometry) {
+    return new BoxGeometry(geometry.width, geometry.height, geometry.depth, 16);
+  }
+  createPlaneGeometry(geometry) {
+    return new BoxGeometry(geometry.width, geometry.height, geometry.depth);
+  }
+};
+
+// src/scene/root/primitiveroot/PrimitiveRoot.ts
+var DIVEPrimitiveRoot = class extends Object3D9 {
+  constructor() {
+    super();
+    this.name = "PrimitiveRoot";
+  }
+  GetPrimitive(object) {
+    if (object.id === void 0) {
+      console.warn("PrimitiveRoot.GetPrimitive: object.id is undefined");
+      return void 0;
+    }
+    return this.children.find((object3D) => object3D.userData.id === object.id);
+  }
+  UpdatePrimitive(object) {
+    if (object.id === void 0) {
+      console.warn("PrimitiveRoot.UpdatePrimitive: object.id is undefined");
+      return;
+    }
+    let sceneObject = this.children.find((object3D) => object3D.userData.id === object.id);
+    if (!sceneObject && object.geometry !== void 0) {
+      const primitive = new DIVEPrimitive();
+      primitive.SetGeometry(object.geometry);
+      sceneObject = primitive;
+      sceneObject.userData.id = object.id;
+      this.add(sceneObject);
+    }
+    if (object.position !== void 0) sceneObject.SetPosition(object.position);
+    if (object.rotation !== void 0) sceneObject.SetRotation(object.rotation);
+    if (object.scale !== void 0) sceneObject.SetScale(object.scale);
+    if (object.visible !== void 0) sceneObject.SetVisibility(object.visible);
+    if (object.material !== void 0) sceneObject.SetMaterial(object.material);
+  }
+  DeletePrimitive(object) {
+    if (object.id === void 0) {
+      console.warn(`PrimitiveRoot.DeletePrimitive: object.id is undefined`);
+      return;
+    }
+    const sceneObject = this.children.find((object3D) => object3D.userData.id === object.id);
+    if (!sceneObject) {
+      console.warn(`PrimitiveRoot.DeletePrimitive: Primitive with id ${object.id} not found`);
+      return;
+    }
+    const findScene = (object2) => {
+      if (object2.parent !== null) {
+        return findScene(object2.parent);
+      }
+      ;
+      return object2;
+    };
+    const scene = findScene(sceneObject);
+    scene.children.find((object2) => {
+      if ("isTransformControls" in object2) {
+        object2.detach();
+      }
+    });
+    this.remove(sceneObject);
+  }
+  PlaceOnFloor(object) {
+    if (object.id === void 0) console.warn("PrimitiveRoot.PlaceOnFloor: object.id is undefined");
+    const sceneObject = this.children.find((object3D) => object3D.userData.id === object.id);
+    if (!sceneObject) return;
+    sceneObject.PlaceOnFloor();
+  }
+};
+
 // src/primitive/floor/Floor.ts
 init_VisibilityLayerMask();
-import { Color as Color5, Mesh as Mesh2, MeshStandardMaterial, PlaneGeometry } from "three";
-var DIVEFloor = class extends Mesh2 {
+import { Color as Color6, Mesh as Mesh3, MeshStandardMaterial as MeshStandardMaterial2, PlaneGeometry } from "three";
+var DIVEFloor = class extends Mesh3 {
   constructor() {
-    super(new PlaneGeometry(1e4, 1e4), new MeshStandardMaterial({ color: new Color5(150 / 255, 150 / 255, 150 / 255) }));
+    super(new PlaneGeometry(1e4, 1e4), new MeshStandardMaterial2({ color: new Color6(150 / 255, 150 / 255, 150 / 255) }));
     this.isFloor = true;
     this.name = "Floor";
     this.layers.mask = PRODUCT_LAYER_MASK;
@@ -1397,7 +1657,7 @@ var DIVEFloor = class extends Mesh2 {
     this.visible = visible;
   }
   SetColor(color) {
-    this.material.color = new Color5(color);
+    this.material.color = new Color6(color);
   }
 };
 
@@ -1407,8 +1667,8 @@ var GRID_SIDE_LINE_COLOR = "#dddddd";
 
 // src/grid/Grid.ts
 init_VisibilityLayerMask();
-import { GridHelper, Object3D as Object3D8 } from "three";
-var DIVEGrid = class extends Object3D8 {
+import { GridHelper, Object3D as Object3D10 } from "three";
+var DIVEGrid = class extends Object3D10 {
   constructor() {
     super();
     this.name = "Grid";
@@ -1423,7 +1683,7 @@ var DIVEGrid = class extends Object3D8 {
 };
 
 // src/scene/root/Root.ts
-var DIVERoot = class extends Object3D9 {
+var DIVERoot = class extends Object3D11 {
   get Floor() {
     return this.floor;
   }
@@ -1437,18 +1697,25 @@ var DIVERoot = class extends Object3D9 {
     this.add(this.lightRoot);
     this.modelRoot = new DIVEModelRoot();
     this.add(this.modelRoot);
+    this.primitiveRoot = new DIVEPrimitiveRoot();
+    this.add(this.primitiveRoot);
     this.floor = new DIVEFloor();
     this.add(this.floor);
     this.grid = new DIVEGrid();
     this.add(this.grid);
   }
   ComputeSceneBB() {
-    const bb = new Box32();
+    const bb = new Box33();
     this.modelRoot.traverse((object) => {
       if ("isObject3D" in object) {
         bb.expandByObject(object);
       }
     });
+    this.primitiveRoot.traverse((object) => {
+      if ("isObject3D" in object) {
+        bb.expandByObject(object);
+      }
+    });
     return bb;
   }
   GetSceneObject(object) {
@@ -1462,6 +1729,9 @@ var DIVERoot = class extends Object3D9 {
       case "model": {
         return this.modelRoot.GetModel(object);
       }
+      case "primitive": {
+        return this.primitiveRoot.GetPrimitive(object);
+      }
     }
   }
   AddSceneObject(object) {
@@ -1477,6 +1747,10 @@ var DIVERoot = class extends Object3D9 {
         this.modelRoot.UpdateModel(object);
         break;
       }
+      case "primitive": {
+        this.primitiveRoot.UpdatePrimitive(object);
+        break;
+      }
     }
   }
   UpdateSceneObject(object) {
@@ -1492,6 +1766,10 @@ var DIVERoot = class extends Object3D9 {
         this.modelRoot.UpdateModel(object);
         break;
       }
+      case "primitive": {
+        this.primitiveRoot.UpdatePrimitive(object);
+        break;
+      }
     }
   }
   DeleteSceneObject(object) {
@@ -1507,10 +1785,27 @@ var DIVERoot = class extends Object3D9 {
         this.modelRoot.DeleteModel(object);
         break;
       }
+      case "primitive": {
+        this.primitiveRoot.DeletePrimitive(object);
+        break;
+      }
     }
   }
   PlaceOnFloor(object) {
-    this.modelRoot.PlaceOnFloor(object);
+    switch (object.entityType) {
+      case "pov":
+      case "light": {
+        break;
+      }
+      case "model": {
+        this.modelRoot.PlaceOnFloor(object);
+        break;
+      }
+      case "primitive": {
+        this.primitiveRoot.PlaceOnFloor(object);
+        break;
+      }
+    }
   }
 };
 
@@ -1521,12 +1816,12 @@ var DIVEScene = class extends Scene2 {
   }
   constructor() {
     super();
-    this.background = new Color6(16777215);
+    this.background = new Color7(16777215);
     this.root = new DIVERoot();
     this.add(this.root);
   }
   SetBackground(color) {
-    this.background = new Color6(color);
+    this.background = new Color7(color);
   }
   ComputeSceneBB() {
     return this.Root.ComputeSceneBB();
@@ -1552,8 +1847,8 @@ var DIVEScene = class extends Scene2 {
 init_PerspectiveCamera();
 
 // src/controls/OrbitControls.ts
-import { OrbitControls } from "three/examples/jsm/Addons.js";
-import { MathUtils as MathUtils2, Vector3 as Vector33 } from "three";
+import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";
+import { MathUtils as MathUtils2, Vector3 as Vector34 } from "three";
 import { Easing } from "@tweenjs/tween.js";
 var DIVEOrbitControlsDefaultSettings = {
   enableDamping: true,
@@ -1584,16 +1879,19 @@ var _DIVEOrbitControls = class _DIVEOrbitControls extends OrbitControls {
     this._removePreRenderCallback = () => {
       renderer.RemovePreRenderCallback(id);
     };
-    this.enableDamping = settings.enableDamping;
-    this.dampingFactor = settings.dampingFactor;
+    this.enableDamping = settings.enableDamping || DIVEOrbitControlsDefaultSettings.enableDamping;
+    this.dampingFactor = settings.dampingFactor || DIVEOrbitControlsDefaultSettings.dampingFactor;
+    this.object.position.set(0, 2, 2);
+    this.target.copy({ x: 0, y: 0.5, z: 0 });
+    this.update();
   }
   Dispose() {
     this._removePreRenderCallback();
     this.dispose();
   }
   ComputeEncompassingView(bb) {
-    const center = bb.getCenter(new Vector33());
-    const size = bb.getSize(new Vector33());
+    const center = bb.getCenter(new Vector34());
+    const size = bb.getSize(new Vector34());
     const distance = Math.max(size.x, size.y, size.z) * 1.25;
     const direction = this.object.position.clone().normalize();
     return {
@@ -1761,7 +2059,7 @@ var DIVEAnimationSystem = class {
 
 // src/axiscamera/AxisCamera.ts
 init_VisibilityLayerMask();
-import { AxesHelper, Color as Color7, Matrix4, OrthographicCamera, Vector4 } from "three";
+import { AxesHelper, Color as Color8, Matrix4, OrthographicCamera, Vector4 } from "three";
 import SpriteText from "three-spritetext";
 
 // src/constant/AxisHelperColors.ts
@@ -1782,9 +2080,9 @@ var DIVEAxisCamera = class extends OrthographicCamera {
     this.axesHelper.material.depthTest = false;
     this.axesHelper.position.set(0, 0, -1);
     this.axesHelper.setColors(
-      new Color7(AxesColorRed),
-      new Color7(AxesColorGreen),
-      new Color7(AxesColorBlue)
+      new Color8(AxesColorRed),
+      new Color8(AxesColorGreen),
+      new Color8(AxesColorBlue)
     );
     const x = new SpriteText("X", 0.2, AxesColorRedLetter);
     const y = new SpriteText("Y", 0.2, AxesColorGreenLetter);
@@ -2110,14 +2408,14 @@ var DIVE = class _DIVE {
     const settingsDelta = getObjectDelta(this._settings, settings);
     if (settingsDelta.renderer) this.renderer = new DIVERenderer(this._settings.renderer);
     if (settingsDelta.perspectiveCamera) {
-      this.perspectiveCamera.fov = settingsDelta.perspectiveCamera.fov;
-      this.perspectiveCamera.near = settingsDelta.perspectiveCamera.near;
-      this.perspectiveCamera.far = settingsDelta.perspectiveCamera.far;
+      if (settingsDelta.perspectiveCamera.fov !== void 0) this.perspectiveCamera.fov = settingsDelta.perspectiveCamera.fov;
+      if (settingsDelta.perspectiveCamera.near !== void 0) this.perspectiveCamera.near = settingsDelta.perspectiveCamera.near;
+      if (settingsDelta.perspectiveCamera.far !== void 0) this.perspectiveCamera.far = settingsDelta.perspectiveCamera.far;
       this.perspectiveCamera.OnResize(this.renderer.domElement.width, this.renderer.domElement.height);
     }
     if (settingsDelta.orbitControls) {
-      this.orbitControls.enableDamping = settingsDelta.orbitControls.enableDamping;
-      this.orbitControls.dampingFactor = settingsDelta.orbitControls.dampingFactor;
+      if (settingsDelta.orbitControls.enableDamping !== void 0) this.orbitControls.enableDamping = settingsDelta.orbitControls.enableDamping;
+      if (settingsDelta.orbitControls.dampingFactor !== void 0) this.orbitControls.dampingFactor = settingsDelta.orbitControls.dampingFactor;
     }
     if (settingsDelta.autoResize !== this._settings.autoResize) {
       if (settingsDelta.autoResize) {
@@ -2160,6 +2458,7 @@ var DIVE = class _DIVE {
         console.log(this.scene);
       }
     };
+    console.log("DIVE initialized");
   }
   Dispose() {
     var _a;