init

assets/license.98fb416e.js

@@ -0,0 +1 @@
+const e=!1,s={hasLicense:!1};export{s as default,e as hasLicense};

include/console/ConsoleReroute.js

@@ -0,0 +1,79 @@
+(function() {
+    const url = window.location.search;
+    const urlParams = new URLSearchParams(url);
+    if (!urlParams.has('debugconsole')) return;
+
+    const logNode = document.createElement("pre");
+    logNode.id = "log";
+    const logContainer = document.createElement("div");
+    logContainer.id = "log-container";
+    logContainer.appendChild(logNode);
+
+    window.addEventListener('DOMContentLoaded', (_) => {
+        const arOverlay = document.querySelector('.ar.overlay');
+        if(arOverlay)
+            arOverlay.appendChild(logContainer);
+        else
+            document.body.appendChild(logContainer);
+    });
+
+    rewireLoggingToElement(
+        () => logNode,
+        () => logContainer, true);
+
+    window.onError = function(message, source, lineno, colno, error) {
+        console.error(message, source, lineno, colno, error);
+    }
+
+    console.info("rewired console output");
+    console.info("User Agent: " + navigator.userAgent);
+
+    function rewireLoggingToElement(eleLocator, eleOverflowLocator, autoScroll) {
+        fixLoggingFunc('log');
+        fixLoggingFunc('debug');
+        fixLoggingFunc('warn');
+        fixLoggingFunc('error');
+        fixLoggingFunc('info');
+
+        function fixLoggingFunc(name) {
+            console['old' + name] = console[name];
+            console[name] = function(...args) {
+                const output = produceOutput(name, args);
+                const eleLog = eleLocator();
+
+                if (autoScroll) {
+                    const eleContainerLog = eleOverflowLocator();
+                    const isScrolledToBottom = eleContainerLog.scrollHeight - eleContainerLog.clientHeight <= eleContainerLog.scrollTop + 1;
+                    eleLog.innerHTML += output + "<br>";
+                    if (isScrolledToBottom) {
+                        eleContainerLog.scrollTop = eleContainerLog.scrollHeight - eleContainerLog.clientHeight;
+                    }
+                } else {
+                    eleLog.innerHTML += output + "<br>";
+                }
+
+                console['old' + name].apply(undefined, args);
+            };
+        }
+
+        function produceOutput(name, args) {
+            return args.reduce((output, arg) => {
+                try {
+                    return output +
+                        "<span class=\"log-" + (typeof arg) + " log-" + name + "\">" +
+                            (typeof arg === "object" && (JSON || {}).stringify ? JSON.stringify(arg) : arg) +
+                        "</span>&nbsp;";
+                }
+                catch(ex) {
+                    console.error("exception when logging: " + ex);
+                }
+            }, '');
+        }
+    }
+    /*
+    setInterval(() => {
+      const method = (['log', 'debug', 'warn', 'error', 'info'][Math.floor(Math.random() * 5)]);
+      console[method](method, 'logging something...'); 
+    }, 200);
+    */
+})();

include/three/ARButton.js

@@ -0,0 +1,229 @@
+class ARButton {
+
+	static createButton( renderer, options = {} ) {
+
+		const button = document.createElement( 'button' );
+		let ARButtonControlsDomOverlay = false;
+
+		function showStartAR( /*device*/ ) {			
+
+			options.optionalFeatures = options.optionalFeatures || [];
+
+			if ( options.domOverlay === undefined) {
+
+				var 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 );
+				svg.style.position = 'absolute';
+				svg.style.right = '20px';
+				svg.style.top = '20px';
+				svg.addEventListener( 'click', function () {
+
+					currentSession.end();
+
+				} );
+				overlay.appendChild( svg );
+
+				var 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 );
+				svg.appendChild( path );
+
+				options.optionalFeatures.push( 'dom-overlay' );
+				options.domOverlay = { root: overlay };
+				ARButtonControlsDomOverlay = true;
+
+			}
+
+			//
+
+			let currentSession = null;
+			let originalDomOverlayParent = null;
+
+			async function onSessionStarted( session ) {
+
+				// Workaround: seems WebXR Viewer has a non-standard behaviour when it comes to DOM Overlay and Canvas;
+				// HTMLElements that are inside the Canvas element are not visible in the DOM Overlay.
+				const isWebXRViewer = /WebXRViewer\//i.test( navigator.userAgent );
+				if (isWebXRViewer) {
+					if(options.domOverlay?.root) {
+						const overlayElement = options.domOverlay.root;
+						originalDomOverlayParent = overlayElement.parentElement;
+						if (originalDomOverlayParent) {
+							console.log("Reparent DOM Overlay to body", overlayElement, overlayElement.style.display);
+							// mozilla webxr does hide elements on session start
+							// this is only necessary if we generated the overlay element
+							overlayElement.style.display = "";
+							overlayElement.style.visibility = "";
+							document.body.appendChild(overlayElement);
+						}
+					}
+					else {
+						console.warn("WebXRViewer: No DOM Overlay found");
+					}
+				}
+
+				session.addEventListener( 'end', onSessionEnded );
+
+				// 'local' is head-relative, 'local-floor' is what the device thinks the floor is (e.g. Hololens knows pretty well)
+				// renderer.xr.setReferenceSpaceType( 'local' );
+
+				await renderer.xr.setSession( session );
+
+				button.textContent = 'STOP AR';
+
+				if (ARButtonControlsDomOverlay)
+					options.domOverlay.root.style.display = '';
+
+				currentSession = session;
+
+			}
+
+			function onSessionEnded( /*event*/ ) {
+
+				currentSession.removeEventListener( 'end', onSessionEnded );
+
+				button.textContent = 'START AR';
+
+				// if we reparented the DOM overlay, we're reverting it here
+				if (originalDomOverlayParent)
+					originalDomOverlayParent.appendChild(options.domOverlay.root);
+
+				if (ARButtonControlsDomOverlay)
+					options.domOverlay.root.style.display = 'none';
+
+				currentSession = null;
+
+			}
+
+			//
+
+			button.style.display = '';
+
+			button.style.cursor = 'pointer';
+			button.style.left = 'calc(50% - 50px)';
+			button.style.width = '100px';
+
+			button.textContent = 'START AR';
+
+			button.onmouseenter = function () {
+
+				button.style.opacity = '1.0';
+
+			};
+
+			button.onmouseleave = function () {
+
+				button.style.opacity = '0.5';
+
+			};
+
+			button.onclick = function () {
+
+				if ( currentSession === null ) {
+
+					navigator.xr.requestSession( 'immersive-ar', options ).then( onSessionStarted );
+
+				} else {
+
+					currentSession.end();
+
+				}
+
+			};
+
+		}
+
+		function disableButton() {
+
+			button.disabled = true;
+
+			button.style.display = '';
+
+			button.style.cursor = 'auto';
+			button.style.left = 'calc(50% - 75px)';
+			button.style.width = '150px';
+
+			button.onmouseenter = null;
+			button.onmouseleave = null;
+
+			button.onclick = null;
+
+		}
+
+		function showARNotSupported() {
+
+			disableButton();
+
+			button.textContent = 'AR NOT SUPPORTED';
+
+		}
+
+		function stylizeElement( element ) {
+
+			element.style.position = 'absolute';
+			element.style.bottom = '20px';
+			element.style.padding = '12px 6px';
+			element.style.border = '1px solid #fff';
+			element.style.borderRadius = '4px';
+			element.style.background = 'rgba(0,0,0,0.1)';
+			element.style.color = '#fff';
+			element.style.font = 'normal 13px sans-serif';
+			element.style.textAlign = 'center';
+			element.style.opacity = '0.5';
+			element.style.outline = 'none';
+			element.style.zIndex = '999';
+
+		}
+
+		if ( 'xr' in navigator ) {
+
+			button.id = 'ARButton';
+			button.style.display = 'none';
+
+			stylizeElement( button );
+
+			navigator.xr.isSessionSupported( 'immersive-ar' ).then( function ( supported ) {
+
+				supported ? showStartAR() : showARNotSupported();
+
+			} ).catch( showARNotSupported );
+
+			return button;
+
+		} else {
+
+			const message = document.createElement( 'a' );
+
+			if ( window.isSecureContext === false ) {
+
+				message.href = document.location.href.replace( /^http:/, 'https:' );
+				message.innerHTML = 'WEBXR NEEDS HTTPS'; // TODO Improve message
+
+			} else {
+
+				message.href = 'https://immersiveweb.dev/';
+				message.innerHTML = 'WEBXR NOT AVAILABLE';
+
+			}
+
+			message.style.left = 'calc(50% - 90px)';
+			message.style.width = '180px';
+			message.style.textDecoration = 'none';
+
+			stylizeElement( message );
+
+			return message;
+
+		}
+
+	}
+
+}
+
+export { ARButton };