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-06 18:17:56 +02:00
parent fd3f9a6d69
commit 4565782e9f
14 changed files with 113 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/InteractiveObjects/MazeQuizGame/MazeObject.js
+23 -33
View File
@@ -2,31 +2,21 @@ import { Group, Vector3, Matrix4, Mesh, Quaternion, PlaneGeometry, MeshStandardM
import { InteractiveObject } from '../InteractiveObject';
class MazeObject {
constructor(engine, def, params = {}){
constructor(engine, def, params){
let room = new Group();
let root = room;
this.object = room;
let context = {};
const bbox = {l:0, r:0, f:0}
const { wallSize, tubeSize, scale } = params
const scale = 5;
context.wallSize = params.wallSize || 1.2*scale; //half
context.tubeSize = params.tubeSize || 1.2*scale;
context.wallDepth = params.wallDepth || 0*scale;
context.fontPath = params.fontPath || '/static/fonts/Montserrat-Regular.ttf';
context.scale = scale;
this.context = context;
let _tf = {
rotation: {
r: 3 * Math.PI / 2, f: 0, l: Math.PI / 2, b: 0
},
pNext: {
r: [-context.wallSize/2, context.wallSize/2],
f: [0, context.wallSize],
l: [context.wallSize/2, context.wallSize/2]
r: [-wallSize/2, wallSize/2],
f: [0, wallSize],
l: [wallSize/2, wallSize/2]
}
};
@@ -53,7 +43,7 @@ class MazeObject {
let e = elements.map(e=>o[e].clone())
e[0].position.set(0, 0, offsetZ + context.wallSize/2);
e[0].position.set(0, 0, offsetZ + wallSize/2);
e[1].rotateY(_tf.rotation.b);
@@ -62,24 +52,24 @@ class MazeObject {
e[4].rotateY(_tf.rotation.l);
e[1].position.set(0, 0, offsetZ + 0);
e[2].position.set(-context.wallSize/2, 0, offsetZ + context.wallSize/2);
e[3].position.set(0, 0, offsetZ + context.wallSize);
e[4].position.set(context.wallSize/2, 0, offsetZ + context.wallSize/2);
e[2].position.set(-wallSize/2, 0, offsetZ + wallSize/2);
e[3].position.set(0, 0, offsetZ + wallSize);
e[4].position.set(wallSize/2, 0, offsetZ + wallSize/2);
if (elements[1] == 'wall'){
addPhysics(def.matrix, [0, 0, offsetZ], context.wallSize, 'front')
addPhysics(def.matrix, [0, 0, offsetZ], wallSize, 'front')
}
if (elements[2] == 'wall'){
addPhysics(def.matrix, [-context.wallSize/2, 0, offsetZ + context.wallSize/2], context.wallSize)
addPhysics(def.matrix, [-wallSize/2, 0, offsetZ + wallSize/2], wallSize)
}
if (elements[3] == 'wall'){
addPhysics(def.matrix, [0, 0, offsetZ + context.wallSize], context.wallSize, 'front')
addPhysics(def.matrix, [0, 0, offsetZ + wallSize], wallSize, 'front')
}
if (elements[4] == 'wall'){
addPhysics(def.matrix, [context.wallSize/2, 0, offsetZ + context.wallSize/2], context.wallSize)
addPhysics(def.matrix, [wallSize/2, 0, offsetZ + wallSize/2], wallSize)
}
e.forEach(g => {
@@ -98,32 +88,32 @@ class MazeObject {
let offsetZ = 0, e;
def.len = def.len || 0;
if (step == 0) {
addRoom(['floor', 'wall', 'wall', 'door', 'wall'], def, -context.wallSize)
addRoom(['floor', 'wall', 'wall', 'door', 'wall'], def, -wallSize)
}
if (def.userData?.answer !== undefined){
addPhysics(def.matrix, [0,0,0], context.wallSize, 'front', true, def.userData)
addPhysics(def.matrix, [0,0,0], wallSize, 'front', true, def.userData)
}
for (let i = 0; i < def.len; i++) {
let t = o.tunnel.clone();
t.position.set(0, 0, i * context.tubeSize);
t.position.set(0, 0, i * tubeSize);
def.matrix && t.applyMatrix4(def.matrix);
root.add(t);
}
offsetZ = def.len * context.tubeSize;
addPhysics(def.matrix, [context.tubeSize / 2, 0.6, offsetZ/2], offsetZ)
addPhysics(def.matrix, [-context.tubeSize / 2, 0.6, offsetZ/2], offsetZ)
offsetZ = def.len * tubeSize;
addPhysics(def.matrix, [tubeSize / 2, 0.6, offsetZ/2], offsetZ)
addPhysics(def.matrix, [-tubeSize / 2, 0.6, offsetZ/2], offsetZ)
addRoom(['floor', 'door', def.r ? 'door' : 'wall', def.f ? 'door' : 'wall', def.l ? 'door' : 'wall'], def, offsetZ)
if (def.userData?.qid !== undefined || def.userData?.finish){
addPhysics(def.matrix, [0,0,offsetZ + context.wallSize/2], { width: context.wallSize/2, height: context.wallSize/2, depth: context.wallSize/2}, 'side', true, def.userData)
addPhysics(def.matrix, [0,0,offsetZ + wallSize/2], { width: wallSize/2, height: wallSize/2, depth: wallSize/2}, 'side', true, def.userData)
}
//console.log('loadingggg', def.objects)
def.objects?.forEach(async obj => {
obj.room = room;
let go = new InteractiveObject(obj, engine, context)
let go = new InteractiveObject(engine, obj)
await go.ready;
go.object.scale.multiplyScalar(context.wallSize)
go.object.position.multiplyScalar(context.wallSize)
go.object.scale.multiplyScalar(wallSize)
go.object.position.multiplyScalar(wallSize)
go.object.applyMatrix4(def.matrix);
root.add(go.object);
});
src/components/InteractiveObjects/MazeQuizGame/MazeQuizGame.js
+28 -17
View File
@@ -1,16 +1,34 @@
import { MazeObject } from "./MazeObject";
import Utils from "@/lib/Utils";
const params = {
scale: 5,
wallSize: 5 * 1.2,
tubeSize: 5 * 1.2,
}
const imgParams = {
type: 'Image',
width: params.wallSize*0.033,
height: params.wallSize*0.033,
value: '/static/textures/arrow.png'
}
const textParams = {
type: 'Text', width:0.073 * params.wallSize,
fontPath:'/static/fonts/Montserrat-Regular.ttf', fontSize:0.025
}
const defaults = {
arrows:{
r: len => ({ type: 'Image', value: '/static/textures/arrow.png', position:[-.5,.44,len+.96], rotation:[0,Math.PI, 0], scale: [0.03, 0.03, 0.03] }),
l: len => ({ type: 'Image', value: '/static/textures/arrow.png', position:[.5,.44,len+.96], rotation:[0,Math.PI, Math.PI], scale: [0.03, 0.03, 0.03] }),
f: len => ({ type: 'Image', value: '/static/textures/arrow.png', position:[0,.7,len+.96], rotation:[0,Math.PI, Math.PI/2], scale: [0.03, 0.03, 0.03] })
r: len => ({ position:[-.5,.44,len+.96], rotation:[0,Math.PI, 0], ...imgParams }),
l: len => ({ position:[.5,.44,len+.96], rotation:[0,Math.PI, Math.PI], ...imgParams }),
f: len => ({ position:[0,.7,len+.96], rotation:[0,Math.PI, Math.PI/2], ...imgParams })
},
answers:{
r: (len, text) => ({ type: 'Text', width:0.5, text, fontSize:0.025, position:[-.5,.3,len+.9], rotation:[0,Math.PI, 0] }),
l: (len, text) => ({ type: 'Text', width:0.5, text, fontSize:0.025, position:[.5,.3,len+.9], rotation:[0,Math.PI, 0] }),
f: (len, text) => ({ type: 'Text', width:0.5, text, fontSize:0.025, position:[0,.55,len+.9], rotation:[0,Math.PI, 0] })
r: (len, text) => ({ ...textParams, text, position:[-.5,.3,len+.9], rotation:[0,Math.PI, 0] }),
l: (len, text) => ({ ...textParams, text, position:[.5,.3,len+.9], rotation:[0,Math.PI, 0] }),
f: (len, text) => ({ ...textParams, text, position:[0,.55,len+.9], rotation:[0,Math.PI, 0] })
}
}
@@ -21,7 +39,7 @@ class MazeQuizGame {
return new Promise(async (resolve, reject)=>{
let questions = data.shuffle ? Utils.shuffleArray(data.questions) : data.questions;
let def = this.generate(questions);
this.mazeObject = new MazeObject(engine, def)
this.mazeObject = new MazeObject(engine, def, params)
engine.addEventListener('collision', async e=>{
let ud1 = engine.physics.world.getCollider(e.handle1)?.parent()?.userData,
ud2 = engine.physics.world.getCollider(e.handle2)?.parent()?.userData;
@@ -73,19 +91,13 @@ class MazeQuizGame {
};
len = len || Math.round(Math.random()*tl) + 2;
// let l = {
// l: Math.round(Math.random()*tl) + 2,
// r: Math.round(Math.random()*tl) + 2,
// f: Math.round(Math.random()*tl/2) + 2
// }
let directions = Utils.shuffleArray( ['l', 'r', 'f'] )
let mo = {
len, userData: { question, qid },
objects:[
{
type: 'Text', text: question.q, fontSize:0.033, width:0.5, position:[0,.33,len + .96], rotation:[0,Math.PI, 0]
...textParams, text: question.q, fontSize:0.033, position:[0,.33,len + .96], rotation:[0,Math.PI, 0]
}
]
}
@@ -116,7 +128,7 @@ class MazeQuizGame {
len: 2,
objects:[
{
type: 'Text', width:0.5, color:0xff0000, text: question.h, fontSize:0.033, position:[0,.44,2+.96], rotation:[0,Math.PI, 0]
...textParams, color:0xff0000, text: question.h, fontSize:0.033, position:[0,.44,2+.96], rotation:[0,Math.PI, 0]
}
]
}
@@ -133,9 +145,8 @@ class MazeQuizGame {
}
}
})
return mo;
}
}
export {MazeQuizGame}
export { MazeQuizGame }