get thumb image and fallback imageview

Shared/Extensions/JellyfinAPIExtensions/BaseItemDtoExtensions.swift

@@ -92,6 +92,19 @@ public extension BaseItemDto {
 		return URL(string: urlString)!
 	}
 
+	func getThumbImage(maxWidth: Int) -> URL {
+		let imageType = ImageType.thumb
+		let imageItemId = id ?? ""
+
+		let x = UIScreen.main.nativeScale * CGFloat(maxWidth)
+
+		let urlString = ImageAPI.getItemImageWithRequestBuilder(itemId: imageItemId,
+		                                                        imageType: imageType,
+		                                                        maxWidth: Int(x),
+		                                                        quality: 96).URLString
+		return URL(string: urlString)!
+	}
+
 	func getEpisodeLocator() -> String? {
 		if let seasonNo = parentIndexNumber, let episodeNo = indexNumber {
 			return L10n.seasonAndEpisode(String(seasonNo), String(episodeNo))

Shared/Views/ImageView.swift

@@ -10,44 +10,32 @@ import NukeUI
 import SwiftUI
 
 struct ImageView: View {
-	private let source: URL
+
+	private let sources: [URL]
 	private let blurhash: String
 	private let failureInitials: String
 
 	init(src: URL, bh: String = "001fC^", failureInitials: String = "") {
-		self.source = src
+		self.sources = [src]
 		self.blurhash = bh
 		self.failureInitials = failureInitials
 	}
 
-	// TODO: fix placeholder hash image
+	init(sources: [URL], bh: String = "001fC^", failureInitials: String = "") {
+		assert(!sources.isEmpty, "Must supply at least one source")
+
+		self.sources = sources
+		self.blurhash = bh
+		self.failureInitials = failureInitials
+	}
+
+	// TODO: fix placeholder hash view
 	@ViewBuilder
-	private var placeholderImage: some View {
+	private func placeholderView() -> some View {
-		Image(uiImage: UIImage(blurHash: blurhash, size: CGSize(width: 8, height: 8)) ??
+//		Image(uiImage: UIImage(blurHash: blurhash, size: CGSize(width: 8, height: 8)) ??
-			UIImage(blurHash: "001fC^", size: CGSize(width: 8, height: 8))!)
+//			UIImage(blurHash: "001fC^", size: CGSize(width: 8, height: 8))!)
-			.resizable()
+//			.resizable()
-	}
 
-	@ViewBuilder
-	private var failureImage: some View {
-		ZStack {
-			Rectangle()
-				.foregroundColor(Color(UIColor.darkGray))
-
-			Text(failureInitials)
-				.font(.largeTitle)
-				.foregroundColor(.secondary)
-				.accessibilityHidden(true)
-		}
-	}
-
-	var body: some View {
-		LazyImage(source: source) { state in
-			if let image = state.image {
-				image
-			} else if state.error != nil {
-				failureImage
-			} else {
 		#if os(tvOS)
 			ZStack {
 				Color.black.ignoresSafeArea()
@@ -62,6 +50,82 @@ struct ImageView: View {
 			}
 		#endif
 	}
+
+	@ViewBuilder
+	private func failureImage() -> some View {
+		ZStack {
+			Rectangle()
+				.foregroundColor(Color(UIColor.darkGray))
+
+			Text(failureInitials)
+				.font(.largeTitle)
+				.foregroundColor(.secondary)
+				.accessibilityHidden(true)
+		}
+	}
+
+	var body: some View {
+		ImageViewBackgroundA(index: 0,
+		                     sources: sources,
+		                     placeholderView: placeholderView,
+		                     failureView: failureImage)
+	}
+}
+
+// Two image view are necessary to switch between one another to appease the type system
+// as a recursive view with itself isn't valid
+
+fileprivate struct ImageViewBackgroundA<PlaceholderView: View, FailureView: View>: View {
+
+	let index: Int
+	let sources: [URL]
+	let placeholderView: () -> PlaceholderView
+	let failureView: () -> FailureView
+
+	var body: some View {
+		LazyImage(source: sources[index]) { state in
+			if let image = state.image {
+				image
+			} else if state.error != nil {
+				if index + 1 == sources.count {
+					failureView()
+				} else {
+					ImageViewBackgroundB(index: index + 1,
+					                     sources: sources,
+					                     placeholderView: placeholderView,
+					                     failureView: failureView)
+				}
+			} else {
+				placeholderView()
+			}
+		}
+		.pipeline(ImagePipeline(configuration: .withDataCache))
+	}
+}
+
+fileprivate struct ImageViewBackgroundB<PlaceholderView: View, FailureView: View>: View {
+
+	let index: Int
+	let sources: [URL]
+	let placeholderView: () -> PlaceholderView
+	let failureView: () -> FailureView
+
+	var body: some View {
+		LazyImage(source: sources[index]) { state in
+			if let image = state.image {
+				image
+			} else if state.error != nil {
+				if index + 1 == sources.count {
+					failureView()
+				} else {
+					ImageViewBackgroundA(index: index + 1,
+					                     sources: sources,
+					                     placeholderView: placeholderView,
+					                     failureView: failureView)
+				}
+			} else {
+				placeholderView()
+			}
 		}
 		.pipeline(ImagePipeline(configuration: .withDataCache))
 	}

Swiftfin tvOS/Components/HomeCinematicView/CinematicNextUpCardView.swift

@@ -27,7 +27,11 @@ struct CinematicNextUpCardView: View {
 						ImageView(src: item.getSeriesBackdropImage(maxWidth: 350))
 							.frame(width: 350, height: 210)
 					} else {
-						ImageView(src: item.getBackdropImage(maxWidth: 350))
+						ImageView(sources: [
+							item.getThumbImage(maxWidth: 320),
+							item.getBackdropImage(maxWidth: 320),
+						],
+						bh: item.getBackdropImageBlurHash())
 							.frame(width: 350, height: 210)
 					}
 

Swiftfin tvOS/Components/HomeCinematicView/CinematicResumeCardView.swift

@@ -28,7 +28,11 @@ struct CinematicResumeCardView: View {
 						ImageView(src: item.getSeriesBackdropImage(maxWidth: 350))
 							.frame(width: 350, height: 210)
 					} else {
-						ImageView(src: item.getBackdropImage(maxWidth: 350))
+						ImageView(sources: [
+							item.getThumbImage(maxWidth: 320),
+							item.getBackdropImage(maxWidth: 320),
+						],
+						bh: item.getBackdropImageBlurHash())
 							.frame(width: 350, height: 210)
 					}
 

Swiftfin/Views/ContinueWatchingView.swift

@@ -27,7 +27,11 @@ struct ContinueWatchingView: View {
 						VStack(alignment: .leading) {
 
 							ZStack {
-								ImageView(src: item.getBackdropImage(maxWidth: 320), bh: item.getBackdropImageBlurHash())
+								ImageView(sources: [
+									item.getThumbImage(maxWidth: 320),
+									item.getBackdropImage(maxWidth: 320),
+								],
+								bh: item.getBackdropImageBlurHash())
 									.frame(width: 320, height: 180)
 									.accessibilityIgnoresInvertColors()