@polygonjs/polygonjs
Version:
node-based WebGL 3D engine https://polygonjs.com
90 lines (89 loc) • 3.02 kB
JavaScript
;
import { applyDefaultStyle, createInfoLink, disableButtonElement, setErrorStyle } from "./Common";
const _CoreVRButton = class {
static createButton(options, sessionInit = {}) {
var _a;
const { renderer, controller } = options;
this.registerSessionGrantedListener();
const button = document.createElement("button");
function showEnterVR() {
let currentSession = null;
async function onSessionStarted(session) {
session.addEventListener("end", onSessionEnded);
await renderer.xr.setSession(session);
button.textContent = "EXIT VR";
currentSession = session;
}
function onSessionEnded() {
currentSession == null ? void 0 : currentSession.removeEventListener("end", onSessionEnded);
button.textContent = "ENTER VR";
currentSession = null;
}
button.style.display = "";
button.style.cursor = "pointer";
button.style.left = "calc(50% - 50px)";
button.style.width = "100px";
button.textContent = "ENTER VR";
button.onmouseenter = function() {
button.style.opacity = "1.0";
};
button.onmouseleave = function() {
button.style.opacity = "0.5";
};
button.onclick = function() {
if (currentSession === null) {
controller.requestSession(sessionInit, onSessionStarted);
} else {
currentSession.end();
}
};
}
function disableButton() {
disableButtonElement(button);
}
function showWebXRNotFound() {
disableButton();
button.textContent = "VR NOT SUPPORTED";
setErrorStyle(button);
}
function showVRNotAllowed(exception) {
disableButton();
console.warn("Exception when trying to call xr.isSessionSupported", exception);
button.textContent = "VR NOT ALLOWED";
setErrorStyle(button);
}
function stylizeElement(element) {
applyDefaultStyle(element);
element.style.background = "rgb(16 27 44 / 95%)";
}
if ("xr" in navigator) {
button.id = "VRButton";
button.style.display = "none";
stylizeElement(button);
(_a = navigator.xr) == null ? void 0 : _a.isSessionSupported("immersive-vr").then(function(supported) {
supported ? showEnterVR() : showWebXRNotFound();
if (supported && _CoreVRButton.xrSessionIsGranted) {
button.click();
}
}).catch(showVRNotAllowed);
return button;
} else {
const message = createInfoLink();
stylizeElement(message);
setErrorStyle(message);
return message;
}
}
static registerSessionGrantedListener() {
var _a;
if ("xr" in navigator) {
if (/WebXRViewer\//i.test(navigator.userAgent))
return;
(_a = navigator.xr) == null ? void 0 : _a.addEventListener("sessiongranted", () => {
_CoreVRButton.xrSessionIsGranted = true;
});
}
}
};
export let CoreVRButton = _CoreVRButton;
CoreVRButton.xrSessionIsGranted = false;