Player layout changes

This commit is contained in:
Arkadiusz Fal
2022-12-18 13:11:06 +01:00
parent 328119f0e0
commit ba1ec7c559
15 changed files with 147 additions and 169 deletions

View File

@@ -106,7 +106,7 @@ struct PlayerControls: View {
if playerControlsLayout.displaysTitleLine {
VStack(alignment: .leading) {
Text(player.currentVideo?.displayTitle ?? "Not Playing")
Text(player.videoForDisplay?.displayTitle ?? "Not Playing")
.shadow(radius: 10)
.font(.system(size: playerControlsLayout.titleLineFontSize).bold())
.lineLimit(1)
@@ -216,19 +216,23 @@ struct PlayerControls: View {
@ViewBuilder var controlsBackground: some View {
if player.musicMode,
let item = self.player.currentItem,
let video = item.video,
let url = controlsBackgroundURL
{
ThumbnailView(url: url)
.frame(maxWidth: .infinity, maxHeight: .infinity)
.transition(.opacity)
.animation(.default)
}
}
var controlsBackgroundURL: URL? {
if let video = player.videoForDisplay,
let url = thumbnails.best(video)
{
WebImage(url: url, options: [.lowPriority])
.resizable()
.placeholder {
Rectangle().fill(Color("PlaceholderColor"))
}
.retryOnAppear(true)
.indicator(.activity)
.frame(maxWidth: .infinity, maxHeight: .infinity)
return url
}
return nil
}
var timeline: some View {
@@ -296,7 +300,7 @@ struct PlayerControls: View {
"Fullscreen",
systemImage: player.playingFullScreen ? "arrow.down.right.and.arrow.up.left" : "arrow.up.left.and.arrow.down.right"
) {
player.toggleFullscreen(player.playingFullScreen)
player.toggleFullscreen(player.playingFullScreen, showControls: false)
}
#if !os(tvOS)
.keyboardShortcut(player.playingFullScreen ? .cancelAction : .defaultAction)

View File

@@ -4,10 +4,8 @@ import SwiftUI
struct VideoDetailsOverlay: View {
@ObservedObject private var controls = PlayerControlsModel.shared
@State private var detailsPage = VideoDetails.DetailsPage.info
var body: some View {
VideoDetails(video: PlayerModel.shared.currentVideo, page: $detailsPage, sidebarQueue: .constant(false), fullScreen: fullScreenBinding)
VideoDetails(video: PlayerModel.shared.currentVideo, fullScreen: fullScreenBinding)
.clipShape(RoundedRectangle(cornerRadius: 4))
}

View File

@@ -52,24 +52,19 @@ struct VideoActions: View {
}
}
if player.currentItem == nil {
Spacer()
}
actionButton("Hide", systemImage: "chevron.down") {
player.hide(animate: true)
}
if player.currentItem != nil {
Spacer()
actionButton("Close", systemImage: "xmark") {
Spacer()
actionButton("Close", systemImage: "xmark") {
// TODO: setting
// player.pause()
// WatchNextViewModel.shared.prepareForEmptyPlayerPlaceholder(player.currentItem)
// WatchNextViewModel.shared.open()
player.closeCurrentItem()
}
player.closeCurrentItem()
}
.disabled(player.currentItem == nil)
}
.padding(.horizontal)
.multilineTextAlignment(.center)

View File

@@ -10,11 +10,11 @@ struct VideoDetails: View {
var video: Video?
@Binding var page: DetailsPage
@Binding var sidebarQueue: Bool
@Binding var fullScreen: Bool
var bottomPadding = false
@State private var detailsSize = CGSize.zero
@State private var descriptionVisibility = Constants.descriptionVisibility
@State private var subscribed = false
@State private var subscriptionToggleButtonDisabled = false
@@ -49,50 +49,10 @@ struct VideoDetails: View {
VideoActions(video: video)
.animation(nil, value: player.currentItem)
ZStack(alignment: .bottom) {
currentPage
.frame(maxWidth: detailsSize.width)
.animation(nil, value: player.currentItem)
HStack {
if detailsToolbarPosition.needsLeftSpacer { Spacer() }
VideoDetailsToolbar(video: video, page: $page, sidebarQueue: sidebarQueue)
if detailsToolbarPosition.needsRightSpacer { Spacer() }
}
.padding(.leading, detailsToolbarPosition == .left ? 10 : 0)
.padding(.trailing, detailsToolbarPosition == .right ? 10 : 0)
#if os(iOS)
.offset(y: bottomPadding ? -SafeArea.insets.bottom : 0)
#endif
}
.onChange(of: player.currentItem) { _ in
page = .info
}
}
.onAppear {
if video.isNil ||
!VideoDetailsTool.find(for: page)!.isAvailable(for: video!, sidebarQueue: sidebarQueue)
{
guard let video, video.isLocal else { return }
page = .info
}
guard video != nil, accounts.app.supportsSubscriptions else {
subscribed = false
return
}
}
.onChange(of: sidebarQueue) { queue in
if queue {
if page == .related || page == .queue {
page = video.isNil || video!.isLocal ? .inspector : .info
}
} else if video.isNil {
page = .inspector
}
detailsPage
#if os(iOS)
.frame(maxWidth: maxWidth)
#endif
}
.overlay(GeometryReader { proxy in
Color.clear
@@ -100,67 +60,53 @@ struct VideoDetails: View {
detailsSize = proxy.size
}
.onChange(of: proxy.size) { newSize in
guard !player.playingFullScreen else { return }
detailsSize = newSize
}
})
.background(colorScheme == .dark ? Color.black : .white)
}
#if os(iOS)
private var maxWidth: Double {
let width = min(detailsSize.width, player.playerSize.width)
if width.isNormal, width > 0 {
return width
}
return 0
}
#endif
private var contentItem: ContentItem {
ContentItem(video: player.currentVideo)
}
var currentPage: some View {
VStack {
switch page {
case .info:
detailsPage
case .inspector:
InspectorView(video: video)
case .chapters:
ChaptersView()
case .comments:
CommentsView(embedInScrollView: true)
.onAppear {
Delay.by(0.3) { comments.loadIfNeeded() }
}
case .related:
RelatedView()
case .queue:
PlayerQueueView(sidebarQueue: sidebarQueue, fullScreen: $fullScreen)
}
}
.contentShape(Rectangle())
.frame(maxWidth: .infinity, maxHeight: .infinity)
}
@State private var detailsSize = CGSize.zero
var detailsPage: some View {
ScrollView(.vertical, showsIndicators: false) {
if let video, player.videoBeingOpened == nil {
if let video {
VStack(alignment: .leading, spacing: 10) {
videoProperties
#if os(iOS)
.opacity(descriptionVisibility ? 1 : 0)
#endif
if !player.videoBeingOpened.isNil && (video.description.isNil || video.description!.isEmpty) {
VStack(alignment: .leading, spacing: 0) {
ForEach(1 ... Int.random(in: 2 ... 5), id: \.self) { _ in
Text(String(repeating: Video.fixture.description ?? "", count: Int.random(in: 1 ... 4)))
}
VStack {
ProgressView()
.progressViewStyle(.circular)
}
.redacted(reason: .placeholder)
.frame(maxWidth: .infinity)
.opacity(descriptionVisibility ? 1 : 0)
} else if video.description != nil, !video.description!.isEmpty {
VideoDescription(video: video, detailsSize: detailsSize)
#if os(iOS)
.opacity(descriptionVisibility ? 1 : 0)
.padding(.bottom, player.playingFullScreen ? 10 : SafeArea.insets.bottom)
#endif
} else if !video.isLocal {
Text("No description")
.font(.caption)
.foregroundColor(.secondary)
}
}
@@ -168,6 +114,17 @@ struct VideoDetails: View {
.padding(.bottom, 60)
}
}
#if os(iOS)
.onAppear {
if fullScreen {
descriptionVisibility = true
return
}
Delay.by(0.3) { withAnimation(.easeOut(duration: 0.2)) { self.descriptionVisibility = true } }
}
#endif
.transition(.opacity)
.animation(nil, value: player.currentItem)
.padding(.horizontal)
}
@@ -180,7 +137,7 @@ struct VideoDetails: View {
HStack(spacing: 4) {
Image(systemName: "eye")
if let views = video?.viewsCount, player.videoBeingOpened.isNil {
if let views = video?.viewsCount {
Text(views)
} else {
if player.videoBeingOpened == nil {
@@ -192,7 +149,7 @@ struct VideoDetails: View {
Image(systemName: "hand.thumbsup")
if let likes = video?.likesCount, player.videoBeingOpened.isNil {
if let likes = video?.likesCount {
Text(likes)
} else {
if player.videoBeingOpened == nil {
@@ -205,7 +162,7 @@ struct VideoDetails: View {
if enableReturnYouTubeDislike {
Image(systemName: "hand.thumbsdown")
if let dislikes = video?.dislikesCount, player.videoBeingOpened.isNil {
if let dislikes = video?.dislikesCount {
Text(dislikes)
} else {
if player.videoBeingOpened == nil {
@@ -238,7 +195,6 @@ struct VideoDetails: View {
struct VideoDetails_Previews: PreviewProvider {
static var previews: some View {
VideoDetails(video: .fixture, page: .constant(.info), sidebarQueue: .constant(true), fullScreen: .constant(false))
.injectFixtureEnvironmentObjects()
VideoDetails(video: .fixture, fullScreen: .constant(false))
}
}

View File

@@ -66,7 +66,6 @@ struct VideoPlayerView: View {
@Default(.seekGestureSpeed) var seekGestureSpeed
@Default(.seekGestureSensitivity) var seekGestureSensitivity
@Default(.playerSidebar) var playerSidebar
@Default(.videoDetailsPage) var detailsPage
@ObservedObject internal var controlsOverlayModel = ControlOverlaysModel.shared
@@ -107,6 +106,9 @@ struct VideoPlayerView: View {
playerSize = geometry.size
}
}
#if os(iOS)
.padding(.bottom, fullScreenPlayer ? 0.0001 : geometry.safeAreaInsets.bottom)
#endif
.onChange(of: geometry.size) { _ in
self.playerSize = geometry.size
}
@@ -114,7 +116,6 @@ struct VideoPlayerView: View {
player.backend.setNeedsDrawing(!value)
}
#if os(iOS)
.padding(.bottom, playerEdgesIgnoringSafeArea == [.bottom] ? 0 : geometry.safeAreaInsets.bottom)
.frame(width: playerWidth.isNil ? nil : Double(playerWidth!), height: playerHeight.isNil ? nil : Double(playerHeight!))
.ignoresSafeArea(.all, edges: playerEdgesIgnoringSafeArea)
.onChange(of: player.presentingPlayer) { newValue in
@@ -321,20 +322,24 @@ struct VideoPlayerView: View {
.background(Color.black)
if !fullScreenPlayer {
VideoDetails(video: player.currentVideo, page: $detailsPage, sidebarQueue: $sidebarQueue, fullScreen: $fullScreenDetails, bottomPadding: detailsNeedBottomPadding)
VideoDetails(
video: player.videoForDisplay,
fullScreen: $fullScreenDetails,
bottomPadding: detailsNeedBottomPadding
)
#if os(iOS)
.ignoresSafeArea(.all, edges: .bottom)
.ignoresSafeArea(.all, edges: .bottom)
#endif
.modifier(VideoDetailsPaddingModifier(
playerSize: player.playerSize,
fullScreen: fullScreenDetails
))
.onDisappear {
if player.presentingPlayer {
player.setNeedsDrawing(true)
}
.modifier(VideoDetailsPaddingModifier(
playerSize: player.playerSize,
fullScreen: fullScreenDetails
))
.onDisappear {
if player.presentingPlayer {
player.setNeedsDrawing(true)
}
.transition(.opacity)
}
.transition(.opacity)
}
}
#endif
@@ -389,7 +394,7 @@ struct VideoPlayerView: View {
#elseif os(macOS)
if Defaults[.playerSidebar] != .never {
PlayerQueueView(sidebarQueue: true, fullScreen: $fullScreenDetails)
.frame(minWidth: 300)
.frame(width: 350)
.background(colorScheme == .dark ? Color.black : Color.white)
}
#endif
@@ -471,8 +476,5 @@ struct VideoPlayerView: View {
struct VideoPlayerView_Previews: PreviewProvider {
static var previews: some View {
VideoPlayerView()
.onAppear {
WatchNextViewModel.shared.prepareForEmptyPlayerPlaceholder(.init(.fixture))
}
}
}

View File

@@ -60,7 +60,9 @@ struct WatchNextView: View {
}
.padding(.horizontal)
}
#if os(iOS)
.navigationBarTitleDisplayMode(.inline)
#endif
.navigationTitle("Watch Next")
#if !os(macOS)
.toolbar {
@@ -78,7 +80,7 @@ struct WatchNextView: View {
var closeButton: some View {
Button {
player.closeCurrentItem()
player.hide(animate: true)
player.hide()
Delay.by(0.8) {
model.presentingOutro = false
}