fix: improve simple renderer resize event

ThatOpen · May 7, 2024 · d5b4f59 · d5b4f59
1 parent e44e32a
commit d5b4f59
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 8 deletions.
diff --git a/packages/components-front/package.json b/packages/components-front/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@thatopen/components-front",
   "description": "Collection of frontend tools to author BIM apps.",
-  "version": "2.0.0-alpha.6",
+  "version": "2.0.0-alpha.7",
   "author": "That Open Company",
   "contributors": [
     "Antonio Gonzalez Viegas (https://github.com/agviegas)",
@@ -45,7 +45,7 @@
     "web-ifc": "0.0.53"
   },
   "dependencies": {
-    "@thatopen/components": "2.0.0-alpha.6",
+    "@thatopen/components": "2.0.0-alpha.7",
     "camera-controls": "2.7.3",
     "dexie": "^4.0.4",
     "earcut": "^2.2.4",

diff --git a/packages/components/package.json b/packages/components/package.json
@@ -69,4 +69,4 @@
     "three": "^0.160.1",
     "web-ifc": "0.0.53"
   }
-}
+}
diff --git a/packages/components/src/core/Worlds/example.ts b/packages/components/src/core/Worlds/example.ts
@@ -19,7 +19,11 @@ world.camera = new OBC.SimpleCamera(components);
 
 components.init();
 
-const cube = new THREE.Mesh(new THREE.BoxGeometry());
+const material = new THREE.MeshLambertMaterial({color: "#6528D7"});
+const geometry = new THREE.BoxGeometry();
+const cube = new THREE.Mesh(geometry, material);
 world.scene.three.add(cube);
 
-world.camera.controls.setLookAt(13, 13, 13, 0, 0, 0);
+world.scene.setup();
+
+world.camera.controls.setLookAt(3, 3, 3, 0, 0, 0);
diff --git a/packages/components/src/core/Worlds/src/simple-renderer.ts b/packages/components/src/core/Worlds/src/simple-renderer.ts
@@ -112,11 +112,18 @@ export class SimpleRenderer extends BaseRenderer {
     }
 
     if (active) {
-      this._resizeObserver = new ResizeObserver(() => this.resize());
+      this._resizeObserver = new ResizeObserver(this.resizeEvent);
       this._resizeObserver.observe(dom);
+      this._resizeObserver.observe(document.body);
+
+      window.addEventListener("resize", this.resizeEvent);
     }
   }
 
+  private resizeEvent = () => {
+    this.resize();
+  };
+
   private setupRenderer() {
     this.three.localClippingEnabled = true;
     if (this.container) {

diff --git a/yarn.lock b/yarn.lock
@@ -1242,7 +1242,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@thatopen/components-front@workspace:packages/components-front"
   dependencies:
-    "@thatopen/components": 2.0.0-alpha.6
+    "@thatopen/components": 2.0.0-alpha.7
     "@thatopen/fragments": 2.0.0-alpha.1
     "@types/earcut": ^2.1.4
     "@types/three": ^0.160.0
@@ -1260,7 +1260,7 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@thatopen/[email protected].6, @thatopen/components@workspace:packages/components":
+"@thatopen/[email protected].7, @thatopen/components@workspace:packages/components":
   version: 0.0.0-use.local
   resolution: "@thatopen/components@workspace:packages/components"
   dependencies:
-Original file line number
+Diff line change
@@ Expand Up / @@ -69,4 +69,4 @@ @@
         "three": "^0.160.1",
         "web-ifc": "0.0.53"
       }
-    }
+    }