Autoplay Audio/video

1

Hi all,

I have a movie room for a client in which the video plays and you can move around the movie room.

Im trying to make it so there is audio in the background whilst the movie plays.

Link: https://virtual.virtual3dspaces.com/morgan_cinema_room/

I have the audio set to autoplay (shown on the attached image) but when loading on a browser (chrome) it doesnt seem to work. It autoplays on my phone (iphone) but then then video doesnt autoplay. Not sure if anyone can suggest anything to get them both autoplaying at the same time?

Also, is there a way to sync audio and visual? At the moment I have visual of a movie and the audio is just a soundtrack - when trying to make the movie audio sync it just didnt work due to what i assume was different loading times.

Any help would be great!

EDIT: Ive just tried this on Safari on my computer and it works fine (autoplays both) but chrome is doesnt. On my phone its hit and miss if audio or visual autoplays. Is this just simply browser related?

Screenshot 2021-06-15 at 08.18.13
Screenshot 2021-06-15 at 08.18.132080×1360 270 KB

2

In can be browser related, over the time we have encountered various browser specific issues with auto-playing audio and video. Browsers apply restrictions to improve browsing experience, so the web pages don’t start video and audio automatically without any user interaction.

In your case, having a video with audio would be the best solution. This way audio should be always synchronized with the video.

3

Hi Jan,

Thanks for your response, thought it may be browser related.

With regards to having the video with audio, im sorry if this is an obvious answer, but how do i do this? The video i have autoplaying is an MP4 with audio but it doesnt automatically play as i am simply changing the texture. Would i have to have an extension of a video player rather than change the texture?

Thanks

4

You need to add ‘Video texture control’ extension, select this video texture and disable the ‘Muted’ checkbox.

2 Likes
5

Thanks Jan, didnt realise that was a feature, works perfectly now!

Thanks for your help.

1 Like
6

Hi! We are launching a small Shapespark game for the United Nations soon. It’s in Finnish but in case you are interested, it begins here: 3D scene

I have a somewhat similar problem with video audio sync. I had the video with audio there but the problem was, that once an iframe was opened, the video stopped. I then tried a workaround and muted the video + added the audio as a separate extension. Now the sound does play over the iframes but is not in sync with the video anymore. Is there any solution?

7

An HTML label containing a <video> or <iframe> element pauses video textures to avoid performance issues. We’ve observed that simultaneous playback of video textures and video in HTML label may cause scene frame rate drop or stuttering of the video displayed in the HTML label. As for the <iframe> the content of the embedded website isn’t known, so the viewer conservatively assumes that the iframe might have a <video> element.

You can use the newly added viewer API functions to display an HTML pop-up instead of the HTML label extension. When a pop-up is created using the API, it’s not pausing video textures.

Try replacing your HTML label with a Script extension with the following code, adapted from your HTML label content:

WALK.getViewer().openPopup(
  '<iframe style="width: 1100px; height: 1400px; overflow: show;"
                 src="<YOUR-URL>" scrolling="yes"
                 width="1100"height="1100">
     Iframes not supported
   </iframe>',
  {centerHorizontally: true, centerVertically: true}
);
1 Like
8

Thanks, I’ll try this!