add a simple box in stats-world

src/components/World/World.js

@@ -3,12 +3,11 @@
 import { createCamera } from "./components/camera.js";
 import { createLights } from "./components/lights.js";
 import { createScene } from "./components/scene.js";
-import { createRenderer } from "./systems/renderer.js";
+import { createCube, createTerrain } from "./components/objects/terrain.js";
 import { Loop } from "./systems/Loop.js";
 import { Resizer } from "./systems/Resizer.js";
 import { createControls } from "./systems/controls.js";
-
+import { createRenderer } from "./systems/renderer.js";
-import createTerrain from "./components/objects/terrain.js";
 
 // These variables are module-scoped: we cannot access them
 // from outside the module
@@ -61,6 +60,10 @@ class World {
 
     scene.add(light, terrain);
 
+    const cube = createCube();
+    loop.updatables.push(cube);
+    scene.add(cube);
+
     // Responsive handler
     const resizer = new Resizer(container, camera, renderer);
     resizer.onResize = () => {

src/components/World/components/objects/terrain.js

@@ -1,17 +1,18 @@
 import {
+  BoxGeometry,
   PlaneGeometry,
-  MeshStandardMaterial,
+  MeshLambertMaterial,
   Mesh,
   TextureLoader,
 } from "three";
 
-export default function createTerrain(props) {
+export function createTerrain(props) {
   const loader = new TextureLoader();
   const height = loader.load("img/textures/height.png");
   //                                        w    h
   const geometry = new PlaneGeometry(150, 150, 64, 64);
 
-  const material = new MeshStandardMaterial({
+  const material = new MeshLambertMaterial({
     color: props.color,
     flatShading: true,
     displacementMap: height,
@@ -39,3 +40,13 @@ export default function createTerrain(props) {
 
   return plane;
 }
+
+export function createCube() {
+  const geometry = new BoxGeometry(1, 1, 1);
+  const material = new MeshLambertMaterial({ color: 0xff0000 });
+  const cube = new Mesh(geometry, material);
+  cube.position.set(0, 5, 0);
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
+  cube.tick = () => {};
+  return cube;
+}