Prettier

GDJS/Runtime/layer.ts

@@ -304,7 +304,7 @@ namespace gdjs {
      * Convert a point from the container coordinates (for example,
      * an object position) to the canvas coordinates.
      *
-     * This method doesn't handle 3D rotations.
+     * This method handles 3D rotations.
      *
      * @param x The x position, in container coordinates.
      * @param y The y position, in container coordinates.
@@ -321,6 +321,11 @@ namespace gdjs {
 
       // The result parameter used to be optional.
       let position = result || [0, 0];
+
+      if (this._renderer.isCameraRotatedIn3D()) {
+        return this._renderer.transformFrom3DWorld(x, y, 0, cameraId, result);
+      }
+
       x -= this.getCameraX(cameraId);
       y -= this.getCameraY(cameraId);
 

GDJS/Runtime/pixi-renderers/DebuggerPixiRenderer.ts

@@ -112,39 +112,19 @@ namespace gdjs {
         const polygon: float[] = [];
         polygon.push.apply(
           polygon,
-          layer.applyLayerTransformation(
-            aabb.min[0],
-            aabb.min[1],
-            0,
-            workingPoint
-          )
+          layer.convertInverseCoords(aabb.min[0], aabb.min[1], 0, workingPoint)
         );
         polygon.push.apply(
           polygon,
-          layer.applyLayerTransformation(
-            aabb.max[0],
-            aabb.min[1],
-            0,
-            workingPoint
-          )
+          layer.convertInverseCoords(aabb.max[0], aabb.min[1], 0, workingPoint)
         );
         polygon.push.apply(
           polygon,
-          layer.applyLayerTransformation(
-            aabb.max[0],
-            aabb.max[1],
-            0,
-            workingPoint
-          )
+          layer.convertInverseCoords(aabb.max[0], aabb.max[1], 0, workingPoint)
         );
         polygon.push.apply(
           polygon,
-          layer.applyLayerTransformation(
-            aabb.min[0],
-            aabb.max[1],
-            0,
-            workingPoint
-          )
+          layer.convertInverseCoords(aabb.min[0], aabb.max[1], 0, workingPoint)
         );
 
         debugDraw.drawPolygon(polygon);
@@ -185,7 +165,7 @@ namespace gdjs {
           // as this is for debug draw.
           const polygon: float[] = [];
           hitboxes[j].vertices.forEach((point) => {
-            point = layer.applyLayerTransformation(
+            point = layer.convertInverseCoords(
               point[0],
               point[1],
               0,
@@ -205,7 +185,7 @@ namespace gdjs {
         debugDraw.fill.alpha = 0.3;
 
         // Draw Center point
-        const centerPoint = layer.applyLayerTransformation(
+        const centerPoint = layer.convertInverseCoords(
           object.getCenterXInScene(),
           object.getCenterYInScene(),
           0,
@@ -221,7 +201,7 @@ namespace gdjs {
         );
 
         // Draw position point
-        const positionPoint = layer.applyLayerTransformation(
+        const positionPoint = layer.convertInverseCoords(
           object.getX(),
           object.getY(),
           0,
@@ -245,7 +225,7 @@ namespace gdjs {
             Math.abs(originPoint[0] - positionPoint[0]) >= 1 ||
             Math.abs(originPoint[1] - positionPoint[1]) >= 1
           ) {
-            originPoint = layer.applyLayerTransformation(
+            originPoint = layer.convertInverseCoords(
               originPoint[0],
               originPoint[1],
               0,
@@ -269,7 +249,7 @@ namespace gdjs {
           for (const customPointName in object._animationFrame.points.items) {
             let customPoint = object.getPointPosition(customPointName);
 
-            customPoint = layer.applyLayerTransformation(
+            customPoint = layer.convertInverseCoords(
               customPoint[0],
               customPoint[1],
               0,

GDJS/Runtime/pixi-renderers/layer-pixi-renderer.ts

@@ -401,6 +401,37 @@ namespace gdjs {
       return result;
     }
 
+    transformFrom3DWorld(
+      worldX: float,
+      worldY: float,
+      worldZ: float,
+      cameraId: integer,
+      result: FloatPoint
+    ): FloatPoint {
+      const camera = this._threeCamera;
+      if (!camera) {
+        result[0] = 0;
+        result[1] = 0;
+        return result;
+      }
+      const width = this._layer.getWidth();
+      const height = this._layer.getHeight();
+
+      let vector = LayerPixiRenderer.vectorForProjections;
+      if (!vector) {
+        vector = new THREE.Vector3();
+        LayerPixiRenderer.vectorForProjections = vector;
+      }
+
+      // https://stackoverflow.com/questions/11586527/converting-world-coordinates-to-screen-coordinates-in-three-js-using-projection
+      vector.set(worldX, -worldY, worldZ);
+      vector.project(camera);
+
+      result[0] = (vector.x * width) / 2 + width / 2;
+      result[1] = (-vector.y * height) / 2 + height / 2;
+      return result;
+    }
+
     updateVisibility(visible: boolean): void {
       this._pixiContainer.visible = !!visible;
       if (this._threeGroup) this._threeGroup.visible = !!visible;