yattee/Shared/Videos/VideoBanner.swift

import CoreMedia
import Foundation
import SDWebImageSwiftUI
import SwiftUI

struct VideoBanner: View {
    let video: Video?
    var playbackTime: CMTime?
    var videoDuration: TimeInterval?

    init(video: Video? = nil, playbackTime: CMTime? = nil, videoDuration: TimeInterval? = nil) {
        self.video = video
        self.playbackTime = playbackTime
        self.videoDuration = videoDuration
    }

    var body: some View {
        HStack(alignment: stackAlignment, spacing: 12) {
            VStack(spacing: thumbnailStackSpacing) {
                smallThumbnail

                #if !os(tvOS)
                    progressView
                #endif
            }
            VStack(alignment: .leading, spacing: 4) {
                Group {
                    if let video {
                        HStack(alignment: .top) {
                            Text(video.displayTitle + "\n")
                            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)

                HStack {
                    Group {
                        if let video {
                            if !video.isLocal || video.localStreamIsRemoteURL {
                                Text(video.displayAuthor)
                            }
                        } else {
                            Text("Video Author")
                                .redacted(reason: .placeholder)
                        }
                    }
                    .lineLimit(1)

                    Spacer()

                    #if os(tvOS)
                        progressView
                    #endif

                    Text((videoDuration ?? video?.length ?? 0).formattedAsPlaybackTime() ?? PlayerTimeModel.timePlaceholder)
                        .fontWeight(.light)
                }
                .foregroundColor(.secondary)
            }
            .padding(.vertical, playbackTime.isNil ? 0 : 5)
        }
        .contentShape(Rectangle())
        #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
    }

    private var stackAlignment: VerticalAlignment {
        #if os(macOS)
            playbackTime.isNil ? .center : .top
        #else
                .center
        #endif
    }

    private var thumbnailStackSpacing: Double {
        #if os(tvOS)
            8
        #else
            2
        #endif
    }

    @ViewBuilder private var smallThumbnail: some View {
        Group {
            if let video {
                if let thumbnail = video.thumbnailURL(quality: .medium) {
                    WebImage(url: thumbnail, options: [.lowPriority])
                        .resizable()
                } else if video.localStreamIsFile {
                    Image(systemName: "folder")
                } else if video.localStreamIsRemoteURL {
                    Image(systemName: "globe")
                }
            } else {
                Image(systemName: "ellipsis")
            }
        }
        #if os(tvOS)
        .frame(width: thumbnailWidth, height: thumbnailHeight)
        .mask(RoundedRectangle(cornerRadius: 12))
        #else
        .frame(width: thumbnailWidth, height: thumbnailHeight)
        .mask(RoundedRectangle(cornerRadius: 6))
        #endif
    }

    private var thumbnailWidth: Double {
        #if os(tvOS)
            250
        #else
            100
        #endif
    }

    private var thumbnailHeight: Double {
        #if os(tvOS)
            140
        #else
            60
        #endif
    }

    private var progressView: some View {
        Group {
            if !playbackTime.isNil, !(video?.live ?? false) {
                ProgressView(value: progressViewValue, total: progressViewTotal)
                    .progressViewStyle(.linear)
                    .frame(maxWidth: thumbnailWidth)
            }
        }
    }

    private var progressViewValue: Double {
        [playbackTime?.seconds, videoDuration].compactMap { $0 }.min() ?? 0
    }

    private var progressViewTotal: Double {
        videoDuration ?? video?.length ?? 1
    }
}

struct VideoBanner_Previews: PreviewProvider {
    static var previews: some View {
        VStack(spacing: 20) {
            VideoBanner(video: Video.fixture, playbackTime: CMTime(seconds: 400, preferredTimescale: 10000))
            VideoBanner(video: Video.fixtureUpcomingWithoutPublishedOrViews)
            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()
        }
        .frame(maxWidth: 900)
    }
}