mirror of
https://github.com/yattee/yattee.git
synced 2024-11-12 17:18:22 +00:00
Simplify video list row
This commit is contained in:
parent
ca4378afc1
commit
c5a4efd00f
@ -2,6 +2,7 @@ parent_config: https://raw.githubusercontent.com/sindresorhus/swiftlint-config/m
|
||||
|
||||
disabled_rules:
|
||||
- opening_brace
|
||||
- multiline_arguments
|
||||
|
||||
excluded:
|
||||
- Tests Apple TV
|
||||
|
@ -65,6 +65,7 @@ struct PlayerView: View {
|
||||
}
|
||||
}
|
||||
|
||||
// swiftlint:disable implicit_return
|
||||
#if !os(macOS)
|
||||
var pvc: PlayerViewController? {
|
||||
guard store.item != nil else {
|
||||
@ -74,4 +75,5 @@ struct PlayerView: View {
|
||||
return PlayerViewController(video: store.item!)
|
||||
}
|
||||
#endif
|
||||
// swiftlint:enable implicit_return
|
||||
}
|
||||
|
@ -12,50 +12,20 @@ struct VideoListRowView: View {
|
||||
var video: Video
|
||||
|
||||
var body: some View {
|
||||
#if os(tvOS)
|
||||
#if os(tvOS) || os(macOS)
|
||||
NavigationLink(destination: PlayerView(id: video.id)) {
|
||||
HStack(alignment: .top, spacing: 2) {
|
||||
roundedThumbnail
|
||||
|
||||
HStack {
|
||||
VStack(alignment: .leading, spacing: 0) {
|
||||
videoDetail(video.title, bold: true)
|
||||
videoDetail(video.author, color: .secondary, bold: true)
|
||||
|
||||
Spacer()
|
||||
|
||||
additionalDetails
|
||||
}
|
||||
.padding()
|
||||
|
||||
Spacer()
|
||||
}
|
||||
.frame(minHeight: 180)
|
||||
}
|
||||
}
|
||||
#elseif os(macOS)
|
||||
NavigationLink(destination: PlayerView(id: video.id)) {
|
||||
verticalyAlignedDetails
|
||||
#if os(tvOS)
|
||||
horizontalRow(detailsOnThumbnail: false)
|
||||
#else
|
||||
verticalRow
|
||||
#endif
|
||||
}
|
||||
#else
|
||||
ZStack {
|
||||
if verticalSizeClass == .compact {
|
||||
HStack(alignment: .top) {
|
||||
thumbnailWithDetails
|
||||
.frame(minWidth: 0, maxWidth: 320, minHeight: 0, maxHeight: 180)
|
||||
.padding(4)
|
||||
|
||||
VStack(alignment: .leading) {
|
||||
videoDetail(video.title, bold: true)
|
||||
.frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
|
||||
.padding(.top, 10)
|
||||
|
||||
additionalDetails
|
||||
.padding(.top, 4)
|
||||
}
|
||||
}
|
||||
horizontalRow(padding: 4)
|
||||
} else {
|
||||
verticalyAlignedDetails
|
||||
verticalRow
|
||||
}
|
||||
|
||||
NavigationLink(destination: PlayerView(id: video.id)) {
|
||||
@ -68,6 +38,66 @@ struct VideoListRowView: View {
|
||||
#endif
|
||||
}
|
||||
|
||||
func horizontalRow(detailsOnThumbnail: Bool = true, padding: Double = 0) -> some View {
|
||||
HStack(alignment: .top, spacing: 2) {
|
||||
if detailsOnThumbnail {
|
||||
thumbnailWithDetails
|
||||
.padding(padding)
|
||||
} else {
|
||||
thumbnail
|
||||
.frame(width: 320, height: 180)
|
||||
}
|
||||
|
||||
VStack(alignment: .leading, spacing: 0) {
|
||||
videoDetail(video.title, bold: true)
|
||||
.frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
|
||||
|
||||
if !detailsOnThumbnail {
|
||||
videoDetail(video.author, color: .secondary, bold: true)
|
||||
}
|
||||
|
||||
Spacer()
|
||||
|
||||
additionalDetails
|
||||
}
|
||||
.padding()
|
||||
.frame(minHeight: 180)
|
||||
|
||||
if !detailsOnThumbnail, let time = video.playTime {
|
||||
Spacer()
|
||||
|
||||
VStack(alignment: .center) {
|
||||
Spacer()
|
||||
HStack(spacing: 8) {
|
||||
Image(systemName: "clock")
|
||||
Text(time)
|
||||
.fontWeight(.bold)
|
||||
}
|
||||
Spacer()
|
||||
}
|
||||
.foregroundColor(.secondary)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var verticalRow: some View {
|
||||
VStack(alignment: .leading) {
|
||||
thumbnailWithDetails
|
||||
.frame(minWidth: 0, maxWidth: 600)
|
||||
.padding([.leading, .top, .trailing], 4)
|
||||
|
||||
VStack(alignment: .leading) {
|
||||
videoDetail(video.title, bold: true)
|
||||
.padding(.bottom)
|
||||
|
||||
additionalDetails
|
||||
.padding(.bottom, 10)
|
||||
}
|
||||
.frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
|
||||
.padding(.horizontal, 8)
|
||||
}
|
||||
}
|
||||
|
||||
var additionalDetails: some View {
|
||||
VStack {
|
||||
if !video.published.isEmpty || video.views != 0 {
|
||||
@ -91,80 +121,46 @@ struct VideoListRowView: View {
|
||||
}
|
||||
}
|
||||
|
||||
var verticalyAlignedDetails: some View {
|
||||
VStack(alignment: .leading) {
|
||||
thumbnailWithDetails
|
||||
.frame(minWidth: 0, maxWidth: 600)
|
||||
.padding([.leading, .top, .trailing], 4)
|
||||
|
||||
VStack(alignment: .leading) {
|
||||
videoDetail(video.title, bold: true)
|
||||
.padding(.bottom)
|
||||
|
||||
additionalDetails
|
||||
.padding(.bottom, 10)
|
||||
}
|
||||
.frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
|
||||
.padding(.horizontal, 8)
|
||||
}
|
||||
}
|
||||
|
||||
var thumbnailWithDetails: some View {
|
||||
Group {
|
||||
ZStack(alignment: .trailing) {
|
||||
if let thumbnail = video.thumbnailURL(quality: "maxres") {
|
||||
// to replace with AsyncImage when it is fixed with lazy views
|
||||
URLImage(thumbnail) { image in
|
||||
image
|
||||
.resizable()
|
||||
.aspectRatio(contentMode: .fit)
|
||||
.frame(minWidth: 0, maxWidth: 600, minHeight: 0, maxHeight: .infinity)
|
||||
.background(Color.black)
|
||||
}
|
||||
.mask(RoundedRectangle(cornerRadius: 12))
|
||||
} else {
|
||||
Image(systemName: "exclamationmark.square")
|
||||
}
|
||||
ZStack(alignment: .trailing) {
|
||||
thumbnail
|
||||
|
||||
VStack(alignment: .trailing) {
|
||||
Text(video.author)
|
||||
VStack(alignment: .trailing) {
|
||||
Text(video.author)
|
||||
.padding(8)
|
||||
.background(.thinMaterial)
|
||||
.mask(RoundedRectangle(cornerRadius: 12))
|
||||
.offset(x: -5, y: 5)
|
||||
|
||||
Spacer()
|
||||
|
||||
if let time = video.playTime {
|
||||
Text(time)
|
||||
.fontWeight(.bold)
|
||||
.padding(8)
|
||||
.background(.thinMaterial)
|
||||
.mask(RoundedRectangle(cornerRadius: 12))
|
||||
.offset(x: -5, y: 5)
|
||||
.truncationMode(.middle)
|
||||
|
||||
Spacer()
|
||||
|
||||
if let time = video.playTime {
|
||||
Text(time)
|
||||
.fontWeight(.bold)
|
||||
.padding(8)
|
||||
.background(.thinMaterial)
|
||||
.mask(RoundedRectangle(cornerRadius: 12))
|
||||
.offset(x: -5, y: -5)
|
||||
}
|
||||
.offset(x: -5, y: -5)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var roundedThumbnail: some View {
|
||||
Section {
|
||||
if let thumbnail = video.thumbnailURL(quality: "high") {
|
||||
var thumbnail: some View {
|
||||
Group {
|
||||
if let thumbnail = video.thumbnailURL(quality: "maxres") {
|
||||
// to replace with AsyncImage when it is fixed with lazy views
|
||||
URLImage(thumbnail) { image in
|
||||
image
|
||||
.resizable()
|
||||
.aspectRatio(contentMode: .fill)
|
||||
.frame(minWidth: 0, maxWidth: 320, minHeight: 0, maxHeight: 180)
|
||||
}
|
||||
.mask(RoundedRectangle(cornerRadius: 12))
|
||||
} else {
|
||||
Image(systemName: "exclamationmark.square")
|
||||
}
|
||||
}
|
||||
.frame(width: 320, height: 180)
|
||||
.frame(minWidth: 320, maxWidth: .infinity, minHeight: 180, maxHeight: .infinity)
|
||||
}
|
||||
|
||||
func videoDetail(_ text: String, color: Color? = .primary, bold: Bool = false) -> some View {
|
||||
|
@ -25,7 +25,7 @@ struct VideosView: View {
|
||||
#else
|
||||
VideosListView(videos: videos)
|
||||
#if os(macOS)
|
||||
.frame(minWidth: 250, idealWidth: 350)
|
||||
.frame(minWidth: 400)
|
||||
#endif
|
||||
#endif
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user