yattee/Shared/Player/Video Details/VideoDetails.swift

480 lines
17 KiB
Swift
Raw Normal View History

2022-11-13 17:52:15 +00:00
import Defaults
import Foundation
import SDWebImageSwiftUI
import SwiftUI
struct VideoDetails: View {
static let pageMenuID = "pageMenu"
struct TitleView: View {
@ObservedObject private var model = PlayerModel.shared
@State private var titleSize = CGSize.zero
var video: Video? { model.videoForDisplay }
var body: some View {
HStack(spacing: 0) {
Text(model.videoForDisplay?.displayTitle ?? "Not playing")
.font(.title3.bold())
.lineLimit(4)
2022-12-18 21:34:22 +00:00
}
.padding(.vertical, 4)
2022-12-18 21:34:22 +00:00
}
}
struct ChannelView: View {
@ObservedObject private var model = PlayerModel.shared
@Binding var detailsVisibility: Bool
var video: Video? { model.videoForDisplay }
var body: some View {
HStack {
Button {
guard let channel = video?.channel else { return }
NavigationModel.shared.openChannel(channel, navigationStyle: .sidebar)
} label: {
if detailsVisibility {
ChannelAvatarView(
channel: video?.channel,
video: video
)
} else {
Circle()
2023-07-25 11:20:20 +00:00
.foregroundColor(Color("PlaceholderColor"))
}
}
.frame(width: 40, height: 40)
.buttonStyle(.plain)
.padding(.trailing, 5)
VStack(alignment: .leading, spacing: 2) {
HStack {
2023-05-25 16:02:38 +00:00
if let name = model.videoForDisplay?.channel.name, !name.isEmpty {
Text(name)
.font(.subheadline)
.fontWeight(.semibold)
.lineLimit(1)
} else if model.videoBeingOpened != nil {
Text("Yattee")
.font(.subheadline)
.redacted(reason: .placeholder)
}
if let video, !video.isLocal {
HStack(spacing: 2) {
Image(systemName: "person.2.fill")
if let channel = model.videoForDisplay?.channel {
if let subscriptions = channel.subscriptionsString {
Text(subscriptions)
} else {
Text("1234").redacted(reason: .placeholder)
}
}
}
.font(.caption2)
}
}
.foregroundColor(.secondary)
if video != nil {
VideoMetadataView()
}
}
}
}
}
struct VideoMetadataView: View {
@ObservedObject private var model = PlayerModel.shared
@Default(.enableReturnYouTubeDislike) private var enableReturnYouTubeDislike
var video: Video? { model.videoForDisplay }
var body: some View {
HStack(spacing: 4) {
publishedDateSection
HStack(spacing: 4) {
if model.videoBeingOpened != nil || video?.viewsCount != nil {
Image(systemName: "eye")
}
if let views = video?.viewsCount {
Text(views)
} else if model.videoBeingOpened != nil {
2023-04-24 10:57:06 +00:00
Text("123").redacted(reason: .placeholder)
}
if model.videoBeingOpened != nil || video?.likesCount != nil {
Image(systemName: "hand.thumbsup")
}
2023-04-22 12:26:57 +00:00
if let likes = video?.likesCount, !likes.isEmpty {
Text(likes)
2023-04-22 12:26:57 +00:00
} else {
2023-04-24 10:57:06 +00:00
Text("123").redacted(reason: .placeholder)
}
if enableReturnYouTubeDislike {
if model.videoBeingOpened != nil || video?.dislikesCount != nil {
Image(systemName: "hand.thumbsdown")
}
2023-04-22 12:26:57 +00:00
if let dislikes = video?.dislikesCount, !dislikes.isEmpty {
Text(dislikes)
2023-04-22 12:26:57 +00:00
} else {
2023-04-24 10:57:06 +00:00
Text("123").redacted(reason: .placeholder)
}
}
}
}
.font(.caption2)
.foregroundColor(.secondary)
.frame(maxWidth: .infinity, alignment: .leading)
}
var publishedDateSection: some View {
Group {
if let video {
HStack(spacing: 4) {
if let published = video.publishedDate {
Text(published)
} else {
2023-04-24 10:57:06 +00:00
Text("1 wk ago").redacted(reason: .placeholder)
}
}
}
}
}
}
enum DetailsPage: String, CaseIterable, Defaults.Serializable {
case info, comments, queue
2022-12-18 21:34:22 +00:00
var title: String {
rawValue.capitalized.localized()
}
2022-11-13 17:52:15 +00:00
}
2022-12-17 23:08:30 +00:00
var video: Video?
2022-11-13 17:52:15 +00:00
@Binding var fullScreen: Bool
@Binding var sidebarQueue: Bool
2022-11-13 17:52:15 +00:00
2022-12-18 12:11:06 +00:00
@State private var detailsSize = CGSize.zero
@State private var detailsVisibility = Constants.detailsVisibility
2022-11-13 17:52:15 +00:00
@State private var subscribed = false
@State private var subscriptionToggleButtonDisabled = false
2022-12-18 21:34:22 +00:00
@State private var page = DetailsPage.info
2023-04-22 17:22:13 +00:00
@State private var descriptionExpanded = false
@State private var chaptersExpanded = false
2022-11-13 17:52:15 +00:00
@Environment(\.navigationStyle) private var navigationStyle
#if os(iOS)
@Environment(\.verticalSizeClass) private var verticalSizeClass
#endif
@Environment(\.colorScheme) private var colorScheme
@ObservedObject private var accounts = AccountsModel.shared
@ObservedObject private var comments = CommentsModel.shared
2022-12-18 18:39:03 +00:00
@ObservedObject private var player = PlayerModel.shared
2022-11-13 17:52:15 +00:00
2022-11-18 21:43:16 +00:00
@Default(.enableReturnYouTubeDislike) private var enableReturnYouTubeDislike
2022-11-13 17:52:15 +00:00
@Default(.playerSidebar) private var playerSidebar
@Default(.showInspector) private var showInspector
@Default(.showChapters) private var showChapters
@Default(.showRelated) private var showRelated
#if !os(tvOS)
@Default(.showScrollToTopInComments) private var showScrollToTopInComments
#endif
2023-04-22 17:22:13 +00:00
@Default(.expandVideoDescription) private var expandVideoDescription
2022-11-13 17:52:15 +00:00
var body: some View {
VStack(alignment: .leading, spacing: 0) {
VStack(alignment: .leading, spacing: 0) {
TitleView()
if video != nil, !video!.isLocal {
ChannelView(detailsVisibility: $detailsVisibility)
.layoutPriority(1)
.padding(.bottom, 6)
}
}
.frame(maxWidth: .infinity, alignment: .leading)
.contentShape(Rectangle())
.padding(.horizontal, 16)
#if !os(tvOS)
.tapRecognizer(
tapSensitivity: 0.2,
doubleTapAction: {
withAnimation(.default) {
fullScreen.toggle()
}
}
)
#endif
2022-11-13 17:52:15 +00:00
2022-12-18 18:39:03 +00:00
VideoActions(video: player.videoForDisplay)
.padding(.vertical, 5)
.frame(maxHeight: 50)
.frame(maxWidth: .infinity)
.borderTop(height: 0.5, color: Color("ControlsBorderColor"))
.borderBottom(height: 0.5, color: Color("ControlsBorderColor"))
2022-12-17 23:08:30 +00:00
.animation(nil, value: player.currentItem)
.frame(minWidth: 0, maxWidth: .infinity)
2022-11-13 17:52:15 +00:00
ScrollViewReader { proxy in
pageView
.overlay(scrollToTopButton(proxy), alignment: .bottomTrailing)
}
#if os(iOS)
.opacity(detailsVisibility ? 1 : 0)
#endif
2022-11-13 17:52:15 +00:00
}
.overlay(GeometryReader { proxy in
Color.clear
.onAppear {
detailsSize = proxy.size
}
.onChange(of: proxy.size) { newSize in
2022-12-18 12:11:06 +00:00
guard !player.playingFullScreen else { return }
2022-11-13 17:52:15 +00:00
detailsSize = newSize
}
})
.background(colorScheme == .dark ? Color.black : .white)
2023-11-20 20:51:28 +00:00
.onAppear {
descriptionExpanded = expandVideoDescription
}
2022-11-13 17:52:15 +00:00
}
2022-12-18 12:11:06 +00:00
#if os(iOS)
private var maxWidth: Double {
let width = min(detailsSize.width, player.playerSize.width)
if width.isNormal, width > 0 {
return width
2022-11-13 17:52:15 +00:00
}
2022-12-18 12:11:06 +00:00
return 0
2022-11-13 17:52:15 +00:00
}
2022-12-18 12:11:06 +00:00
#endif
2022-11-13 17:52:15 +00:00
2022-12-18 12:11:06 +00:00
private var contentItem: ContentItem {
ContentItem(video: player.currentVideo)
}
2022-11-13 17:52:15 +00:00
2022-12-19 09:48:30 +00:00
@ViewBuilder var pageMenu: some View {
2022-12-18 21:34:22 +00:00
Picker("Page", selection: $page) {
ForEach(DetailsPage.allCases.filter { pageAvailable($0) }, id: \.rawValue) { page in
Text(page.title).tag(page)
2022-11-13 17:52:15 +00:00
}
}
.pickerStyle(.segmented)
.labelsHidden()
2022-12-18 21:34:22 +00:00
}
func pageAvailable(_ page: DetailsPage) -> Bool {
guard let video else { return false }
switch page {
case .queue:
2023-04-22 14:33:08 +00:00
return !sidebarQueue && player.isAdvanceToNextItemAvailable
default:
return !video.isLocal
}
}
2022-12-18 21:34:22 +00:00
var pageView: some View {
ScrollView(.vertical) {
2023-04-22 14:49:45 +00:00
LazyVStack {
pageMenu
.id(Self.pageMenuID)
2023-04-22 14:49:45 +00:00
.padding(5)
switch page {
case .info:
Group {
if let video {
VStack(alignment: .leading, spacing: 10) {
if !player.videoBeingOpened.isNil && (video.description.isNil || video.description!.isEmpty) {
VStack {
ProgressView()
.progressViewStyle(.circular)
}
2023-04-22 14:49:45 +00:00
.frame(maxWidth: .infinity)
} else if let description = video.description, !description.isEmpty {
2023-04-22 17:22:13 +00:00
Section(header: descriptionHeader) {
VideoDescription(video: video, detailsSize: detailsSize, expand: $descriptionExpanded)
2023-04-22 18:06:30 +00:00
.padding(.horizontal)
2023-04-22 17:22:13 +00:00
}
2023-04-22 14:49:45 +00:00
} else if !video.isLocal {
Text("No description")
.font(.caption)
.foregroundColor(.secondary)
2023-04-22 18:06:30 +00:00
.padding(.horizontal)
2023-04-22 14:49:45 +00:00
}
if player.videoBeingOpened.isNil {
if showChapters,
!video.isLocal,
2023-11-22 09:23:42 +00:00
!video.chapters.isEmpty
{
Section(header: chaptersHeader) {
ChaptersView(expand: $chaptersExpanded)
}
2023-04-22 18:06:30 +00:00
}
if showInspector == .always || video.isLocal {
InspectorView(video: player.videoForDisplay)
.padding(.horizontal)
}
if showRelated,
!sidebarQueue,
2023-11-22 09:23:42 +00:00
!(player.videoForDisplay?.related.isEmpty ?? true)
{
RelatedView()
.padding(.horizontal)
.padding(.top, 20)
}
2022-12-18 21:34:22 +00:00
}
}
}
2023-04-22 14:49:45 +00:00
}
.onAppear {
if video != nil, !pageAvailable(page) {
page = .info
}
2023-04-22 14:49:45 +00:00
}
.transition(.opacity)
.animation(nil, value: player.currentItem)
#if os(iOS)
.frame(maxWidth: YatteeApp.isForPreviews ? .infinity : maxWidth)
#endif
case .queue:
PlayerQueueView(sidebarQueue: false)
.padding(.horizontal)
case .comments:
CommentsView()
.onAppear {
2023-04-22 14:49:45 +00:00
comments.loadIfNeeded()
}
2022-12-18 21:34:22 +00:00
}
2022-12-18 12:11:06 +00:00
}
.padding(.bottom, 60)
2022-12-18 12:11:06 +00:00
}
#if os(iOS)
.onAppear {
if fullScreen {
if let video, video.isLocal {
page = .info
2022-11-13 20:55:19 +00:00
}
detailsVisibility = true
return
2022-11-13 20:55:19 +00:00
}
Delay.by(0.8) { withAnimation(.easeIn(duration: 0.25)) { self.detailsVisibility = true } }
2022-11-13 20:55:19 +00:00
}
#endif
2022-11-13 20:55:19 +00:00
.onChange(of: player.queue) { _ in
if video != nil, !pageAvailable(page) {
page = .info
2022-11-13 20:55:19 +00:00
}
}
}
2023-04-22 17:22:13 +00:00
@ViewBuilder func scrollToTopButton(_ proxy: ScrollViewProxy) -> some View {
#if !os(tvOS)
if showScrollToTopInComments,
page == .comments,
comments.loaded,
2023-11-22 09:23:42 +00:00
comments.all.count > 3
{
Button {
withAnimation {
proxy.scrollTo(Self.pageMenuID)
}
} label: {
Label("Scroll to top", systemImage: "arrow.up")
.padding(8)
.foregroundColor(.white)
.background(Circle().opacity(0.8).foregroundColor(.accentColor))
}
.padding()
.labelStyle(.iconOnly)
.buttonStyle(.plain)
}
#endif
}
2023-04-22 17:22:13 +00:00
var descriptionHeader: some View {
#if canImport(UIKit)
Button(action: {
descriptionExpanded.toggle()
}) {
HStack {
Text("Description".localized())
Spacer()
Image(systemName: descriptionExpanded ? "chevron.up" : "chevron.down")
.imageScale(.small)
}
.padding(.horizontal)
.font(.caption)
.foregroundColor(.secondary)
2023-04-22 17:22:13 +00:00
}
#elseif canImport(AppKit)
HStack {
Text("Description".localized())
Spacer()
Button { descriptionExpanded.toggle()
} label: {
Image(systemName: descriptionExpanded ? "chevron.up" : "chevron.down")
.imageScale(.small)
}
}
.padding(.horizontal)
.font(.caption)
.foregroundColor(.secondary)
#endif
2023-04-22 17:22:13 +00:00
}
2023-04-22 18:06:30 +00:00
var chaptersHeader: some View {
2023-11-25 21:02:28 +00:00
#if canImport(UIKit)
Button(action: {
chaptersExpanded.toggle()
}) {
HStack {
Text("Chapters".localized())
Spacer()
Image(systemName: chaptersExpanded ? "chevron.up" : "chevron.down")
.imageScale(.small)
}
.padding(.horizontal)
.font(.caption)
.foregroundColor(.secondary)
}
2023-11-25 21:02:28 +00:00
#elseif canImport(AppKit)
HStack {
Text("Chapters".localized())
Spacer()
Button(action: { chaptersExpanded.toggle() }) {
Image(systemName: chaptersExpanded ? "chevron.up" : "chevron.down")
.imageScale(.small)
}
}
.padding(.horizontal)
.font(.caption)
.foregroundColor(.secondary)
#endif
2023-04-22 18:06:30 +00:00
}
2022-11-13 17:52:15 +00:00
}
struct VideoDetails_Previews: PreviewProvider {
static var previews: some View {
VideoDetails(video: .fixture, fullScreen: .constant(false), sidebarQueue: .constant(false))
2022-11-13 17:52:15 +00:00
}
}