objects locking system

src/components/AppHeader.vue

@@ -22,7 +22,7 @@
         <v-list nav>
             <v-list-item prepend-icon="mdi-database" to="/game-objects/list" :title="l.gameObjects"></v-list-item>
             <v-list-item prepend-icon="mdi-receipt-text-edit-outline" to="/scenarios/list" :title="l.gameScenarios"></v-list-item>
-            <v-list-item prepend-icon="mdi-cogs" :title="l.gameRules"></v-list-item>
+            <!-- <v-list-item prepend-icon="mdi-cogs" :title="l.gameRules"></v-list-item> -->
             <v-divider></v-divider>
             <v-list-item prepend-icon="mdi-controller" :title="l.games" to="/games/list"></v-list-item>
             <v-list-item prepend-icon="mdi-cog-play" :title="l.play" to="/play/list"></v-list-item>

src/components/InteractiveObjects/GenenricObject.js

@@ -9,20 +9,6 @@ class GenericObject extends EventDispatcher{
             this.object = centerOrigin(this.source.scene)
 
             if (!data.exclude){
-                const bckGeometry = new SphereGeometry(getBoundingBoxMaxLength(this.object.userData.bbox)/2,8,8)
-                const bckMesh = new Mesh(bckGeometry, new MeshStandardMaterial({
-                    transparent: true,
-                    opacity:1, color: 0xaaaaaa,
-                    alphaMap: await engine.loadTexture('locked.webp', '/static/textures/'),
-                }))
-                this.object.add(bckMesh)
-                engine.motionQueue.add(
-                    { o: bckMesh, a:{ 
-                        material: { opacity: k=>0.11 + 0.52*Math.sin(k*Math.PI)},
-                        rotation: { y: k=>k*Math.PI*2},
-                        scale: (k,s)=>s.setScalar(1+0.11*Math.sin(2*k*Math.PI))
-                    }, r: true, t: 3 },
-                )
                 engine.clickable.add(this.object, async e=>{
                     this.object._active = !this.object._active;
                     if (engine.dashboard){

src/components/InteractiveObjects/InteractiveObject.js

@@ -1,4 +1,4 @@
-import { Group, EventDispatcher } from "three";
+import { Group, EventDispatcher, MeshStandardMaterial, Mesh, SphereGeometry } from "three";
 
 import { GenericObject } from "./GenenricObject";
 import { TextObject } from "./TextObject";
@@ -13,7 +13,8 @@ import { PuzzleGame4 } from "./PuzzleGame4";
 // import { Game6 } from "./games/Game6";
 import { MazeQuizGame } from "./MazeQuizGame/MazeQuizGame";
 import { Particles } from "./Particles";
-import { assignMaterial, assignParams } from "@/lib/MeshUtils";
+import { assignMaterial, assignParams, wrapInGroup, getBoundingBoxMaxLength } from "@/lib/MeshUtils";
+import { GameEngine } from "@/lib/GameEngine";
 
 const InteractiveObjectsImports = { 
     GenericObject, CharacterObject, TextObject, ImageObject, VideoPlayer, Particles,
@@ -72,12 +73,52 @@ class InteractiveObject extends EventDispatcher{
                     this.io.addEventListener?.('finish', this.dispatchEvent.bind(this))
                     break;
             }
+            if (obj.shouldBeLocked){
+                this.object = wrapInGroup(this.object)
+                this.locker = new Locker(gameEngine, this.object);
+                this.locker.lock();
+            }
             assignParams(this.object, obj);
             resolve(this);
         });
     }
 }
 
+class Locker{
+    static materialLocked = new MeshStandardMaterial({
+        transparent: true, opacity:1, color: 0xaaaaaa
+    })
+    constructor(engine, group){
+        const bckGeometry = new SphereGeometry(getBoundingBoxMaxLength(group.userData.bbox)/2,8,8)
+        const bckMesh = new Mesh(bckGeometry, Locker.materialLocked);
+        bckMesh.visible = false;
+        group.add(bckMesh)
+        function animate(){
+            engine.motionQueue.add(
+                { o: bckMesh, a:{ 
+                    material: { opacity: k=>0.11 + 0.52*Math.sin(k*Math.PI)},
+                    rotation: { y: k=>k*Math.PI*2},
+                    scale: (k,s)=>s.setScalar(1+0.11*Math.sin(2*k*Math.PI))
+                }, r: true, t: 3 },
+            )
+        }
+        this.object = bckMesh;
+        this.lock = function(){
+            bckMesh.visible = true;
+            //bckMesh.material.needsUpdate = true;
+            engine.motionQueue.clear(bckMesh);
+            group.__locked = true;
+            animate();
+        }
+        this.unlock = function(){
+            bckMesh.visible = false;
+            engine.motionQueue.clear(bckMesh);
+            group.__locked = false;
+        }
+    }
+}
+GameEngine.loadTexture('locked.webp', '/static/textures/', null, [Locker.materialLocked, 'alphaMap'])
+
 const InteractiveObjectTypes = [
     {
         id: 'CharacterObject', name: 'Character'

src/components/InteractiveObjects/MazeQuizGame/MazeQuizGame.vue

@@ -47,7 +47,8 @@ export default {
     mounted(){
         this.modelValue.questions ??= [];
         this.modelValue.questionPoints ??= 10;
-        this.modelValue.questionPenalty ??= 0
+        this.modelValue.questionPenalty ??= 0;
+        this.modelValue.exclude = true;
     },
     methods:{
         addQuestion(){

src/components/InteractiveObjects/VideoPlayer.js

@@ -44,7 +44,7 @@ class VideoPlayer extends EventDispatcher {
                     //material.opacity = 0.5;
                     if (data.playInHud){
                         engine.dashboard?.detach(plane, {
-                            skipTransition: !data.skipTransition
+                            skipTransition: data.skipTransition
                         });
                     }
                 })