search

pulsejet / memories

Fast, modern and advanced photo management suite. Runs as a Nextcloud app.
https://memories.gallery
GNU Affero General Public License v3.0
3.1k stars 82 forks source link

Videos shared through link display incorrectly after hitting the full screen button on iOS Safari #697

Open ChildLearningClub opened 1 year ago

ChildLearningClub commented 1 year ago

Describe the bug

when setting video to full screen it does not actually go full screen

To Reproduce play a video in the browser and hit the full screen button when on iOS Safari, the icon changes, but the video remains non-fullscreen

Screenshots

https://github.com/pulsejet/memories/assets/25701774/14dfc05a-e5da-4aa6-b0d3-81f82d316be3

Platform:

Additional context I have found this to be the case with other programs that also do not implement the fullscreen correctly for iOS Safari. The example of it implemented correctly is in the Jellyfin program.

meichthys commented 1 year ago

Fullscreen does work for me on android (grapheneos) with chromium (vanadium), so perhaps this is limited to iOS.

ChildLearningClub commented 9 months ago

@pulsejet I’m happy to test any builds. Currently playback of video on an iOS through Safari is a really bad experience. I did notice that in the case of Jellyfin, as I posted above, that when going full screen it appears that Jellyfin is dropping its player and playing directly from the iPhones built in player. Is there some reason this is not possible within Nextcloud?

https://github.com/pulsejet/memories/assets/25701774/61356f87-d0bf-43b7-aab8-f954357c3847

pulsejet commented 8 months ago

iPhones don't support fullscreen: https://caniuse.com/fullscreen

Safari should just die at this point 😞

ChildLearningClub commented 8 months ago

From what I have seen Safari is not very developer friendly :(. I know I keep referencing Jellyfin, but it is clear is the first video and the initial post above ☝️ that it is possible to play videos in full screen on iOS devices. It does not look like they are being played in the Safari browser but rather played from the iOS devices native built in video player possibly through its API https://developer.apple.com/documentation/webkitjs/htmlvideoelement/1630493-webkitdisplayingfullscreen So I’m sure there is a way to do this.

pulsejet commented 8 months ago

That's right, native apps can do this but not web apps. There's simply no fullscreen API (funnily enough, the fullscreen API supposedly works on iPads but not iPhones)

ChildLearningClub commented 8 months ago

https://media.childlearning.club/web/index.html#!/video

This is a web app playing in full screen and it goes full screen on iOS playing any of these videos.

ChildLearningClub commented 8 months ago

Sorry I should be more specific about the issue. Your app when download to the iOS Home Screen as a progressive web app works well and will play the videos in full screen perfectly fine. The issue above is with a shared video through a link. When I open the shared video in the browser it displays as you can see in the videos I posted above.

ChildLearningClub commented 8 months ago

Also something was changed in Memories between when I first created this issue and my second post where things got wonky. Initially it was simply that the full screen button had no effect. Now it’s that the video margins get all messed up. With the video getting stuck in the top right corner. Only way to fix it is to refresh the page and not touch the full screen button.

https://github.com/pulsejet/memories/assets/25701774/61356f87-d0bf-43b7-aab8-f954357c3847