Merge pull request #2201 from tbirdso/xr-emulator-directions

docs(XR): Add discussion on XR emulator

Author: floryst

Documentation/content/docs/develop_webxr.md

@@ -0,0 +1,70 @@
+title: WebXR Examples
+---
+
+<style>
+.categories {
+    columns: 2 200px;
+    column-gap: 1rem;
+  }
+
+  .category {
+    break-inside: avoid;
+    display: inline-block;
+    width: 100%;
+  }
+
+  .categories br {
+    display: none;
+  }
+
+  .category ul {
+    margin-top: 0;
+  }
+
+  .gallery img {
+    width: 49%;
+    display: inline-block;
+    padding: 2px;
+  }
+
+  .gallery br {
+    display: none;
+  }
+</style>
+
+vtk.js supports virtual and augmented reality rendering via the [WebXR device API](https://www.w3.org/TR/webxr/) for most standalone and PC headsets.
+
+### Virtual Reality Examples
+
+<div class="gallery">
+
+[![VR Cone Example][VrCone]](../examples/VR.html)
+[![SkyboxViewer Example][SkyboxViewerVR]](../examples/SkyboxViewer.html?fileURL=https://data.kitware.com/api/v1/file/5ae8a89c8d777f0685796bae/download)
+
+</div>
+
+### Augmented Reality Examples
+
+<div class="gallery">
+
+[![AR Cone Example][ArCone]](../examples/AR.html)
+[![GeometryViewer Example][GeometryViewer]](../examples/GeometryViewer.html?fileURL=https://data.kitware.com/api/v1/item/59de9de58d777f31ac641dc5/download)
+
+</div>
+
+### For Developers
+
+Developers without access to XR hardware may find it convenient to install and use the [Mozilla WebXR emulator](https://github.com/MozillaReality/WebXR-emulator-extension) in their browser.
+
+- Install the WebXR extension on either Chrome or Firefox.
+- Close and reopen the browser.
+- Press F12 to access the browser console.
+- Select the "WebXR" tab to selected XR emulated hardware and view controls.
+
+While WebXR has broad industry support, it is not yet implemented in all browsers. Developers may include the [WebXR polyfill](https://github.com/immersive-web/webxr-polyfill) in their projects for backwards compatibility with the deprecated WebVR API.
+
+
+[ArCone]: ../docs/gallery/ArCone.jpg
+[GeometryViewer]: ../docs/gallery/GeometryViewer.jpg
+[SkyboxViewerVR]: ../docs/gallery/SkyboxViewerVR.jpg
+[VrCone]: ../docs/gallery/VrCone.jpg

Documentation/content/docs/gallery/ArCone.jpg

@@ -29,6 +29,7 @@ sidebar:
     class: Create class
     example: Create example
     webgpu: WebGPU Examples
+    webxr: WebXR Examples
     test: Create test
     build: Build library
     concepts: Concepts

Documentation/content/docs/gallery/SkyboxViewerVR.jpg

@@ -17,6 +17,7 @@ docs:
     build: develop_build.html
     widget: develop_widget.html
     webgpu: develop_webgpu.html
+    webxr: develop_webxr.html
 
   concepts:
     widgets: concepts_widgets.html

Documentation/content/docs/gallery/VrCone.jpg

@@ -1,3 +1,6 @@
+// For streamlined VR development install the WebXR emulator extension
+// https://github.com/MozillaReality/WebXR-emulator-extension
+
 import 'vtk.js/Sources/favicon';
 
 // Load the rendering pieces we want to use (for both WebGL and WebGPU)

Documentation/tpl/__en__

@@ -1,3 +1,6 @@
+// For streamlined VR development install the WebXR emulator extension
+// https://github.com/MozillaReality/WebXR-emulator-extension
+
 import 'vtk.js/Sources/favicon';
 
 // Load the rendering pieces we want to use (for both WebGL and WebGPU)

Documentation/tpl/__sidebar__

@@ -0,0 +1,10 @@
+## Viewing Scenes with WebXR
+
+vtk.js supports virtual reality rendering via the [WebXR device API](https://www.w3.org/TR/webxr/) for most standalone and PC headsets.
+
+Developers seeking to develop VR experiences without hardware may make use of the Mozilla WebXR emulator extension at [https://github.com/MozillaReality/WebXR-emulator-extension](https://github.com/MozillaReality/WebXR-emulator-extension) with these installation steps:
+
+- Install the WebXR extension on either Chrome or Firefox.
+- Close and reopen the browser.
+- Press F12 to access the browser console.
+- Select the "WebXR" tab to selected XR emulated hardware and view controls.