porting

src/modules/bar/arcades/arcades.ts

@@ -1,37 +1,37 @@
-
 import { Entity, GltfContainer, Transform, engine } from '@dcl/sdk/ecs'
 import { Vector3, Quaternion } from '@dcl/sdk/math'
 import { Arcade } from './gameObjects/arcade'
-import { Utils } from 'cannon/build/cannon'
-import { loadAtariLevel } from './gameLogic/atariLevel'
+import * as utils from '@dcl-sdk/utils'
+import { loadAtariBricks, loadAtariLevel, unloadAtariBricks } from './gameLogic/atariLevel'
+import { Box } from 'cannon/build/cannon'
+import { GameManager } from './gameManager'
+import { loadPlayer, unloadPlayer } from './player'
 // import { scene } from "./scene"
 
 export function addArcades() {
   // Atari arcade cabinets
-  const arcadeAtariShape = engine.addEntity()
-  GltfContainer.create(arcadeAtariShape, {src:'models/core_building/arcadeCabinetAtari.glb'})
+  const arcadeAtariShape = 'models/core_building/arcadeCabinetAtari.glb'
 
 
-  const atariPos1 = engine.addEntity()
-  const atariPos2 = engine.addEntity()
-  const atariPos3 = engine.addEntity()
+  const atariEntity1 = engine.addEntity()
+  const atariEntity2 = engine.addEntity()
+  const atariEntity3 = engine.addEntity()
 
-  Transform.create( atariPos1,{
+  Transform.create( atariEntity1,{
     position: Vector3.create(167, 10.7, 164),
     rotation: Quaternion.fromEulerDegrees(0, 180 + 24, 0),
   })
-
-  Transform.create(atariPos2,{
+  Transform.create(atariEntity2,{
     position: Vector3.create(154, 10.7, 163),
     rotation: Quaternion.fromEulerDegrees(0, 180 + -24, 0),
   })
-  Transform.create(atariPos3,{
+  Transform.create(atariEntity3,{
     position: Vector3.create(175, 10.7, 144.7),
     rotation: Quaternion.fromEulerDegrees(0, 180 + 24, 0),
   })
 
   // Atari arcade positions and triggers
-  const arcadeAtariPos: Entity[] = [atariPos1, atariPos2, atariPos3]
+  const arcadeAtariPos: Entity[] = [atariEntity1, atariEntity2, atariEntity3]
 
 
   // ISSUE: These ecs-utils triggers can't rotate but work fine for now...
@@ -43,40 +43,41 @@ export function addArcades() {
 
   // Atari arcade cabinet
   for (let i = 0; i < arcadeAtariPos.length; i++) {
+    let transform = Transform.getMutableOrNull(arcadeAtariPos[i])
     const arcadeCabinetAtari = new Arcade(
       arcadeAtariShape,
-      arcadeAtariPos[i]
+      transform.position,
+      transform.scale
     )
 
     // Breakout game
     const atariGameTransform = engine.addEntity()
     Transform.create(atariGameTransform, {position: Vector3.create(-0.48, 1.38, -0.155), scale: Vector3.create(.3, .3, .3), parent: arcadeCabinetAtari})
-
+    /*
+    //TODO
+    transform.rotation = Quaternion.fromLookAt(Vector3.Zero(), Vector3.Left()) // Rotate 90% using a look matrix
+    transform.rotation = Quaternion.fromEulerDegrees(90, 0, 0)
 
-    Transform.getMutableOrNull(atariGameTransform).rotate(Vector3.Left(), 75)
 
-    let arcadeCabinetAtariTrigger = new Utils.TriggerBoxShape(
-      Vector3.create(3, 3, 3),
-      arcadeAtariTriggerPos[i]
+    Transform.getMutableOrNull(atariGameTransform).rotate(Vector3.Left(), 75)
+    */
+    let arcadeCabinetAtariTrigger = engine.addEntity()
+    utils.triggers.addTrigger(arcadeCabinetAtariTrigger, utils.NO_LAYERS, utils.LAYER_1,
+      [{type: "box",position: arcadeAtariTriggerPos[i], scale: Vector3.create(3, 3, 3)}],
+      () => {
+        if (!GameManager.hasGameLoaded) {
+          loadAtariBricks(atariGameTransform)
+          loadPlayer(atariGameTransform, arcadeCabinetAtari)
+        }
+      },
+      () => {
+        if (GameManager.hasGameLoaded) {
+          unloadAtariBricks()
+          unloadPlayer()
+        }
+      }
     )
-    loadAtariLevel(atariGameTransform)
 
-    arcadeCabinetAtari.addComponent(
-      new utils.TriggerComponent(arcadeCabinetAtariTrigger, {
-        onCameraEnter: () => {
-          if (!GameManager.hasGameLoaded) {
-            loadAtariBricks(atariGameTransform)
-            loadPlayer(atariGameTransform, arcadeCabinetAtari)
-          }
-        },
-        onCameraExit: () => {
-          if (GameManager.hasGameLoaded) {
-            unloadAtariBricks()
-            unloadPlayer()
-          }
-        },
-        enableDebug: false,
-      })
-    )
+    loadAtariLevel(atariGameTransform)
   }
 }

src/modules/bar/arcades/gameLogic/ballTranslator.ts

@@ -2,31 +2,33 @@ import { Ball, BallFlag } from "../gameObjects/ball"
 import { Sound } from "../gameObjects/sound"
 import { GameManager } from "../gameManager"
 import { AudioSource, Transform, engine } from "@dcl/sdk/ecs"
+import { Vector3 } from "@dcl/sdk/math"
 
 // Sound
 const missSound = new Sound("sounds/miss.mp3")
 
-class BallTranslatorSystem {
-  private ballGroup = engine.getEntitiesWith(BallFlag, Transform)
-
-  update(dt: number) {
-
-    for(const [ballEntity, ballFlag, ballTransformRO] of this.ballGroup){
-      let transform = ballTransformRO
-      let scale = ballTransformRO.scale
-      let increment = scale(dt * GameManager.BALL_SPEED)
-
-      if (transform.position.z <= GameManager.OUT_OF_BOUNDS) {
-        GameManager.isBallAlive = false
-        AudioSource.getMutableOrNull(missSound.entity).playing = true
-        engine.removeEntity()
-      }
-      if (transform.position.x < 0 || transform.position.x > 32 || transform.position.z < 0 || transform.position.z > 32) {
-        GameManager.isBallAlive = false
-        engine.removeEntity(entity)
-      }
+
+
+function ballTranslatorSystem(dt: number) {
+
+  let ballGroup = engine.getEntitiesWith(BallFlag, Transform)
+
+  for(const [ballEntity, ballFlag, ballTransformRO] of ballGroup){
+    let transform = ballTransformRO
+    let scale = ballTransformRO.scale
+    let increment = Vector3.scale(ballFlag.direction, dt * GameManager.BALL_SPEED)
+
+    if (transform.position.z <= GameManager.OUT_OF_BOUNDS) {
+      GameManager.isBallAlive = false
+      AudioSource.getMutableOrNull(missSound.entity).playing = true
+      engine.removeEntity(ballEntity)
+    }
+    if (transform.position.x < 0 || transform.position.x > 32 || transform.position.z < 0 || transform.position.z > 32) {
+      GameManager.isBallAlive = false
+      engine.removeEntity(ballEntity)
     }
   }
 }
 
-engine.addSystem(new BallTranslatorSystem())
+
+engine.addSystem(ballTranslatorSystem, 1)

src/modules/bar/arcades/gameLogic/collision.ts

@@ -1,9 +1,10 @@
+import * as utils from '@dcl-sdk/utils'
 import { Ball, BallFlag, BallFlagType } from '../gameObjects/ball'
 import { BrickFlag } from '../gameObjects/brick'
 import { PaddleFlag } from '../gameObjects/paddle'
 import { Sound } from '../gameObjects/sound'
-import { WallFlag } from '../gameObjects/wall'
-import { AudioSource, Transform, engine } from '@dcl/sdk/ecs'
+import { Wall, WallFlag } from '../gameObjects/wall'
+import { AudioSource, Entity, Transform, engine } from '@dcl/sdk/ecs'
 import { Vector3 } from '@dcl/sdk/math'
 
 export const CollisionFlag = engine.defineComponent('collisionFlag', {})
@@ -17,8 +18,9 @@ class CollisionDetection {
     const ballGroup = engine.getEntitiesWith(BallFlag, Transform) 
     const collisionGroup = engine.getEntitiesWith(CollisionFlag, Transform) 
 
-    for (const [ballEntity, ballFlag, ballTransformRO] of ballGroup){
+    for (const [ballEntity, ballFlagRO, ballTransformRO] of ballGroup){
       for (const [hitEntity, collisionFlag, hitTransformRO] of collisionGroup){
+        const ballFlag = BallFlag.getMutableOrNull(ballEntity)
         let ballPos = ballTransformRO.position
         let brickPos = hitTransformRO.position
         let ballSize = ballTransformRO.scale
@@ -38,31 +40,33 @@ class CollisionDetection {
           AudioSource.getMutableOrNull(hitSound.entity).playing = true
 
           // HACK: Temporary disable collisions on entity that's already been hit
-          hitEntity.removeComponent(CollisionFlag)
-          hitEntity.addComponentOrReplace(
-            new utils.Delay(100, () => {
-              hitEntity.addComponent(new CollisionFlag())
-            })
+          CollisionFlag.deleteFrom(hitEntity)
+          utils.timers.setTimeout(
+            function() {
+              CollisionFlag.create(hitEntity)
+            },
+            100
           )
 
-          let isPaddle = hitEntity.hasComponent(PaddleFlag)
-          let isWall = hitEntity.hasComponent(WallFlag)
-          isWall
-            ? (collisionNorm = hitEntity.normal)
-            : (collisionNorm = collisionNormal(ballEntity, ballFlag, hitEntity))
-          ballEntity.direction = reflectVector(
-            ballEntity.direction,
+
+          let isPaddle = PaddleFlag.getMutableOrNull(hitEntity)
+          let isWall = WallFlag.getMutableOrNull(hitEntity)
+          isWall ? (collisionNorm = hitEntity.normal) : (collisionNorm = collisionNormal(ballFlag as BallFlagType, ballTransformRO.position, hitEntity, hitTransformRO.position, hitTransformRO.scale))
+          ballFlag.direction = reflectVector(
+            ballFlag.direction,
             collisionNorm,
             isPaddle,
             isWall
           )
 
           // If it's a brick then remove it
-          if (
-            hitEntity.hasComponent(BrickFlag) &&
-            !hitEntity.hasComponent(utils.ExpireIn)
-          ) {
-            hitEntity.addComponent(new utils.ExpireIn(100))
+          let brick = BrickFlag.getMutableOrNull(hitEntity) 
+          if ( brick && !brick.removed){
+            brick.removed = true
+            utils.timers.setTimeout(
+              function() { engine.removeEntity(hitEntity)},
+              100
+            )
           }
         }
       }
@@ -77,7 +81,7 @@ function reflectVector(
   isPaddle: boolean,
   isWall: boolean
 ): Vector3 {
-  let dot = 2 * Vector3.Dot(incident, normal)
+  let dot = 2 * Vector3.dot(incident, normal)
   let reflected = incident.subtract(normal.multiplyByFloats(dot, dot, dot))
 
   // HACKS: Collision issues
@@ -93,18 +97,18 @@ function reflectVector(
   if (reflected.z >= 0 && reflected.z <= 0.25) reflected.z = 0.35
   if (reflected.z <= 0 && reflected.z >= -0.25) reflected.z = -0.35
 
-  return Vector3.Normalize(reflected)
+  return Vector3.normalize(reflected)
 }
 
-function collisionNormal(ballEntity: Ball, ballFlag: BallFlagType, hitEntity: IEntity): Vector3 {
-  let ballPosition = ballEntity.getComponent(Transform).position
-  let hitEntityPosition = hitEntity.getComponent(Transform).position
-  let hitEntityWidth = hitEntity.getComponent(Transform).scale.x
+function collisionNormal(ballFlag: BallFlagType, ballPositionRO: Vector3, hitEntity: Entity, hitPositionRo: Vector3, hitScaleRo: Vector3): Vector3 {
+  let ballPosition = ballPositionRO
+  let hitEntityPosition = hitPositionRo
+  let hitEntityWidth = hitScaleRo.x
   let delta = ballPosition.subtract(hitEntityPosition)
-  let normal = new Vector3(0, 0, 1)
+  let normal = Vector3.create(0, 0, 1)
 
   // If the ball hits a paddle
-  if (hitEntity.hasComponent(PaddleFlag)) {
+  if (PaddleFlag.getMutableOrNull(hitEntity)) {
     // Paddle normal logic
     normal.x = delta.x / 2
 
@@ -113,20 +117,20 @@ function collisionNormal(ballEntity: Ball, ballFlag: BallFlagType, hitEntity: IE
       normal.set(1, 0, 0)
 
     // Corner cases
-    if (delta.x <= -hitEntityWidth / 2 && ballEntity.direction.x < 0)
+    if (delta.x <= -hitEntityWidth / 2 && ballFlag.direction.x < 0)
       normal.set(-1, 0, 1)
-    if (delta.x >= hitEntityWidth / 2 && ballEntity.direction.x > 0)
+    if (delta.x >= hitEntityWidth / 2 && ballFlag.direction.x > 0)
       normal.set(1, 0, 1)
 
     return Vector3.normalize(normal) // Normalize the vector first to maintain constant ball speed
   } else {
     if (delta.x <= -hitEntityWidth / 2 || delta.x >= hitEntityWidth / 2)
-      normal.set(1, 0, 0)
+      Vector3.copyFromFloats(1, 0, 0, normal)
 
     // Corner cases
-    if (delta.x <= -hitEntityWidth / 2 && ballEntity.direction.x < 0)
+    if (delta.x <= -hitEntityWidth / 2 && ballFlag.direction.x < 0)
       normal.set(0, 0, 1)
-    if (delta.x >= hitEntityWidth / 2 && ballEntity.direction.x > 0)
+    if (delta.x >= hitEntityWidth / 2 && ballFlag.direction.x > 0)
       normal.set(0, 0, 1)
   }
   return Vector3.normalize(normal)

src/modules/bar/arcades/gameObjects/arcade.ts

@@ -1,17 +1,18 @@
-import { Vector3 } from "@dcl/sdk/math"
+import { Vector3, Quaternion } from "@dcl/sdk/math"
 import { Entity, GltfContainer, Transform, engine } from '@dcl/sdk/ecs'
 
 
+
 export class Arcade {
   entity: Entity
   knob: Entity
 
-  constructor(position: Vector3, scale: Vector3, knob: boolean = true) {
+  constructor(src: string, position: Vector3, scale: Vector3, knob: boolean = true) {
 
     let _entity = engine.addEntity()
     this.entity = _entity
 
-    GltfContainer.create(this.entity, {src: "models/core_building/knob.glb"})
+    GltfContainer.create(this.entity, {src: src})
     Transform.create(this.entity,{
       position: position,
       scale: scale
@@ -33,9 +34,9 @@ export class Arcade {
     if (this.knob.hasComponent(utils.KeepRotatingComponent)) this.knob.removeComponent(utils.KeepRotatingComponent)
   }
   controlLeft() {
-    this.knob.addComponentOrReplace(new utils.KeepRotatingComponent(Quaternion.Euler(0, -90, 0)))
+    this.knob.addComponentOrReplace(new utils.KeepRotatingComponent(Quaternion.fromEulerDegrees(0, -90, 0)))
   }
   controlRight() {
-    this.knob.addComponentOrReplace(new utils.KeepRotatingComponent(Quaternion.Euler(0, 90, 0)))
+    this.knob.addComponentOrReplace(new utils.KeepRotatingComponent(Quaternion.fromEulerDegrees(0, 90, 0)))
   }
 }

src/modules/bar/arcades/gameObjects/brick.ts

@@ -1,15 +1,16 @@
 import { CollisionFlag } from "../gameLogic/collision"
-import { Entity, Material, MeshRenderer, Transform, engine } from "@dcl/sdk/ecs"
+import { Entity, Material, MeshRenderer, Schemas, Transform, engine } from "@dcl/sdk/ecs"
 import { Color4, Vector3 } from "@dcl/sdk/math"
 
 
-export const BrickFlag = engine.defineComponent('brickFlag', {})
+export const BrickFlag = engine.defineComponent('brickFlag', {removed: Schemas.Boolean})
 
 export class Brick {
   entity: Entity
 
   constructor(position: Vector3, scale: Vector3, color: Color4, parent: Entity) {
 
+
     let _entity = engine.addEntity()
     this.entity = _entity
 
@@ -25,7 +26,7 @@ export class Brick {
       emissiveIntensity: 0.95
     })
 
-    BrickFlag.create(this.entity)
+    BrickFlag.create(this.entity, {removed: false})
     CollisionFlag.create(this.entity)
   }
 }