imi-bas/pronature-platform
1
0
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases 1 Wiki Activity

refactoring

Browse Source
This commit is contained in:
goynov
2025-11-25 17:44:09 +02:00
parent d89522f405
commit c6d4ce9007
6 changed files with 29 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/InteractiveObjects/PuzzleGame1.js
+6 -6
View File
@@ -1,5 +1,4 @@
import { BoxGeometry, Mesh, MeshStandardMaterial, Group, EventDispatcher } from 'three'; import { BoxGeometry, Mesh, MeshStandardMaterial, Group, EventDispatcher } from 'three';
import { MotionEngine } from '../../lib/MotionEngine';
import { centerOrigin } from '@/lib/MeshUtils'; import { centerOrigin } from '@/lib/MeshUtils';
class PuzzleGame1 extends EventDispatcher { class PuzzleGame1 extends EventDispatcher {
@@ -9,7 +8,7 @@ class PuzzleGame1 extends EventDispatcher {
return new Promise(async (resolve, reject)=>{ return new Promise(async (resolve, reject)=>{
let w = data.w, h = data.h, wh = w*h; let w = data.w, h = data.h, wh = w*h;
let container = new Group(); let container = new Group();
const aq = new MotionEngine(); const aq = engine.motionQueue;
const pr = [[0, 2], [0, -1], [0, 1], [1, 0], [-1, 0], [0, 0]]; const pr = [[0, 2], [0, -1], [0, 1], [1, 0], [-1, 0], [0, 0]];
let d = 1.2; let d = 1.2;
@@ -76,7 +75,8 @@ class PuzzleGame1 extends EventDispatcher {
aq.add({ aq.add({
o: i.object, o: i.object,
a: { rotation: { x: pr[i.object._ri][0] * Math.PI / 2, y: pr[i.object._ri][1] * Math.PI / 2 } }, a: { rotation: { x: pr[i.object._ri][0] * Math.PI / 2, y: pr[i.object._ri][1] * Math.PI / 2 } },
t: .5 t: .5,
s: 'PG2'
}); });
} }
}; };
@@ -86,8 +86,7 @@ class PuzzleGame1 extends EventDispatcher {
}); });
this.update = () => { this.update = () => {
aq.update(); if (aq.isIdle('PG2') && !this.done && check()) {
if (aq.isIdle() && !this.done && check()) {
this.done = true; this.done = true;
container.children.forEach((c, i) => { container.children.forEach((c, i) => {
aq.add({ aq.add({
@@ -96,7 +95,8 @@ class PuzzleGame1 extends EventDispatcher {
t: 1, t: 1,
f: i == 0 ? ()=>{ f: i == 0 ? ()=>{
this.dispatchEvent({type:'finish'}) this.dispatchEvent({type:'finish'})
} : undefined } : undefined,
s: 'PG2'
}); });
}); });
//engine.dashboard.addPoints(10); //engine.dashboard.addPoints(10);
src/components/InteractiveObjects/PuzzleGame2.js
+8 -7
View File
@@ -1,5 +1,4 @@
import { BoxGeometry, Mesh, MeshBasicMaterial, Group, EventDispatcher } from 'three'; import { BoxGeometry, Mesh, MeshBasicMaterial, Group, EventDispatcher } from 'three';
import { MotionEngine } from '../../lib/MotionEngine';
import { centerOrigin } from '@/lib/MeshUtils'; import { centerOrigin } from '@/lib/MeshUtils';
class PuzzleGame2 extends EventDispatcher { class PuzzleGame2 extends EventDispatcher {
@@ -12,7 +11,7 @@ class PuzzleGame2 extends EventDispatcher {
const material = new MeshBasicMaterial({ const material = new MeshBasicMaterial({
map: texture map: texture
}); });
const aq = new MotionEngine(); const aq = engine.motionQueue;
const m2 = new MeshBasicMaterial({ const m2 = new MeshBasicMaterial({
map: texture, map: texture,
transparent: true, transparent: true,
@@ -113,12 +112,14 @@ class PuzzleGame2 extends EventDispatcher {
o: i.object, o: i.object,
a: { position: { x: (xl - xc) * d, y: (yl - yc) * d } }, a: { position: { x: (xl - xc) * d, y: (yl - yc) * d } },
t: .3, t: .3,
m: 'offset' m: 'offset',
s: 'PG2'
},{ },{
o: last, o: last,
a: { position: { x: (xc - xl) * d, y: (yc - yl) * d } }, a: { position: { x: (xc - xl) * d, y: (yc - yl) * d } },
t: .3, t: .3,
m: 'offset' m: 'offset',
s: 'PG2'
}]); }]);
xch(idx, lidx); xch(idx, lidx);
} }
@@ -130,8 +131,7 @@ class PuzzleGame2 extends EventDispatcher {
}); });
this.update = () => { this.update = () => {
aq.update(); if (aq.isIdle('PG2') && !this.done && check()) {
if (aq.isIdle() && !this.done && check()) {
this.done = true; this.done = true;
container.children.forEach((c, i) => { container.children.forEach((c, i) => {
last.material = material; last.material = material;
@@ -141,7 +141,8 @@ class PuzzleGame2 extends EventDispatcher {
t: 1, t: 1,
f: i == 0 ? ()=>{ f: i == 0 ? ()=>{
this.dispatchEvent({type:'finish'}) this.dispatchEvent({type:'finish'})
} : undefined } : undefined,
s: 'PG2'
}); });
}); });
//engine.dashboard.addPoints(10); //engine.dashboard.addPoints(10);
src/lib/GameEngine.js
+4 -4
View File
@@ -28,7 +28,7 @@ class GameEngine extends THREE.EventDispatcher{
this.opts = opts; this.opts = opts;
const gameEngine = this; const gameEngine = this;
this.perspectiveCamera = new THREE.PerspectiveCamera(45, this.aspect, 0.01, 200); this.perspectiveCamera = new THREE.PerspectiveCamera(45, this.aspect, 0.1, 100);
this.raycaster = new THREE.Raycaster(); this.raycaster = new THREE.Raycaster();
this.perspectiveCamera.position.set(0, 0, 10); this.perspectiveCamera.position.set(0, 0, 10);
@@ -139,12 +139,12 @@ class GameEngine extends THREE.EventDispatcher{
function animate(time) { function animate(time) {
let delta = clock.getDelta(); let delta = clock.getDelta();
gameEngine.hero?.update(); gameEngine.hero?.update(delta);
gameEngine.physics?.step(); gameEngine.physics?.step();
gameEngine.mixers.forEach(m => m.update(delta)); gameEngine.mixers.forEach(m => m.update(delta));
gameEngine.handleXrAction(gameEngine, delta) gameEngine.handleXrAction(gameEngine, delta)
gameEngine.dispatchEvent({type: 'beforeRender'}) gameEngine.dispatchEvent({type: 'beforeRender'})
this.motionQueue.update(); this.motionQueue.update(delta);
gameEngine.render(scene, gameEngine.camera); gameEngine.render(scene, gameEngine.camera);
if (!renderer.xr.isPresenting) { if (!renderer.xr.isPresenting) {
@@ -415,7 +415,7 @@ class GameEngine extends THREE.EventDispatcher{
if (object.material.map) object.material.map.colorSpace = THREE.SRGBColorSpace; if (object.material.map) object.material.map.colorSpace = THREE.SRGBColorSpace;
//object.material.metalness = 0; //object.material.metalness = 0;
} }
object.frustumCulled = false; //object.frustumCulled = false;
object.castShadow = true; object.castShadow = true;
object.receiveShadow = true; object.receiveShadow = true;
}); });
src/lib/Hero.js
+3 -5
View File
@@ -1,4 +1,4 @@
import { AnimationMixer, Vector3, Clock } from 'three'; import { AnimationMixer, Vector3 } from 'three';
import { PointerControls } from './PointerControls'; import { PointerControls } from './PointerControls';
import { getBoundingBox, getBoundingBoxCenterPoint, getBoundingBoxSize, centerOrigin } from './MeshUtils'; import { getBoundingBox, getBoundingBoxCenterPoint, getBoundingBoxSize, centerOrigin } from './MeshUtils';
import { QueryFilterFlags } from '@dimforge/rapier3d'; import { QueryFilterFlags } from '@dimforge/rapier3d';
@@ -77,8 +77,6 @@ class Hero{
this.actionStart = 0; this.actionStart = 0;
this.cameraDelta = 0; this.cameraDelta = 0;
this.cameraIdleDelta = 0; this.cameraIdleDelta = 0;
this.clock = new Clock()
this.ready = true; this.ready = true;
} }
@@ -86,13 +84,13 @@ class Hero{
this.pointerControls.controls.lock(); this.pointerControls.controls.lock();
} }
update(){ update(delta){
if (this.gameEngine.renderer.xr.isPresenting) return; if (this.gameEngine.renderer.xr.isPresenting) return;
if (this.ready && !this.disableInput) { if (this.ready && !this.disableInput) {
let pc = this.pointerControls; let pc = this.pointerControls;
pc.update(); pc.update();
this.updateCharacterControls(this.clock.getDelta(), pc) this.updateCharacterControls(delta, pc)
} }
} }
src/lib/MotionEngine.js
+6 -9
View File
@@ -1,9 +1,6 @@
import { Clock } from 'three';
class MotionEngine { class MotionEngine {
constructor() { constructor() {
const aq = []; const aq = [];
const clock = new Clock();
this.animationQueue = aq; this.animationQueue = aq;
function calcValues(target, values, initial, k = 1, mode = 'offset') { function calcValues(target, values, initial, k = 1, mode = 'offset') {
@@ -30,7 +27,7 @@ class MotionEngine {
} }
// a = {o-object, a-attributes, t-time, f-finish event, d-delay, m-mode, r-repeat, // a = {o-object, a-attributes, t-time, f-finish event, d-delay, m-mode, r-repeat,
// rd-repeat the delay, rf-reset on finish, u-on update} // rd-repeat the delay, rf-reset on finish, u-on update, s-scope}
this.add = function (a) { this.add = function (a) {
a = Array.isArray(a) ? a : [a]; a = Array.isArray(a) ? a : [a];
a.forEach(e => { a.forEach(e => {
@@ -65,10 +62,9 @@ class MotionEngine {
} }
}; };
this.update = () => { this.update = (delta) => {
let t = clock.getDelta();
if (aq.length) { if (aq.length) {
aq.forEach(e => this.animate(e, t)); aq.forEach(e => this.animate(e, delta));
this.clear(); this.clear();
} }
}; };
@@ -105,8 +101,9 @@ class MotionEngine {
return aq.find(e => e.o == object); return aq.find(e => e.o == object);
}; };
this.isIdle = function () { this.isIdle = function (scope) {
return aq.length == 0; if (!scope) return aq.length == 0;
return aq.filter(e => e.s == scope).length == 0
}; };
} }
} }
src/lib/PointerControls.js
+2 -39
View File
@@ -1,7 +1,4 @@
import { import { Vector3 } from 'three';
Clock,
Vector3
} from 'three';
import { PointerLockControls } from 'three/examples/jsm/Addons.js'; import { PointerLockControls } from 'three/examples/jsm/Addons.js';
@@ -18,7 +15,6 @@ class PointerControls {
this.camera = camera; this.camera = camera;
this.hero = hero; this.hero = hero;
this.clock = new Clock();
this.click = false; this.click = false;
this.controls = new PointerLockControls(camera, domElement); this.controls = new PointerLockControls(camera, domElement);
@@ -61,40 +57,7 @@ class PointerControls {
this.controls.isLocked && this.onpointer && this.onpointer('end'); this.controls.isLocked && this.onpointer && this.onpointer('end');
}); });
this.update = () => { this.update = () => { };
// const delta = this.clock.getDelta() * 10;
// if (this.gp) {
// this.gp = navigator.getGamepads()[this.gp.index];
// this.gp.pressed = this.gp.buttons[4].pressed || this.gp.buttons[5].pressed || this.gp.buttons[6].pressed || this.gp.buttons[7].pressed || this.gp.buttons[9].pressed;
// if (!this.click && this.gp.pressed) {
// this.click = true;
// this.clicked?.();
// //console.log(this.gp.buttons.map((b,i)=>[i, b.pressed]));
// }
// if (this.click && !this.gp.pressed) this.click = false;
// }
// //this.velocity.x -= this.velocity.x * 5.0 * delta;
// this.velocity.z -= this.velocity.z * 5.0 * delta;
// this.rvelo -= this.rvelo * 5 * delta;
// // this.velocity.y -= 9.8 * 100.0 * delta; // 100.0 = mass
// this.direction.z = Number(this.moveForward) - Number(this.moveBackward) - Math.floor((this.gp && this.gp.axes[1] || 0) * 100) / 100 + (this.touchControls && this.touchControls.move || 0);
// this.rotationY = Number(this.rotateLeft) - Number(this.rotateRight) - Math.floor((this.gp && this.gp.axes[0] || 0) * 100) / 110 + (this.touchControls && this.touchControls.rotate || 0);
// //this.direction.x = Number( this.moveRight ) - Number( this.moveLeft );
// //this.direction.normalize(); // this ensures consistent movements in all directions
// if (this.direction.z) this.velocity.z -= this.direction.z * 5.0 * delta;
// //if ( this.moveLeft || this.moveRight ) this.velocity.x -= this.direction.x * 5.0 * delta;
// if (this.rotationY) this.rvelo -= this.rotationY * 8 * delta;
//this.velocity.x && this.controls.moveRight( - this.velocity.x * delta );
// if (this.velocity.z) {
// this.controls.moveForward(-this.velocity.z * delta);
// this.hero.position.z += -this.velocity.z * delta;
// }
// this.controls.moveRight( this.direction.x * delta );
// this.controls.moveForward( this.direction.z * delta );
// this.hero.position.y += (Number(this.moveUp) - Number(this.moveDown)) * delta;
// this.hero.rotation.y += -this.rvelo * delta;
};
} }