From 31af1ca9e6f54bc7238be3baa5752a16bcc0f2ff Mon Sep 17 00:00:00 2001
From: DebaucheryLibrarian <moonloop.adult@protonmail.com>
Date: Sun, 27 Dec 2020 23:10:11 +0100
Subject: [PATCH] Fixed movie tile lazy loading and SFW image.

---
 assets/components/actors/photos.vue       |  1 +
 assets/components/releases/movie-tile.vue | 15 +++++++++++++--
 assets/components/releases/scene-tile.vue |  2 ++
 assets/js/releases/actions.js             |  7 +++++++
 4 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/assets/components/actors/photos.vue b/assets/components/actors/photos.vue
index d68dc17b..0b680c29 100644
--- a/assets/components/actors/photos.vue
+++ b/assets/components/actors/photos.vue
@@ -107,6 +107,7 @@ export default {
     height: 15rem;
     box-shadow: 0 0 3px var(--darken-weak);
 	object-fit: cover;
+	background-position: center;
 	background-size: cover;
 }
 
diff --git a/assets/components/releases/movie-tile.vue b/assets/components/releases/movie-tile.vue
index 22796924..ba7bba2f 100644
--- a/assets/components/releases/movie-tile.vue
+++ b/assets/components/releases/movie-tile.vue
@@ -7,7 +7,9 @@
 			>
 				<img
 					v-if="movie.covers[0]"
-					:src="`/media/${movie.covers[0].thumbnail}`"
+					:src="sfw ? `/img/${movie.covers[0].sfw.thumbnail}` : `/media/${movie.covers[0].thumbnail}`"
+					:style="{ 'background-image': sfw ? `/img/${movie.covers[0].sfw.lazy}` : `/media/${movie.covers[0].lazy }` }"
+					loading="lazy"
 				>
 			</router-link>
 
@@ -56,6 +58,10 @@
 <script>
 import Details from './tile-details.vue';
 
+function sfw() {
+	return this.$store.state.ui.sfw;
+}
+
 export default {
 	components: {
 		Details,
@@ -66,6 +72,9 @@ export default {
 			default: null,
 		},
 	},
+	computed: {
+		sfw,
+	},
 };
 </script>
 
@@ -96,8 +105,10 @@ export default {
 	img {
 		height: 100%;
 		max-width: 12rem;
+		background-position: center;
+		background-size: cover;
 		object-fit: cover;
-		object-position: center ;
+		object-position: center;
 	}
 }
 
diff --git a/assets/components/releases/scene-tile.vue b/assets/components/releases/scene-tile.vue
index de1d3fc5..ceca55ce 100644
--- a/assets/components/releases/scene-tile.vue
+++ b/assets/components/releases/scene-tile.vue
@@ -14,6 +14,7 @@
 				<img
 					v-if="release.poster"
 					:src="sfw ? `/img/${release.poster.sfw.thumbnail}` : `/media/${release.poster.thumbnail}`"
+					:style="{ 'background-image': sfw ? `/img/${release.poster.sfw.lazy}` : `/media/${release.poster.lazy}` }"
 					:alt="release.title"
 					class="thumbnail"
 					loading="lazy"
@@ -27,6 +28,7 @@
 						v-for="cover in release.covers"
 						:key="cover.id"
 						:src="sfw ? `/img/${cover.sfw.thumbnail}` : `/media/${cover.thumbnail}`"
+						:style="{ 'background-image': sfw ? `/img/${cover.sfw.lazy}` : `/media/${cover.lazy}` }"
 						:alt="release.title"
 						class="thumbnail cover"
 						loading="lazy"
diff --git a/assets/js/releases/actions.js b/assets/js/releases/actions.js
index ae261fa1..f65939f2 100644
--- a/assets/js/releases/actions.js
+++ b/assets/js/releases/actions.js
@@ -98,6 +98,13 @@ function initReleasesActions(store, router) {
 								path
 								thumbnail
 								lazy
+								sfw: sfwMedia {
+									id
+									path
+									thumbnail
+									lazy
+									comment
+								}
 							}
 						}
 					}