From d50cbebb73850eeaece0477494ca9b4d23245fa8 Mon Sep 17 00:00:00 2001 From: nearnshaw Date: Tue, 3 Oct 2023 10:59:37 -0300 Subject: [PATCH] more animation fixes --- Hummingbirds/src/hummingBird.ts | 133 +++++---- Hummingbirds/src/index.ts | 119 ++++---- Shark-animation/src/index.ts | 108 ++++---- Swimming-Shark/src/shark.ts | 104 ++++--- Zombie-shooter/src/zombie.ts | 198 +++++++------ Zombie-shooter2/src/factory/zombie.ts | 120 ++++---- advanced-avatar-swap/src/index.ts | 52 ++-- .../src/modules/modelsHandler.ts | 202 +++++++------- .../src/modules/swappingControls.ts | 77 +++--- beer-dispenser/src/modules/factory.ts | 260 +++++++++--------- boids/src/shark.ts | 104 ++++--- 11 files changed, 735 insertions(+), 742 deletions(-) diff --git a/Hummingbirds/src/hummingBird.ts b/Hummingbirds/src/hummingBird.ts index 36b12b1b2..9fd12a9e8 100644 --- a/Hummingbirds/src/hummingBird.ts +++ b/Hummingbirds/src/hummingBird.ts @@ -3,82 +3,79 @@ import { Quaternion } from '@dcl/sdk/math' import * as utils from '@dcl-sdk/utils' export function createHummingBird() { - const bird = engine.addEntity() - Transform.create(bird, { - position: { x: 13, y: 3.5, z: 5 }, - rotation: { x: 0, y: 0, z: 0, w: 1 }, - scale: { x: 0.2, y: 0.2, z: 0.2 } - }) - GltfContainer.create(bird, { - src: 'models/hummingbird.glb' - }) - Animator.create(bird, { - states: [ - { - clip: 'fly', - loop: true, - playing: true, - shouldReset: false, - speed: 2, - name: 'fly' - }, - { - clip: 'look', - loop: false, - playing: false, - shouldReset: false, - name: 'look' - }, - { - clip: 'shake', - loop: false, - playing: false, - shouldReset: false, - name: 'shake' - } - ] - }) + const bird = engine.addEntity() + Transform.create(bird, { + position: { x: 13, y: 3.5, z: 5 }, + rotation: { x: 0, y: 0, z: 0, w: 1 }, + scale: { x: 0.2, y: 0.2, z: 0.2 } + }) + GltfContainer.create(bird, { + src: 'models/hummingbird.glb' + }) + Animator.create(bird, { + states: [ + { + clip: 'fly', + loop: true, + playing: true, + shouldReset: false, + speed: 2 + }, + { + clip: 'look', + loop: false, + playing: false, + shouldReset: false + }, + { + clip: 'shake', + loop: false, + playing: false, + shouldReset: false + } + ] + }) - // fly pattern - utils.timers.setInterval(() => { - const birdTransform = Transform.getMutable(bird) + // fly pattern + utils.timers.setInterval(() => { + const birdTransform = Transform.getMutable(bird) - // next target - const nextPos = { - x: Math.random() * 12 + 2, - y: Math.random() * 3 + 1, - z: Math.random() * 12 + 2 - } + // next target + const nextPos = { + x: Math.random() * 12 + 2, + y: Math.random() * 3 + 1, + z: Math.random() * 12 + 2 + } - const nextRot = Quaternion.fromLookAt(birdTransform.position, nextPos) + const nextRot = Quaternion.fromLookAt(birdTransform.position, nextPos) - // face new pos - utils.tweens.startRotation(bird, birdTransform.rotation, nextRot, 0.3, utils.InterpolationType.EASEINSINE) + // face new pos + utils.tweens.startRotation(bird, birdTransform.rotation, nextRot, 0.3, utils.InterpolationType.EASEINSINE) - // move to next pos (after rotating) - utils.timers.setTimeout( - () => { - utils.tweens.startTranslation(bird, birdTransform.position, nextPos, 2, utils.InterpolationType.EASEINEXPO) - }, - 300 // after rotation is over - ) + // move to next pos (after rotating) + utils.timers.setTimeout( + () => { + utils.tweens.startTranslation(bird, birdTransform.position, nextPos, 2, utils.InterpolationType.EASEINEXPO) + }, + 300 // after rotation is over + ) - // randomly play head animation - utils.timers.setTimeout( - () => randomHeadMovement(bird), - 2500 // after rotation and translation + pause - ) - }, 4000) // loop every 4 seconds + // randomly play head animation + utils.timers.setTimeout( + () => randomHeadMovement(bird), + 2500 // after rotation and translation + pause + ) + }, 4000) // loop every 4 seconds } // Randomly determine if any head moving animations are played export function randomHeadMovement(bird: Entity) { - const anim = Math.random() - if (anim < 0.2) { - const look = Animator.getClip(bird, 'look') - look.playing = true - } else if (anim > 0.8) { - const shake = Animator.getClip(bird, 'shake') - shake.playing = true - } + const anim = Math.random() + if (anim < 0.2) { + const look = Animator.getClip(bird, 'look') + look.playing = true + } else if (anim > 0.8) { + const shake = Animator.getClip(bird, 'shake') + shake.playing = true + } } diff --git a/Hummingbirds/src/index.ts b/Hummingbirds/src/index.ts index 9156e165d..ad136e837 100644 --- a/Hummingbirds/src/index.ts +++ b/Hummingbirds/src/index.ts @@ -1,70 +1,69 @@ import { - Animator, - AudioSource, - ColliderLayer, - engine, - GltfContainer, - InputAction, - pointerEventsSystem, - Transform + Animator, + AudioSource, + ColliderLayer, + engine, + GltfContainer, + InputAction, + pointerEventsSystem, + Transform } from '@dcl/sdk/ecs' import { createHummingBird } from './hummingBird' export function main() { - const ground = engine.addEntity() - Transform.create(ground, { - position: { x: 8, y: 0, z: 8 }, - rotation: { x: 0, y: 0, z: 0, w: 0 }, - scale: { x: 1.6, y: 1.6, z: 1.6 } - }) - GltfContainer.create(ground, { - src: 'models/Ground.gltf' - }) + const ground = engine.addEntity() + Transform.create(ground, { + position: { x: 8, y: 0, z: 8 }, + rotation: { x: 0, y: 0, z: 0, w: 0 }, + scale: { x: 1.6, y: 1.6, z: 1.6 } + }) + GltfContainer.create(ground, { + src: 'models/Ground.gltf' + }) - const tree = engine.addEntity() - Transform.create(tree, { - position: { x: 8, y: 0, z: 8 }, - rotation: { x: 0, y: 0, z: 0, w: 0 }, - scale: { x: 1.6, y: 1.6, z: 1.6 } - }) - GltfContainer.create(tree, { - src: 'models/Tree.gltf', - visibleMeshesCollisionMask: ColliderLayer.CL_POINTER, - invisibleMeshesCollisionMask: undefined - }) + const tree = engine.addEntity() + Transform.create(tree, { + position: { x: 8, y: 0, z: 8 }, + rotation: { x: 0, y: 0, z: 0, w: 0 }, + scale: { x: 1.6, y: 1.6, z: 1.6 } + }) + GltfContainer.create(tree, { + src: 'models/Tree.gltf', + visibleMeshesCollisionMask: ColliderLayer.CL_POINTER, + invisibleMeshesCollisionMask: undefined + }) - AudioSource.create(tree, { - audioClipUrl: 'sounds/pickUp.mp3', - loop: false, - playing: false - }) + AudioSource.create(tree, { + audioClipUrl: 'sounds/pickUp.mp3', + loop: false, + playing: false + }) - Animator.create(tree, { - states: [ - { - clip: 'Tree_Action', - loop: false, - playing: false, - shouldReset: true, - name: 'Tree_Action' - } - ] - }) + Animator.create(tree, { + states: [ + { + clip: 'Tree_Action', + loop: false, + playing: false, + shouldReset: true + } + ] + }) - pointerEventsSystem.onPointerDown( - { - entity: tree, - opts: { - button: InputAction.IA_PRIMARY, - hoverText: 'Shake' - } - }, - function () { - createHummingBird() - const anim = Animator.getMutable(tree) - anim.states[0].playing = true - const audioSource = AudioSource.getMutable(tree) - audioSource.playing = true - } - ) + pointerEventsSystem.onPointerDown( + { + entity: tree, + opts: { + button: InputAction.IA_PRIMARY, + hoverText: 'Shake' + } + }, + function () { + createHummingBird() + const anim = Animator.getMutable(tree) + anim.states[0].playing = true + const audioSource = AudioSource.getMutable(tree) + audioSource.playing = true + } + ) } diff --git a/Shark-animation/src/index.ts b/Shark-animation/src/index.ts index 41f6d169b..98331cded 100644 --- a/Shark-animation/src/index.ts +++ b/Shark-animation/src/index.ts @@ -1,68 +1,66 @@ import { - Animator, - ColliderLayer, - engine, - GltfContainer, - InputAction, - pointerEventsSystem, - Transform + Animator, + ColliderLayer, + engine, + GltfContainer, + InputAction, + pointerEventsSystem, + Transform } from '@dcl/sdk/ecs' import { Vector3 } from '@dcl/sdk/math' export function main() { - const seaBed = engine.addEntity() + const seaBed = engine.addEntity() - Transform.create(seaBed, { - position: Vector3.create(8, 0, 8), - scale: Vector3.create(0.8, 0.8, 0.8) - }) + Transform.create(seaBed, { + position: Vector3.create(8, 0, 8), + scale: Vector3.create(0.8, 0.8, 0.8) + }) - GltfContainer.create(seaBed, { - src: 'models/Underwater.gltf' - }) + GltfContainer.create(seaBed, { + src: 'models/Underwater.gltf' + }) - const shark = engine.addEntity() + const shark = engine.addEntity() - Transform.create(shark, { - position: Vector3.create(8, 3, 8) - }) + Transform.create(shark, { + position: Vector3.create(8, 3, 8) + }) - GltfContainer.create(shark, { - src: 'models/shark.glb', - visibleMeshesCollisionMask: ColliderLayer.CL_POINTER, - invisibleMeshesCollisionMask: undefined - }) + GltfContainer.create(shark, { + src: 'models/shark.glb', + visibleMeshesCollisionMask: ColliderLayer.CL_POINTER, + invisibleMeshesCollisionMask: undefined + }) - Animator.create(shark, { - states: [ - { - clip: 'swim', - name: 'swim', - playing: true, - loop: true - }, - { - clip: 'bite', - name: 'bite', - playing: false, - loop: false, - shouldReset: true - } - ] - }) + Animator.create(shark, { + states: [ + { + clip: 'swim', + playing: true, + loop: true + }, + { + clip: 'bite', + playing: false, + loop: false, + shouldReset: true + } + ] + }) - pointerEventsSystem.onPointerDown( - { - entity: shark, - opts: { - button: InputAction.IA_POINTER, - hoverText: 'Bite' - } - }, - () => { - // TODO use Animator.getClip() - const mutableAnimator = Animator.getMutable(shark) - mutableAnimator.states[1].playing = true - } - ) + pointerEventsSystem.onPointerDown( + { + entity: shark, + opts: { + button: InputAction.IA_POINTER, + hoverText: 'Bite' + } + }, + () => { + // TODO use Animator.getClip() + const mutableAnimator = Animator.getMutable(shark) + mutableAnimator.states[1].playing = true + } + ) } diff --git a/Swimming-Shark/src/shark.ts b/Swimming-Shark/src/shark.ts index af3ae9c4c..569d115da 100644 --- a/Swimming-Shark/src/shark.ts +++ b/Swimming-Shark/src/shark.ts @@ -5,61 +5,59 @@ import { SpeedComponent } from './components/swimSpeed' import { cpoints } from './sharkPath' export function createShark() { - const shark = engine.addEntity() - Transform.create(shark, { - position: { x: 8, y: 3, z: 8 }, - rotation: { x: 0, y: 0, z: 0, w: 1 }, - scale: { x: 0.5, y: 0.5, z: 0.5 } - }) - GltfContainer.create(shark, { - src: 'models/shark.glb' - }) - Animator.create(shark, { - states: [ - { - clip: 'swim', - loop: true, - playing: true, - speed: 0.5, - weight: 0.5, - name: 'swim' - }, - { - clip: 'bite', - loop: true, - playing: false, - shouldReset: false, - name: 'bite' - } - ] - }) + const shark = engine.addEntity() + Transform.create(shark, { + position: { x: 8, y: 3, z: 8 }, + rotation: { x: 0, y: 0, z: 0, w: 1 }, + scale: { x: 0.5, y: 0.5, z: 0.5 } + }) + GltfContainer.create(shark, { + src: 'models/shark.glb' + }) + Animator.create(shark, { + states: [ + { + clip: 'swim', + loop: true, + playing: true, + speed: 0.5, + weight: 0.5 + }, + { + clip: 'bite', + loop: true, + playing: false, + shouldReset: false + } + ] + }) - PathDataComponent.create(shark, { - path: cpoints, - origin: 0, - target: 1, - startRot: Quaternion.Zero(), - endRot: Quaternion.Zero(), - fraction: 0, - paused: false - }) + PathDataComponent.create(shark, { + path: cpoints, + origin: 0, + target: 1, + startRot: Quaternion.Zero(), + endRot: Quaternion.Zero(), + fraction: 0, + paused: false + }) - SpeedComponent.create(shark, { - speed: 0.5 - }) + SpeedComponent.create(shark, { + speed: 0.5 + }) - // MoveTransformComponent.create(shark, { - // hasFinished: false, - // start: cpoints[0], - // end: cpoints[1], - // fraction: 0 - // }) + // MoveTransformComponent.create(shark, { + // hasFinished: false, + // start: cpoints[0], + // end: cpoints[1], + // fraction: 0 + // }) - // RotateTransformComponent.create(shark, { - // hasFinished: false, - // start: Quaternion.Zero(), - // end: Quaternion.Zero(), - // fraction: 1, - // interpolationType: 0 - // }) + // RotateTransformComponent.create(shark, { + // hasFinished: false, + // start: Quaternion.Zero(), + // end: Quaternion.Zero(), + // fraction: 1, + // interpolationType: 0 + // }) } diff --git a/Zombie-shooter/src/zombie.ts b/Zombie-shooter/src/zombie.ts index 98318c778..900992651 100644 --- a/Zombie-shooter/src/zombie.ts +++ b/Zombie-shooter/src/zombie.ts @@ -5,109 +5,107 @@ import { onMoveZombieFinish } from './systems/moveZombie' import { playSound } from './systems/sound' import { - Entity, - engine, - Transform, - GltfContainer, - Animator, - NftShape, - pointerEventsSystem, - InputAction, - MeshCollider, - AvatarAttach, - AvatarAnchorPointType + Entity, + engine, + Transform, + GltfContainer, + Animator, + NftShape, + pointerEventsSystem, + InputAction, + MeshCollider, + AvatarAttach, + AvatarAnchorPointType } from '@dcl/sdk/ecs' export function createZombie(xPos: number): Entity { - const zombie = engine.addEntity() - - Transform.create(zombie, { - position: { x: xPos, y: 1, z: 3 } - }) - - GltfContainer.create(zombie, { - src: 'models/zombie.glb' - }) - - MoveTransformComponent.create(zombie, { - start: { x: xPos, y: 1, z: 3 }, - end: { x: xPos, y: 1, z: 12 }, - duration: 6, - normalizedTime: 0, - lerpTime: 0, - speed: 0.04, - hasFinished: false, - interpolationType: 1 - }) - - MeshCollider.setBox(zombie) - - Animator.create(zombie, { - states: [ - { - clip: 'Walking', - loop: true, - name: 'Walk', - playing: true - }, - { - clip: 'Attacking', - loop: true, - name: 'Attack', - playing: false - } - ] - }) - - pointerEventsSystem.onPointerDown( - { - entity: zombie, - opts: { - button: InputAction.IA_POINTER, - hoverText: 'Shoot' - } - }, - function () { - console.log('BOOM!!!') - - engine.removeEntity(zombie) - playSound(dummySoundPlayer, 'sounds/explosion.mp3', true) - - if (GameControllerComponent.has(coneEntity)) { - GameControllerComponent.getMutable(coneEntity).score += 1 - } - } - ) - - onMoveZombieFinish(zombie, () => { - console.log('finished zombie', zombie) - - if (GameControllerComponent.has(coneEntity)) { - GameControllerComponent.getMutable(coneEntity).livesLeft -= 1 - } - - const animator = Animator.getMutable(zombie) - const walkAnim = Animator.getClip(zombie, 'Walking') - const attackAnim = Animator.getClip(zombie, 'Attacking') - if (walkAnim && attackAnim) { - walkAnim.playing = false - walkAnim.loop = false - attackAnim.playing = true - attackAnim.loop = true - } - - const nfts = engine.getEntitiesWith(NftShape) - - //only remove first - for (const [entity] of nfts) { - engine.removeEntity(entity) - break - } - - playSound(zombie, 'sounds/attack.mp3', true) - }) - - return zombie + const zombie = engine.addEntity() + + Transform.create(zombie, { + position: { x: xPos, y: 1, z: 3 } + }) + + GltfContainer.create(zombie, { + src: 'models/zombie.glb' + }) + + MoveTransformComponent.create(zombie, { + start: { x: xPos, y: 1, z: 3 }, + end: { x: xPos, y: 1, z: 12 }, + duration: 6, + normalizedTime: 0, + lerpTime: 0, + speed: 0.04, + hasFinished: false, + interpolationType: 1 + }) + + MeshCollider.setBox(zombie) + + Animator.create(zombie, { + states: [ + { + clip: 'Walking', + loop: true, + playing: true + }, + { + clip: 'Attacking', + loop: true, + playing: false + } + ] + }) + + pointerEventsSystem.onPointerDown( + { + entity: zombie, + opts: { + button: InputAction.IA_POINTER, + hoverText: 'Shoot' + } + }, + function () { + console.log('BOOM!!!') + + engine.removeEntity(zombie) + playSound(dummySoundPlayer, 'sounds/explosion.mp3', true) + + if (GameControllerComponent.has(coneEntity)) { + GameControllerComponent.getMutable(coneEntity).score += 1 + } + } + ) + + onMoveZombieFinish(zombie, () => { + console.log('finished zombie', zombie) + + if (GameControllerComponent.has(coneEntity)) { + GameControllerComponent.getMutable(coneEntity).livesLeft -= 1 + } + + const animator = Animator.getMutable(zombie) + const walkAnim = Animator.getClip(zombie, 'Walking') + const attackAnim = Animator.getClip(zombie, 'Attacking') + if (walkAnim && attackAnim) { + walkAnim.playing = false + walkAnim.loop = false + attackAnim.playing = true + attackAnim.loop = true + } + + const nfts = engine.getEntitiesWith(NftShape) + + //only remove first + for (const [entity] of nfts) { + engine.removeEntity(entity) + break + } + + playSound(zombie, 'sounds/attack.mp3', true) + }) + + return zombie } const dummySoundPlayer = engine.addEntity() diff --git a/Zombie-shooter2/src/factory/zombie.ts b/Zombie-shooter2/src/factory/zombie.ts index 29cf7cbe0..65c7c8ffe 100644 --- a/Zombie-shooter2/src/factory/zombie.ts +++ b/Zombie-shooter2/src/factory/zombie.ts @@ -1,77 +1,75 @@ import { - Entity, - engine, - Transform, - GltfContainer, - MeshRenderer, - Animator, - PointerEvents, - PointerEventType, - InputAction, - MeshCollider + Entity, + engine, + Transform, + GltfContainer, + MeshRenderer, + Animator, + PointerEvents, + PointerEventType, + InputAction, + MeshCollider } from '@dcl/sdk/ecs' import { MoveTransformComponent } from '../components/moveTransport' import { ZombieComponent } from '../components/zombie' export function createZombie(xPos: number): Entity { - const zombie = engine.addEntity() + const zombie = engine.addEntity() - ZombieComponent.create(zombie) + ZombieComponent.create(zombie) - Transform.create(zombie, { - position: { x: xPos, y: 1, z: 3 } - }) + Transform.create(zombie, { + position: { x: xPos, y: 1, z: 3 } + }) - const zombieGltf = true + const zombieGltf = true - if (zombieGltf) { - GltfContainer.create(zombie, { - src: 'models/zombie.glb' - }) - } else { - MeshRenderer.setBox(zombie) - } + if (zombieGltf) { + GltfContainer.create(zombie, { + src: 'models/zombie.glb' + }) + } else { + MeshRenderer.setBox(zombie) + } - MoveTransformComponent.create(zombie, { - start: { x: xPos, y: 1, z: 3 }, - end: { x: xPos, y: 1, z: 12 }, - duration: 6, - normalizedTime: 0, - lerpTime: 0, - speed: 0.04, - interpolationType: 1 - }) + MoveTransformComponent.create(zombie, { + start: { x: xPos, y: 1, z: 3 }, + end: { x: xPos, y: 1, z: 12 }, + duration: 6, + normalizedTime: 0, + lerpTime: 0, + speed: 0.04, + interpolationType: 1 + }) - Animator.create(zombie, { - states: [ - { - clip: 'Walking', - loop: true, - name: 'Walk', - playing: true - }, - { - clip: 'Attacking', - loop: true, - name: 'Attack', - playing: false - } - ] - }) + Animator.create(zombie, { + states: [ + { + clip: 'Walking', + loop: true, + playing: true + }, + { + clip: 'Attacking', + loop: true, + playing: false + } + ] + }) - MeshCollider.setBox(zombie) + MeshCollider.setBox(zombie) - PointerEvents.create(zombie, { - pointerEvents: [ - { - eventType: PointerEventType.PET_DOWN, - eventInfo: { - button: InputAction.IA_POINTER, - hoverText: 'Shoot' - } - } - ] - }) + PointerEvents.create(zombie, { + pointerEvents: [ + { + eventType: PointerEventType.PET_DOWN, + eventInfo: { + button: InputAction.IA_POINTER, + hoverText: 'Shoot' + } + } + ] + }) - return zombie + return zombie } diff --git a/advanced-avatar-swap/src/index.ts b/advanced-avatar-swap/src/index.ts index ac4dc732b..b67a2b797 100644 --- a/advanced-avatar-swap/src/index.ts +++ b/advanced-avatar-swap/src/index.ts @@ -6,38 +6,38 @@ import { createJoinTeamControl } from './modules/swappingControls' import { TeamModels } from './modules/modelsHandler' export function main() { - // Initializing for models to be properly loaded even before usage - initializeModels() + // Initializing for models to be properly loaded even before usage + initializeModels() - // Instantiate ground model - const groundEntity = engine.addEntity() - MeshRenderer.setBox(groundEntity) - Transform.create(groundEntity, { - position: Vector3.create(8, 0, 18.5), - scale: Vector3.create(16, 0.1, 27) - }) + // Instantiate ground model + const groundEntity = engine.addEntity() + MeshRenderer.setBox(groundEntity) + Transform.create(groundEntity, { + position: Vector3.create(8, 0, 18.5), + scale: Vector3.create(16, 0.1, 27) + }) - // Instantiate 'Santa' character animated model - const modelEntity = initializeCharacter() + // Instantiate 'Santa' character animated model + const modelEntity = initializeCharacter() - const modelEntityTransform = Transform.get(modelEntity) + const modelEntityTransform = Transform.get(modelEntity) - if (modelEntityTransform.parent) { - AvatarAttach.create(modelEntityTransform.parent, { - anchorPointId: AvatarAnchorPointType.AAPT_POSITION - }) - } + if (modelEntityTransform.parent) { + AvatarAttach.create(modelEntityTransform.parent, { + anchorPointId: AvatarAnchorPointType.AAPT_POSITION + }) + } - // Set avatar modifier area to swap player avatar - createAvatarSwappingArea(Vector3.create(8, 2, 18.5), Vector3.create(16, 4, 27), modelEntity) + // Set avatar modifier area to swap player avatar + createAvatarSwappingArea(Vector3.create(8, 2, 18.5), Vector3.create(16, 4, 27), modelEntity) - // Add a wall of separation between 2 areas - createSeparationWall(Vector3.create(8, 0.5, 4.75), Vector3.create(16, 1.5, 0.5)) + // Add a wall of separation between 2 areas + createSeparationWall(Vector3.create(8, 0.5, 4.75), Vector3.create(16, 1.5, 0.5)) - // Add Swap Models Controls - createJoinTeamControl(TeamModels.Santa, Vector3.create(7, 1, 6), Color4.Red()) - createJoinTeamControl(TeamModels.Krampus, Vector3.create(9, 1, 6), Color4.Blue()) + // Add Swap Models Controls + createJoinTeamControl(TeamModels.Santa, Vector3.create(7, 1, 6), Color4.Red()) + createJoinTeamControl(TeamModels.Krampus, Vector3.create(9, 1, 6), Color4.Blue()) - // Register avatar swapping system - engine.addSystem(avatarSwappingSystem) + // Register avatar swapping system + engine.addSystem(avatarSwappingSystem) } diff --git a/advanced-avatar-swap/src/modules/modelsHandler.ts b/advanced-avatar-swap/src/modules/modelsHandler.ts index 9d5ac59ac..83a2db8d6 100644 --- a/advanced-avatar-swap/src/modules/modelsHandler.ts +++ b/advanced-avatar-swap/src/modules/modelsHandler.ts @@ -2,42 +2,41 @@ import { engine, Entity, GltfContainer, Transform, Animator, PBAnimator, PBAnima import { Vector3 } from '@dcl/sdk/math' export enum TeamModels { - None = 'None', - Krampus = 'Krampus', - Santa = 'Santa' + None = 'None', + Krampus = 'Krampus', + Santa = 'Santa' } const santaModel = 'models/Santa_FullBody.glb' const krampusModel = 'models/Grinch_FullBody.glb' +export let CURRENT_TEAM: TeamModels = TeamModels.Santa + + const santaStates: PBAnimationState[] = [ - { - name: 'Idle', - clip: 'Idle_Santa', - loop: true, - shouldReset: false - }, - { - name: 'Running', - clip: 'Run_Santa', - loop: true, - shouldReset: false - } + { + clip: 'Idle_Santa', + loop: true, + shouldReset: false + }, + { + clip: 'Run_Santa', + loop: true, + shouldReset: false + } ] const krampusStates: PBAnimationState[] = [ - { - name: 'Idle', - clip: 'Idle', - loop: true, - shouldReset: false - }, - { - name: 'Running', - clip: 'Run', - loop: true, - shouldReset: false - } + { + clip: 'Idle', + loop: true, + shouldReset: false + }, + { + clip: 'Run', + loop: true, + shouldReset: false + } ] let parentEntity: Entity @@ -45,86 +44,99 @@ let modelEntity: Entity let animator: PBAnimator export function initializeCharacter(): Entity { - parentEntity = engine.addEntity() - - modelEntity = engine.addEntity() - - GltfContainer.create(modelEntity, { - src: santaModel - }) - Transform.create(modelEntity, { - position: Vector3.create(0, 0.75, 0), - scale: Vector3.create(1, 1, 1), - parent: parentEntity - }) - animator = Animator.create(modelEntity, { - states: santaStates - }) - - return modelEntity + parentEntity = engine.addEntity() + + modelEntity = engine.addEntity() + + GltfContainer.create(modelEntity, { + src: santaModel + }) + Transform.create(modelEntity, { + position: Vector3.create(0, 0.75, 0), + scale: Vector3.create(1, 1, 1), + parent: parentEntity + }) + animator = Animator.create(modelEntity, { + states: santaStates + }) + + return modelEntity } let currentModel: TeamModels export function changeModel(targetModel: TeamModels) { - if (currentModel == targetModel) return - currentModel = targetModel - switch (currentModel) { - case TeamModels.Krampus: - console.log('Swap model to Kramps') - GltfContainer.createOrReplace(modelEntity, { - src: krampusModel - }) - animator.states = krampusStates - break - case TeamModels.Santa: - console.log('Swap model to Santa') - GltfContainer.createOrReplace(modelEntity, { - src: santaModel - }) - animator.states = santaStates - break - } + if (currentModel == targetModel) return + currentModel = targetModel + switch (currentModel) { + case TeamModels.Krampus: + console.log('Swap model to Kramps') + GltfContainer.createOrReplace(modelEntity, { + src: krampusModel + }) + animator.states = krampusStates + CURRENT_TEAM = TeamModels.Krampus + + break + case TeamModels.Santa: + console.log('Swap model to Santa') + GltfContainer.createOrReplace(modelEntity, { + src: santaModel + }) + animator.states = santaStates + CURRENT_TEAM = TeamModels.Santa + + break + } } export enum AniamtionState { - None = 'None', - Idle = 'Idle', - Run = 'Run' + None = 'None', + Idle = 'Idle', + Run = 'Run' } let currentAnimation: AniamtionState export function playAnimation(animation: AniamtionState) { - if (currentAnimation === animation) return - currentAnimation = animation - switch (currentAnimation) { - case AniamtionState.Idle: - Animator.playSingleAnimation(modelEntity, 'Idle', false) - break - - case AniamtionState.Run: - Animator.playSingleAnimation(modelEntity, 'Running', false) - break - } + if (currentAnimation === animation) return + currentAnimation = animation + switch (currentAnimation) { + case AniamtionState.Idle: + if (CURRENT_TEAM == TeamModels.Krampus) { + Animator.playSingleAnimation(modelEntity, 'Idle', false) + } else if (CURRENT_TEAM == TeamModels.Santa) { + Animator.playSingleAnimation(modelEntity, 'Idle_Santa', false) + } + + break + + case AniamtionState.Run: + if (CURRENT_TEAM == TeamModels.Krampus) { + Animator.playSingleAnimation(modelEntity, 'Run', false) + } else if (CURRENT_TEAM == TeamModels.Santa) { + Animator.playSingleAnimation(modelEntity, 'Run_Santa', false) + } + break + } } export function initializeModels() { - let santaHolder = engine.addEntity() - GltfContainer.create(santaHolder, { - src: santaModel - }) - - Transform.create(santaHolder, { - position: Vector3.create(0, 4, 0), - scale: Vector3.create(0, 0, 0) - }) - - let krampusHolder = engine.addEntity() - GltfContainer.create(krampusHolder, { - src: krampusModel - }) - - Transform.create(krampusHolder, { - position: Vector3.create(0, 4, 0), - scale: Vector3.create(0, 0, 0) - }) + let santaHolder = engine.addEntity() + GltfContainer.create(santaHolder, { + src: santaModel + }) + + Transform.create(santaHolder, { + position: Vector3.create(0, 4, 0), + scale: Vector3.create(0, 0, 0) + }) + + let krampusHolder = engine.addEntity() + GltfContainer.create(krampusHolder, { + src: krampusModel + }) + + Transform.create(krampusHolder, { + position: Vector3.create(0, 4, 0), + scale: Vector3.create(0, 0, 0) + }) } diff --git a/advanced-avatar-swap/src/modules/swappingControls.ts b/advanced-avatar-swap/src/modules/swappingControls.ts index bacc4de92..485204601 100644 --- a/advanced-avatar-swap/src/modules/swappingControls.ts +++ b/advanced-avatar-swap/src/modules/swappingControls.ts @@ -1,50 +1,51 @@ import { - InputAction, - Material, - MeshCollider, - MeshRenderer, - TextShape, - Transform, - engine, - pointerEventsSystem + InputAction, + Material, + MeshCollider, + MeshRenderer, + TextShape, + Transform, + engine, + pointerEventsSystem } from '@dcl/sdk/ecs' import { Color4, Vector3 } from '@dcl/sdk/math' import { TeamModels, changeModel } from './modelsHandler' + export function createJoinTeamControl(team: TeamModels, position: Vector3, color: Color4) { - let teamBall = engine.addEntity() + let teamBall = engine.addEntity() - MeshRenderer.setSphere(teamBall) - Material.setPbrMaterial(teamBall, { - albedoColor: color - }) + MeshRenderer.setSphere(teamBall) + Material.setPbrMaterial(teamBall, { + albedoColor: color + }) - MeshCollider.setBox(teamBall) + MeshCollider.setBox(teamBall) - Transform.create(teamBall, { - position: position, - scale: Vector3.create(0.5, 0.5, 0.5) - }) + Transform.create(teamBall, { + position: position, + scale: Vector3.create(0.5, 0.5, 0.5) + }) - pointerEventsSystem.onPointerDown( - teamBall, - function () { - changeModel(team) - }, - { - button: InputAction.IA_PRIMARY, - hoverText: 'Join Team: ' + team, - maxDistance: 5 - } - ) + pointerEventsSystem.onPointerDown( + teamBall, + function () { + changeModel(team) + }, + { + button: InputAction.IA_PRIMARY, + hoverText: 'Join Team: ' + team, + maxDistance: 5 + } + ) - let label = engine.addEntity() - Transform.create(label, { - parent: teamBall, - position: Vector3.create(0, 2, 0) - }) - TextShape.create(label, { - text: 'Join Team:\n' + team, - fontSize: 5 - }) + let label = engine.addEntity() + Transform.create(label, { + parent: teamBall, + position: Vector3.create(0, 2, 0) + }) + TextShape.create(label, { + text: 'Join Team:\n' + team, + fontSize: 5 + }) } diff --git a/beer-dispenser/src/modules/factory.ts b/beer-dispenser/src/modules/factory.ts index 3865765cd..3ff8c8722 100644 --- a/beer-dispenser/src/modules/factory.ts +++ b/beer-dispenser/src/modules/factory.ts @@ -1,157 +1,151 @@ import { - engine, - GltfContainer, - Transform, - Animator, - PointerEvents, - PointerEventType, - InputAction, - Entity, - MeshCollider, - MeshRenderer, - AudioSource, - ColliderLayer + engine, + GltfContainer, + Transform, + Animator, + PointerEvents, + PointerEventType, + InputAction, + Entity, + MeshCollider, + MeshRenderer, + AudioSource, + ColliderLayer } from '@dcl/sdk/ecs' import { Vector3, Quaternion } from '@dcl/sdk/math' import { BeerGlass, BeerType, getTapData, TapBase, TapComponent } from '../definitions' export function createBeerGlass(model: string, position: Vector3) { - const glassEntity = engine.addEntity() + const glassEntity = engine.addEntity() - GltfContainer.create(glassEntity, { - src: model, - visibleMeshesCollisionMask: ColliderLayer.CL_POINTER, - invisibleMeshesCollisionMask: undefined - }) + GltfContainer.create(glassEntity, { + src: model, + visibleMeshesCollisionMask: ColliderLayer.CL_POINTER, + invisibleMeshesCollisionMask: undefined + }) - Transform.create(glassEntity, { position }) + Transform.create(glassEntity, { position }) - Animator.create(glassEntity, { - states: [ - { - clip: 'Blank', - name: 'Blank', - playing: true - }, - { - clip: 'PourRed', - name: 'PourRed', - loop: false - }, - { - clip: 'PourYellow', - name: 'PourYellow', - loop: false - }, - { - clip: 'PourGreen', - name: 'PourGreen', - loop: false - } - ] - }) - BeerGlass.create(glassEntity) + Animator.create(glassEntity, { + states: [ + { + clip: 'Blank', + playing: true + }, + { + clip: 'PourRed', + loop: false + }, + { + clip: 'PourYellow', + loop: false + }, + { + clip: 'PourGreen', + loop: false + } + ] + }) + BeerGlass.create(glassEntity) - PointerEvents.create(glassEntity, { - pointerEvents: [ - { - eventType: PointerEventType.PET_DOWN, - eventInfo: { - hoverText: 'Pick up', - maxDistance: 5, - button: InputAction.IA_PRIMARY - } - } - ] - }) + PointerEvents.create(glassEntity, { + pointerEvents: [ + { + eventType: PointerEventType.PET_DOWN, + eventInfo: { + hoverText: 'Pick up', + maxDistance: 5, + button: InputAction.IA_PRIMARY + } + } + ] + }) } export function createTap(tapBeerType: BeerType, dispenseEntity: Entity) { - const tapEntity = engine.addEntity() - const tapData = getTapData(tapBeerType) + const tapEntity = engine.addEntity() + const tapData = getTapData(tapBeerType) - TapComponent.create(tapEntity, { - beerType: tapBeerType - }) - GltfContainer.create(tapEntity, { - src: tapData.model - }) - Transform.create(tapEntity, { - parent: dispenseEntity - }) - Animator.create(tapEntity, { - states: [ - { - clip: 'Blank', - name: 'Blank', - playing: true, - loop: false - }, - { - clip: 'Pour', - name: 'Pour', - loop: false - } - ] - }) + TapComponent.create(tapEntity, { + beerType: tapBeerType + }) + GltfContainer.create(tapEntity, { + src: tapData.model + }) + Transform.create(tapEntity, { + parent: dispenseEntity + }) + Animator.create(tapEntity, { + states: [ + { + clip: 'Blank', + playing: true, + loop: false + }, + { + clip: 'Pour', + loop: false + } + ] + }) - PointerEvents.create(tapEntity, { - pointerEvents: [ - { - eventType: PointerEventType.PET_DOWN, - eventInfo: { - hoverText: 'Pour', - maxDistance: 5, - button: InputAction.IA_PRIMARY - } - } - ] - }) + PointerEvents.create(tapEntity, { + pointerEvents: [ + { + eventType: PointerEventType.PET_DOWN, + eventInfo: { + hoverText: 'Pour', + maxDistance: 5, + button: InputAction.IA_PRIMARY + } + } + ] + }) - const tapColliderPosition = Vector3.add(tapData.position, Vector3.create(0, 0.05, 0)) - const colliderParentEntity = engine.addEntity() - Transform.create(colliderParentEntity, { - parent: tapEntity, - position: tapColliderPosition - }) - TapBase.create(colliderParentEntity, { - beerType: tapBeerType - }) + const tapColliderPosition = Vector3.add(tapData.position, Vector3.create(0, 0.05, 0)) + const colliderParentEntity = engine.addEntity() + Transform.create(colliderParentEntity, { + parent: tapEntity, + position: tapColliderPosition + }) + TapBase.create(colliderParentEntity, { + beerType: tapBeerType + }) - const colliderEntity = engine.addEntity() - Transform.create(colliderEntity, { - parent: colliderParentEntity, - scale: Vector3.scale(Vector3.One(), 0.33), - rotation: Quaternion.fromEulerDegrees(90, 0, 0) - }) + const colliderEntity = engine.addEntity() + Transform.create(colliderEntity, { + parent: colliderParentEntity, + scale: Vector3.scale(Vector3.One(), 0.33), + rotation: Quaternion.fromEulerDegrees(90, 0, 0) + }) - MeshCollider.setPlane(colliderEntity) - // Debug to see the collider - //MeshRenderer.setPlane(colliderEntity) - PointerEvents.create(colliderEntity, { - pointerEvents: [ - { - eventType: PointerEventType.PET_DOWN, - eventInfo: { - hoverText: 'Place mug', - button: InputAction.IA_PRIMARY - } - } - ] - }) + MeshCollider.setPlane(colliderEntity) + // Debug to see the collider + //MeshRenderer.setPlane(colliderEntity) + PointerEvents.create(colliderEntity, { + pointerEvents: [ + { + eventType: PointerEventType.PET_DOWN, + eventInfo: { + hoverText: 'Place mug', + button: InputAction.IA_PRIMARY + } + } + ] + }) } export function playSound(audio: string, loop: boolean = false, position?: Vector3) { - const entity = engine.addEntity() - AudioSource.create(entity, { - audioClipUrl: audio, - loop, - playing: true - }) + const entity = engine.addEntity() + AudioSource.create(entity, { + audioClipUrl: audio, + loop, + playing: true + }) - Transform.create(entity, { - position - }) + Transform.create(entity, { + position + }) - return entity + return entity } diff --git a/boids/src/shark.ts b/boids/src/shark.ts index be626b7f1..5ae4104cd 100644 --- a/boids/src/shark.ts +++ b/boids/src/shark.ts @@ -5,61 +5,59 @@ import { SpeedComponent } from './components/swimSpeed' import { cpoints } from './sharkPath' export function createShark() { - const shark = engine.addEntity() - Transform.create(shark, { - position: { x: 8, y: 3, z: 8 }, - rotation: { x: 0, y: 0, z: 0, w: 1 }, - scale: { x: 0.5, y: 0.5, z: 0.5 } - }) - GltfContainer.create(shark, { - src: 'models/shark.glb' - }) - Animator.create(shark, { - states: [ - { - clip: 'swim', - loop: true, - playing: true, - speed: 0.5, - weight: 0.5, - name: 'swim' - }, - { - clip: 'bite', - loop: true, - playing: false, - shouldReset: false, - name: 'bite' - } - ] - }) + const shark = engine.addEntity() + Transform.create(shark, { + position: { x: 8, y: 3, z: 8 }, + rotation: { x: 0, y: 0, z: 0, w: 1 }, + scale: { x: 0.5, y: 0.5, z: 0.5 } + }) + GltfContainer.create(shark, { + src: 'models/shark.glb' + }) + Animator.create(shark, { + states: [ + { + clip: 'swim', + loop: true, + playing: true, + speed: 0.5, + weight: 0.5, + }, + { + clip: 'bite', + loop: true, + playing: false, + shouldReset: false + } + ] + }) - SpeedComponent.create(shark, { - speed: 0.5 - }) + SpeedComponent.create(shark, { + speed: 0.5 + }) - // MoveTransformComponent.create(shark, { - // hasFinished: false, - // start: cpoints[0], - // end: cpoints[1], - // fraction: 0 - // }) + // MoveTransformComponent.create(shark, { + // hasFinished: false, + // start: cpoints[0], + // end: cpoints[1], + // fraction: 0 + // }) - // RotateTransformComponent.create(shark, { - // hasFinished: false, - // start: Quaternion.Zero(), - // end: Quaternion.Zero(), - // fraction: 1, - // interpolationType: 0 - // }) + // RotateTransformComponent.create(shark, { + // hasFinished: false, + // start: Quaternion.Zero(), + // end: Quaternion.Zero(), + // fraction: 1, + // interpolationType: 0 + // }) - PathDataComponent.create(shark, { - path: cpoints, - origin: 0, - target: 1, - startRot: Quaternion.Zero(), - endRot: Quaternion.Zero(), - fraction: 0, - paused: false - }) + PathDataComponent.create(shark, { + path: cpoints, + origin: 0, + target: 1, + startRot: Quaternion.Zero(), + endRot: Quaternion.Zero(), + fraction: 0, + paused: false + }) }