feat: p5LIVE live coding / Merge pull request #238 from TiborUdvari/f…

…eat/p5live-hardreload feat: p5LIVE live coding inside immersive ar or vr session by reusing existing xrSession
stalgiag · Sep 19, 2024 · 20aeccc · 20aeccc
2 parents bb12a61 + 708382e
commit 20aeccc
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 14 deletions.
diff --git a/src/p5xr/core/p5xr.js b/src/p5xr/core/p5xr.js
@@ -190,24 +190,45 @@ export default class p5xr {
    * @ignore
    */
   __onXRButtonClicked() {
-    if (this.hasImmersive) {
-      console.log(`Requesting session with mode: ${this.mode}`);
-      this.isImmersive = true;
-      this.resetXR();
-      navigator.xr
+    if (!this.hasImmersive) {
+      this.xrButton.hide();
+      return;
+    }
+
+    console.log(`Requesting session with mode: ${this.mode}`);
+    this.isImmersive = true;
+    this.resetXR();
+
+    const isEmulator = typeof CustomWebXRPolyfill !== 'undefined';
+    const isP5LiveEditor = window.parent?.p5frame;
+    const parentFrameXRSession = !isEmulator && isP5LiveEditor;
+    const context = parentFrameXRSession ? window.parent : window;
+
+    if (parentFrameXRSession) {
+      console.log('p5xr: p5live experimental xr session persistance mode');
+    }
+
+    if (context.xrSession) {
+      console.log('p5xr: p5live mode attempting xr session reuse');
+      setTimeout(() => {
+        const session = context.xrSession;
+        this.xrButton.setSession(session);
+        this.__startSketch.call(this, session);
+      }, 1);
+    } else {
+      context.navigator.xr
         .requestSession(this.mode, {
           requiredFeatures: this.requiredFeatures,
           optionalFeatures: this.optionalFeatures,
         })
         .then((session) => {
+          context.xrSession = session;
           this.xrButton.setSession(session);
           this.__startSketch.call(this, session);
         })
         .catch((error) => {
           console.error(`An error occured activating ${this.mode}: ${error}`);
         });
-    } else {
-      this.xrButton.hide();
     }
   }
 
@@ -488,6 +509,9 @@ export default class p5xr {
    */
   __onSessionEnded() {
     this.resetXR();
+    if (window.parent && window.parent.xrSession) {
+      window.parent.xrSession = null;
+    }
   }
 
   /**

diff --git a/src/p5xr/core/p5xrViewer.js b/src/p5xr/core/p5xrViewer.js
@@ -41,16 +41,17 @@ class p5xrViewer {
    */
   set view(newView) {
     this._view = newView;
+    const renderer = p5.instance._renderer;
 
-    // eslint-disable-next-line no-unused-expressions
-    p5.instance._renderer.uViewMatrix?.set(this._view.transform.inverse.matrix);
+    if (renderer.uViewMatrix) {
+      renderer.uViewMatrix.mat4 = this._view.transform.inverse.matrix;
+    }
 
     // has not effect in v1.10.0, but kept for older version
-    p5.instance._renderer.uMVMatrix.set(this._view.transform.inverse.matrix);
-    p5.instance._renderer.uPMatrix.set(this._view.projectionMatrix);
-    p5.instance._renderer._curCamera.cameraMatrix.set(
-      p5.Matrix.identity().mult(this._view.transform.inverse.matrix),
-    );
+    renderer.uMVMatrix.mat4 = this._view.transform.inverse.matrix;
+    renderer.uPMatrix.mat4 = this._view.projectionMatrix;
+
+    renderer._curCamera.cameraMatrix.mat4 = this._view.transform.inverse.matrix;
 
     if (newView.eye === 'left') {
       this.leftPMatrix.set(p5.instance._renderer.uPMatrix.copy());