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

297 lines
9.8 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 {
enum DetailsPage: String, CaseIterable, Defaults.Serializable {
2022-12-18 21:34:22 +00:00
case info, comments, chapters, inspector
var systemImageName: String {
switch self {
case .info:
return "info.circle"
case .inspector:
return "wand.and.stars"
case .comments:
return "text.bubble"
case .chapters:
return "bookmark"
}
}
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
var bottomPadding = false
2022-12-18 12:11:06 +00:00
@State private var detailsSize = CGSize.zero
@State private var descriptionVisibility = Constants.descriptionVisibility
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
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
let 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
var body: some View {
VStack(alignment: .leading, spacing: 0) {
ControlsBar(
fullScreen: $fullScreen,
expansionState: .constant(.full),
2022-11-13 17:52:15 +00:00
presentingControls: false,
backgroundEnabled: false,
borderTop: false,
detailsTogglePlayer: false,
detailsToggleFullScreen: true
)
2022-12-17 23:08:30 +00:00
.animation(nil, value: player.currentItem)
2022-11-13 17:52:15 +00:00
2022-12-18 18:39:03 +00:00
VideoActions(video: player.videoForDisplay)
2022-12-17 23:08:30 +00:00
.animation(nil, value: player.currentItem)
2022-11-13 17:52:15 +00:00
2022-12-18 21:34:22 +00:00
pageView
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)
}
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
#if os(macOS)
pagePicker
.labelsHidden()
.offset(x: 15, y: 15)
.frame(maxWidth: 200)
2022-12-19 09:48:30 +00:00
#elseif os(iOS)
2022-12-18 21:34:22 +00:00
Menu {
pagePicker
} label: {
HStack {
Label(page.title, systemImage: page.systemImageName)
Image(systemName: "chevron.up.chevron.down")
.imageScale(.small)
2022-11-13 17:52:15 +00:00
}
2022-12-18 21:34:22 +00:00
.padding(10)
.fixedSize(horizontal: true, vertical: false)
.modifier(ControlBackgroundModifier())
.clipShape(RoundedRectangle(cornerRadius: 6))
.frame(width: 200, alignment: .leading)
.transaction { t in t.animation = nil }
}
.modifier(SettingsPickerModifier())
.offset(x: 15, y: 5)
#endif
}
var pagePicker: some View {
Picker("Page", selection: $page) {
ForEach(DetailsPage.allCases, id: \.rawValue) { page in
Label(page.title, systemImage: page.systemImageName).tag(page)
2022-11-13 17:52:15 +00:00
}
}
2022-12-18 21:34:22 +00:00
}
var pageView: some View {
ZStack(alignment: .topLeading) {
switch page {
case .info:
ScrollView(.vertical, showsIndicators: false) {
if let video {
VStack(alignment: .leading, spacing: 10) {
HStack {
videoProperties
.frame(maxWidth: .infinity, alignment: .trailing)
#if os(iOS)
.opacity(descriptionVisibility ? 1 : 0)
#endif
}
.padding(.bottom, 12)
if !player.videoBeingOpened.isNil && (video.description.isNil || video.description!.isEmpty) {
VStack {
ProgressView()
.progressViewStyle(.circular)
}
.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)
}
}
.padding(.top, 18)
.padding(.bottom, 60)
}
}
#if os(iOS)
.onAppear {
if fullScreen {
descriptionVisibility = true
return
}
Delay.by(0.4) { withAnimation(.easeIn(duration: 0.25)) { self.descriptionVisibility = true } }
}
#endif
.transition(.opacity)
.animation(nil, value: player.currentItem)
.padding(.horizontal)
#if os(iOS)
.frame(maxWidth: YatteeApp.isForPreviews ? .infinity : maxWidth)
#endif
case .inspector:
InspectorView(video: video)
case .chapters:
ChaptersView()
case .comments:
CommentsView(embedInScrollView: true)
.onAppear {
comments.loadIfNeeded()
}
2022-12-18 12:11:06 +00:00
}
2022-12-18 21:34:22 +00:00
pageMenu
.font(.headline)
.foregroundColor(.accentColor)
.zIndex(1)
#if !os(tvOS)
Rectangle()
.fill(
LinearGradient(
gradient: .init(colors: [fadePlaceholderStartColor, .clear]),
startPoint: .top,
endPoint: .bottom
)
)
.zIndex(0)
.frame(maxHeight: 15)
#endif
2022-12-18 12:11:06 +00:00
}
2022-12-18 21:34:22 +00:00
}
var fadePlaceholderStartColor: Color {
#if os(macOS)
.secondaryBackground
#elseif os(iOS)
.background
2022-12-19 09:48:30 +00:00
#else
.clear
2022-12-18 12:11:06 +00:00
#endif
2022-11-13 17:52:15 +00:00
}
2022-11-13 20:55:19 +00:00
@ViewBuilder var videoProperties: some View {
2022-12-18 21:34:22 +00:00
HStack(spacing: 4) {
Spacer()
2022-11-13 20:55:19 +00:00
publishedDateSection
2022-12-18 21:34:22 +00:00
Text("")
2022-11-13 20:55:19 +00:00
HStack(spacing: 4) {
2022-12-18 21:40:29 +00:00
if player.videoBeingOpened != nil || video?.viewsCount != nil {
Image(systemName: "eye")
}
2022-11-13 20:55:19 +00:00
2022-12-18 12:11:06 +00:00
if let views = video?.viewsCount {
2022-11-13 20:55:19 +00:00
Text(views)
2022-12-18 21:40:29 +00:00
} else if player.videoBeingOpened != nil {
Text("1,234M").redacted(reason: .placeholder)
2022-11-13 20:55:19 +00:00
}
2022-12-18 21:40:29 +00:00
if player.videoBeingOpened != nil || video?.likesCount != nil {
Image(systemName: "hand.thumbsup")
}
2022-11-13 20:55:19 +00:00
2022-12-18 12:11:06 +00:00
if let likes = video?.likesCount {
2022-11-13 20:55:19 +00:00
Text(likes)
2022-12-18 21:40:29 +00:00
} else if player.videoBeingOpened == nil {
Text("1,234M").redacted(reason: .placeholder)
2022-11-13 20:55:19 +00:00
}
2022-11-18 21:43:16 +00:00
if enableReturnYouTubeDislike {
2022-12-18 21:40:29 +00:00
if player.videoBeingOpened != nil || video?.dislikesCount != nil {
Image(systemName: "hand.thumbsdown")
}
2022-11-13 20:55:19 +00:00
2022-12-18 12:11:06 +00:00
if let dislikes = video?.dislikesCount {
2022-11-13 20:55:19 +00:00
Text(dislikes)
2022-12-18 21:40:29 +00:00
} else if player.videoBeingOpened == nil {
Text("1,234M").redacted(reason: .placeholder)
2022-11-13 20:55:19 +00:00
}
}
}
}
2022-12-18 21:34:22 +00:00
.font(.caption)
2022-11-13 20:55:19 +00:00
.foregroundColor(.secondary)
}
var publishedDateSection: some View {
Group {
if let video {
HStack(spacing: 4) {
if let published = video.publishedDate {
Text(published)
} else {
Text("1 century ago").redacted(reason: .placeholder)
}
}
}
}
}
2022-11-13 17:52:15 +00:00
}
struct VideoDetails_Previews: PreviewProvider {
static var previews: some View {
2022-12-18 12:11:06 +00:00
VideoDetails(video: .fixture, fullScreen: .constant(false))
2022-11-13 17:52:15 +00:00
}
}