Watch Next behavior and settings

This commit is contained in:
Arkadiusz Fal
2022-12-18 19:39:03 +01:00
parent b90c856e21
commit 39fc23c5dc
23 changed files with 487 additions and 451 deletions

View File

@@ -26,12 +26,9 @@ struct PlayerControls: View {
@FocusState private var focusedField: Field?
#endif
#if !os(macOS)
@Default(.closePlayerOnItemClose) private var closePlayerOnItemClose
#endif
@Default(.playerControlsLayout) private var regularPlayerControlsLayout
@Default(.fullScreenPlayerControlsLayout) private var fullScreenPlayerControlsLayout
@Default(.openWatchNextOnClose) private var openWatchNextOnClose
private let controlsOverlayModel = ControlOverlaysModel.shared
@@ -164,6 +161,7 @@ struct PlayerControls: View {
#if os(tvOS)
.onChange(of: model.presentingControls) { newValue in
if newValue { focusedField = .play }
else { focusedField = nil }
}
.onChange(of: focusedField) { _ in model.resetTimer() }
#else
@@ -222,6 +220,8 @@ struct PlayerControls: View {
.frame(maxWidth: .infinity, maxHeight: .infinity)
.transition(.opacity)
.animation(.default)
} else if player.videoForDisplay == nil {
Color.black
}
}
@@ -320,10 +320,12 @@ struct PlayerControls: View {
private var closeVideoButton: some View {
button("Close", systemImage: "xmark") {
// TODO: Setting
// WatchNextViewModel.shared.prepareForEmptyPlayerPlaceholder(player.currentItem)
// WatchNextViewModel.shared.open()
player.closeCurrentItem()
if openWatchNextOnClose {
player.pause()
WatchNextViewModel.shared.closed(player.currentItem)
} else {
player.closeCurrentItem()
}
}
#if os(tvOS)
.focused($focusedField, equals: .close)

View File

@@ -5,7 +5,7 @@ struct VideoDetailsOverlay: View {
@ObservedObject private var controls = PlayerControlsModel.shared
var body: some View {
VideoDetails(video: PlayerModel.shared.currentVideo, fullScreen: fullScreenBinding)
VideoDetails(video: controls.player.videoForDisplay, fullScreen: fullScreenBinding)
.clipShape(RoundedRectangle(cornerRadius: 4))
}

View File

@@ -9,13 +9,14 @@ struct VideoActions: View {
var video: Video?
@Default(.openWatchNextOnClose) private var openWatchNextOnClose
@Default(.playerActionsButtonLabelStyle) private var playerActionsButtonLabelStyle
var body: some View {
HStack {
HStack(spacing: 6) {
if let video {
#if !os(tvOS)
if !video.isLocal || video.localStreamIsRemoteURL {
if video.isShareable {
ShareButton(contentItem: .init(video: video)) {
actionButton("Share", systemImage: "square.and.arrow.up")
}
@@ -50,21 +51,29 @@ struct VideoActions: View {
Spacer()
}
}
} else {
Spacer()
}
actionButton("Next", systemImage: Constants.nextSystemImage) {
WatchNextViewModel.shared.userInteractedOpen(player.currentItem)
}
Spacer()
actionButton("Hide", systemImage: "chevron.down") {
player.hide(animate: true)
}
Spacer()
actionButton("Close", systemImage: "xmark") {
// TODO: setting
// player.pause()
// WatchNextViewModel.shared.prepareForEmptyPlayerPlaceholder(player.currentItem)
// WatchNextViewModel.shared.open()
player.closeCurrentItem()
if openWatchNextOnClose {
player.pause()
WatchNextViewModel.shared.closed(player.currentItem)
} else {
player.closeCurrentItem()
}
}
.disabled(player.currentItem == nil)
}
.padding(.horizontal)
.multilineTextAlignment(.center)

View File

@@ -27,10 +27,9 @@ struct VideoDetails: View {
@ObservedObject private var accounts = AccountsModel.shared
let comments = CommentsModel.shared
var player = PlayerModel.shared
@ObservedObject private var player = PlayerModel.shared
@Default(.enableReturnYouTubeDislike) private var enableReturnYouTubeDislike
@Default(.detailsToolbarPosition) private var detailsToolbarPosition
@Default(.playerSidebar) private var playerSidebar
var body: some View {
@@ -46,7 +45,7 @@ struct VideoDetails: View {
)
.animation(nil, value: player.currentItem)
VideoActions(video: video)
VideoActions(video: player.videoForDisplay)
.animation(nil, value: player.currentItem)
detailsPage

View File

@@ -1,46 +0,0 @@
import Defaults
import Foundation
struct VideoDetailsTool: Identifiable {
static let all = [
Self(icon: "info.circle", name: "Info", page: .info),
Self(icon: "wand.and.stars", name: "Inspector", page: .inspector),
Self(icon: "bookmark", name: "Chapters", page: .chapters),
Self(icon: "text.bubble", name: "Comments", page: .comments),
Self(icon: "rectangle.stack.fill", name: "Related", page: .related),
Self(icon: "list.number", name: "Queue", page: .queue)
]
static func find(for page: VideoDetails.DetailsPage) -> Self? {
all.first { $0.page == page }
}
var id: String {
page.rawValue
}
var icon: String
var name: String
var toolPostion: CGRect = .zero
var page = VideoDetails.DetailsPage.info
func isAvailable(for video: Video?, sidebarQueue: Bool) -> Bool {
guard !YatteeApp.isForPreviews else {
return true
}
switch page {
case .info:
return true
case .inspector:
return video == nil || Defaults[.showInspector] == .always || video!.isLocal
case .chapters:
return video != nil && !video!.chapters.isEmpty
case .comments:
return video != nil && !video!.isLocal
case .related:
return !sidebarQueue && video != nil && !video!.isLocal
case .queue:
return !sidebarQueue
}
}
}

View File

@@ -1,154 +0,0 @@
import Defaults
import SwiftUI
struct VideoDetailsToolbar: View {
static let lowOpacity = 0.5
var video: Video?
@Binding var page: VideoDetails.DetailsPage
var sidebarQueue: Bool
@State private var tools = VideoDetailsTool.all
@State private var activeTool: VideoDetailsTool?
@State private var startedToolPosition: CGRect = .zero
@State private var opacity = 1.0
@ObservedObject private var player = PlayerModel.shared
@Default(.playerDetailsPageButtonLabelStyle) private var playerDetailsPageButtonLabelStyle
var body: some View {
VStack {
HStack(spacing: 12) {
ForEach($tools) { $tool in
if $tool.wrappedValue.isAvailable(for: video, sidebarQueue: sidebarQueue) {
ToolView(tool: $tool)
.padding(.vertical, 10)
}
}
}
.id(video?.id)
.onAppear {
activeTool = .find(for: page)
}
.onChange(of: page) { newValue in
activeTool = tools.first { $0.id == newValue.rawValue }
}
.coordinateSpace(name: "toolbarArea")
#if !os(tvOS)
.gesture(
DragGesture(minimumDistance: 0)
.onChanged { value in
withAnimation(.linear(duration: 0.2)) {
opacity = 1
}
guard let firstTool = tools.first else { return }
if startedToolPosition == .zero {
startedToolPosition = firstTool.toolPostion
}
let location = CGPoint(x: value.location.x, y: value.location.y)
if let index = tools.firstIndex(where: { $0.toolPostion.contains(location) }),
activeTool?.id != tools[index].id,
tools[index].isAvailable(for: video, sidebarQueue: sidebarQueue)
{
withAnimation(.interpolatingSpring(stiffness: 230, damping: 22)) {
activeTool = tools[index]
}
withAnimation(.linear(duration: 0.25)) {
page = activeTool?.page ?? .info
}
}
}
.onEnded { _ in
withAnimation(.interactiveSpring(response: 0.5, dampingFraction: 1, blendDuration: 1)) {
startedToolPosition = .zero
}
Delay.by(2) {
lowerOpacity()
}
}
)
#endif
}
#if !os(tvOS)
.onHover { hovering in
hovering ? resetOpacity(0.2) : lowerOpacity(0.2)
}
#endif
.onAppear {
Delay.by(2) { lowerOpacity() }
}
.opacity(opacity)
.background(
Rectangle()
.contentShape(Rectangle())
.foregroundColor(.clear)
)
}
func lowerOpacity(_ duration: Double = 1.0) {
withAnimation(.linear(duration: duration)) {
opacity = Self.lowOpacity
}
}
func resetOpacity(_ duration: Double = 1.0) {
withAnimation(.linear(duration: duration)) {
opacity = 1
}
}
@ViewBuilder func ToolView(tool: Binding<VideoDetailsTool>) -> some View {
HStack(spacing: 0) {
Image(systemName: tool.wrappedValue.icon)
.font(.title2)
.foregroundColor(.white)
.frame(width: 30, height: 30)
.layoutPriority(1)
if activeToolID == tool.wrappedValue.id,
playerDetailsPageButtonLabelStyle.text,
player.playerSize.width > 450
{
Text(tool.wrappedValue.name.localized())
.font(.system(size: 14).bold())
.padding(.trailing, 4)
.foregroundColor(.white)
.allowsTightening(true)
.lineLimit(1)
}
}
.padding(.horizontal, 10)
.padding(.vertical, 6)
.background(
RoundedRectangle(cornerRadius: 10, style: .continuous)
.fill(activeToolID == tool.wrappedValue.id ? Color.accentColor : Color.secondary)
)
.background(
GeometryReader { proxy in
let frame = proxy.frame(in: .named("toolbarArea"))
Color.clear
.preference(key: RectKey.self, value: frame)
.onPreferenceChange(RectKey.self) { rect in
tool.wrappedValue.toolPostion = rect
}
}
)
}
var visibleToolsCount: Int {
tools.filter { $0.isAvailable(for: video, sidebarQueue: sidebarQueue) }.count
}
var activeToolID: VideoDetailsTool.ID {
activeTool?.id ?? "info"
}
}
struct VideoDetailsToolbar_Previews: PreviewProvider {
static var previews: some View {
VideoDetailsToolbar(page: .constant(.queue), sidebarQueue: false)
.injectFixtureEnvironmentObjects()
}
}

View File

@@ -126,6 +126,11 @@ struct VideoPlayerView: View {
}
}
.onAppear {
#if os(macOS)
if player.videoForDisplay.isNil {
player.hide()
}
#endif
viewDragOffset = 0
Delay.by(0.2) {
@@ -178,6 +183,9 @@ struct VideoPlayerView: View {
.backport
.persistentSystemOverlays(!fullScreenPlayer)
#endif
#if os(macOS)
.frame(minWidth: 1000, minHeight: 700)
#endif
}
func updateSidebarQueue() {

View File

@@ -14,15 +14,36 @@ struct WatchNextView: View {
#if os(iOS)
NavigationView {
watchNext
.toolbar {
ToolbarItem(placement: .principal) {
watchNextMenu
}
}
}
#else
VStack {
HStack {
closeButton
hideCloseButton
.labelStyle(.iconOnly)
.frame(maxWidth: .infinity, alignment: .leading)
Spacer()
reopenButton
watchNextMenu
.frame(maxWidth: .infinity)
Spacer()
HStack {
if model.isRestartable {
reopenButton
}
}
.frame(maxWidth: .infinity, alignment: .trailing)
}
#if os(macOS)
.padding()
#endif
watchNext
}
#endif
@@ -32,143 +53,215 @@ struct WatchNextView: View {
#else
.background(Color.background)
#endif
.opacity(model.presentingOutro ? 1 : 0)
.opacity(model.isPresenting ? 1 : 0)
}
var watchNext: some View {
ScrollView {
VStack(alignment: .leading) {
if model.isAutoplaying,
let item = nextFromTheQueue
let item = model.nextFromTheQueue
{
HStack {
Text("Playing Next in 5...")
.font(.headline)
Text("Playing Next in \(Int(model.countdown.rounded()))...")
.font(.headline.monospacedDigit())
Spacer()
Button {
model.cancelAutoplay()
model.keepFromAutoplaying()
} label: {
Label("Cancel", systemImage: "xmark")
Label("Cancel", systemImage: "pause.fill")
#if os(iOS)
.imageScale(.large)
.padding([.vertical, .leading])
.font(.headline.bold())
#endif
}
}
#if os(tvOS)
.padding(.top, 10)
#endif
PlayerQueueRow(item: item)
.padding(.bottom, 10)
}
moreVideos
.padding(.top, 15)
}
.padding(.horizontal)
}
#if os(iOS)
.navigationBarTitleDisplayMode(.inline)
#endif
.navigationTitle("Watch Next")
#if !os(macOS)
.toolbar {
ToolbarItem(placement: .cancellationAction) {
closeButton
}
ToolbarItem(placement: .primaryAction) {
reopenButton
}
.navigationTitle(model.page.title)
.toolbar {
ToolbarItem(placement: .cancellationAction) {
hideCloseButton
}
ToolbarItem(placement: .primaryAction) {
reopenButton
}
}
#endif
}
var watchNextMenu: some View {
#if os(tvOS)
Button {
model.page = model.page.next()
} label: {
menuLabel
}
#elseif os(macOS)
pagePicker
.modifier(SettingsPickerModifier())
#if os(macOS)
.frame(maxWidth: 150)
#endif
#else
Menu {
pagePicker
} label: {
HStack(spacing: 12) {
menuLabel
.foregroundColor(.primary)
Image(systemName: "chevron.down.circle.fill")
.foregroundColor(.accentColor)
.imageScale(.small)
}
.transaction { t in t.animation = nil }
}
#endif
}
var menuLabel: some View {
HStack {
Image(systemName: model.page.systemImageName)
.imageScale(.small)
Text(model.page.title)
.font(.headline)
}
}
var pagePicker: some View {
Picker("Page", selection: $model.page) {
ForEach(WatchNextViewModel.Page.allCases, id: \.rawValue) { page in
Label(page.title, systemImage: page.systemImageName)
.tag(page)
}
}
}
@ViewBuilder var hideCloseButton: some View {
if model.isHideable {
hideButton
} else {
closeButton
}
}
var hideButton: some View {
Button {
model.hide()
} label: {
Label("Hide", systemImage: "chevron.down")
}
}
var closeButton: some View {
Button {
player.closeCurrentItem()
player.hide()
Delay.by(0.8) {
model.presentingOutro = false
}
model.close()
} label: {
Label("Close", systemImage: "xmark")
}
}
@ViewBuilder var reopenButton: some View {
if player.currentItem != nil, model.item != nil {
if model.isRestartable {
Button {
model.close()
model.restart()
} label: {
Label("Back to last video", systemImage: "arrow.counterclockwise")
Label(model.reason == .userInteracted ? "Back" : "Reopen", systemImage: "arrow.counterclockwise")
}
}
}
@ViewBuilder var moreVideos: some View {
VStack(spacing: 12) {
let queueForMoreVideos = player.queue.isEmpty ? [] : player.queue.suffix(from: model.isAutoplaying ? 1 : 0)
if !queueForMoreVideos.isEmpty {
VStack(spacing: 12) {
Text("Next in Queue")
.frame(maxWidth: .infinity, alignment: .leading)
.font(.headline)
switch model.page {
case .queue:
let queueForMoreVideos = player.queue.isEmpty ? [] : player.queue.suffix(from: model.isAutoplaying ? 1 : 0)
if !queueForMoreVideos.isEmpty {
ForEach(queueForMoreVideos) { item in
ContentItemView(item: .init(video: item.video))
.environment(\.listingStyle, .list)
PlayerQueueRow(item: item)
.contextMenu {
removeButton(item)
removeAllButton()
if let video = item.video {
VideoContextMenuView(video: video)
}
}
#if os(tvOS)
.padding(.horizontal, 30)
#endif
#if !os(tvOS)
Divider()
#endif
}
} else if player.playbackMode != .related && player.playbackMode != .loopOne {
Label(
model.isAutoplaying ? "Nothing more in the queue" : "Queue is empty",
systemImage: WatchNextViewModel.Page.queue.systemImageName
)
.foregroundColor(.secondary)
}
}
if let item = model.item {
VStack(spacing: 12) {
Text("Related videos")
.frame(maxWidth: .infinity, alignment: .leading)
.font(.headline)
case .related:
if let item = model.item {
ForEach(item.video.related) { video in
ContentItemView(item: .init(video: video))
.environment(\.listingStyle, .list)
}
.padding(.bottom, 4)
} else {
Label("Nothing was played",
systemImage: WatchNextViewModel.Page.related.systemImageName)
.foregroundColor(.secondary)
}
}
if saveHistory {
VStack(spacing: 12) {
Text("History")
.frame(maxWidth: .infinity, alignment: .leading)
.font(.headline)
HStack {
Text("Playing Next in 5...")
.font(.headline)
Spacer()
Button {
model.cancelAutoplay()
} label: {
Label("Cancel", systemImage: "pause.fill")
}
}
case .history:
if saveHistory {
HistoryView(limit: 15)
}
}
}
}
var nextFromTheQueue: PlayerQueueItem? {
if player.playbackMode == .related {
return player.autoplayItem
} else if player.playbackMode == .queue {
return player.queue.first
private func removeButton(_ item: PlayerQueueItem) -> some View {
Button {
player.remove(item)
} label: {
Label("Remove from the queue", systemImage: "trash")
}
}
return nil
private func removeAllButton() -> some View {
Button {
player.removeQueueItems()
} label: {
Label("Clear the queue", systemImage: "trash.fill")
}
}
}
struct OutroView_Previews: PreviewProvider {
struct WatchNextView_Previews: PreviewProvider {
static var previews: some View {
WatchNextView()
.onAppear {
WatchNextViewModel.shared.prepareForNextItem(.init(.fixture))
WatchNextViewModel.shared.finishedWatching(.init(.fixture))
}
}
}