Supporting animated WebP in scene media banner.

components/media/banner.vue

@@ -17,7 +17,22 @@
 			</div>
 
 			<div
-				v-if="release.trailer || release.teaser"
+				v-if="release.teaser?.mime?.type === 'image'"
+				class="poster-container"
+			>
+				<div class="poster-link">
+					<img
+						:src="getPath(release.teaser)"
+						:style="{ 'background-image': `url(${getPath(release.teaser, 'lazy')}` }"
+						:width="release.teaser.width"
+						:height="release.teaser.height"
+						class="poster teaser"
+					>
+				</div>
+			</div>
+
+			<div
+				v-else-if="release.trailer || release.teaser"
 				class="trailer"
 			>
 				<Player
@@ -34,7 +49,7 @@
 			</div>
 
 			<div
-				v-else-if="release.poster"
+				v-if="release.poster && !release.trailer && (!release.teaser || release.teaser.mime?.type === 'image')"
 				class="poster-container"
 			>
 				<div class="poster-link">

src/media.js

@@ -3,6 +3,8 @@ export function curateMedia(media, context = {}) {
 		return null;
 	}
 
+	const mime = media.mime.split('/');
+
 	return {
 		id: media.id,
 		hash: media.hash,
@@ -15,6 +17,10 @@ export function curateMedia(media, context = {}) {
 		index: media.index,
 		sharpness: media.sharpness,
 		credit: media.credit,
+		mime: mime && {
+			type: mime[0],
+			subtype: mime[1],
+		},
 		type: context.type || null,
 	};
 }