User interaction needed to play all videos on iOS?

Hello again,

So for my app I have multiple 360 videos I want to play back to back, now I understand that iOS requires user interaction to play a video (otherwise it must be muted for autoplay).

My logic at the moment is to press a “play” button for the first video, then after that video is done, load the next video and call play() right away (no user interaction). I’ve tested on safari/iOS and the first video plays after I click the play ui button mentioned above, then when the settimeout triggers after 10 seconds to load the second video, the texture goes black and doesn’t play… weirdly enough when i then click on the screen, the first frame of the video shows up on the sphere (using the 360 video player setup)

I’ve read through various apple articles on this, specifically along the lines of “The user must interact with the document first”, which leads me to believe that the first user interaction should allow me to then autoplay from there on out, does this seem right or does anybody know the intended behaviour? Really hoping to be able to autoplay after that first video.

I’ve turned off low battery mode which I understand stops autoplay regardless.

Thank you!

Hi @adkaros,

iOS is tricky to get it to work with videos, not sure if it’s doable, I haven’t tried to autoplay videos in a row.

But just to make sure, are you adding the playsinline attribute to your video element? To autoplay videos on iOS is required.

Another trick to try is to bind all your video play methods to a single input element, and apart from the first video pause the other videos at their 2nd/3rd frame so you can resume them later.

1 Like

Hi Leonidas, thanks for the reply.

It looks like the loading all videos on one click seemed to work on iOS for me, and yes I’ve been using the playsinline in my tests.

iOS video is tricky indeed… Do you think a gaze input would work for starting the video? Technically it’s user interaction but not sure if iOS would count that, (eg. using the look camera, have the user look at a box and once it confirms the input after 1 second or so, fire an event to trigger, or is it just with input elements ‘click’ event?

Thanks again for the help, super appreciated.

I suppose it would work assuming you use the google cardboard with the button on the top and have it click a fullscreen element to trigger the ‘click’ event?

Let me know if you know if gaze alone is enough, I would assume no but curious.

Ah sorry, never tried a gaze before. If you test it and works, let us know, I’d be very curious myself.

1 Like

Hey Leonidas … before I head into adjusting my video-project with certain API.
Did you - by any chance - use this example? HTML5 Video
(could be nice to save some time → in case you have a readymade recipe for using it in PlayCanvas)

Hi @Thomas_Due_Nielsen,

From what I see you are linking an example API of the browser video element right?

The PlayCanvas video examples (e.g. video texture) use the same element, you can use those.

1 Like

ok, so should be straight forward (?)

Due to big trouble in regards to stopping a video clip fully on IOS, I had (namely within this IOS-video issue) found: javascript - Pause a (html5) youtube video on an IOS device - Stack Overflow

  • but will give it an extra try

//thx for reply, anyway

1 Like