2021-10-22 20:49:31 +00:00
|
|
|
import CoreMedia
|
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-11-12 01:39:44 +00:00
|
|
|
#if os(tvOS)
|
|
|
|
static let titleAppend = ""
|
|
|
|
#else
|
|
|
|
static let titleAppend = "\n"
|
|
|
|
#endif
|
|
|
|
|
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?
|
|
|
|
|
2021-10-24 18:01:08 +00:00
|
|
|
init(video: Video? = nil, playbackTime: CMTime? = nil, videoDuration: TimeInterval? = nil) {
|
2021-10-22 20:49:31 +00:00
|
|
|
self.video = video
|
|
|
|
self.playbackTime = playbackTime
|
|
|
|
self.videoDuration = videoDuration
|
|
|
|
}
|
2021-10-05 20:20:09 +00:00
|
|
|
|
|
|
|
var body: some View {
|
2021-10-23 10:13:05 +00:00
|
|
|
HStack(alignment: stackAlignment, spacing: 12) {
|
2022-11-13 11:16:44 +00:00
|
|
|
VStack(spacing: thumbnailStackSpacing) {
|
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
|
2021-10-22 20:49:31 +00:00
|
|
|
}
|
2021-10-05 20:20:09 +00:00
|
|
|
VStack(alignment: .leading, spacing: 4) {
|
2022-11-10 17:11:28 +00:00
|
|
|
Group {
|
|
|
|
if let video {
|
|
|
|
HStack(alignment: .top) {
|
2022-11-12 01:39:44 +00:00
|
|
|
Text(video.displayTitle + Self.titleAppend)
|
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)
|
|
|
|
.lineLimit(2)
|
|
|
|
.font(.headline)
|
|
|
|
.frame(alignment: .leading)
|
2021-10-05 20:20:09 +00:00
|
|
|
|
|
|
|
HStack {
|
2022-11-10 17:11:28 +00:00
|
|
|
Group {
|
|
|
|
if let video {
|
|
|
|
if !video.isLocal || video.localStreamIsRemoteURL {
|
|
|
|
Text(video.displayAuthor)
|
2022-11-12 23:01:04 +00:00
|
|
|
} 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)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
#endif
|
2022-11-10 17:11:28 +00:00
|
|
|
}
|
|
|
|
} else {
|
|
|
|
Text("Video Author")
|
|
|
|
.redacted(reason: .placeholder)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.lineLimit(1)
|
2021-10-05 20:20:09 +00:00
|
|
|
|
|
|
|
Spacer()
|
|
|
|
|
2021-10-23 10:13:05 +00:00
|
|
|
#if os(tvOS)
|
|
|
|
progressView
|
|
|
|
#endif
|
|
|
|
|
2022-11-12 23:01:04 +00:00
|
|
|
if !(video?.localStreamIsDirectory ?? false) {
|
|
|
|
Text(videoDurationLabel)
|
|
|
|
.fontWeight(.light)
|
|
|
|
}
|
2021-10-05 20:20:09 +00:00
|
|
|
}
|
|
|
|
.foregroundColor(.secondary)
|
|
|
|
}
|
2021-10-22 20:49:31 +00:00
|
|
|
.padding(.vertical, playbackTime.isNil ? 0 : 5)
|
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
|
|
|
|
.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: 100, alignment: .center)
|
|
|
|
#if os(tvOS)
|
|
|
|
.padding(.vertical, 20)
|
|
|
|
.padding(.trailing, 10)
|
|
|
|
#endif
|
2021-10-05 20:20:09 +00:00
|
|
|
}
|
|
|
|
|
2021-10-23 10:13:05 +00:00
|
|
|
private var stackAlignment: VerticalAlignment {
|
|
|
|
#if os(macOS)
|
|
|
|
playbackTime.isNil ? .center : .top
|
|
|
|
#else
|
2021-11-08 16:29:35 +00:00
|
|
|
.center
|
2021-10-23 10:13:05 +00:00
|
|
|
#endif
|
|
|
|
}
|
|
|
|
|
2022-11-13 11:16:44 +00:00
|
|
|
private var thumbnailStackSpacing: Double {
|
|
|
|
#if os(tvOS)
|
|
|
|
8
|
|
|
|
#else
|
|
|
|
2
|
|
|
|
#endif
|
|
|
|
}
|
|
|
|
|
2022-08-31 19:24:46 +00:00
|
|
|
@ViewBuilder private var smallThumbnail: some View {
|
2022-11-12 23:01:04 +00:00
|
|
|
ZStack {
|
|
|
|
Color("PlaceholderColor")
|
2022-11-10 17:11:28 +00:00
|
|
|
if let video {
|
|
|
|
if let thumbnail = video.thumbnailURL(quality: .medium) {
|
2022-11-10 18:11:19 +00:00
|
|
|
WebImage(url: thumbnail, options: [.lowPriority])
|
2022-11-10 17:11:28 +00:00
|
|
|
.resizable()
|
2022-11-12 23:01:04 +00:00
|
|
|
} else if video.isLocal {
|
|
|
|
Image(systemName: video.localStreamImageSystemName)
|
2022-11-10 17:11:28 +00:00
|
|
|
}
|
|
|
|
} else {
|
|
|
|
Image(systemName: "ellipsis")
|
2021-10-05 20:20:09 +00:00
|
|
|
}
|
2022-11-10 17:11:28 +00:00
|
|
|
}
|
2022-09-11 19:33:08 +00:00
|
|
|
#if os(tvOS)
|
2022-11-10 17:11:28 +00:00
|
|
|
.frame(width: thumbnailWidth, height: thumbnailHeight)
|
|
|
|
.mask(RoundedRectangle(cornerRadius: 12))
|
2022-09-11 19:33:08 +00:00
|
|
|
#else
|
2022-11-10 17:11:28 +00:00
|
|
|
.frame(width: thumbnailWidth, height: thumbnailHeight)
|
|
|
|
.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
|
|
|
|
|
|
|
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
|
2021-10-23 10:13:05 +00:00
|
|
|
100
|
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
|
|
|
|
60
|
|
|
|
#endif
|
|
|
|
}
|
|
|
|
|
2022-11-12 23:01:04 +00:00
|
|
|
private var videoDurationLabel: String {
|
|
|
|
guard videoDuration != 0 else { return PlayerTimeModel.timePlaceholder }
|
|
|
|
return (videoDuration ?? video?.length ?? 0).formattedAsPlaybackTime() ?? PlayerTimeModel.timePlaceholder
|
|
|
|
}
|
|
|
|
|
2021-10-23 10:13:05 +00:00
|
|
|
private var progressView: some View {
|
|
|
|
Group {
|
2021-12-26 21:14:46 +00:00
|
|
|
if !playbackTime.isNil, !(video?.live ?? false) {
|
2021-10-23 10:13:05 +00:00
|
|
|
ProgressView(value: progressViewValue, total: progressViewTotal)
|
|
|
|
.progressViewStyle(.linear)
|
|
|
|
.frame(maxWidth: thumbnailWidth)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
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
|
|
|
}
|
2021-10-05 20:20:09 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
struct VideoBanner_Previews: PreviewProvider {
|
|
|
|
static var previews: some View {
|
|
|
|
VStack(spacing: 20) {
|
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
|
|
|
}
|
|
|
|
.frame(maxWidth: 900)
|
|
|
|
}
|
|
|
|
}
|