2021-10-22 20:49:31 +00:00
|
|
|
import CoreMedia
|
2022-11-19 13:11:04 +00:00
|
|
|
import Defaults
|
2021-10-05 20:20:09 +00:00
|
|
|
import Foundation
|
2021-10-21 23:29:10 +00:00
|
|
|
import SDWebImageSwiftUI
|
2021-10-05 20:20:09 +00:00
|
|
|
import SwiftUI
|
|
|
|
|
|
|
|
struct VideoBanner: View {
|
2022-12-13 00:50:26 +00:00
|
|
|
var id: String?
|
2021-10-24 18:01:08 +00:00
|
|
|
let video: Video?
|
2021-10-22 20:49:31 +00:00
|
|
|
var playbackTime: CMTime?
|
|
|
|
var videoDuration: TimeInterval?
|
2022-12-13 00:50:26 +00:00
|
|
|
var watch: Watch?
|
2021-10-22 20:49:31 +00:00
|
|
|
|
2022-12-13 00:50:26 +00:00
|
|
|
@Default(.saveHistory) private var saveHistory
|
|
|
|
@Default(.watchedVideoStyle) private var watchedVideoStyle
|
|
|
|
@Default(.watchedVideoBadgeColor) private var watchedVideoBadgeColor
|
2022-12-13 20:56:03 +00:00
|
|
|
@Default(.timeOnThumbnail) private var timeOnThumbnail
|
2022-12-13 00:50:26 +00:00
|
|
|
|
|
|
|
@Environment(\.inChannelView) private var inChannelView
|
|
|
|
@Environment(\.inNavigationView) private var inNavigationView
|
|
|
|
@Environment(\.navigationStyle) private var navigationStyle
|
|
|
|
|
|
|
|
init(
|
|
|
|
id: String? = nil,
|
|
|
|
video: Video? = nil,
|
|
|
|
playbackTime: CMTime? = nil,
|
|
|
|
videoDuration: TimeInterval? = nil,
|
|
|
|
watch: Watch? = nil
|
|
|
|
) {
|
|
|
|
self.id = id
|
2021-10-22 20:49:31 +00:00
|
|
|
self.video = video
|
|
|
|
self.playbackTime = playbackTime
|
|
|
|
self.videoDuration = videoDuration
|
2022-12-13 00:50:26 +00:00
|
|
|
self.watch = watch
|
2021-10-22 20:49:31 +00:00
|
|
|
}
|
2021-10-05 20:20:09 +00:00
|
|
|
|
|
|
|
var body: some View {
|
2022-12-12 18:46:31 +00:00
|
|
|
HStack(alignment: .top, spacing: 12) {
|
2022-12-13 20:56:03 +00:00
|
|
|
VStack(alignment: .trailing, spacing: 2) {
|
2021-10-22 20:49:31 +00:00
|
|
|
smallThumbnail
|
2021-10-20 22:21:50 +00:00
|
|
|
|
2021-10-23 10:13:05 +00:00
|
|
|
#if !os(tvOS)
|
|
|
|
progressView
|
|
|
|
#endif
|
2022-12-13 20:56:03 +00:00
|
|
|
|
|
|
|
if !timeOnThumbnail, let timeLabel {
|
|
|
|
Text(timeLabel)
|
|
|
|
.font(.caption.monospacedDigit())
|
|
|
|
.foregroundColor(.secondary)
|
|
|
|
}
|
2021-10-22 20:49:31 +00:00
|
|
|
}
|
2022-12-13 20:56:03 +00:00
|
|
|
|
2022-12-13 00:50:26 +00:00
|
|
|
VStack(alignment: .leading, spacing: 2) {
|
2022-11-10 17:11:28 +00:00
|
|
|
Group {
|
|
|
|
if let video {
|
|
|
|
HStack(alignment: .top) {
|
2022-12-12 18:46:31 +00:00
|
|
|
Text(video.displayTitle)
|
2022-11-10 17:11:28 +00:00
|
|
|
if video.isLocal, let fileExtension = video.localStreamFileExtension {
|
|
|
|
Spacer()
|
|
|
|
Text(fileExtension)
|
|
|
|
.foregroundColor(.secondary)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
Text("Loading contents of the video, please wait")
|
|
|
|
.redacted(reason: .placeholder)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.truncationMode(.middle)
|
2022-12-12 18:46:31 +00:00
|
|
|
.lineLimit(5)
|
2022-11-10 17:11:28 +00:00
|
|
|
.font(.headline)
|
2021-10-05 20:20:09 +00:00
|
|
|
|
2022-12-13 00:50:26 +00:00
|
|
|
Spacer()
|
|
|
|
|
|
|
|
HStack {
|
2022-12-13 20:56:03 +00:00
|
|
|
HStack {
|
2022-12-13 23:07:32 +00:00
|
|
|
if !inChannelView,
|
|
|
|
let video,
|
|
|
|
let url = video.channel.thumbnailURLOrCached
|
|
|
|
{
|
|
|
|
ThumbnailView(url: url)
|
2022-12-13 20:56:03 +00:00
|
|
|
.frame(width: 30, height: 30)
|
|
|
|
.clipShape(Circle())
|
|
|
|
}
|
|
|
|
|
|
|
|
VStack(alignment: .leading) {
|
|
|
|
Group {
|
|
|
|
if let video {
|
|
|
|
if !inChannelView, !video.isLocal || video.localStreamIsRemoteURL {
|
|
|
|
channelControl
|
|
|
|
.font(.subheadline)
|
|
|
|
} else {
|
|
|
|
#if os(iOS)
|
|
|
|
if DocumentsModel.shared.isDocument(video) {
|
|
|
|
HStack(spacing: 6) {
|
|
|
|
if let date = DocumentsModel.shared.formattedCreationDate(video) {
|
|
|
|
Text(date)
|
|
|
|
}
|
|
|
|
if let size = DocumentsModel.shared.formattedSize(video) {
|
|
|
|
Text("•")
|
|
|
|
Text(size)
|
|
|
|
}
|
2022-11-19 14:09:09 +00:00
|
|
|
|
2022-12-13 20:56:03 +00:00
|
|
|
Spacer()
|
|
|
|
}
|
|
|
|
.frame(maxWidth: .infinity)
|
|
|
|
}
|
|
|
|
#endif
|
2022-11-12 23:01:04 +00:00
|
|
|
}
|
2022-12-13 20:56:03 +00:00
|
|
|
} else {
|
|
|
|
Text("Video Author")
|
|
|
|
.redacted(reason: .placeholder)
|
|
|
|
}
|
2022-11-10 17:11:28 +00:00
|
|
|
}
|
2022-12-13 20:56:03 +00:00
|
|
|
|
|
|
|
extraAttributes
|
2022-11-10 17:11:28 +00:00
|
|
|
}
|
|
|
|
}
|
2022-12-13 20:56:03 +00:00
|
|
|
.foregroundColor(.secondary)
|
2022-12-13 00:50:26 +00:00
|
|
|
}
|
2021-10-05 20:20:09 +00:00
|
|
|
}
|
2022-12-13 00:50:26 +00:00
|
|
|
.frame(maxWidth: .infinity, alignment: .leading)
|
|
|
|
.frame(maxHeight: .infinity)
|
|
|
|
#if os(tvOS)
|
|
|
|
.padding(.vertical)
|
|
|
|
#endif
|
2021-10-05 20:20:09 +00:00
|
|
|
}
|
2022-12-13 00:50:26 +00:00
|
|
|
.fixedSize(horizontal: false, vertical: true)
|
2021-10-05 20:20:09 +00:00
|
|
|
.contentShape(Rectangle())
|
2022-11-10 21:51:30 +00:00
|
|
|
#if os(tvOS)
|
|
|
|
.buttonStyle(.card)
|
|
|
|
#else
|
|
|
|
.buttonStyle(.plain)
|
|
|
|
#endif
|
|
|
|
#if os(tvOS)
|
2022-12-13 00:50:26 +00:00
|
|
|
.padding(.trailing, 10)
|
2022-11-13 11:16:44 +00:00
|
|
|
#endif
|
2022-12-13 00:50:26 +00:00
|
|
|
.opacity(contentOpacity)
|
|
|
|
.id(id ?? video?.videoID ?? video?.id)
|
2022-11-13 11:16:44 +00:00
|
|
|
}
|
|
|
|
|
2022-12-13 09:09:21 +00:00
|
|
|
private var extraAttributes: some View {
|
|
|
|
HStack(spacing: 16) {
|
|
|
|
if let video {
|
|
|
|
if let date = video.publishedDate {
|
|
|
|
HStack(spacing: 2) {
|
|
|
|
Text(date)
|
|
|
|
.allowsTightening(true)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
if video.views > 0 {
|
|
|
|
HStack(spacing: 2) {
|
|
|
|
Image(systemName: "eye")
|
|
|
|
Text(video.viewsCount!)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.font(.caption)
|
|
|
|
.lineLimit(1)
|
|
|
|
.foregroundColor(.secondary)
|
|
|
|
}
|
|
|
|
|
2022-08-31 19:24:46 +00:00
|
|
|
@ViewBuilder private var smallThumbnail: some View {
|
2022-12-13 20:56:03 +00:00
|
|
|
ZStack(alignment: .bottomTrailing) {
|
|
|
|
ZStack(alignment: .bottomLeading) {
|
|
|
|
ZStack {
|
|
|
|
Color("PlaceholderColor")
|
|
|
|
|
|
|
|
if let video {
|
|
|
|
if let thumbnail = video.thumbnailURL(quality: .medium) {
|
|
|
|
ThumbnailView(url: thumbnail)
|
|
|
|
} else if video.isLocal {
|
|
|
|
Image(systemName: video.localStreamImageSystemName)
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
Image(systemName: "ellipsis")
|
2022-12-13 00:50:26 +00:00
|
|
|
}
|
2022-12-13 20:56:03 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
if saveHistory,
|
|
|
|
watchedVideoStyle.isShowingBadge,
|
|
|
|
watch?.finished ?? false
|
|
|
|
{
|
|
|
|
Image(systemName: "checkmark.circle.fill")
|
|
|
|
.foregroundColor(Color(
|
|
|
|
watchedVideoBadgeColor == .colorSchemeBased ? "WatchProgressBarColor" :
|
|
|
|
watchedVideoBadgeColor == .red ? "AppRedColor" : "AppBlueColor"
|
|
|
|
))
|
|
|
|
.background(Color.white)
|
|
|
|
.clipShape(Circle())
|
|
|
|
.imageScale(.medium)
|
|
|
|
.offset(x: 5, y: -5)
|
2022-11-10 17:11:28 +00:00
|
|
|
}
|
2022-12-13 00:50:26 +00:00
|
|
|
}
|
|
|
|
|
2022-12-13 20:56:03 +00:00
|
|
|
if timeOnThumbnail {
|
|
|
|
timeView
|
2021-10-05 20:20:09 +00:00
|
|
|
}
|
2022-11-10 17:11:28 +00:00
|
|
|
}
|
|
|
|
.frame(width: thumbnailWidth, height: thumbnailHeight)
|
2022-12-13 20:56:03 +00:00
|
|
|
#if os(tvOS)
|
|
|
|
.mask(RoundedRectangle(cornerRadius: 12))
|
2022-09-11 19:33:08 +00:00
|
|
|
#else
|
2022-12-13 20:56:03 +00:00
|
|
|
.mask(RoundedRectangle(cornerRadius: 6))
|
2022-09-11 19:33:08 +00:00
|
|
|
#endif
|
2021-10-05 20:20:09 +00:00
|
|
|
}
|
2021-10-22 20:49:31 +00:00
|
|
|
|
2022-12-13 00:50:26 +00:00
|
|
|
private var contentOpacity: Double {
|
|
|
|
guard saveHistory,
|
|
|
|
!watch.isNil,
|
|
|
|
watchedVideoStyle == .decreasedOpacity || watchedVideoStyle == .both
|
|
|
|
else {
|
|
|
|
return 1
|
|
|
|
}
|
|
|
|
|
|
|
|
return watch!.finished ? 0.5 : 1
|
|
|
|
}
|
|
|
|
|
2021-10-22 20:49:31 +00:00
|
|
|
private var thumbnailWidth: Double {
|
|
|
|
#if os(tvOS)
|
2021-11-04 23:25:51 +00:00
|
|
|
250
|
2021-10-22 20:49:31 +00:00
|
|
|
#else
|
2022-12-13 20:56:03 +00:00
|
|
|
120
|
2021-10-22 20:49:31 +00:00
|
|
|
#endif
|
|
|
|
}
|
|
|
|
|
2022-11-10 17:11:28 +00:00
|
|
|
private var thumbnailHeight: Double {
|
|
|
|
#if os(tvOS)
|
|
|
|
140
|
|
|
|
#else
|
2022-12-13 20:56:03 +00:00
|
|
|
72
|
2022-11-10 17:11:28 +00:00
|
|
|
#endif
|
|
|
|
}
|
|
|
|
|
2022-12-13 00:50:26 +00:00
|
|
|
private var videoDurationLabel: String? {
|
|
|
|
guard videoDuration != 0 else { return nil }
|
|
|
|
return (videoDuration ?? video?.length)?.formattedAsPlaybackTime()
|
2022-11-12 23:01:04 +00:00
|
|
|
}
|
|
|
|
|
2022-12-13 00:50:26 +00:00
|
|
|
private var watchStoppedAtLabel: String? {
|
|
|
|
guard let watch else { return nil }
|
|
|
|
|
|
|
|
return watch.stoppedAt.formattedAsPlaybackTime(allowZero: true)
|
|
|
|
}
|
|
|
|
|
|
|
|
var timeInfo: Bool {
|
|
|
|
videoDurationLabel != nil && (video == nil || !video!.localStreamIsDirectory)
|
|
|
|
}
|
|
|
|
|
2022-12-13 20:56:03 +00:00
|
|
|
private var timeLabel: String? {
|
|
|
|
if let watch, let watchStoppedAtLabel, let videoDurationLabel, !watch.finished {
|
|
|
|
return "\(watchStoppedAtLabel) / \(videoDurationLabel)"
|
|
|
|
} else if let videoDurationLabel {
|
|
|
|
return videoDurationLabel
|
|
|
|
} else {
|
|
|
|
return nil
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@ViewBuilder private var timeView: some View {
|
|
|
|
if let timeLabel {
|
|
|
|
Text(timeLabel)
|
|
|
|
.font(.caption2.weight(.semibold).monospacedDigit())
|
|
|
|
.allowsTightening(true)
|
|
|
|
.padding(2)
|
|
|
|
.modifier(ControlBackgroundModifier())
|
2021-10-23 10:13:05 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-12-13 00:50:26 +00:00
|
|
|
private var progressView: some View {
|
|
|
|
ProgressView(value: watchValue, total: progressViewTotal)
|
|
|
|
.progressViewStyle(.linear)
|
|
|
|
.frame(maxWidth: thumbnailWidth)
|
|
|
|
.opacity(showProgressView ? 1 : 0)
|
|
|
|
.frame(height: 12)
|
|
|
|
}
|
|
|
|
|
|
|
|
private var showProgressView: Bool {
|
|
|
|
guard playbackTime != nil,
|
|
|
|
let video,
|
|
|
|
!video.live
|
|
|
|
else {
|
|
|
|
return false
|
|
|
|
}
|
|
|
|
|
|
|
|
return true
|
|
|
|
}
|
|
|
|
|
2022-11-19 13:11:04 +00:00
|
|
|
private var watchValue: Double {
|
|
|
|
if finished { return progressViewTotal }
|
|
|
|
|
|
|
|
return progressViewValue
|
|
|
|
}
|
|
|
|
|
2021-10-22 20:49:31 +00:00
|
|
|
private var progressViewValue: Double {
|
2022-11-12 23:01:04 +00:00
|
|
|
guard videoDuration != 0 else { return 1 }
|
|
|
|
return [playbackTime?.seconds, videoDuration].compactMap { $0 }.min() ?? 0
|
2021-10-22 20:49:31 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
private var progressViewTotal: Double {
|
2022-11-12 23:01:04 +00:00
|
|
|
guard videoDuration != 0 else { return 1 }
|
|
|
|
return videoDuration ?? video?.length ?? 1
|
2021-10-22 20:49:31 +00:00
|
|
|
}
|
2022-11-19 13:11:04 +00:00
|
|
|
|
|
|
|
private var finished: Bool {
|
|
|
|
(progressViewValue / progressViewTotal) * 100 > Double(Defaults[.watchedThreshold])
|
|
|
|
}
|
2022-12-13 00:50:26 +00:00
|
|
|
|
|
|
|
@ViewBuilder private var channelControl: some View {
|
|
|
|
if let video, !video.displayAuthor.isEmpty {
|
|
|
|
#if os(tvOS)
|
|
|
|
displayAuthor
|
|
|
|
#else
|
|
|
|
if navigationStyle == .tab, inNavigationView {
|
|
|
|
channelNavigationLink
|
|
|
|
} else {
|
|
|
|
channelButton
|
|
|
|
}
|
|
|
|
#endif
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@ViewBuilder private var channelNavigationLink: some View {
|
|
|
|
if let channel = video?.channel {
|
|
|
|
NavigationLink(destination: ChannelVideosView(channel: channel)) {
|
|
|
|
displayAuthor
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@ViewBuilder private var channelButton: some View {
|
|
|
|
if let video {
|
|
|
|
Button {
|
|
|
|
guard !inChannelView else { return }
|
|
|
|
|
|
|
|
NavigationModel.shared.openChannel(
|
|
|
|
video.channel,
|
|
|
|
navigationStyle: navigationStyle
|
|
|
|
)
|
|
|
|
} label: {
|
|
|
|
displayAuthor
|
|
|
|
}
|
|
|
|
#if os(tvOS)
|
|
|
|
.buttonStyle(.card)
|
|
|
|
#else
|
|
|
|
.buttonStyle(.plain)
|
|
|
|
#endif
|
|
|
|
.help("\(video.channel.name) Channel")
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@ViewBuilder private var displayAuthor: some View {
|
|
|
|
if let video, !video.displayAuthor.isEmpty {
|
|
|
|
Text(video.displayAuthor)
|
|
|
|
.fontWeight(.semibold)
|
|
|
|
.foregroundColor(.secondary)
|
|
|
|
}
|
|
|
|
}
|
2021-10-05 20:20:09 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
struct VideoBanner_Previews: PreviewProvider {
|
|
|
|
static var previews: some View {
|
2022-12-13 00:50:26 +00:00
|
|
|
VStack(spacing: 2) {
|
2021-10-22 20:49:31 +00:00
|
|
|
VideoBanner(video: Video.fixture, playbackTime: CMTime(seconds: 400, preferredTimescale: 10000))
|
2021-10-05 20:20:09 +00:00
|
|
|
VideoBanner(video: Video.fixtureUpcomingWithoutPublishedOrViews)
|
2022-11-10 17:11:28 +00:00
|
|
|
VideoBanner(video: .local(URL(string: "https://apple.com/a/directory/of/video+that+has+very+long+title+that+will+likely.mp4")!))
|
|
|
|
VideoBanner(video: .local(URL(string: "file://a/b/c/d/e/f.mkv")!))
|
|
|
|
VideoBanner()
|
2021-10-05 20:20:09 +00:00
|
|
|
}
|
2022-12-13 00:50:26 +00:00
|
|
|
.frame(maxWidth: 1300)
|
2021-10-05 20:20:09 +00:00
|
|
|
}
|
|
|
|
}
|