VR on mobilephones - non stereoscopic

Questions
1

Hi there

I’m using the universal and the arc rotate camera in my project. Its a multibe floor building to walk around. Now i would like to implement a VR button, visible only if you are using it on a mobile device.

Question: Is it possible to use the WebVR camera in a non-stereoscopic way? Only control the direction of the target by the devices motion, the rest will stay the same. (Or implement this control to the universal camera) Did anybody do this so far?

I think it would make it way more useful as most people don’t have a cardboard with them.

Thanks!

1 Like
2

You are asking about the device orientation camera, which uses the, well, device orientation to control its rotation - this is not VR related, but mobile-phone related -

https://doc.babylonjs.com/features/cameras#device-orientation-cameras

https://doc.babylonjs.com/api/classes/babylon.deviceorientationcamera

3

ah ok - thank you

i have tried to implement it but it alway says:
“DeviceOrientationEvent.requestPermission is not a function”

https://playground.babylonjs.com/#6MVYD5#1

On my iphone it does not prompt any request -

4

What iOS version are you using? what iPhone version?

EDIT

Just wanted to say - it feels quite weird, as we are checking before running the function:

if (typeof(DeviceOrientationEvent) !== "undefined" && typeof (<any>DeviceOrientationEvent).requestPermission === 'function')

What version of babylon are you using?

5

iPhone Xr, iOs 13.5.1

6

Babylon.js v4.1.0-beta.8

7

Please use the latest beta or the latest stable 4.1, as this issue was fixed already

1 Like
8

But the playground should be up to date - why is it throwing an error there?:

https://playground.babylonjs.com/#45Z7V6#1

9

made a different request - result stays the same:

https://playground.babylonjs.com/#6MVYD5#2

10

Yes, the playground should be working correctly.

What is the result you see when you use your iPhone? Can any iPhone user provide an input here as well?

11

Using this https://playground.babylonjs.com/#6MVYD5#3

It says NotAllowedError, Requesting device orientation or motion access requires a user gesture to prompt.

12

Ok, this is the expected behavior in that case. I think @ueli doesn’t have the rtequestPermission function defined (or at least not as a function), which is odd.

13

hmm - that’s bizarre - shouldn’t that be a standart working in all browsers?

Like this…

https://playground.babylonjs.com/#6MVYD5#4

…it says: “Requesting device orientation or motion acces requires a user gesture to prompt”

grrrr :wink:

14

That’s the expected behavior. You need to ask the user (using a button, for example) if they want to enable the feature.

15

i’ve tried that - but it’s not working. same message:

https://playground.babylonjs.com/#6MVYD5#6

“Requesting device orientation or motion acces requires a user gesture to prompt”

16

Could it be possible that this user gesture is only allowed on a DOM element?

i’ve been looking for VR examples in the babylonjs docs - but i can’t find any example that is working on iOS (sadly i can’t test android here) with the devices sensor

17

Usually a screen rotation event is more than enough, unless apple has changed something. I have no iphone to test with, but any user event should work correctly. It might be the pointer masking that prevents it from happening, but I am not entirely sure.

I will check with a team member that has an iphone and see what’s up. Try this example - after licking, no exception should be thrown and the device orientation should kick in - https://playground.babylonjs.com/#6MVYD5#8

18

it responds with the same error: “Requesting device orientation or motion access requires a user gesture to prompt”

i will search for a solution the next days and post it here if i find something

19

If somebody is finding this thread by search, it works like this for me:

// ASK FOR PERMISSION TO USE THE SENSOR OF THE IPHONE
if (typeof DeviceMotionEvent.requestPermission === ‘function’) {
DeviceMotionEvent.requestPermission()
.then(permissionState => {
if (permissionState === ‘granted’) {
window.addEventListener(‘devicemotion’, () => {
alert(“permission granted!”);
}
})
.catch(console.error);
} else {
// handle regular non iOS 13+ devices
alert(“noniOS13”);
if (typeof DeviceOrientationEvent !== ‘function’) {
alert(‘DeviceOrientationEvent not detected’);
}
if (typeof DeviceOrientationEvent.requestPermission !== ‘function’) {
alert(‘DeviceOrientationEvent.requestPermission not detected’);
}
DeviceOrientationEvent.requestPermission().then(function (result) {
}).catch(function (result) {
});
}

…android i can’t test right now

1 Like
20

the pg for it:
https://playground.babylonjs.com/#6MVYD5#6

another a bit stupid question - please forgive my noop-ness:

If i create the new device oriented camera (camera3) i would love to use it as the universal camera (camera2). Is there a way to just swap names of two cameras? or to replace one camera with another? I got so much code working with the “camera2”, it would be so much easier if i could call the new camera the same way (OR if i could handle the universal cameras orientation over the devices orientation, but for that i would probably need to implement it to the universal cameras type script code - i think that’s too much for me now… pfff)