Update index.html

index.html

@@ -91,63 +91,60 @@
             engine.resize();
         });
 
+        // Initialize VR experience without unused features
         async function createXRExperience() {
-          try {
-              const xrHelper = await scene.createDefaultXRExperienceAsync({
-                  floorMeshes: [scene.getMeshByName("ground")],
-                  // Do not explicitly disable all optional features; let the default setup run
-                  disableDefaultUI: false // Keep the default UI enabled to ensure the VR button works
-              });
-      
-              // After initialization, specifically disable hand tracking if it was included
-              const featuresManager = xrHelper.baseExperience.featuresManager;
-      
-              // This explicitly disables hand tracking if it was somehow included by default
-              featuresManager.disableFeature(BABYLON.WebXRFeatureName.HAND_TRACKING);
-      
-              // Set up interactions
-              setupControllerInteractions(xrHelper);
-              scene.activeCamera = xrHelper.baseExperience.camera;
-      
-          } catch (err) {
-              console.error('Failed to start VR session:', err);
-          }
-      }
-      
-      // Set up VR button and initialize VR experience on click
-      const vrButton = document.createElement("button");
-      vrButton.textContent = "Enter VR";
-      vrButton.style.position = "absolute";
-      vrButton.style.bottom = "10px";
-      vrButton.style.left = "10px";
-      vrButton.style.width = "200px";
-      vrButton.style.height = "40px";
-      vrButton.style.background = "linear-gradient(to bottom, #6c543e, #4e342e)";
-      vrButton.style.color = "#e0d7c5";
-      vrButton.style.border = "none";
-      vrButton.style.cursor = "pointer";
-      document.body.appendChild(vrButton);
-      
-      vrButton.addEventListener("click", createXRExperience);
+            try {
+                const xrHelper = await scene.createDefaultXRExperienceAsync({
+                    floorMeshes: [scene.getMeshByName("ground")]
+                    // No optional features like hand-tracking or plane-detection are requested
+                });
+
+                setupControllerInteractions(xrHelper);
+                scene.activeCamera = xrHelper.baseExperience.camera;
+
+            } catch (err) {
+                console.error('Failed to start VR session:', err);
+            }
+        }
+
+        // Set up VR button and initialize VR experience on click
+        const vrButton = document.createElement("button");
+        vrButton.textContent = "Enter VR";
+        vrButton.style.position = "absolute";
+        vrButton.style.bottom = "10px";
+        vrButton.style.left = "10px";
+        vrButton.style.width = "200px";
+        vrButton.style.height = "40px";
+        vrButton.style.background = "linear-gradient(to bottom, #6c543e, #4e342e)";
+        vrButton.style.color = "#e0d7c5";
+        vrButton.style.border = "none";
+        vrButton.style.cursor = "pointer";
+        document.body.appendChild(vrButton);
+
+        vrButton.addEventListener("click", createXRExperience);
 
         function setupControllerInteractions(xrHelper) {
-          xrHelper.input.onControllerAddedObservable.add(controller => {
-              controller.onMotionControllerInitObservable.add(motionController => {
-                  const thumbstick = motionController.getComponent("xr-standard-thumbstick");
-      
-                  if (thumbstick) {
-                      thumbstick.onAxisValueChangedObservable.add((axisValues) => {
-                          const player = scene.getMeshByName("player");
-      
-                          // Map thumbstick input to movement
-                          const speed = 0.05; // Adjust this value for faster/slower movement
-                          player.position.x += axisValues.x * speed; // Horizontal movement (left-right)
-                          player.position.z += axisValues.y * speed; // Vertical movement (forward-backward)
-                      });
-                  }
-              });
-          });
-      }
+            xrHelper.input.onControllerAddedObservable.add(controller => {
+                controller.onMotionControllerInitObservable.add(motionController => {
+                    const xrRay = motionController.getComponent("xr-standard-trigger");
+
+                    if (xrRay) {
+                        xrRay.onButtonStateChangedObservable.add(() => {
+                            if (xrRay.changes.pressed) {
+                                if (xrRay.pressed) {
+                                    const pickResult = scene.pickWithRay(controller.pointerRay);
+                                    if (pickResult.hit && pickResult.pickedMesh) {
+                                        if (pickResult.pickedMesh.name === "npc1") {
+                                            openChat("npc1", "NPC-1", "Hello! How can I assist you today?");
+                                        }
+                                    }
+                                }
+                            }
+                        });
+                    }
+                });
+            });
+        }
 
         // Chat System with Transformers.js
         async function setupChat() {
@@ -170,7 +167,7 @@
             const message = inputField.value;
             if (message.trim() === "" || !chatSetup) return;
 
-            chatLog.innerHTML += <p>Player: ${message}</p>;
+            chatLog.innerHTML += `<p>Player: ${message}</p>`;
             inputField.value = "";
 
             const { model, tokenizer } = await chatSetup;
@@ -178,7 +175,7 @@
             const response = await model.generate(inputs.input_ids, { max_length: 50 });
             const output = tokenizer.decode(response[0], { skip_special_tokens: true });
 
-            chatLog.innerHTML += <p>NPC: ${output}</p>;
+            chatLog.innerHTML += `<p>NPC: ${output}</p>`;
             chatLog.scrollTop = chatLog.scrollHeight;
 
             // Limit chat log entries to 50
@@ -189,9 +186,9 @@
 
         function openChat(npcId, npcName, greeting) {
             const chatLog = document.getElementById("chatLog");
-            chatLog.innerHTML += <p>${npcName}: ${greeting}</p>;
+            chatLog.innerHTML += `<p>${npcName}: ${greeting}</p>`;
         }
     </script>
 </body>
 
-</html>
+</html>