diff --git a/src/components/InteractiveObjects/GenenricObject.js b/src/components/InteractiveObjects/GenenricObject.js new file mode 100644 index 0000000..a2fd5a4 --- /dev/null +++ b/src/components/InteractiveObjects/GenenricObject.js @@ -0,0 +1,11 @@ +class GenericObject{ + constructor(engine, data){ + return new Promise(async(resolve, reject)=>{ + this.source = await engine.load(data.$go.asset.name); + this.object = this.source.scene; + resolve(this); + }) + } +} + +export {GenericObject} \ No newline at end of file diff --git a/src/components/InteractiveObjects/GenericObject.vue b/src/components/InteractiveObjects/GenericObject.vue index 4d67d14..07ebe7b 100644 --- a/src/components/InteractiveObjects/GenericObject.vue +++ b/src/components/InteractiveObjects/GenericObject.vue @@ -1,10 +1,28 @@ \ No newline at end of file diff --git a/src/components/InteractiveObjects/Grass.js b/src/components/InteractiveObjects/Grass.js deleted file mode 100644 index 76e718a..0000000 --- a/src/components/InteractiveObjects/Grass.js +++ /dev/null @@ -1,65 +0,0 @@ -import { - Matrix4, - Mesh, - PlaneGeometry, - MeshPhongMaterial, - Vector3, - TextureLoader -} from 'three'; - -import * as BufferGeometryUtils from 'three/addons/utils/BufferGeometryUtils.js'; - -class Grass { - constructor(positions, texture, x, y) { - return new Promise((resolve, reject) => { - var tLoader = new TextureLoader(); - tLoader.load(texture, (t) => { - //t.encoding = sRGBEncoding; - // create the initial geometry - var geometry = new PlaneGeometry(x || 1, y || 1); - var material = new MeshPhongMaterial({ - map: t, - alphaTest: .5, - }); - geometry.applyMatrix4(new Matrix4().makeTranslation(0, geometry.parameters.height / 2, 0)); - geometry.normalizeNormals(); - - var arr = []; - for (var i = 0; i < positions.length; i++) { - var position = positions[i]; - var baseAngle = Math.PI * 2 * Math.random(); - - var nPlanes = 2; - for (var j = 0; j < nPlanes; j++) { - var angle = baseAngle + j * Math.PI / nPlanes; - var gg = geometry.clone(); - gg.rotateY(angle); - gg.translate(position.x, position.y, position.z); - arr.push(gg); - - var gg = geometry.clone(); - gg.rotateY(angle + Math.PI); - gg.translate(position.x, position.y, position.z); - arr.push(gg); - } - } - var mesh = new Mesh(BufferGeometryUtils.mergeGeometries(arr, false), material); - resolve(mesh); - arr.forEach(g => g.dispose()); - }); - }); - } - static positions(count, x, z) { - var positions = new Array(count); - for (var i = 0; i < count; i++) { - var position = new Vector3(); - position.x = (Math.random() - 0.5) * x; - position.z = (Math.random() - 0.5) * z; - positions[i] = position; - } - return positions; - } -} - - -export { Grass } \ No newline at end of file diff --git a/src/components/InteractiveObjects/Grass.vue b/src/components/InteractiveObjects/Grass.vue deleted file mode 100644 index e69de29..0000000 diff --git a/src/components/InteractiveObjects/InteractiveObject.js b/src/components/InteractiveObjects/InteractiveObject.js index 6973495..d81f27a 100644 --- a/src/components/InteractiveObjects/InteractiveObject.js +++ b/src/components/InteractiveObjects/InteractiveObject.js @@ -1,4 +1,6 @@ import { Group } from "three"; + +import { GenericObject } from "./GenenricObject"; import { PuzzleGame1 } from "./PuzzleGame1"; import { PuzzleGame2 } from "./PuzzleGame2"; // import { Game3 } from "./games/Game3"; @@ -9,9 +11,10 @@ import { TextObject } from "./TextObject"; import { ImageObject } from "./ImageObject"; import { VideoPlayer } from "./VideoPlayer"; import { MazeQuizGame } from "./MazeQuizGame/MazeQuizGame"; +import { Particles } from "./Particles"; import { assignMaterial, assignParams } from "@/lib/MeshUtils"; -const games = {PuzzleGame1, PuzzleGame2, PuzzleGame4, MazeQuizGame}; +const InteractiveObjectsImports = { PuzzleGame1, PuzzleGame2, PuzzleGame4, MazeQuizGame, Particles }; class InteractiveObject { constructor(obj, gameEngine, params) { @@ -58,14 +61,15 @@ class InteractiveObject { this.source = gltf; break; case 'GenericObject': - this.source = await gameEngine.load(obj.$go.asset.name); - this.object = this.source.scene; + let go = await new GenericObject(gameEngine, obj) //await gameEngine.load(obj.$go.asset.name); + this.source = go.source; + this.object = go.object; break; case 'PuzzleGame3': case 'PuzzleGame4': case 'PuzzleGame5': case 'PuzzleGame6': - let game = new games[obj.type](gameEngine, obj.args[0], obj.args[1], obj.args[2]); + let game = new InteractiveObjectsImports[obj.type](gameEngine, obj.args[0], obj.args[1], obj.args[2]); this.object = game.object; this.object.game = game; break; @@ -77,7 +81,8 @@ class InteractiveObject { case 'PuzzleGame1': case 'PuzzleGame2': case 'MazeQuizGame': - this.source = await new games[obj.type](gameEngine, obj); + case 'Particles': + this.source = await new InteractiveObjectsImports[obj.type](gameEngine, obj); this.object = this.source.object; break; } @@ -96,7 +101,9 @@ const InteractiveObjectTypes = [ id: 'MazeQuizGame', name: 'Maze Quiz Game' },{ id: 'VideoPlayer', name: 'Video Player' + },{ + id: 'Particles', name: 'Particles' } ]; -export { InteractiveObject, InteractiveObjectTypes } \ No newline at end of file +export { InteractiveObject, InteractiveObjectTypes, InteractiveObjectsImports } \ No newline at end of file diff --git a/src/components/InteractiveObjects/Particles.js b/src/components/InteractiveObjects/Particles.js new file mode 100644 index 0000000..88ade67 --- /dev/null +++ b/src/components/InteractiveObjects/Particles.js @@ -0,0 +1,62 @@ +import { + Matrix4, + Mesh, + PlaneGeometry, + MeshPhongMaterial, + Vector3, +} from 'three'; + +import * as BufferGeometryUtils from 'three/addons/utils/BufferGeometryUtils.js'; + +class Particles { + constructor(engine, data) { + const { x, y, count, w, h } = data; + let positions = Particles.positions(count, w, h); + return new Promise(async (resolve, reject) => { + let t = await engine.loadTexture(data.$go.asset.name) + var geometry = new PlaneGeometry(x || 1, y || 1); + var material = new MeshPhongMaterial({ + map: t, + alphaTest: .5, + }); + geometry.applyMatrix4(new Matrix4().makeTranslation(0, geometry.parameters.height / 2, 0)); + geometry.normalizeNormals(); + + var arr = []; + for (var i = 0; i < positions.length; i++) { + var position = positions[i]; + var baseAngle = Math.PI * 2 * Math.random(); + + var nPlanes = 2; + for (var j = 0; j < nPlanes; j++) { + var angle = baseAngle + j * Math.PI / nPlanes; + var gg = geometry.clone(); + gg.rotateY(angle); + gg.translate(position.x, position.y, position.z); + arr.push(gg); + + var gg = geometry.clone(); + gg.rotateY(angle + Math.PI); + gg.translate(position.x, position.y, position.z); + arr.push(gg); + } + } + this.object = new Mesh(BufferGeometryUtils.mergeGeometries(arr, false), material); + resolve(this); + arr.forEach(g => g.dispose()); + }); + } + static positions(count, x, z) { + let positions = new Array(count); + for (var i = 0; i < count; i++) { + var position = new Vector3(); + position.x = (Math.random() - 0.5) * x; + position.z = (Math.random() - 0.5) * z; + positions[i] = position; + } + return positions; + } +} + + +export { Particles } \ No newline at end of file diff --git a/src/components/InteractiveObjects/Particles.vue b/src/components/InteractiveObjects/Particles.vue new file mode 100644 index 0000000..3112fd5 --- /dev/null +++ b/src/components/InteractiveObjects/Particles.vue @@ -0,0 +1,49 @@ + + + \ No newline at end of file diff --git a/src/components/SceneDesigner/GameObject.vue b/src/components/SceneDesigner/GameObject.vue index ab703cb..610a7c4 100644 --- a/src/components/SceneDesigner/GameObject.vue +++ b/src/components/SceneDesigner/GameObject.vue @@ -18,7 +18,6 @@ - @@ -36,11 +35,12 @@ import VideoPlayer from '../InteractiveObjects/VideoPlayer.vue'; import PuzzleGame1 from '../InteractiveObjects/PuzzleGame1.vue'; import PuzzleGame2 from '../InteractiveObjects/PuzzleGame2.vue'; import MazeQuizGame from '../InteractiveObjects/MazeQuizGame/MazeQuizGame.vue'; +import Particles from '../InteractiveObjects/Particles.vue'; import GenericObject from '../InteractiveObjects/GenericObject.vue'; export default { emits:['target', 'preview'], - components: { SvgIcon, VideoPlayer, PuzzleGame1, PuzzleGame2, MazeQuizGame, GenericObject }, + components: { SvgIcon, GenericObject, VideoPlayer, PuzzleGame1, PuzzleGame2, MazeQuizGame, Particles, }, data(){ return { active: false diff --git a/src/lib/CharacterControls.js b/src/lib/CharacterControls.js index a37e9f2..8af4373 100644 --- a/src/lib/CharacterControls.js +++ b/src/lib/CharacterControls.js @@ -16,9 +16,8 @@ export class CharacterControls { walkVelocity = 7 lerp = (x, y, a) => x * (1 - a) + y * a; - constructor(model, mixer, animationsMap, engine, currentAction, po, pointerControls) { + constructor(model, animationsMap, engine, currentAction, po, pointerControls) { this.model = model - this.mixer = mixer this.animationsMap = animationsMap this.currentAction = currentAction this.animationsMap[currentAction].play() @@ -91,14 +90,13 @@ export class CharacterControls { const current = this.animationsMap[this.currentAction] current.fadeOut(this.fadeDuration) - toPlay.timeScale = 0.5; + //toPlay.timeScale = 1; toPlay.reset().fadeIn(this.fadeDuration).play(); this.currentAction = play this.actionStart = 0; } - this.mixer.update(delta) this.actionStart += delta; this.cameraDelta += delta * ( pointerControls.cameraLeft * -1 + pointerControls.cameraRight * 1) @@ -150,11 +148,6 @@ export class CharacterControls { cameraPosition.lerp(cameraDesiredPosition, delta*2) this.camera.position.copy(cameraPosition) - // this.camera.lookAt(new THREE.Vector3( - // this.model.position.x, - // 2, - // this.model.position.z - // )) this.orbitControl.target.set(this.model.position.x, 2, this.model.position.z) this.camera.lookAt(this.orbitControl.target) } @@ -165,4 +158,9 @@ export class CharacterControls { pointerControls.moveForward * 1 + pointerControls.moveBackward * -1 ] } + + idleReset(){ + this.actionStart = 0; + this.currentAction = 'idle' + } } \ No newline at end of file diff --git a/src/lib/GameEngine.js b/src/lib/GameEngine.js index afe3217..2a0fb2c 100644 --- a/src/lib/GameEngine.js +++ b/src/lib/GameEngine.js @@ -482,6 +482,7 @@ class GameEngine extends THREE.EventDispatcher{ let mouse = this.getMouseVector(mouseEvent, domElement); this.raycaster.setFromCamera(mouse, this.camera); this.clickable.update(mouse, this.camera, mouseEvent); + this.hero?.characterControls?.idleReset(); } autoScale(object, mk = 1) { diff --git a/src/lib/Hero.js b/src/lib/Hero.js index 4f865dd..a8dc4cc 100644 --- a/src/lib/Hero.js +++ b/src/lib/Hero.js @@ -31,7 +31,7 @@ class Hero{ po.collider.setTranslationWrtParent({ x: 0, y: 2.0, z: 0 }); //po.collider.setActiveEvents(RAPIER.ActiveEvents.COLLISION_EVENTS); - this.characterControls = new CharacterControls(this.model, this.mixer, + this.characterControls = new CharacterControls(this.model, this.animationsMap, gameEngine, 'idle', po, this.pointerControls) this.clock = new THREE.Clock()