kainino0x / holoplay-webxr

No longer maintained! Please move to https://github.com/Looking-Glass/looking-glass-webxr

No longer maintained! Please move to https://github.com/Looking-Glass/looking-glass-webxr

Original README

WebXR for HoloPlay (Unofficial!)

Implements the WebXR API (using webxr-polyfill) for Looking Glass Factory's HoloPlay devices.

This project contains both a library and a WebExtension that injects the library before page load.

This repo contains builds of both the library and the (unpacked) extension. In order to install the extension, simply clone the repository and point your browser at the directory. (Tested in Chrome 89 and Firefox 86.)

• To install in Chrome, navigate to chrome://extensions, select the Load Unpacked button, and point at the cloned directory.

Thanks to WebXR Emulator Extension from which I took the skeleton of this project.

Live Demo

This fork of webxr-samples has been modified to unconditionally use WebXR for HoloPlay instead.

Status

• Only tested on a single Looking Glass 8.9" dev kit. (Additional testing would be appreciated!)
• Extension has not been published in the Chrome Web Store or Firefox Add-ons.

Compatibility

• webxr-samples: Works!
• Three.js: Technically works, but can only handle 2 views. Often fails to launch in Chrome, due to an unattributed DOMException. (tested page)
• Babylon.js: Works! Fixed in version 5.0.0-alpha.9. (tested page)
• Sketchfab: Renders a blank screen (not sure why).

Hacking

• npm run build to build.
• npm run serve to serve the demos.

holoplay-webxr's Issues

use gl-preserve-state

discovered accidentally in my own build deps. https://github.com/jsantell/gl-preserve-state

A-Frame / three.js support on Looking Glass Portrait

I have been able to successfully download and install the Chrome extension and use it on the webxr sample page as well as babylon.js with the portrait. I appreciate the view controls to find the perfect image in the scene, it's super useful.

I tried run the sample A-Frame "hello webvr" scene and when I click VR mode the scene becomes unresponsive and there is a new console message:

The optional feature 'bounded-floor' is not supported

When I run a three.js webxr sample scene the scene keeps animating after the button is pressed but no overlay appears to set holoplay view controls / settings. There are also messages on the console:

The optional feature 'bounded-floor' is not supported
VM79:7662 HoloPlayXRDevice.isFeatureSupported: feature not understood: hand-tracking
isFeatureSupported @ VM79:7662
requestSession @ VM79:936
button.onclick @ VRButton.js:72
VM79:937 The optional feature 'hand-tracking' is not supported
VM79:7662 HoloPlayXRDevice.isFeatureSupported: feature not understood: layers
isFeatureSupported @ VM79:7662
requestSession @ VM79:936
button.onclick @ VRButton.js:72
VM79:937 The optional feature 'layers' is not supported

Is there anything else I could do to help diagnose?

Uncaught TypeError: Class extends value undefined is not a constructor or null

Trying this in Chrome 90.0.4430.212 (Official Build) and looking glass portrait. Holoplay Studio is up and running. After some challenges, was able to run the unpacked extension and clone the right commit of the webxr samples, but I keep getting this error. Tried with and without the WebXR extension. Any idea what might be going on? Super keen to get webxr running on this beautiful device!

See if WebHID can be used to get (correct) calibration data on Portrait

I can't test how calibration data gets exposed on Looking Glass Portrait.
Here's an experiment that works with the "2K" Looking Glass:
https://kai.graphics/holoplay-webxr/calibration-via-webhid.html

Open questions:

• Is Portrait a HID device?
• If so, what is the vendor/device ID and name of the Portrait? Can be checked using Chrome by looking at log entries in chrome://device-log/ upon connecting the device - for "2K":

  [19:12:24] HID device added: vendorId=1240, productId=61310, name='HoloPlay', serial='C', ...
  

• Is the HID protocol still the same?
• Is the retrieved calibration data the correct data, or the busted data?

failed to install due to webxr-polyfill not having a package.json file

currently the package.json file points to an empty webxr-polyfill folder as its source for webxr-polyfill

given that this folder is empty and does not contain a package.json file, npm is unable to install it.

In order to install the holoplay-webxr library currently the user has to manually override the path for the webxr-polyfill package.

Handle multiple devices somehow?

Currently prints a warning. I have no idea how multiple devices work in WebXR or if any sites even support it.

Uncaught promise error if no devices attached

this.calibration = msg.devices[0].calibration;
devices is 0 length.

Not sure if this is really a problem, but maybe highlights at some point handling error/mutliple displays could be improved

Extension's XRReferenceSpace missing addEventListener

https://immersive-web.github.io/webxr/#xrreferencespace-interface

XRReferenceSpace is supposed to be an EventTarget, so expected that addEventListener exists.

This is for reset when a space changes, which doesn't really apply, but function still should be around :)

Working on Portrait?

Has anyone had success getting this to work on the LG Portrait? I've tried it in the Babylon test scene but it doesn't look right. Likely something wrong with the calibration.

Support Looking Glass portrait

As if you didn't have enough to do. :)

Just got my Looking Glass Portrait and gave this a cursory test. Unfortunately the views aren't properly aligned (which is probably to be expected) so it just shows up garbled, even with the content fullscreen. Happy to help debug and fix this some time!