Repository: 4ian/GDevelop
File: Extensions/3D/Cube3DRuntimeObjectPixiRenderer.ts (TypeScript)

Code before:
    }
    return runtimeObject
      .getInstanceContainer()
      .getGame()
      .getImageManager()
      .getThreeMaterial(runtimeObject.getFaceAtIndexResourceName(faceIndex), {
        useTransparentTexture: runtimeObject.shouldUseTransparentTexture(),
        forceBasicMaterial:
          runtimeObject._materialType ===
          gdjs.Cube3DRuntimeObject.MaterialType.Basic,
      });
  };

  class Cube3DRuntimeObjectPixiRenderer extends gdjs.RuntimeObject3DRenderer {
    private _cube3DRuntimeObject: gdjs.Cube3DRuntimeObject;
    private _boxMesh: THREE.Mesh;

    constructor(
      runtimeObject: gdjs.Cube3DRuntimeObject,
      instanceContainer: gdjs.RuntimeInstanceContainer
    ) {
      const geometry = new THREE.BoxGeometry(1, 1, 1);
      // TODO (3D) - feature: support color instead of texture?
      const materials: THREE.Material[] = [];

      for (let i = 0; i < 6; i++) {
        const material: THREE.Material = getFaceMaterial(
          runtimeObject,
          materialIndexToFaceIndex[i]
        );
        const basicMaterial: THREE.MeshBasicMaterial =
          new THREE.MeshBasicMaterial();
        basicMaterial.copy(material);
        materials.push(
          basicMaterial.map
            ? getFaceMaterial(runtimeObject, materialIndexToFaceIndex[i])
            : new THREE.MeshBasicMaterial({ vertexColors: true })
        );
      }

      let colors: number[] = [];
      for (let i = 0; i < geometry.attributes.position.count; i++) {
        colors.push(
          runtimeObject._color.r,
          runtimeObject._color.g,
          runtimeObject._color.b
        );
      }

      geometry.setAttribute(
        'color',

Review comment (suggestion):
Good idea to use a loop!
In JS, there's a more elegant way to do this, with a `map`.
So you could write:

```js
const materials = new Array(6).fill(0).map((_, index) => {
  return material;
})
```

Code after:
      .getThreeMaterial(runtimeObject.getFaceAtIndexResourceName(faceIndex), {
        useTransparentTexture: runtimeObject.shouldUseTransparentTexture(),
        forceBasicMaterial:
          runtimeObject._materialType ===
          gdjs.Cube3DRuntimeObject.MaterialType.Basic,
      });
  };

  class Cube3DRuntimeObjectPixiRenderer extends gdjs.RuntimeObject3DRenderer {
    private _cube3DRuntimeObject: gdjs.Cube3DRuntimeObject;
    private _boxMesh: THREE.Mesh;

    constructor(
      runtimeObject: gdjs.Cube3DRuntimeObject,
      instanceContainer: gdjs.RuntimeInstanceContainer
    ) {
      const geometry = new THREE.BoxGeometry(1, 1, 1);

      const materials: THREE.Material[] = new Array(6)
        .fill(0)
        .map((_, index) =>
          getFaceMaterial(runtimeObject, materialIndexToFaceIndex[index])
        );

      const boxMesh = new THREE.Mesh(geometry, materials);

      super(runtimeObject, instanceContainer, boxMesh);
      this._boxMesh = boxMesh;
      this._cube3DRuntimeObject = runtimeObject;

      this.updateSize();
      this.updatePosition();
      this.updateRotation();
      this.updateTint();
    }
    updateTint() {
      const tints: number[] = [];

      const normalizedTint = gdjs
        .hexNumberToRGBArray(this._cube3DRuntimeObject._tint)
        .map((component) => component / 255);

      for (
        let i = 0;
        i < this._boxMesh.geometry.attributes.position.count;
        i++
      ) {
        tints.push(...normalizedTint);
      }

      this._boxMesh.geometry.setAttribute(