Buttons becomes disabled when YouTube video is streaming on iPhone

Hello
I am following Youtube-video-on-mesh example
https://forum.babylonjs.com/t/youtube-videos-on-a-mesh-port-of-css3drenderer-js/10600/1

In the example’s playground
https://playground.babylonjs.com/#1DX9UE#523
you should be able to click the buttons and change the camera’s angle while YouTube video is playing. That works great on my desktop, but does not work on iPhone. It appears that as soon as youtube video starts, all UI (buttons and drag events) are disabled.
Any suggestions how to fix this for iPhone?

Thank you

I created an extension that sort of combines the best practices around the various CSS renderer ports to provide a consistent way to show HTML content in scene. Would you be willing to try it out. Not entirely sure it will solve your problem, but if not, I’ll look into it and add any fixes to the extension so everyone gets them. You can find it in the BabylonJS Extensions Repo or on NPM

1 Like

First of all, thank you so much for this example. I was experimenting with your playground https://www.babylonjs-playground.com/#Y2LIXI#44

It works as expected on a desktop.
However, on iPhone, when I click on the youtube video, nothing happens. If I slightly rotate the camera (by one degree!), click on the video again, it starts to play. And while the video is playing, I can continue to manipulate the camera, which is GREAT!
Do you know how it is possible to start video (on iPhone) w/o requiring user to rotate the camera?

Thanks for trying it out. I suspect that it might be related to pointer capture and the iOS browser requires that you click somewhere in the scene before we can capture the pointer events. I’m away from my home office this week, and don’t have my test iOS device, but I will look at this next week. Would you be so kind as to create an issue for this in the GitHub Repo.

Thank you. I just submitted the issue. Please let me know if you need more info

1 Like

Hello @ericwood73
Please, let me know if there is any update on this
Thank you,
David

Have not looked into it yet. Will do this week.

1 Like

It seems pointermove doesn’t trigger on ios if the user just taps. I added a listener for touchstart on ios and that allows the user to interact with the iframe after an initial touch. I tried triggering the event manually, but iOS would have none of it. Unfortunately, I think this is the best we are going to be able to do on iOS.

1 Like

Does anyone want to upvote BAN SAFARI ? :joy: I mean, until they finally admit that they are never going to rule the world with 18% market share… + most part of which comes from the selling of iPhones that also become more clumsy with each new iteration. Not to mention that this 18% market share essentially comes from the 95% of stupid users using this crap on mobile, instead of taking 2 minutes to download and install a proper browser.

Looks like same as for the past 3 decades, there’s no other way than to push Apple against the wall before they finally conform. Just on the side of hardware, we had this with CPUs, GPUs and lately power-up (where it took a law from the EU-gov to finally ban the proprietary piece of crap that made them rich over the past 25 years). And on the side of software, honestly, the list is just too long.

And then, it took them a decade (YES, a decade) to conform to the basics of webGL… + we’re still not there yet.

Reason why, despite for being a mac user and addict for 35 years, I’m willing to upvote “BAN SAFARI”.

1 Like

Well thanks to DMA in Europe, there is finally an alternative to WebKit on iOS. Now if only we could get something similar in the US…

3 Likes