search

samvera-labs / ramp

Interactive, IIIF powered audio/video media player React components library. Styleguidist Docs: https://samvera-labs.github.io/ramp/
https://ramp.avalonmediasystem.org/
30 stars 5 forks source link

No Autoadvance For Inaccessible Items in iOS Native Player #599

Open joncameron opened 2 months ago

joncameron commented 2 months ago

Description

For Playlists, Ramp is not advancing to the next item if one is present: once you hit the end of the playlist item, the native player just remains open and doesn’t move on to the next playlist item.

One thing we can implement from Ramp side is to use Video.js player instead of going into the native iOS player in playlist contexts for smoother transition between items. We would just have to set playsInline attribute in the Video.js setup to true.

joncameron commented 2 months ago

Needs more testing; advance may be happening but the new source information is not loaded and media doesn't play as it should, effectively breaking autoplay.

elynema commented 2 months ago

Tested this playlist on iPhone 15 iOS17: https://avalon-staging.dlib.indiana.edu/playlists/34. When playing the first items in the playlist, auto-advance works fine with the native player open. After item 6, item 7 is inaccessible. The native player cannot display the placeholderCanvas. It pauses on the last frame of item 6 for 10 seconds. Then the native player attempts to advance to item 8. This item cannot be played in the native player (shows black and nothing happens when click play). Then after closing the native player, the playlist structured navigation shows that it is on item 8. Clicking play in the video.js player just spins for quite a long time before the poster image loads in Ramp. Once the poster image loads, clicking play again in video.js opens the native player and begins playback.

How should we approach inaccessible items in native player when it cannot show the placeholderCanvas? Should we just exit the native player?

Would it be better just to avoid using the native player altogether?

elynema commented 2 months ago

Private Zenhub Video

joncameron commented 2 months ago

There's an attribute in Video.js that would disable native player from being used; we could try this as a possible solution. This would still mean that in full-screen the native player would engage, but in other contexts it would not.

It could also be possible to skip over inaccessible items in the code somehow to get around this.

Overriding native ios player altogether could potentially be an option; force Video.js to engage rather than switching over to the native player when full-screen is triggered. Video.js does have a mix of options that we could try, to keep users in Video.js and force this for full screen as well (similar to the Android behavior).