three-stdlib 2.11.1 → 2.12.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "three-stdlib",
-  "version": "2.11.1",
+  "version": "2.12.0",
   "private": false,
   "description": "stand-alone library of threejs examples",
   "main": "index.cjs.js",

package/webxr/ARButton.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.ARButton=class{static createButton(e,t={}){const n=document.createElement("button");function o(){n.style.display="",n.style.cursor="auto",n.style.left="calc(50% - 75px)",n.style.width="150px",n.onmouseenter=null,n.onmouseleave=null,n.onclick=null,n.textContent="AR NOT SUPPORTED"}function s(e){e.style.position="absolute",e.style.bottom="20px",e.style.padding="12px 6px",e.style.border="1px solid #fff",e.style.borderRadius="4px",e.style.background="rgba(0,0,0,0.1)",e.style.color="#fff",e.style.font="normal 13px sans-serif",e.style.textAlign="center",e.style.opacity="0.5",e.style.outline="none",e.style.zIndex="999"}if("xr"in navigator)return n.id="ARButton",n.style.display="none",s(n),navigator.xr.isSessionSupported("immersive-ar").then((function(s){s?function(){if(void 0===t.domOverlay){var o=document.createElement("div");o.style.display="none",document.body.appendChild(o);var s=document.createElementNS("http://www.w3.org/2000/svg","svg");s.setAttribute("width",38),s.setAttribute("height",38),s.style.position="absolute",s.style.right="20px",s.style.top="20px",s.addEventListener("click",(function(){i.end()})),o.appendChild(s);var l=document.createElementNS("http://www.w3.org/2000/svg","path");l.setAttribute("d","M 12,12 L 28,28 M 28,12 12,28"),l.setAttribute("stroke","#fff"),l.setAttribute("stroke-width",2),s.appendChild(l),void 0===t.optionalFeatures&&(t.optionalFeatures=[]),t.optionalFeatures.push("dom-overlay"),t.domOverlay={root:o}}let i=null;async function r(o){o.addEventListener("end",a),e.xr.setReferenceSpaceType("local"),await e.xr.setSession(o),n.textContent="STOP AR",t.domOverlay.root.style.display="",i=o}function a(){i.removeEventListener("end",a),n.textContent="START AR",t.domOverlay.root.style.display="none",i=null}n.style.display="",n.style.cursor="pointer",n.style.left="calc(50% - 50px)",n.style.width="100px",n.textContent="START AR",n.onmouseenter=function(){n.style.opacity="1.0"},n.onmouseleave=function(){n.style.opacity="0.5"},n.onclick=function(){null===i?navigator.xr.requestSession("immersive-ar",t).then(r):i.end()}}():o()})).catch(o),n;{const e=document.createElement("a");return!1===window.isSecureContext?(e.href=document.location.href.replace(/^http:/,"https:"),e.innerHTML="WEBXR NEEDS HTTPS"):(e.href="https://immersiveweb.dev/",e.innerHTML="WEBXR NOT AVAILABLE"),e.style.left="calc(50% - 90px)",e.style.width="180px",e.style.textDecoration="none",s(e),e}}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.ARButton=class{static createButton(e,t={}){const n=document.createElement("button");function o(){n.style.display="",n.style.cursor="auto",n.style.left="calc(50% - 75px)",n.style.width="150px",n.onmouseenter=null,n.onmouseleave=null,n.onclick=null,n.textContent="AR NOT SUPPORTED"}function s(e){e.style.position="absolute",e.style.bottom="20px",e.style.padding="12px 6px",e.style.border="1px solid #fff",e.style.borderRadius="4px",e.style.background="rgba(0,0,0,0.1)",e.style.color="#fff",e.style.font="normal 13px sans-serif",e.style.textAlign="center",e.style.opacity="0.5",e.style.outline="none",e.style.zIndex="999"}if("xr"in navigator)return n.id="ARButton",n.style.display="none",s(n),navigator.xr.isSessionSupported("immersive-ar").then((function(s){s?function(){if(void 0===t.domOverlay){const e=document.createElement("div");e.style.display="none",document.body.appendChild(e);const n=document.createElementNS("http://www.w3.org/2000/svg","svg");n.setAttribute("width","38px"),n.setAttribute("height","38px"),n.style.position="absolute",n.style.right="20px",n.style.top="20px",n.addEventListener("click",(function(){var e;null===(e=o)||void 0===e||e.end()})),e.appendChild(n);const s=document.createElementNS("http://www.w3.org/2000/svg","path");s.setAttribute("d","M 12,12 L 28,28 M 28,12 12,28"),s.setAttribute("stroke","#fff"),s.setAttribute("stroke-width","2px"),n.appendChild(s),void 0===t.optionalFeatures&&(t.optionalFeatures=[]),t.optionalFeatures.push("dom-overlay"),t.domOverlay={root:e}}let o=null;async function s(s){s.addEventListener("end",l),e.xr.setReferenceSpaceType("local"),await e.xr.setSession(s),n.textContent="STOP AR",t.domOverlay.root.style.display="",o=s}function l(){o.removeEventListener("end",l),n.textContent="START AR",t.domOverlay.root.style.display="none",o=null}n.style.display="",n.style.cursor="pointer",n.style.left="calc(50% - 50px)",n.style.width="100px",n.textContent="START AR",n.onmouseenter=()=>{n.style.opacity="1.0"},n.onmouseleave=()=>{n.style.opacity="0.5"},n.onclick=()=>{null===o?navigator.xr.requestSession("immersive-ar",t).then(s):o.end()}}():o()})).catch(o),n;{const e=document.createElement("a");return!1===window.isSecureContext?(e.href=document.location.href.replace(/^http:/,"https:"),e.innerHTML="WEBXR NEEDS HTTPS"):(e.href="https://immersiveweb.dev/",e.innerHTML="WEBXR NOT AVAILABLE"),e.style.left="calc(50% - 90px)",e.style.width="180px",e.style.textDecoration="none",s(e),e}}};

package/webxr/ARButton.d.ts

@@ -1,5 +1,5 @@
-import { WebGLRenderer } from 'three';
-
-export namespace ARButton {
-    function createButton(renderer: WebGLRenderer, sessionInit?: any): HTMLElement;
+import { WebGLRenderer, XRSessionInit } from 'three';
+declare class ARButton {
+    static createButton(renderer: WebGLRenderer, sessionInit?: XRSessionInit): HTMLButtonElement | HTMLAnchorElement;
 }
+export { ARButton };

package/webxr/ARButton.js

@@ -6,23 +6,25 @@ class ARButton {
       /*device*/
     showStartAR() {
       if (sessionInit.domOverlay === undefined) {
-        var overlay = document.createElement('div');
+        const overlay = document.createElement('div');
         overlay.style.display = 'none';
         document.body.appendChild(overlay);
-        var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-        svg.setAttribute('width', 38);
-        svg.setAttribute('height', 38);
+        const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+        svg.setAttribute('width', '38px');
+        svg.setAttribute('height', '38px');
         svg.style.position = 'absolute';
         svg.style.right = '20px';
         svg.style.top = '20px';
         svg.addEventListener('click', function () {
-          currentSession.end();
+          var _currentSession;
+
+          (_currentSession = currentSession) === null || _currentSession === void 0 ? void 0 : _currentSession.end();
         });
         overlay.appendChild(svg);
-        var path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+        const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
         path.setAttribute('d', 'M 12,12 L 28,28 M 28,12 12,28');
         path.setAttribute('stroke', '#fff');
-        path.setAttribute('stroke-width', 2);
+        path.setAttribute('stroke-width', '2px');
         svg.appendChild(path);
 
         if (sessionInit.optionalFeatures === undefined) {
@@ -63,15 +65,15 @@ class ARButton {
       button.style.width = '100px';
       button.textContent = 'START AR';
 
-      button.onmouseenter = function () {
+      button.onmouseenter = () => {
         button.style.opacity = '1.0';
       };
 
-      button.onmouseleave = function () {
+      button.onmouseleave = () => {
         button.style.opacity = '0.5';
       };
 
-      button.onclick = function () {
+      button.onclick = () => {
         if (currentSession === null) {
           navigator.xr.requestSession('immersive-ar', sessionInit).then(onSessionStarted);
         } else {
@@ -113,7 +115,8 @@ class ARButton {
     if ('xr' in navigator) {
       button.id = 'ARButton';
       button.style.display = 'none';
-      stylizeElement(button);
+      stylizeElement(button) // Query for session mode
+      ;
       navigator.xr.isSessionSupported('immersive-ar').then(function (supported) {
         supported ? showStartAR() : showARNotSupported();
       }).catch(showARNotSupported);

package/webxr/VRButton.cjs.js

@@ -1 +1 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("@babel/runtime/helpers/defineProperty"));class n{static createButton(e,t){t&&console.error('THREE.VRButton: The "options" parameter has been removed. Please set the reference space type via renderer.xr.setReferenceSpaceType() instead.');const o=document.createElement("button");function s(){o.style.display="",o.style.cursor="auto",o.style.left="calc(50% - 75px)",o.style.width="150px",o.onmouseenter=null,o.onmouseleave=null,o.onclick=null,o.textContent="VR NOT SUPPORTED"}function r(e){e.style.position="absolute",e.style.bottom="20px",e.style.padding="12px 6px",e.style.border="1px solid #fff",e.style.borderRadius="4px",e.style.background="rgba(0,0,0,0.1)",e.style.color="#fff",e.style.font="normal 13px sans-serif",e.style.textAlign="center",e.style.opacity="0.5",e.style.outline="none",e.style.zIndex="999"}if("xr"in navigator)return o.id="VRButton",o.style.display="none",r(o),navigator.xr.isSessionSupported("immersive-vr").then((function(t){t?function(){let t=null;async function n(n){n.addEventListener("end",s),await e.xr.setSession(n),o.textContent="EXIT VR",t=n}function s(){t.removeEventListener("end",s),o.textContent="ENTER VR",t=null}o.style.display="",o.style.cursor="pointer",o.style.left="calc(50% - 50px)",o.style.width="100px",o.textContent="ENTER VR",o.onmouseenter=function(){o.style.opacity="1.0"},o.onmouseleave=function(){o.style.opacity="0.5"},o.onclick=function(){if(null===t){const e={optionalFeatures:["local-floor","bounded-floor","hand-tracking","layers"]};navigator.xr.requestSession("immersive-vr",e).then(n)}else t.end()}}():s(),t&&n.xrSessionIsGranted&&o.click()})),o;{const e=document.createElement("a");return!1===window.isSecureContext?(e.href=document.location.href.replace(/^http:/,"https:"),e.innerHTML="WEBXR NEEDS HTTPS"):(e.href="https://immersiveweb.dev/",e.innerHTML="WEBXR NOT AVAILABLE"),e.style.left="calc(50% - 90px)",e.style.width="180px",e.style.textDecoration="none",r(e),e}}static registerSessionGrantedListener(){"xr"in navigator&&navigator.xr.addEventListener("sessiongranted",(()=>{n.xrSessionIsGranted=!0}))}}t.default(n,"xrSessionIsGranted",!1),exports.VRButton=n;
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("@babel/runtime/helpers/defineProperty"));class n{static createButton(e,t={}){const o=document.createElement("button");function s(){o.style.display="",o.style.cursor="auto",o.style.left="calc(50% - 75px)",o.style.width="150px",o.onmouseenter=null,o.onmouseleave=null,o.onclick=null,o.textContent="VR NOT SUPPORTED"}function r(e){e.style.position="absolute",e.style.bottom="20px",e.style.padding="12px 6px",e.style.border="1px solid #fff",e.style.borderRadius="4px",e.style.background="rgba(0,0,0,0.1)",e.style.color="#fff",e.style.font="normal 13px sans-serif",e.style.textAlign="center",e.style.opacity="0.5",e.style.outline="none",e.style.zIndex="999"}if("xr"in navigator)return r(o),o.id="VRButton",o.style.display="none",navigator.xr.isSessionSupported("immersive-vr").then((r=>{r?function(){let n=null;async function s(t){t.addEventListener("end",r),await e.xr.setSession(t),o.textContent="EXIT VR",n=t}function r(){n.removeEventListener("end",r),o.textContent="ENTER VR",n=null}o.style.display="",o.style.cursor="pointer",o.style.left="calc(50% - 50px)",o.style.width="100px",o.textContent="ENTER VR",o.onmouseenter=()=>{o.style.opacity="1.0"},o.onmouseleave=()=>{o.style.opacity="0.5"},o.onclick=()=>{if(null===n){var e;const n=[t.optionalFeatures,"local-floor","bounded-floor","hand-tracking"].flat().filter(Boolean);null===(e=navigator.xr)||void 0===e||e.requestSession("immersive-vr",{...t,optionalFeatures:n}).then(s)}else n.end()}}():s(),r&&n.xrSessionIsGranted&&o.click()})),o;{const e=document.createElement("a");return!1===window.isSecureContext?(e.href=document.location.href.replace(/^http:/,"https:"),e.innerHTML="WEBXR NEEDS HTTPS"):(e.href="https://immersiveweb.dev/",e.innerHTML="WEBXR NOT AVAILABLE"),e.style.left="calc(50% - 90px)",e.style.width="180px",e.style.textDecoration="none",r(e),e}}static registerSessionGrantedListener(){"xr"in navigator&&navigator.xr.addEventListener("sessiongranted",(()=>{n.xrSessionIsGranted=!0}))}}t.default(n,"xrSessionIsGranted",!1),exports.VRButton=n;

package/webxr/VRButton.d.ts

@@ -1,5 +1,7 @@
-import { WebGLRenderer } from 'three';
-
-export namespace VRButton {
-    function createButton(renderer: WebGLRenderer): HTMLElement;
+import { WebGLRenderer, XRSessionInit } from 'three';
+declare class VRButton {
+    static createButton(renderer: WebGLRenderer, sessionInit?: XRSessionInit): HTMLButtonElement | HTMLAnchorElement;
+    static xrSessionIsGranted: boolean;
+    static registerSessionGrantedListener(): void;
 }
+export { VRButton };

package/webxr/VRButton.js

@@ -1,11 +1,7 @@
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 
 class VRButton {
-  static createButton(renderer, options) {
-    if (options) {
-      console.error('THREE.VRButton: The "options" parameter has been removed. Please set the reference space type via renderer.xr.setReferenceSpaceType() instead.');
-    }
-
+  static createButton(renderer, sessionInit = {}) {
     const button = document.createElement('button');
 
     function
@@ -35,26 +31,28 @@ class VRButton {
       button.style.width = '100px';
       button.textContent = 'ENTER VR';
 
-      button.onmouseenter = function () {
+      button.onmouseenter = () => {
         button.style.opacity = '1.0';
       };
 
-      button.onmouseleave = function () {
+      button.onmouseleave = () => {
         button.style.opacity = '0.5';
       };
 
-      button.onclick = function () {
+      button.onclick = () => {
         if (currentSession === null) {
+          var _xr;
+
           // WebXR's requestReferenceSpace only works if the corresponding feature
           // was requested at session creation time. For simplicity, just ask for
           // the interesting ones as optional features, but be aware that the
           // requestReferenceSpace call will fail if it turns out to be unavailable.
           // ('local' is always available for immersive sessions and doesn't need to
           // be requested separately.)
-          const sessionInit = {
-            optionalFeatures: ['local-floor', 'bounded-floor', 'hand-tracking', 'layers']
-          };
-          navigator.xr.requestSession('immersive-vr', sessionInit).then(onSessionStarted);
+          const optionalFeatures = [sessionInit.optionalFeatures, 'local-floor', 'bounded-floor', 'hand-tracking'].flat().filter(Boolean);
+          (_xr = navigator.xr) === null || _xr === void 0 ? void 0 : _xr.requestSession('immersive-vr', { ...sessionInit,
+            optionalFeatures
+          }).then(onSessionStarted);
         } else {
           currentSession.end();
         }
@@ -92,10 +90,11 @@ class VRButton {
     }
 
     if ('xr' in navigator) {
-      button.id = 'VRButton';
-      button.style.display = 'none';
       stylizeElement(button);
-      navigator.xr.isSessionSupported('immersive-vr').then(function (supported) {
+      button.id = 'VRButton';
+      button.style.display = 'none' // Query for session mode
+      ;
+      navigator.xr.isSessionSupported('immersive-vr').then(supported => {
         supported ? showEnterVR() : showWebXRNotFound();
 
         if (supported && VRButton.xrSessionIsGranted) {