WebXR Babylon.js Quest Game

A WebXR game for Meta Quest using Babylon.js with local development setup.

Features

• ✅ Green grass ground environment
• ✅ Blue sky atmosphere
• ✅ Wooden stick that can be picked up and dropped
• ✅ WebXR support for Meta Quest
• ✅ Desktop testing with mouse controls
• ✅ Local HTTP and HTTPS development servers

Setup

1. Install dependencies:

npm install

2. For HTTPS (required for Quest testing), generate certificates:

# On Windows
generate-cert.bat

# On Mac/Linux
openssl req -x509 -newkey rsa:4096 -keyout server.key -out server.cert -days 365 -nodes -subj "/CN=localhost"

Running the Game

Local PC Testing (HTTP)

npm start
# or
npm run dev

Visit: http://localhost:8080

Meta Quest Testing (HTTPS)

npm run https

1. Make sure your Quest and PC are on the same WiFi network
2. Note your PC's local IP address from the console output
3. On Meta Quest browser, navigate to: https://YOUR_IP:8443
4. Accept the security certificate warning
5. Enter VR mode to test WebXR

Controls

Desktop (Mouse)

• Click on wooden stick to pick it up
• Click elsewhere to drop it

Meta Quest (VR Controllers)

• Point controller at wooden stick and squeeze trigger/grip to pick up
• Release trigger/grip to drop

Project Structure

• index.html - Main HTML file with Babylon.js setup
• game.js - Main game logic and WebXR implementation
• server.js - HTTP development server
• https-server.js - HTTPS server for Quest testing
• generate-cert.bat - Certificate generation script for Windows

Troubleshooting

1. WebXR not working: Ensure you're using HTTPS and have accepted certificate warnings
2. Controllers not responding: Make sure Quest controllers are turned on and tracking
3. Can't connect from Quest: Verify both devices are on same network and firewall allows connection

Next Steps

• Add more interactive objects
• Implement hand tracking
• Add physics interactions
• Create more complex environments
• Add multiplayer support