Document how to enter/exit VR

[cvan]

Description:

document.querySelector('a-scene').enterVR();
document.querySelector('a-scene').exitVR();

And also document how to when <iframe>-ing content.

• A-Frame Version: any
• Platform/Device: all

[ngokevin]

https://github.com/aframevr/aframe/blob/master/docs/core/scene.md#methods

[cvan]

Nice section here, but for some reason waiting for loaded doesn't work. you have to add a setTimeout. gotta figure out why:

<script>
   (function () {
       // switch to stereoscopic mode directly on page load, this needs to be after the a-scene loads.
       var scene = document.querySelector('a-scene');
       if (scene.hasLoaded) {
           scene.enterVR();
       } else {
           scene.addEventListener('loaded', function () {
               setTimeout(function () {
                   scene.enterVR();
               }, 1000);
           });
       };
   })();
</script>

Also, not exactly specific to this issue, but still think we should support #705.

[ngokevin]

Well, no one is against #705. Though I might also just recommend creating a scene component. They have the advantage that you don't have to worry about query selecting, waiting for events. Just write JS and attach:

AFRAME.registerComponent('auto-enter-vr', {
  init: function () {
    this.el.sceneEl.enterVR();
  }
});

<a-scene auto-enter-vr>

[cvan]

like it

[ngokevin]

Though I guess you might still have to add the event listener...but at least you don't have to query selector or worry whether it's already loaded. And you get reusable code for free.

[manojkota]

This is not working with version >=0.3.0

[cvan]

This is not working with version >=0.3.0

Are you testing in Chromium or Firefox Nightly? Chromium currently has a temporary user-gesture requirement; Firefox Nightly does not.

[cvan]

(Accidentally closed issue.)

[manojkota]

I have tested in firefox & chrome in Android. It is not working. When I change the afrmae version to 0.2.0, it is directly going to vr mode.

[UXVirtual]

The following code seems to work with v0.4.0 in Firefox Nightly when auto-init-vr component is attached to the scene. Unfortunately Chromium still requires user interaction before it can auto-trigger VR mode:

AFRAME.registerComponent('auto-init-vr', {
    init: function () {

        var scene = this;

        scene.el.addEventListener('loaded', function () {
            setTimeout(function(){
                console.log('Automatically entering VR...');
                scene.el.sceneEl.enterVR();
            },1000);
        });
    }
});

Note that I changed the component name since the original name collides with an internal component in v0.4.0. The setTimeout isn't exactly very elegant - is there a better way of detecting when the entire scene is ready?

[machenmusik]

auto-enter-vr in 0.4.0 does what you want, but is configured by default to only enter if VR display is Gear VR (for Carmel browser which has no other way to enter VR)

[Silver-Seagull]

Is there any way for auto-enter-vr to have the GearVR be over-ridden? We are trying to jump through multiple small scenes, but we have to enter VR manually each time, which is inconvenient on Cardboard!

None of the "old" methods of calling a script of setting a setTimeout or loaded work on 0.4.0, so this is extra-frustrating.

[cvan]

@Silver-Seagull yep, there is - I'm working on it right now. out of curiosity, are you working with only Cardboard? or are you using Chromium/Firefox w/ Vive/Rift? I'm just curious which platforms A-Frame devs are using.

[Silver-Seagull]

@cvan Do you have an ETA, or a hint? I'm sorta stuck and it's driving me bonkers.

Our main platform will be cardboard and cardboard-like devices. Vive and Rift aren't really on the map for now :)

[cvan]

@Silver-Seagull there are a couple bugs in that code. I'm fixing them right now. but if you're trying to do it right now, just set <a-scene auto-enter-vr="display: all">; that's a temporary workaround though.

[dmarcos]

Just for the record. auto-enter-vr will go away in next version in favor of the link component and system

[machenmusik]

sorry about the bugs :-/

[machenmusik]

@cvan not sure display: all works correctly at the moment, https://github.com/aframevr/aframe/blob/master/src/components/scene/auto-enter-vr.js#L50 ...
the original intent was to leave blank for all, but unfortunately the parsing just fills in the default... which is unfortunately still GearVR. if you've got fixes forthcoming, they haven't appeared in master yet

[machenmusik]

auto-enter-vr will go away in next version in favor of the link component and system

we will presumably still want the vrdisplayactivate and vrdisplaydeactivate enter/exit behaviors (assuming that browsers fire the events)

[machenmusik]

@Silver-Seagull try:
https://rawgit.com/chenzlabs/aframe/fix-auto-enter-vr-dist/dist/aframe-master.js
https://rawgit.com/chenzlabs/aframe/fix-auto-enter-vr-dist/dist/aframe-master.min.js
with
<a-scene auto-enter-vr="display:all">

[Silver-Seagull]

@cvan & @machenmusik Thank you for the help and tips - however the app isn't entering the split-view as it should.

I feel a little out of my depth (to say the least) and I may have posted out of turn. Looking at our code, I think the view is not Cardboard, but an a-frame page in a Cordova app using the Crosswalk browser. I assume the WebKit-based browser is why this is not working?

:edit:
Running the code now, definitely a Crosswalk-based project in Cordova. On desktop, the VR/cardboard button disappears, which looks like it fired.

[cvan]

I got this patch working to auto-enter VR, but I still have to fix up the tests (and write new ones).

As Diego mentions above, the code in A-Frame (and three.js) is going to have to be reimplemented soon anyway (to support all the variations in Oculus Carmel, Google Daydream, Google Cardboard, Firefox Nightly, and Chromium Desktop), as the WebVR API's navigation flow (for auto-entering VR) is in flux right now (see issues immersive-web/webxr#30 and immersive-web/webxr#152).

@Silver-Seagull: I'd recommend dropping this JS snippet into your scene for now:

window.addEventListener('load', function () {
  var scene = document.querySelector('a-scene');
  if (scene.hasLoaded) {
    scene.enterVR();
  } else {
    el.addEventListener('loaded', function () {
      scene.enterVR();
    });
  }
});

Hope that gets you where you need to be.

[Silver-Seagull]

@cvan It looks like it's a WebVR block, as browsers (save Carmel?) won't allow that sort of action unless it comes from a human.

Thank you for the help and suggestions - hopefully link comes along in the January roadmap as planned ^_^

[0atman]

Hi all. Has this been fixed? I see that in the link docs we have the requirements:

The browser is up-to-date with the WebVR specification and implements the vrdisplayactivate event.
The destination web page listens to the window [vrdisplayactivate] event and enters VR.

How would one listen to vrdisplayactivate and kick off a scene.enterVR();? I've tried this, and it doesn't seem to fire:

window.addEventListener('vrdisplayactivate', function () {
  var scene = document.querySelector('a-scene');
  scene.enterVR();
  console.log(scene);
}

[ngokevin]

aframe has vrdisplayactivate automatic. entervr/exitvr methods documented

[0atman]

Unsatisfactory.

Aframe makes very bold claims, on the frontpage of the site, that it

Works on Vive, Rift, Daydream, GearVR, desktop

When in fact vrdisplayactivate works only on Vive and Rift.

We should manage our users expectations correctly. Here is an example of the update I would like to see:

#3994

[0atman]

This is now documented thank you, guys! 8f94626

[fmagrosoto]

Hello every one...
I tried to load my scene in VR mode using enterVR() within a component:

AFRAME.registerComponent('do-something', {
  init: function () {
    var sceneEl = this.el;
   sceneEl.enterVR()
  }
});

In Chrome for iOS (77.0.8685.103) works fine, but in Android, same Chrome version, do not works... anybody has a solution?, or maybe an explanation?

Thanks in advance

[0atman]

Halloween was last week, I'm not into zombie threads this week 😆

@fmagrosoto I don't think this is the right place to ask this question. Try the aframe discord, or if you think it's a bug, open your own issue. Good luck!