Virtual Reality
How It Works & How to Build It

# Godot 4 — OpenXR VR setup
# 1. Project → Project Settings → XR → Enable OpenXR
# 2. Add XROrigin3D → XRCamera3D → XRController3D (left + right) to your scene
# 3. Attach this script to XROrigin3D

extends XROrigin3D

func _ready() -> void:
    var interface: XRInterface = XRServer.find_interface("OpenXR")
    if interface and interface.is_initialized():
        print("OpenXR initialised")
        get_viewport().use_xr = true
    else:
        push_warning("OpenXR not available — running flat")

# Binaural audio — attach to any AudioStreamPlayer3D in the scene
extends AudioStreamPlayer3D

func _ready():
    # Godot uses its built-in HRTF when the listener is an XRCamera3D
    attenuation_model = AudioStreamPlayer3D.ATTENUATION_INVERSE_DISTANCE
    unit_size        = 1.0
    max_distance     = 20.0
    doppler_tracking = AudioStreamPlayer3D.DOPPLER_TRACKING_PHYSICS_STEP
    play()

# Read head pose manually if needed
func _process(_delta):
    var camera: XRCamera3D = $XRCamera3D
    var head_pos: Vector3    = camera.global_position
    var head_rot: Quaternion = camera.global_transform.basis.get_rotation_quaternion()
    # head_pos and head_rot update every frame from the headset IMU

// Three.js + WebXR — VR in the browser (no install needed for users!)
// Requires HTTPS. Works on Meta Quest Browser, Chrome with WebXR flag.

import * as THREE from 'three';
import { VRButton } from 'three/addons/webxr/VRButton.js';
import { XRControllerModelFactory } from 'three/addons/webxr/XRControllerModelFactory.js';

// ── 1. Renderer ──────────────────────────────────
const renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.xr.enabled = true;   // turn on WebXR
renderer.setPixelRatio(window.devicePixelRatio);
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

// ── 2. VR Button ─────────────────────────────────
document.body.appendChild(VRButton.createButton(renderer));

// ── 3. Scene ──────────────────────────────────────
const scene  = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(70, window.innerWidth / window.innerHeight, 0.01, 100);

// ── 4. Binaural Audio (Web Audio API HRTF) ────────
const listener = new THREE.AudioListener();
camera.add(listener);                     // attach to camera = headset ears

const sound = new THREE.PositionalAudio(listener);
const loader = new THREE.AudioLoader();
loader.load('sounds/ambient.mp3', function(buffer) {
    sound.setBuffer(buffer);
    sound.setRefDistance(1);     // full volume within 1 m
    sound.setRolloffFactor(2);
    sound.setLoop(true);
    sound.play();
});

// Attach the sound to any mesh — it will spatialise automatically
const sphere = new THREE.Mesh(
    new THREE.SphereGeometry(0.1),
    new THREE.MeshStandardMaterial({ color: 0x6f4cff })
);
sphere.add(sound);          // sound follows the mesh in 3D space
scene.add(sphere);

// ── 5. Render loop ────────────────────────────────
renderer.setAnimationLoop(function(time) {
    sphere.position.x = Math.sin(time * 0.001) * 2;   // orbit the player
    renderer.render(scene, camera);
});