Merge pull request #6575 from DougReeder/pdf-update-vr

Fixes bug: PDF page advance doesn't work in mobile VR

Author: Exairnous

src/systems/hubs-systems.ts

@@ -30,6 +30,7 @@ import { AudioZonesSystem } from "./audio-zones-system";
 import { GainSystem } from "./audio-gain-system";
 import { EnvironmentSystem } from "./environment-system";
 import { NameTagVisibilitySystem } from "./name-tag-visibility-system";
+import { MediaPDFOculusFix } from "./media-pdf-oculus-fix";
 
 // new world
 import { networkReceiveSystem } from "../bit-systems/network-receive-system";
@@ -136,6 +137,7 @@ AFRAME.registerSystem("hubs-systems", {
     this.drawingMenuSystem = new DrawingMenuSystem(this.el);
     this.characterController = new CharacterControllerSystem(this.el);
     this.waypointSystem = new WaypointSystem(this.el, this.characterController);
+    this.mediaPDFOculusFix = new MediaPDFOculusFix(this.el);
     this.cursorPoseTrackingSystem = new CursorPoseTrackingSystem();
     this.menuAnimationSystem = new MenuAnimationSystem();
     this.audioSettingsSystem = new AudioSettingsSystem(this.el);

src/systems/media-pdf-oculus-fix.js

@@ -0,0 +1,30 @@
+/*
+  PDFjs which is used to render pdfs depends on the window.requestAnimationFrame function.
+  This is not called when in mobileVR.
+  This system replaces the function with the requestAnimationFrame of the xrSession.
+  It restores window.requestAnimationFrame when the user leaves xr.
+*/
+export class MediaPDFOculusFix {
+  constructor(sceneEl) {
+    // PC VR calls window.requestAnimationFrame even in VR mode
+    if (AFRAME.utils.device.isMobileVR()) {
+      this.requestAnimationFrameOriginal = window.requestAnimationFrame;
+      this.cancelAnimationFrameOriginal = window.cancelAnimationFrame;
+      sceneEl.addEventListener("enter-vr", () => {
+        console.debug(`PDF: monkey-patching window.requestAnimationFrame:`, window.requestAnimationFrame);
+        const { xrSession } = sceneEl;
+        window.requestAnimationFrame = callback => {
+          return xrSession?.requestAnimationFrame(callback);
+        };
+        window.cancelAnimationFrame = handle => {
+          return xrSession?.cancelAnimationFrame(handle);
+        };
+      });
+      sceneEl.addEventListener("exit-vr", () => {
+        console.debug(`PDF: removing window.requestAnimationFrame monkey-patch`, this.requestAnimationFrameOriginal);
+        window.requestAnimationFrame = this.requestAnimationFrameOriginal;
+        window.cancelAnimationFrame = this.cancelAnimationFrameOriginal;
+      });
+    }
+  }
+}

types/aframe.d.ts

@@ -52,6 +52,7 @@ declare module "aframe" {
     drawingMenuSystem: DrawingMenuSystem;
     characterController: CharacterControllerSystem;
     waypointSystem: WaypointSystem;
+    mediaPDFOculusFix: MediaPDFOculusFix;
     cursorPoseTrackingSystem: CursorPoseTrackingSystem;
     menuAnimationSystem: MenuAnimationSystem;
     audioSettingsSystem: AudioSettingsSystem;