After updating Babylon.JS to V5.6 along with amp-360, VR option is not working in Azure Media Player

I have updated the amp-360 plugin so it updated the Babylon version to V 5.6. After updating the plugin I got a console error while I click on the VR option in the Azure Media Player. I will share the screenshot here.

My previous Babylon version was V4. in that version this option was working and it will show that double lense on the screen.

I also checked the Babylon js official demo video so I saw the same console error occurred there too.

Hi @Dhanil and welcome to the forum

Let me ping VR king @RaananW

1 Like

The last implementation used WebVR, this one uses WebXR that requires https to be enabled to work.
I’ll be happy to see the HTML you are using to see the configuration you defined, but it does seem like XR is either not supported on your device, or the specific session type is not supported in this browser. And, of course, https :slight_smile:

2 Likes

Thank you very much for your response. Let me try this with https.
And the configuration is initiated by code, I will share that here.

HTML

   <video id="azuremediaplayer" class="azuremediaplayer amp-default-skin amp-big-play-centered" tabindex="-1" playsinline allowsInlineMediaPlayback>
    </video>

And I initialize it using the code, like the document says.

that’s standard VR. it is either you don’t have any VR/XR device connected, or the https issue. Do WebXR sessions start correctly?

I got a message in console like The specified session configuration is not supported..

Can you try any other webxr example? babylon or not, they should work. If they don’t, your browser or device are not supported.

Actually, I don’t have a device connected. First, let me check with HTTPS,

well, that won’t work if you don’t have a device connected. Not sure what you expect to happen?

oh ok. So what actually I was looking for is in Azure Media Player there is an icon for VR
image
so when clicking this icon we will get a double lens view on screen, that is not happening when I updated the plugin. So you’re saying that it will show an error like this if we don’t have any device connected?

This plugin now uses WebXR and expects your device to support WebXR. if you want to keep the side-by-side please use the older version which uses the deprecated WebVR standard.
You can always install the webxr emulator to see side-by-sie (for example). But do that only if you are sure you need and want the emulator installed.

1 Like

Ok, thank you very much.

1 Like

I checked with HTTPS and WebXR emulator. Then it’s working fine.
So is there anything else we need to do for getting this WebXR support? Because only after installing this emulator the VR option starts working. Or will it work if we connect a VR device?

We support WebXR. anything that will work with WebXR will work with this player.

You can read about it here - WebXR | Babylon.js Documentation

1 Like

Hi, I tried oculus the video everything works fine. But when I’m having a button in the video it’s not appearing in the VR. In normal mode, we see the button but in VR mode it’s not there.
Is there something else we need to add to achieve this?

You can’t add HTML elements in VR. VR will only broadcast the canvas and whatever’s being rendered there. If you want to add a button you will need to create some custom implementation using the babylon GUI which uses the canvas to render UI elements.

1 Like

Actually, I am not trying to add a button in VR. The button is already in the canvas but when we watch it through a VR device we can’t able to watch that button. The buttons are not 3D just 2D buttons.

I am not entirely sure what you mean :slight_smile:

An HTML button will not be displayed. a babylon 2D button might be displayed, but you will probably need to make changes to your implementation and not use the player directly.

1 Like

Ok, For your information I will add a picture


Here is the button which is not showing on the device Also when clicking that button

while clicking gets a popup image like this which is also not visible on the device.
So to achieve all these things we need to change the current buttons to Babylon 2D buttons right?.

The only thing you can see in VR is the canvas. You can’t use HTML elements for buttons, images and so on. It will have to be a babylon button and a babylon UI.