damus
damus copied to clipboard
Damus Video Player (f/k/a Bug: Media Control disappeared in iOS18)
What happens Video playback on iOS18 no longer shows any media control.
What I expect to happen I expect to see a play, pause, 15 +/-, seek bar, and airplay.
Link to noteID, npub N/A
Screenshots/video recording
** Versions ** Damus version: 1.10 (8) Operating system version: iOS18 Release Candidate. Device: e.g. iPhone 14 Pro mac
Steps To Reproduce Click in any video on iOS18.
Additional context
iOS18 is being release very soon.
Whats the noteID?
Here is a note.
note1qqqrwcpeckskkwgrjcwxrra9s4ax7m0mvzy3x83sptdq62k7022qr9vdvv
Though this is not note specific.
I've noticed this as well, can't fullscreen
I've noticed this as well, can't fullscreen
One more data point: noticed same behavior on nostur as well (I am assuming nostur had full screen prior), as I've locked myself out of damus
cc @fabianfabian
This is still an issue on the official (non-beta) iOS 18.0 release
Device: iPhone 13 mini (physical device)
iOS: 18.0
Damus: Current tip of 1.10 dfa72fceb10dc0cd6867870acfc1f2b69c890722
Ok, I haven't found a fix for this yet, but I did a lot of testing and digging and got much closer to the root cause, and there are some different ways we can fix this.
The thing is that, historically, TabView with .tabViewStyle(.page) causes video controls to become hidden. This is yet another SwiftUI quirk — which we have been living with for years.
The thing is, there used to be a hack around this, which is described here: https://stackoverflow.com/a/74401288 We use this hack, and it was working for a long time. But now this hack sadly no longer works on iOS 18.
Here is a minimally reproducible code to demonstrate this:
import SwiftUI
import AVFoundation
import AVKit
struct VideoView: View {
@State var player = AVPlayer(url: URL(string: "https://www.w3schools.com/html/mov_bbb.mp4")!)
@State var player2 = AVPlayer(url: URL(string: "https://www.w3schools.com/html/mov_bbb.mp4")!)
var body: some View {
TabView {
DamusAVPlayerView(
player: player,
controller: AVPlayerViewController.init(),
show_playback_controls: true
)
VideoPlayer(player: player2)
.frame(width: 320, height: 180, alignment: .center)
.clipped()
Text("hi")
}.tabViewStyle(.page)
}
}
struct VideoViewWithNonPageTabBar: View {
@State var player = AVPlayer(url: URL(string: "https://www.w3schools.com/html/mov_bbb.mp4")!)
@State var player2 = AVPlayer(url: URL(string: "https://www.w3schools.com/html/mov_bbb.mp4")!)
var body: some View {
TabView {
DamusAVPlayerView(
player: player,
controller: AVPlayerViewController.init(),
show_playback_controls: true
)
.clipped() // The SwiftUI hack that no longer works
VideoPlayer(player: player2)
.frame(width: 320, height: 180, alignment: .center)
.clipped()
Text("test page")
}
}
}
struct DamusAVPlayerView: UIViewControllerRepresentable {
let player: AVPlayer
var controller: AVPlayerViewController
let show_playback_controls: Bool
func makeUIViewController(context: Context) -> AVPlayerViewController {
return self.controller
}
func updateUIViewController(_ uiViewController: AVPlayerViewController, context: Context) {
if uiViewController.player == nil {
uiViewController.player = player
player.play()
}
self.controller.showsPlaybackControls = show_playback_controls
}
static func dismantleUIViewController(_ uiViewController: AVPlayerViewController, coordinator: ()) {
uiViewController.player?.pause()
uiViewController.player = nil
}
}
#Preview {
VStack {
VideoView()
VideoViewWithNonPageTabBar()
}
}
Possible solutions:
- Build custom video controls
- Use something else other than a page tab bar on the full screen carousel view (Maybe an equivalent implementation of it)
- I am thinking of making it so that I apply some arrow buttons and page indicator at the top. There would be no swipe though.
- Or maybe a scroll view?
- Keep looking for another hack
@jb55, @alltheseas, two questions:
- Which solution seems the most reasonable to you?
- Should this be a blocker for the 1.10 release?
- Should this be a blocker for the 1.10 release?
@jb55, @alltheseas, in this decision it is worth bearing in mind that this issue is also present on the current app store release (1.9.1) on iOS 18, so releasing 1.10 without this fix does not make the app store version "worse".
let's fix this after 1.10. it's annoying but this is going to hold up the release for too long.
let's fix this after 1.10. it's annoying but this is going to hold up the release for too long.
Sned
https://media.tenor.com/MWTaw30tPWYAAAAC/cbz.gif
@ericholguin advised custom video controls/player may be way to go. Tradeoff is more work to implement.
@danieldaquino supports @ericholguin view in order to improve UX.
added to 1.11 milestone in view of improving customer UX
@alltheseas @robagreda I tagged this issue with the "design" label because since we can't use the normal iOS video controls on the full screen carousel anymore, this could be an opportunity to make a better custom UX/UI design and reimagine what this could look like
good, this is great opportunity to fix the design, I am glad we can add custom controls/icons
one customer request: video scrubber for moving forward, and backward in time
Via twtr https://github.com/user-attachments/assets/593ca50b-b243-4dc0-bd42-5b614f753c1a
do we wanna replicate the user behaviour by having the actions to repost, like, share, comment etc on the video?
one customer request: video scrubber for moving forward, and backward in time
We can also add double tap to back/for-ward 5s,10s?
On Mon, Sep 23, 2024 at 10:30:56AM -0700, Daniel D’Aquino wrote:
@alltheseas @robagreda I tagged this issue with the "design" label because since we can't use the normal iOS video controls on the full screen carousel anymore, this could be an opportunity to make a better custom UX/UI design and reimagine what this could look like
if we literally just copy what twitter does that would be ideal. its pretty much the perfect ui and has really clean transitions from the timeline.
Report of video player issues 1.10.1: https://github.com/damus-io/damus/issues/2566
Timestamps in video links
https://damus.io/nevent1qqsqqvpxss2jdwyhhygxmypug7l0rz9w2l7ss5t9hqecevle00crdkcpz4mhxue69uhhwmm59ehx7um5wgh8qctjw3uszrthwden5te0dehhxtnvdakqz9thwden5te0dp5hxapwdehhxarj9ekxzmnyqys8wumn8ghj7un9d3shjtt2wqhxummnw3ezuamfwfjkgmn9wshx5uqzuswr2
moving from sprint 25 to 26 (starting oct 14 2024)
one customer request: video scrubber for moving forward, and backward in time
one more customer request for scrubber from today @danieldaquino
Twtr video options
future: remember my video posiition: https://github.com/damus-io/damus/issues/2078
bonus points save video: https://github.com/damus-io/damus/issues/1370
@jb55, @alltheseas, I have done some more research on the seamless transitioning. It is possible, but seems quite involved, so I am deferring it to this ticket, where I also wrote my findings — so that we can hopefully save some time when we get to work on that.
@jb55, @alltheseas, I have done some more research on the seamless transitioning. It is possible, but seems quite involved, so I am deferring it to this ticket, where I also wrote my findings — so that we can hopefully save some time when we get to work on that.
Thanks for identifying and descoping complexity in favor of fixing the basics first @danieldaquino 💪
@jb55 @alltheseas, I uploaded an internal testflight build with the latest WIP on this, for further testing and evaluation.
Here is what to currently expect:
- Basic video controls implemented and working robustly
- Time syncing between different instances of the same video (e.g. timeline vs. full screen) working well, plus or minus roughly 5 seconds of max de-sync
- Landscape and portrait videos on full screen (and switching) should be working well, without unintended video switching or without leaving full screen mode
- Video coordination working well, videos playing and pausing on timeline as you scroll, no double-playing video, etc
- On full screen you should be able to hide controls by tapping the video
- If it is a carousel, you should be able to swipe between the videos/pictures
If there are any bugs or flakiness with the above, please let me know! I will do some testing as I use it too.
Also published the existing WIP code for this here: https://github.com/damus-io/damus/pull/2613 if needed for reference.
Actually, there seems to be some bizarre bug with this new build, so I removed the build for now. Sorry for the inconvenience! I will upload a new one when that's sorted out
https://github.com/damus-io/damus/issues/2620