feat(WebXR): Enumerate supported XR session types

Replaces RenderWindow boolean "isAR" parameter with enumerated list of XR session types. Updates internal logic and examples to use enumerated session types in place of simple "isAR" checks. These changes are introduced as a prerequisite for adding Looking Glass support as a third type of XR session. Changes are technically API breaking, though consuming projects using VR == 0, AR == 1 implicit enumerated values are unlikely to see changes in project behavior.
Kitware · Feb 28, 2023 · 0107730 · 0107730
1 parent ff90746
commit 0107730
Show file tree

Hide file tree

Showing 11 changed files with 79 additions and 67 deletions.
diff --git a/Examples/Applications/GeometryViewer/index.js b/Examples/Applications/GeometryViewer/index.js
@@ -18,6 +18,7 @@ import vtkMapper from '@kitware/vtk.js/Rendering/Core/Mapper';
 import vtkURLExtract from '@kitware/vtk.js/Common/Core/URLExtract';
 import vtkXMLPolyDataReader from '@kitware/vtk.js/IO/XML/XMLPolyDataReader';
 import vtkFPSMonitor from '@kitware/vtk.js/Interaction/UI/FPSMonitor';
+import { XrSessionTypes } from '@kitware/vtk.js/Rendering/OpenGL/RenderWindow/Constants';
 
 // Force DataAccessHelper to have access to various data source
 import '@kitware/vtk.js/IO/Core/DataAccessHelper/HtmlDataAccessHelper';
@@ -388,16 +389,17 @@ function createPipeline(fileName, fileContents) {
   // --------------------------------------------------------------------
 
   function toggleAR() {
-    const SESSION_IS_AR = true;
     if (immersionSelector.textContent === 'Start AR') {
       fullScreenRenderWindow.setBackground([...background, 0]);
       fullScreenRenderWindow
         .getApiSpecificRenderWindow()
-        .startXR(SESSION_IS_AR);
+        .startXR(XrSessionTypes.MobileAR);
       immersionSelector.textContent = 'Exit AR';
     } else {
       fullScreenRenderWindow.setBackground([...background, 255]);
-      fullScreenRenderWindow.getApiSpecificRenderWindow().stopXR(SESSION_IS_AR);
+      fullScreenRenderWindow
+        .getApiSpecificRenderWindow()
+        .stopXR(XrSessionTypes.MobileAR);
       immersionSelector.textContent = 'Start AR';
     }
   }

diff --git a/Examples/Applications/SkyboxViewer/index.js b/Examples/Applications/SkyboxViewer/index.js
@@ -13,7 +13,7 @@ import vtkFullScreenRenderWindow from '@kitware/vtk.js/Rendering/Misc/FullScreen
 import vtkSkybox from '@kitware/vtk.js/Rendering/Core/Skybox';
 import vtkSkyboxReader from '@kitware/vtk.js/IO/Misc/SkyboxReader';
 import vtkURLExtract from '@kitware/vtk.js/Common/Core/URLExtract';
-// import vtkMobileVR from '@kitware/vtk.js/Common/System/MobileVR';
+import { XrSessionTypes } from '@kitware/vtk.js/Rendering/OpenGL/RenderWindow/Constants';
 
 // Force DataAccessHelper to have access to various data source
 import '@kitware/vtk.js/IO/Core/DataAccessHelper/HtmlDataAccessHelper';
@@ -213,7 +213,9 @@ function createVisualization(container, mapReader) {
     document.querySelector('body').appendChild(button);
     button.addEventListener('click', () => {
       if (button.textContent === 'Send To VR') {
-        fullScreenRenderer.getApiSpecificRenderWindow().startXR();
+        fullScreenRenderer
+          .getApiSpecificRenderWindow()
+          .startXR(XrSessionTypes.HmdVR);
         button.textContent = 'Return From VR';
       } else {
         fullScreenRenderer.getApiSpecificRenderWindow().stopXR();

diff --git a/Examples/Geometry/AR/index.js b/Examples/Geometry/AR/index.js
@@ -10,6 +10,7 @@ import vtkFullScreenRenderWindow from '@kitware/vtk.js/Rendering/Misc/FullScreen
 import vtkMapper from '@kitware/vtk.js/Rendering/Core/Mapper';
 import { AttributeTypes } from '@kitware/vtk.js/Common/DataModel/DataSetAttributes/Constants';
 import { FieldDataTypes } from '@kitware/vtk.js/Common/DataModel/DataSet/Constants';
+import { XrSessionTypes } from '@kitware/vtk.js/Rendering/OpenGL/RenderWindow/Constants';
 
 // Force DataAccessHelper to have access to various data source
 import '@kitware/vtk.js/IO/Core/DataAccessHelper/HtmlDataAccessHelper';
@@ -82,15 +83,16 @@ arbutton.disabled = !fullScreenRenderer
   .getApiSpecificRenderWindow()
   .getXrSupported();
 
-const SESSION_IS_AR = true;
 arbutton.addEventListener('click', (e) => {
   if (arbutton.textContent === 'Start AR') {
     fullScreenRenderer.setBackground([0, 0, 0, 0]);
-    fullScreenRenderer.getApiSpecificRenderWindow().startXR(SESSION_IS_AR);
+    fullScreenRenderer
+      .getApiSpecificRenderWindow()
+      .startXR(XrSessionTypes.MobileAR);
     arbutton.textContent = 'Exit AR';
   } else {
     fullScreenRenderer.setBackground([0, 0, 0, 255]);
-    fullScreenRenderer.getApiSpecificRenderWindow().stopXR(SESSION_IS_AR);
+    fullScreenRenderer.getApiSpecificRenderWindow().stopXR();
     arbutton.textContent = 'Start AR';
   }
 });

diff --git a/Examples/Geometry/VR/index.js b/Examples/Geometry/VR/index.js
@@ -13,6 +13,7 @@ import vtkFullScreenRenderWindow from '@kitware/vtk.js/Rendering/Misc/FullScreen
 import vtkMapper from '@kitware/vtk.js/Rendering/Core/Mapper';
 import { AttributeTypes } from '@kitware/vtk.js/Common/DataModel/DataSetAttributes/Constants';
 import { FieldDataTypes } from '@kitware/vtk.js/Common/DataModel/DataSet/Constants';
+import { XrSessionTypes } from '@kitware/vtk.js/Rendering/OpenGL/RenderWindow/Constants';
 
 // Force DataAccessHelper to have access to various data source
 import '@kitware/vtk.js/IO/Core/DataAccessHelper/HtmlDataAccessHelper';
@@ -113,7 +114,9 @@ resolutionChange.addEventListener('input', (e) => {
 
 vrbutton.addEventListener('click', (e) => {
   if (vrbutton.textContent === 'Send To VR') {
-    fullScreenRenderer.getApiSpecificRenderWindow().startXR();
+    fullScreenRenderer
+      .getApiSpecificRenderWindow()
+      .startXR(XrSessionTypes.HmdVR);
     vrbutton.textContent = 'Return From VR';
   } else {
     fullScreenRenderer.getApiSpecificRenderWindow().stopXR();

diff --git a/Examples/Volume/WebXRChestCTBlendedCVR/index.js b/Examples/Volume/WebXRChestCTBlendedCVR/index.js
@@ -18,6 +18,7 @@ import vtkVolumeMapper from '@kitware/vtk.js/Rendering/Core/VolumeMapper';
 import vtkXMLImageDataReader from '@kitware/vtk.js/IO/XML/XMLImageDataReader';
 import vtkImageReslice from '@kitware/vtk.js/Imaging/Core/ImageReslice';
 import vtkMath from '@kitware/vtk.js/Common/Core/Math';
+import { XrSessionTypes } from '@kitware/vtk.js/Rendering/OpenGL/RenderWindow/Constants';
 
 import './WebXRVolume.module.css';
 
@@ -112,8 +113,6 @@ HttpDataAccessHelper.fetchBinary(fileURL).then((fileContents) => {
   renderWindow.render();
 
   // Add button to launch AR (default) or VR scene
-  const VR = 1;
-  const AR = 2;
   let xrSessionType = 0;
   const xrButton = document.createElement('button');
   let enterText = 'XR not available!';
@@ -125,13 +124,13 @@ HttpDataAccessHelper.fetchBinary(fileURL).then((fileContents) => {
   ) {
     navigator.xr.isSessionSupported('immersive-ar').then((arSupported) => {
       if (arSupported) {
-        xrSessionType = AR;
+        xrSessionType = XrSessionTypes.MobileAR;
         enterText = 'Start AR';
         xrButton.textContent = enterText;
       } else {
         navigator.xr.isSessionSupported('immersive-vr').then((vrSupported) => {
           if (vrSupported) {
-            xrSessionType = VR;
+            xrSessionType = XrSessionTypes.HmdVR;
             enterText = 'Start VR';
             xrButton.textContent = enterText;
           }
@@ -141,18 +140,14 @@ HttpDataAccessHelper.fetchBinary(fileURL).then((fileContents) => {
   }
   xrButton.addEventListener('click', () => {
     if (xrButton.textContent === enterText) {
-      if (xrSessionType === AR) {
+      if (xrSessionType === XrSessionTypes.MobileAR) {
         fullScreenRenderer.setBackground([0, 0, 0, 0]);
       }
-      fullScreenRenderer
-        .getApiSpecificRenderWindow()
-        .startXR(xrSessionType === AR);
+      fullScreenRenderer.getApiSpecificRenderWindow().startXR(xrSessionType);
       xrButton.textContent = exitText;
     } else {
       fullScreenRenderer.setBackground([...background, 255]);
-      fullScreenRenderer
-        .getApiSpecificRenderWindow()
-        .stopXR(xrSessionType === AR);
+      fullScreenRenderer.getApiSpecificRenderWindow().stopXR();
       xrButton.textContent = enterText;
     }
   });

diff --git a/Examples/Volume/WebXRHeadFullVolumeCVR/index.js b/Examples/Volume/WebXRHeadFullVolumeCVR/index.js
@@ -18,6 +18,7 @@ import vtkVolumeMapper from '@kitware/vtk.js/Rendering/Core/VolumeMapper';
 import vtkXMLImageDataReader from '@kitware/vtk.js/IO/XML/XMLImageDataReader';
 import vtkImageReslice from '@kitware/vtk.js/Imaging/Core/ImageReslice';
 import vtkMath from '@kitware/vtk.js/Common/Core/Math';
+import { XrSessionTypes } from '@kitware/vtk.js/Rendering/OpenGL/RenderWindow/Constants';
 
 import './WebXRVolume.module.css';
 
@@ -109,8 +110,6 @@ HttpDataAccessHelper.fetchBinary(fileURL).then((fileContents) => {
   renderWindow.render();
 
   // Add button to launch AR (default) or VR scene
-  const VR = 1;
-  const AR = 2;
   let xrSessionType = 0;
   const xrButton = document.createElement('button');
   let enterText = 'XR not available!';
@@ -122,13 +121,13 @@ HttpDataAccessHelper.fetchBinary(fileURL).then((fileContents) => {
   ) {
     navigator.xr.isSessionSupported('immersive-ar').then((arSupported) => {
       if (arSupported) {
-        xrSessionType = AR;
+        xrSessionType = XrSessionTypes.MobileAR;
         enterText = 'Start AR';
         xrButton.textContent = enterText;
       } else {
         navigator.xr.isSessionSupported('immersive-vr').then((vrSupported) => {
           if (vrSupported) {
-            xrSessionType = VR;
+            xrSessionType = XrSessionTypes.HmdVR;
             enterText = 'Start VR';
             xrButton.textContent = enterText;
           }
@@ -138,18 +137,14 @@ HttpDataAccessHelper.fetchBinary(fileURL).then((fileContents) => {
   }
   xrButton.addEventListener('click', () => {
     if (xrButton.textContent === enterText) {
-      if (xrSessionType === AR) {
+      if (xrSessionType === XrSessionTypes.MobileAR) {
         fullScreenRenderer.setBackground([0, 0, 0, 0]);
       }
-      fullScreenRenderer
-        .getApiSpecificRenderWindow()
-        .startXR(xrSessionType === AR);
+      fullScreenRenderer.getApiSpecificRenderWindow().startXR(xrSessionType);
       xrButton.textContent = exitText;
     } else {
       fullScreenRenderer.setBackground([...background, 255]);
-      fullScreenRenderer
-        .getApiSpecificRenderWindow()
-        .stopXR(xrSessionType === AR);
+      fullScreenRenderer.getApiSpecificRenderWindow().stopXR();
       xrButton.textContent = enterText;
     }
   });

diff --git a/Examples/Volume/WebXRHeadGradientCVR/index.js b/Examples/Volume/WebXRHeadGradientCVR/index.js
@@ -18,6 +18,7 @@ import vtkVolumeMapper from '@kitware/vtk.js/Rendering/Core/VolumeMapper';
 import vtkXMLImageDataReader from '@kitware/vtk.js/IO/XML/XMLImageDataReader';
 import vtkImageReslice from '@kitware/vtk.js/Imaging/Core/ImageReslice';
 import vtkMath from '@kitware/vtk.js/Common/Core/Math';
+import { XrSessionTypes } from '@kitware/vtk.js/Rendering/OpenGL/RenderWindow/Constants';
 
 import './WebXRVolume.module.css';
 
@@ -106,8 +107,6 @@ HttpDataAccessHelper.fetchBinary(fileURL).then((fileContents) => {
   renderWindow.render();
 
   // Add button to launch AR (default) or VR scene
-  const VR = 1;
-  const AR = 2;
   let xrSessionType = 0;
   const xrButton = document.createElement('button');
   let enterText = 'XR not available!';
@@ -119,13 +118,13 @@ HttpDataAccessHelper.fetchBinary(fileURL).then((fileContents) => {
   ) {
     navigator.xr.isSessionSupported('immersive-ar').then((arSupported) => {
       if (arSupported) {
-        xrSessionType = AR;
+        xrSessionType = XrSessionTypes.MobileAR;
         enterText = 'Start AR';
         xrButton.textContent = enterText;
       } else {
         navigator.xr.isSessionSupported('immersive-vr').then((vrSupported) => {
           if (vrSupported) {
-            xrSessionType = VR;
+            xrSessionType = XrSessionTypes.HmdVR;
             enterText = 'Start VR';
             xrButton.textContent = enterText;
           }
@@ -135,18 +134,14 @@ HttpDataAccessHelper.fetchBinary(fileURL).then((fileContents) => {
   }
   xrButton.addEventListener('click', () => {
     if (xrButton.textContent === enterText) {
-      if (xrSessionType === AR) {
+      if (xrSessionType === XrSessionTypes.MobileAR) {
         fullScreenRenderer.setBackground([0, 0, 0, 0]);
       }
-      fullScreenRenderer
-        .getApiSpecificRenderWindow()
-        .startXR(xrSessionType === AR);
+      fullScreenRenderer.getApiSpecificRenderWindow().startXR(xrSessionType);
       xrButton.textContent = exitText;
     } else {
       fullScreenRenderer.setBackground([...background, 255]);
-      fullScreenRenderer
-        .getApiSpecificRenderWindow()
-        .stopXR(xrSessionType === AR);
+      fullScreenRenderer.getApiSpecificRenderWindow().stopXR();
       xrButton.textContent = enterText;
     }
   });

diff --git a/Examples/Volume/WebXRVolume/index.js b/Examples/Volume/WebXRVolume/index.js
@@ -18,6 +18,7 @@ import vtkURLExtract from '@kitware/vtk.js/Common/Core/URLExtract';
 import vtkVolume from '@kitware/vtk.js/Rendering/Core/Volume';
 import vtkVolumeMapper from '@kitware/vtk.js/Rendering/Core/VolumeMapper';
 import vtkXMLImageDataReader from '@kitware/vtk.js/IO/XML/XMLImageDataReader';
+import { XrSessionTypes } from '@kitware/vtk.js/Rendering/OpenGL/RenderWindow/Constants';
 
 import './WebXRVolume.module.css';
 
@@ -96,8 +97,6 @@ HttpDataAccessHelper.fetchBinary(fileURL).then((fileContents) => {
   renderWindow.render();
 
   // Add button to launch AR (default) or VR scene
-  const VR = 1;
-  const AR = 2;
   let xrSessionType = 0;
   const xrButton = document.createElement('button');
   let enterText = 'XR not available!';
@@ -109,13 +108,13 @@ HttpDataAccessHelper.fetchBinary(fileURL).then((fileContents) => {
   ) {
     navigator.xr.isSessionSupported('immersive-ar').then((arSupported) => {
       if (arSupported) {
-        xrSessionType = AR;
+        xrSessionType = XrSessionTypes.MobileAR;
         enterText = 'Start AR';
         xrButton.textContent = enterText;
       } else {
         navigator.xr.isSessionSupported('immersive-vr').then((vrSupported) => {
           if (vrSupported) {
-            xrSessionType = VR;
+            xrSessionType = XrSessionTypes.HmdVR;
             enterText = 'Start VR';
             xrButton.textContent = enterText;
           }
@@ -125,18 +124,14 @@ HttpDataAccessHelper.fetchBinary(fileURL).then((fileContents) => {
   }
   xrButton.addEventListener('click', () => {
     if (xrButton.textContent === enterText) {
-      if (xrSessionType === AR) {
+      if (xrSessionType === XrSessionTypes.MobileAR) {
         fullScreenRenderer.setBackground([0, 0, 0, 0]);
       }
-      fullScreenRenderer
-        .getApiSpecificRenderWindow()
-        .startXR(xrSessionType === AR);
+      fullScreenRenderer.getApiSpecificRenderWindow().startXR(xrSessionType);
       xrButton.textContent = exitText;
     } else {
       fullScreenRenderer.setBackground([...background, 255]);
-      fullScreenRenderer
-        .getApiSpecificRenderWindow()
-        .stopXR(xrSessionType === AR);
+      fullScreenRenderer.getApiSpecificRenderWindow().stopXR();
       xrButton.textContent = enterText;
     }
   });

diff --git a/Sources/Rendering/OpenGL/RenderWindow/Constants.d.ts b/Sources/Rendering/OpenGL/RenderWindow/Constants.d.ts
@@ -0,0 +1,9 @@
+export declare enum XrSessionTypes {
+	HmdVR = 0,
+	MobileAR = 1,
+}
+
+declare const _default: {
+	XrSessionTypes: typeof XrSessionTypes;
+};
+export default _default;
diff --git a/Sources/Rendering/OpenGL/RenderWindow/Constants.js b/Sources/Rendering/OpenGL/RenderWindow/Constants.js
@@ -0,0 +1,8 @@
+export const XrSessionTypes = {
+  HmdVR: 0, // Head-mounted display (HMD), two-camera virtual reality session
+  MobileAR: 1, // Mobile device, single-camera augmented reality session
+};
+
+export default {
+  XrSessionTypes,
+};