Observing network state to show loading

This commit is contained in:
Ilya Yelagov 2022-12-07 08:55:04 +04:00
parent 76030cd8af
commit a74098cd09
2 changed files with 42 additions and 14 deletions

View File

@ -731,6 +731,7 @@ public final class _MediaStreamComponent: CombinedComponent {
private var stateDisposable: Disposable? private var stateDisposable: Disposable?
private var infoDisposable: Disposable? private var infoDisposable: Disposable?
private var connectionDisposable: Disposable? private var connectionDisposable: Disposable?
private var networkStateDisposable: Disposable?
private(set) var originInfo: OriginInfo? private(set) var originInfo: OriginInfo?
@ -798,12 +799,28 @@ public final class _MediaStreamComponent: CombinedComponent {
strongSelf.updated(transition: .immediate) strongSelf.updated(transition: .immediate)
}) })
self.networkStateDisposable = (call.account.networkState |> deliverOnMainQueue).start(next: { [weak self] state in
guard let strongSelf = self else { return }
switch state {
case .waitingForNetwork, .connecting:
print("[NEW] videoStalled")
strongSelf.videoStalled = true
default:
strongSelf.videoStalled = !strongSelf.hasVideo
}
strongSelf.updated(transition: .immediate)
// if let strongSelf = self, case .standard(previewing: false) = strongSelf.presentationInterfaceState.mode {
// strongSelf.chatTitleView?.networkState = state
// }
})
self.connectionDisposable = call.state.start(next: { [weak self] state in self.connectionDisposable = call.state.start(next: { [weak self] state in
let prev = self?.videoStalled let prev = self?.videoStalled
switch state.networkState { switch state.networkState {
case .connected: case .connected:
self?.videoStalled = false self?.videoStalled = false
default: default:
print("[ALERT] video stalled")
self?.videoStalled = true self?.videoStalled = true
} }
if prev != self?.videoStalled { if prev != self?.videoStalled {
@ -821,8 +838,8 @@ public final class _MediaStreamComponent: CombinedComponent {
var updated = false var updated = false
// TODO: remove debug timer // TODO: remove debug timer
Timer.scheduledTimer(withTimeInterval: 0.5, repeats: true) { _ in // Timer.scheduledTimer(withTimeInterval: 0.5, repeats: true) { _ in
strongSelf.infoThrottler.publish(/*members.totalCount*/ Int.random(in: 0..<10000000)) { [weak strongSelf] latestCount in strongSelf.infoThrottler.publish(members.totalCount /*Int.random(in: 0..<10000000)*/) { [weak strongSelf] latestCount in
print(members.totalCount) print(members.totalCount)
guard let strongSelf = strongSelf else { return } guard let strongSelf = strongSelf else { return }
var updated = false var updated = false
@ -835,7 +852,7 @@ public final class _MediaStreamComponent: CombinedComponent {
strongSelf.updated(transition: .immediate) strongSelf.updated(transition: .immediate)
} }
} }
}.fire() // }.fire()
if state.canManageCall != strongSelf.canManageCall { if state.canManageCall != strongSelf.canManageCall {
strongSelf.canManageCall = state.canManageCall strongSelf.canManageCall = state.canManageCall
updated = true updated = true

View File

@ -94,11 +94,12 @@ final class _MediaStreamVideoComponent: Component {
if lhs.peerTitle != rhs.peerTitle { if lhs.peerTitle != rhs.peerTitle {
return false return false
} }
if lhs.isFullscreen != rhs.isFullscreen { if lhs.isFullscreen != rhs.isFullscreen {
return false return false
} }
if lhs.videoLoading != rhs.videoLoading {
return false
}
return true return true
} }
@ -169,8 +170,8 @@ final class _MediaStreamVideoComponent: Component {
} }
let maskGradientLayer = CAGradientLayer() let maskGradientLayer = CAGradientLayer()
private var wasVisible = true private var wasVisible = true
let shimmer = StandaloneShimmerEffect() var shimmer = StandaloneShimmerEffect()
let borderShimmer = StandaloneShimmerEffect() var borderShimmer = StandaloneShimmerEffect()
let shimmerOverlayLayer = CALayer() let shimmerOverlayLayer = CALayer()
let shimmerBorderLayer = CALayer() let shimmerBorderLayer = CALayer()
let placeholderView = UIImageView() let placeholderView = UIImageView()
@ -191,7 +192,7 @@ final class _MediaStreamVideoComponent: Component {
// placeholderView.backgroundColor = .red // placeholderView.backgroundColor = .red
} }
if placeholderView.superview == nil { if !hadVideo && placeholderView.superview == nil {
addSubview(placeholderView) addSubview(placeholderView)
} }
if loadingBlurView.superview == nil { if loadingBlurView.superview == nil {
@ -202,6 +203,7 @@ final class _MediaStreamVideoComponent: Component {
loadingBlurView.layer.addSublayer(shimmerBorderLayer) loadingBlurView.layer.addSublayer(shimmerBorderLayer)
} }
loadingBlurView.clipsToBounds = true loadingBlurView.clipsToBounds = true
shimmer = .init()
shimmer.layer = shimmerOverlayLayer shimmer.layer = shimmerOverlayLayer
shimmerOverlayView.compositingFilter = "softLightBlendMode" shimmerOverlayView.compositingFilter = "softLightBlendMode"
shimmer.testUpdate(background: .clear, foreground: .white.withAlphaComponent(0.4)) shimmer.testUpdate(background: .clear, foreground: .white.withAlphaComponent(0.4))
@ -219,17 +221,26 @@ final class _MediaStreamVideoComponent: Component {
borderMask.lineWidth = 4 borderMask.lineWidth = 4
// let borderMask = CALayer() // let borderMask = CALayer()
shimmerBorderLayer.mask = borderMask shimmerBorderLayer.mask = borderMask
borderShimmer = .init()
borderShimmer.layer = shimmerBorderLayer borderShimmer.layer = shimmerBorderLayer
borderShimmer.testUpdate(background: .clear, foreground: .white) borderShimmer.testUpdate(background: .clear, foreground: .white)
loadingBlurView.alpha = 1 loadingBlurView.alpha = 1
} else { } else {
UIView.animate(withDuration: 0.2, animations: { if hadVideo {
self.loadingBlurView.removeFromSuperview()
placeholderView.removeFromSuperview()
} else {
// Accounting for delay in first frame received
DispatchQueue.main.asyncAfter(deadline: .now() + 1) { [self] in
UIView.transition(with: self.loadingBlurView, duration: 0.2, animations: {
self.loadingBlurView.alpha = 0 self.loadingBlurView.alpha = 0
}, completion: { _ in }, completion: { _ in
self.loadingBlurView.removeFromSuperview() self.loadingBlurView.removeFromSuperview()
}) })
placeholderView.removeFromSuperview() placeholderView.removeFromSuperview()
} }
}
}
if component.hasVideo, self.videoView == nil { if component.hasVideo, self.videoView == nil {
if let input = component.call.video(endpointId: "unified") { if let input = component.call.video(endpointId: "unified") {