Simon/romm
1
0
Fork 0
mirror of https://github.com/rommapp/romm.git synced 2026-06-28 06:46:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix updating image preview + force webp

Browse Source
This commit is contained in:
Georges-Antoine Assi
2025-09-05 09:42:25 -04:00
parent 5219873b3e
commit bf631cfa74
7 changed files with 42 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
backend/handler/filesystem/resources_handler.py
View File

@@ -79,7 +79,8 @@ class FSResourcesHandler(FSHandler):
if ENABLE_SCHEDULED_CONVERT_IMAGES_TO_WEBP:
self.image_converter.convert_to_webp(
self.validate_path(f"{cover_file}/{size.value}.png")
self.validate_path(f"{cover_file}/{size.value}.png"),
force=True,
)
except httpx.TransportError as exc:
log.error(f"Unable to fetch cover at {url_cover}: {str(exc)}")
@@ -93,7 +94,7 @@ class FSResourcesHandler(FSHandler):
if ENABLE_SCHEDULED_CONVERT_IMAGES_TO_WEBP:
self.image_converter.convert_to_webp(
self.validate_path(f"{cover_file}/{size.value}.png")
self.validate_path(f"{cover_file}/{size.value}.png"), force=True
)
except UnidentifiedImageError as exc:
log.error(f"Unable to identify image {cover_file}: {str(exc)}")
@@ -173,6 +174,10 @@ class FSResourcesHandler(FSHandler):
with Image.open(artwork) as img:
img.save(path_cover_l)
self.resize_cover_to_small(img, save_path=str(path_cover_s))
if ENABLE_SCHEDULED_CONVERT_IMAGES_TO_WEBP:
self.image_converter.convert_to_webp(path_cover_l, force=True)
self.image_converter.convert_to_webp(path_cover_s, force=True)
except UnidentifiedImageError as exc:
log.error(
f"Unable to identify image for {entity.fs_resources_path}: {str(exc)}"

4
backend/tasks/scheduled/convert_images_to_webp.py
View File

@@ -58,7 +58,7 @@ class ImageConverter:
target_mode = self.MODE_CONVERSIONS.get(img.mode, "RGB")
return img.convert(target_mode)
def convert_to_webp(self, image_path: Path) -> bool:
def convert_to_webp(self, image_path: Path, force: bool = False) -> bool:
"""Convert a single image to WebP format.
Args:
image_path: Path to the source image
@@ -68,7 +68,7 @@ class ImageConverter:
webp_path = image_path.with_suffix(".webp")
# Skip if WebP already exists
if webp_path.exists():
if webp_path.exists() and not force:
log.debug(f"WebP already exists for {image_path}")
return True

14
frontend/src/components/Gallery/AppBar/Collection/CollectionInfoDrawer.vue
View File

@@ -47,9 +47,8 @@ const collectionCoverImage = computed(() =>
getCollectionCoverImage(updatedCollection.value.name),
);
emitter?.on("updateUrlCover", (url_cover) => {
updatedCollection.value.url_cover = url_cover;
setArtwork(url_cover);
emitter?.on("updateUrlCover", (coverUrl) => {
setArtwork(coverUrl);
});
function showEditable() {
@@ -83,9 +82,10 @@ function previewImage(event: Event) {
}
}
function setArtwork(imageUrl: string) {
if (!imageUrl) return;
imagePreviewUrl.value = imageUrl;
function setArtwork(coverUrl: string) {
if (!coverUrl) return;
updatedCollection.value.url_cover = coverUrl;
imagePreviewUrl.value = coverUrl;
removeCover.value = false;
}
@@ -185,7 +185,7 @@ async function updateCollection() {
:show-title="false"
:with-link="false"
:collection="currentCollection"
:src="imagePreviewUrl"
:coverSrc="imagePreviewUrl"
>
<template v-if="isEditable" #append-inner>
<v-btn-group rounded="0" divided density="compact">

10
frontend/src/components/common/Collection/Card.vue
View File

@@ -21,6 +21,7 @@ const EXTENSION_REGEX = /\.png|\.jpg|\.jpeg$/;
const props = withDefaults(
defineProps<{
collection: CollectionType;
coverSrc?: string;
transformScale?: boolean;
showTitle?: boolean;
titleOnHover?: boolean;
@@ -29,6 +30,7 @@ const props = withDefaults(
enable3DTilt?: boolean;
}>(),
{
coverSrc: undefined,
transformScale: false,
showTitle: true,
titleOnHover: false,
@@ -54,6 +56,14 @@ const collectionCoverImage = computed(() =>
);
watchEffect(() => {
if (props.coverSrc) {
memoizedCovers.value = {
large: [props.coverSrc, props.coverSrc],
small: [props.coverSrc, props.coverSrc],
};
return;
}
// Check if it's a regular collection with covers or a smart collection with covers
const isRegularOrSmartWithCovers =
!props.collection.is_virtual &&

15
frontend/src/components/common/Collection/Dialog/CreateCollection.vue
View File

@@ -29,10 +29,8 @@ emitter?.on("showCreateCollectionDialog", () => {
show.value = true;
removeCover.value = false;
});
emitter?.on("updateUrlCover", (url_cover) => {
if (!collection.value) return;
collection.value.url_cover = url_cover;
setArtwork(url_cover);
emitter?.on("updateUrlCover", (coverUrl) => {
setArtwork(coverUrl);
});
const missingCoverImage = computed(() =>
@@ -57,9 +55,10 @@ function previewImage(event: Event) {
}
}
function setArtwork(imageUrl: string) {
if (!imageUrl) return;
imagePreviewUrl.value = imageUrl;
function setArtwork(coverUrl: string) {
if (!coverUrl || !collection.value) return;
collection.value.url_cover = coverUrl;
imagePreviewUrl.value = coverUrl;
removeCover.value = false;
}
@@ -165,7 +164,7 @@ function closeDialog() {
:show-title="false"
:with-link="false"
:collection="collection"
:src="imagePreviewUrl"
:coverSrc="imagePreviewUrl"
title-on-hover
>
<template #append-inner>

4
frontend/src/components/common/Game/Card/Base.vue
View File

@@ -33,6 +33,7 @@ const EXTENSION_REGEX = /\.png|\.jpg|\.jpeg$/;
const props = withDefaults(
defineProps<{
rom: SimpleRom | SearchRomSchema;
coverSrc?: string;
aspectRatio?: string | number;
width?: string | number;
height?: string | number;
@@ -49,6 +50,7 @@ const props = withDefaults(
enable3DTilt?: boolean;
}>(),
{
coverSrc: undefined,
aspectRatio: undefined,
width: undefined,
height: undefined,
@@ -142,6 +144,7 @@ const isWebpEnabled = computed(
);
const largeCover = computed(() => {
if (props.coverSrc) return props.coverSrc;
if (!romsStore.isSimpleRom(props.rom))
return (
props.rom.igdb_url_cover ||
@@ -155,6 +158,7 @@ const largeCover = computed(() => {
});
const smallCover = computed(() => {
if (props.coverSrc) return props.coverSrc;
if (!romsStore.isSimpleRom(props.rom)) return "";
const pathCoverSmall = isWebpEnabled.value
? props.rom.path_cover_small?.replace(EXTENSION_REGEX, ".webp")

11
frontend/src/components/common/Game/Dialog/EditRom.vue
View File

@@ -36,8 +36,6 @@ emitter?.on("showEditRomDialog", (romToEdit: UpdateRom | undefined) => {
removeCover.value = false;
});
emitter?.on("updateUrlCover", (url_cover) => {
if (!rom.value) return;
rom.value.url_cover = url_cover;
setArtwork(url_cover);
});
const computedAspectRatio = computed(() => {
@@ -68,9 +66,10 @@ function previewImage(event: Event) {
}
}
function setArtwork(imageUrl: string) {
if (!imageUrl) return;
imagePreviewUrl.value = imageUrl;
function setArtwork(coverUrl: string) {
if (!coverUrl || !rom.value) return;
rom.value.url_cover = coverUrl;
imagePreviewUrl.value = coverUrl;
removeCover.value = false;
}
@@ -211,7 +210,7 @@ function closeDialog() {
<game-card
width="240"
:rom="rom"
:src="imagePreviewUrl"
:coverSrc="imagePreviewUrl"
disableViewTransition
:showPlatformIcon="false"
:showActionBar="false"