Plyr: Shows native player UI on iOS 10

[julmot]

• [x] Issue does not already exist
• [x] Issue observed on https://plyr.io

Expected behaviour

Should show custom player UI.

Actual behaviour

Does show the HTML5 player UI and the native vimeo and youtube player UI.

Environment

• Browser: Safari
• Version: 10
• Operating System: iOS
• Version: 10.3

Players affected:

• [x] HTML5 Video
• [ ] HTML5 Audio
• [x] YouTube
• [x] Vimeo

[sampotts]

Hey Julian, did you read the docs?

playsinline support is coming in V3.

[julmot]

Does playsinline affect the player UI? From my point of view this currently only controls autoplay and whether or not iOS goes in fullscreen when initially viewing a video.

[sampotts]

Yes. playsinline allows the player to remain inline rather than full screen when playing - meaning the custom UI can be used. Without it, the custom UI is pointless as it's hidden when the video is actually playing.

https://webkit.org/blog/6784/new-video-policies-for-ios/

[julmot]

I'm very confused currently. I can't find answers to my questions in the docs:

• Where will the custom player UI be visible and where not?
• How to autoplay videos in all browsers with all supported formats – HTML5, Youtube and Vimeo?
• How to set default HTML5 options to other formats – Youtube and Vimeo – too (#632)? Answer for now: Manually use the API for each format. There's no API for all options targeting all formats.

What I need is a custom player UI for all recent browsers and devices, with autoplay support, especially with Vimeo support, as it's the only way to have a video cdn without branding (e.g. Youtube logo).

So, what's the current status for autoplaying and custom player UI?
I've just added playsinline to a HTML5 video, but this still shows the native iOS player UI.

[sampotts]

https://github.com/sampotts/plyr#browser-support

As I said in my first comment:

playsinline support is coming in V3.

That's when the custom UI will be supported on iOS. The other issue I'll have to take a look at. Autoplay also isn't supported on iOS as outlined in the link I provided. It requires user input to play. If the video is muted and playsinline is enabled then it'll work.

I'm working on getting V3 out as quick as I can but I've had a son since starting on it and time is scarce. It's getting closer though.

[julmot]

That's when the custom UI will be supported on iOS.

But I've just tested it by manually adding playinline to a <video> and this didn't cause the plyr UI to appear.

However, how should playsinline solve the autoplay mechanism for Vimeo and Youtube, where it's just an iframe? And why does playsinline affect the UI of Vimeo videos, where it's embedded within an iframe too. Sorry for asking this, but it's really not clear for me.

I'm working on getting V3 out as quick as I can but I've had a son since starting on it and time is scarce. It's getting closer though.

No problem, I'd just like to clear my confusion.

[sampotts]

I'll make it a little larger so you read it...

playsinline support is coming in V3.

Current is V2.

playsinline is not supported for YouTube but is for Vimeo through their SDK/API - from memory. YouTube are little slow to make changes to their JS/iframe SDK. It's passed as a parameter when initialising. As I say though - support is coming soon

[basiteaal]

Hi @sampotts ,
Congrats with the newborn! Everything okay?

I was just wondering; do you have any idea when V3 is coming up? I'm awaiting this function to update my app.

Thanks a lot!

Kind regards.

[sampotts]

Closing this one as I think it's fixed but feel free to re-open if not solved in v3 👍

[pyotr]

Hello @sampotts using 3.2.4 - autoplay muted youtube videos on iOS 11 - can't make it works :(