yattee/Shared/Player/VideoDetails.swift

421 lines
14 KiB
Swift
Raw Normal View History

2021-11-03 23:14:09 +00:00
import Defaults
2021-08-22 19:13:33 +00:00
import Foundation
2021-12-17 20:01:05 +00:00
import SDWebImageSwiftUI
2021-08-22 19:13:33 +00:00
import SwiftUI
import SwiftUIPager
2021-08-22 19:13:33 +00:00
struct VideoDetails: View {
enum DetailsPage: CaseIterable {
case info, chapters, comments, related, queue
var index: Int {
switch self {
case .info:
return 0
case .chapters:
return 1
case .comments:
return 2
case .related:
return 3
case .queue:
return 4
}
}
}
var sidebarQueue: Bool
var fullScreen: Bool
2021-08-25 22:12:59 +00:00
@State private var subscribed = false
2022-03-26 18:01:38 +00:00
@State private var subscriptionToggleButtonDisabled = false
2021-08-25 22:12:59 +00:00
@StateObject private var page: Page = .first()
2021-12-17 20:01:05 +00:00
@Environment(\.navigationStyle) private var navigationStyle
2021-10-20 22:21:50 +00:00
@EnvironmentObject<AccountsModel> private var accounts
@EnvironmentObject<CommentsModel> private var comments
2021-12-17 20:01:05 +00:00
@EnvironmentObject<NavigationModel> private var navigation
@EnvironmentObject<PlayerModel> private var player
2021-12-17 20:01:05 +00:00
@EnvironmentObject<RecentsModel> private var recents
@EnvironmentObject<SubscriptionsModel> private var subscriptions
2021-11-03 23:14:09 +00:00
@Default(.showKeywords) private var showKeywords
@Default(.playerDetailsPageButtonLabelStyle) private var playerDetailsPageButtonLabelStyle
@Default(.controlsBarInPlayer) private var controlsBarInPlayer
2021-11-03 23:14:09 +00:00
var currentPage: DetailsPage {
DetailsPage.allCases.first { $0.index == page.index } ?? .info
}
var video: Video? {
player.currentVideo
}
2021-08-22 19:13:33 +00:00
func pageButton(
_ label: String,
_ symbolName: String,
_ destination: DetailsPage,
pageChangeAction: (() -> Void)? = nil
) -> some View {
Button(action: {
page.update(.new(index: destination.index))
pageChangeAction?()
}) {
HStack {
Spacer()
2021-08-25 22:12:59 +00:00
HStack(spacing: 4) {
Image(systemName: symbolName)
2021-08-22 19:13:33 +00:00
if playerDetailsPageButtonLabelStyle.text {
Text(label)
2021-08-25 22:12:59 +00:00
}
}
.frame(minHeight: 15)
.lineLimit(1)
.padding(.vertical, 4)
.foregroundColor(currentPage == destination ? .white : .accentColor)
Spacer()
}
.contentShape(Rectangle())
}
.background(currentPage == destination ? Color.accentColor : .clear)
.buttonStyle(.plain)
.font(.system(size: 10).bold())
.overlay(
RoundedRectangle(cornerRadius: 2)
.stroke(Color.accentColor, lineWidth: 2)
.foregroundColor(.clear)
)
.frame(maxWidth: .infinity)
}
2021-08-22 19:13:33 +00:00
@ViewBuilder func detailsByPage(_ page: DetailsPage) -> some View {
Group {
switch page {
2021-12-04 19:35:41 +00:00
case .info:
2022-03-19 23:05:09 +00:00
ScrollView(.vertical, showsIndicators: false) {
detailsPage
}
case .chapters:
ChaptersView()
.edgesIgnoringSafeArea(.horizontal)
case .queue:
PlayerQueueView(sidebarQueue: sidebarQueue, fullScreen: fullScreen)
.edgesIgnoringSafeArea(.horizontal)
2021-11-02 23:02:02 +00:00
case .related:
2021-11-03 23:00:17 +00:00
RelatedView()
.edgesIgnoringSafeArea(.horizontal)
2021-12-04 19:35:41 +00:00
case .comments:
2022-01-05 17:51:19 +00:00
CommentsView(embedInScrollView: true)
2021-12-04 19:35:41 +00:00
.edgesIgnoringSafeArea(.horizontal)
}
}
.contentShape(Rectangle())
}
var body: some View {
VStack(alignment: .leading) {
Group {
// Group {
// subscriptionsSection
// .border(.red, width: 4)
//
// .onChange(of: video) { video in
// if let video = video {
// subscribed = subscriptions.isSubscribing(video.channel.id)
// }
// }
// }
// .padding(.top, 4)
// .padding(.horizontal)
HStack(spacing: 4) {
pageButton("Info", "info.circle", .info)
pageButton("Chapters", "bookmark", .chapters)
pageButton("Comments", "text.bubble", .comments) { comments.load() }
pageButton("Related", "rectangle.stack.fill", .related)
pageButton("Queue", "list.number", .queue)
}
.onChange(of: player.currentItem) { _ in
page.update(.moveToFirst)
}
.padding(.horizontal)
.padding(.top, 8)
}
.contentShape(Rectangle())
Pager(page: page, data: DetailsPage.allCases, id: \.self) {
detailsByPage($0)
}
.onPageWillChange { pageIndex in
if pageIndex == DetailsPage.comments.index {
comments.load()
} else {
print("comments not loading")
}
}
}
.onAppear {
2021-11-05 19:57:22 +00:00
if video.isNil && !sidebarQueue {
page.update(.new(index: DetailsPage.queue.index))
2021-11-03 23:00:17 +00:00
}
2021-10-20 22:21:50 +00:00
guard video != nil, accounts.app.supportsSubscriptions else {
subscribed = false
return
}
}
.onChange(of: sidebarQueue) { queue in
2021-11-03 23:00:17 +00:00
if queue {
if currentPage == .related || currentPage == .queue {
page.update(.moveToFirst)
}
2021-11-03 23:00:17 +00:00
} else if video.isNil {
page.update(.moveToLast)
2021-11-03 23:00:17 +00:00
}
}
.edgesIgnoringSafeArea(.horizontal)
2022-01-05 17:51:19 +00:00
.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: .topLeading)
}
var showAddToPlaylistButton: Bool {
accounts.app.supportsUserPlaylists && accounts.signedIn
}
var subscriptionsSection: some View {
Group {
if let video = video {
HStack(alignment: .center) {
2021-12-17 20:01:05 +00:00
HStack(spacing: 10) {
Group {
// ZStack(alignment: .bottomTrailing) {
// authorAvatar
//
// if subscribed {
// Image(systemName: "star.circle.fill")
// .background(Color.background)
// .clipShape(Circle())
// .foregroundColor(.secondary)
// }
// }
// VStack(alignment: .leading, spacing: 4) {
// Text(video.title)
// .font(.system(size: 11))
// .fontWeight(.bold)
//
// HStack(spacing: 4) {
// Text(video.channel.name)
//
// if let subscribers = video.channel.subscriptionsString {
// Text("")
// .foregroundColor(.secondary)
// .opacity(0.3)
//
// Text("\(subscribers) subscribers")
// }
// }
// .foregroundColor(.secondary)
// .font(.caption2)
// }
2021-12-17 20:01:05 +00:00
}
}
.contentShape(RoundedRectangle(cornerRadius: 12))
.contextMenu {
if let video = video {
Button(action: {
NavigationModel.openChannel(
video.channel,
player: player,
recents: recents,
2022-06-24 22:48:57 +00:00
navigation: navigation
2021-12-17 20:01:05 +00:00
)
}) {
Label("\(video.channel.name) Channel", systemImage: "rectangle.stack.fill.badge.person.crop")
}
}
}
2021-08-25 22:12:59 +00:00
}
}
}
}
2021-08-25 22:12:59 +00:00
var publishedDateSection: some View {
Group {
if let video = player.currentVideo {
HStack(spacing: 4) {
if let published = video.publishedDate {
Text(published)
}
2021-08-22 19:13:33 +00:00
}
}
}
}
2021-08-22 19:13:33 +00:00
2021-10-26 22:59:59 +00:00
private var contentItem: ContentItem {
ContentItem(video: player.currentVideo!)
}
2021-08-25 22:12:59 +00:00
2021-12-17 20:01:05 +00:00
private var authorAvatar: some View {
Group {
if let video = video, let url = video.channel.thumbnailURL {
WebImage(url: url)
.resizable()
.placeholder {
Rectangle().fill(Color("PlaceholderColor"))
}
2021-12-24 19:21:11 +00:00
.retryOnAppear(true)
2021-12-17 20:01:05 +00:00
.indicator(.activity)
.clipShape(Circle())
.frame(width: 35, height: 35, alignment: .leading)
2021-12-17 20:01:05 +00:00
}
}
}
var videoProperties: some View {
HStack(spacing: 2) {
publishedDateSection
Spacer()
HStack(spacing: 4) {
if let views = video?.viewsCount {
Image(systemName: "eye")
Text(views)
}
if let likes = video?.likesCount {
Image(systemName: "hand.thumbsup")
Text(likes)
}
if let likes = video?.dislikesCount {
Image(systemName: "hand.thumbsdown")
Text(likes)
}
}
}
.font(.system(size: 12))
.foregroundColor(.secondary)
}
var detailsPage: some View {
Group {
2022-05-29 13:35:16 +00:00
VStack(alignment: .leading, spacing: 0) {
if let video = player.currentVideo {
2022-01-05 17:51:19 +00:00
VStack(spacing: 6) {
videoProperties
2021-08-22 19:13:33 +00:00
2022-01-05 17:51:19 +00:00
Divider()
}
2022-05-29 13:35:16 +00:00
.padding(.bottom, 6)
2021-08-22 19:13:33 +00:00
VStack(alignment: .leading, spacing: 10) {
if !player.videoBeingOpened.isNil && (video.description.isNil || video.description!.isEmpty) {
VStack(alignment: .leading, spacing: 0) {
ForEach(1 ... Int.random(in: 3 ... 5), id: \.self) { _ in
Text(String(repeating: Video.fixture.description!, count: Int.random(in: 1 ... 4)))
.redacted(reason: .placeholder)
}
}
} else if let description = video.description {
Group {
if #available(iOS 15.0, macOS 12.0, tvOS 15.0, *) {
Text(description)
.textSelection(.enabled)
} else {
Text(description)
}
2021-11-28 14:37:55 +00:00
}
.frame(maxWidth: .infinity, alignment: .leading)
.font(.system(size: 14))
.lineSpacing(3)
} else {
Text("No description")
.foregroundColor(.secondary)
2021-11-28 14:37:55 +00:00
}
2021-08-22 19:13:33 +00:00
if showKeywords {
ScrollView(.horizontal, showsIndicators: showScrollIndicators) {
HStack {
ForEach(video.keywords, id: \.self) { keyword in
HStack(alignment: .center, spacing: 0) {
Text("#")
.font(.system(size: 11).bold())
Text(keyword)
.frame(maxWidth: 500)
}
.font(.caption)
.foregroundColor(.white)
.padding(.vertical, 4)
.padding(.horizontal, 8)
2021-12-29 18:40:25 +00:00
.background(Color("KeywordBackgroundColor"))
.mask(RoundedRectangle(cornerRadius: 3))
2021-11-03 23:14:09 +00:00
}
}
.padding(.bottom, 10)
}
}
2021-08-22 19:13:33 +00:00
}
}
if !video.isNil, CommentsModel.placement == .info {
Divider()
#if os(macOS)
.padding(.bottom, 20)
#else
.padding(.vertical, 10)
#endif
}
}
.padding(.horizontal)
2022-01-05 17:51:19 +00:00
LazyVStack {
if !video.isNil, CommentsModel.placement == .info {
CommentsView()
}
2021-08-22 19:13:33 +00:00
}
}
2021-08-25 22:12:59 +00:00
}
func videoDetail(label: String, value: String, symbol: String) -> some View {
VStack(spacing: 4) {
HStack(spacing: 2) {
Image(systemName: symbol)
Text(label.uppercased())
}
.font(.system(size: 9))
.opacity(0.6)
Text(value)
}
.frame(maxWidth: 100)
2021-08-22 19:13:33 +00:00
}
var showScrollIndicators: Bool {
#if os(macOS)
false
#else
true
#endif
}
}
2021-08-25 22:12:59 +00:00
struct VideoDetails_Previews: PreviewProvider {
static var previews: some View {
VideoDetails(sidebarQueue: true, fullScreen: false)
2021-09-29 11:45:00 +00:00
.injectFixtureEnvironmentObjects()
2021-08-22 19:13:33 +00:00
}
}