mirror of
https://github.com/stashapp/stash.git
synced 2025-12-17 20:34:37 +03:00
Images section (#813)
* Add new configuration options * Refactor scan/clean * Schema changes * Add details to galleries * Remove redundant code * Refine thumbnail generation * Gallery overhaul * Don't allow modifying zip gallery images * Show gallery card overlays * Hide zoom slider when not in grid mode
This commit is contained in:
@@ -4,7 +4,7 @@ import FsLightbox from "fslightbox-react";
|
||||
import "flexbin/flexbin.css";
|
||||
|
||||
interface IProps {
|
||||
gallery: GQL.GalleryDataFragment;
|
||||
gallery: Partial<GQL.GalleryDataFragment>;
|
||||
}
|
||||
|
||||
export const GalleryViewer: React.FC<IProps> = ({ gallery }) => {
|
||||
@@ -16,23 +16,27 @@ export const GalleryViewer: React.FC<IProps> = ({ gallery }) => {
|
||||
setLightboxToggle(!lightboxToggle);
|
||||
};
|
||||
|
||||
const photos = gallery.files.map((file) => file.path ?? "");
|
||||
const thumbs = gallery.files.map((file, index) => (
|
||||
<div
|
||||
role="link"
|
||||
tabIndex={index}
|
||||
key={file.index}
|
||||
onClick={() => openImage(index)}
|
||||
onKeyPress={() => openImage(index)}
|
||||
>
|
||||
<img
|
||||
src={`${file.path}?thumb=600` || ""}
|
||||
loading="lazy"
|
||||
className="gallery-image"
|
||||
alt={file.name ?? index.toString()}
|
||||
/>
|
||||
</div>
|
||||
));
|
||||
const photos = !gallery.images
|
||||
? []
|
||||
: gallery.images.map((file) => file.paths.image ?? "");
|
||||
const thumbs = !gallery.images
|
||||
? []
|
||||
: gallery.images.map((file, index) => (
|
||||
<div
|
||||
role="link"
|
||||
tabIndex={index}
|
||||
key={file.checksum ?? index}
|
||||
onClick={() => openImage(index)}
|
||||
onKeyPress={() => openImage(index)}
|
||||
>
|
||||
<img
|
||||
src={file.paths.thumbnail ?? ""}
|
||||
loading="lazy"
|
||||
className="gallery-image"
|
||||
alt={file.title ?? index.toString()}
|
||||
/>
|
||||
</div>
|
||||
));
|
||||
|
||||
return (
|
||||
<div className="gallery">
|
||||
@@ -41,6 +45,7 @@ export const GalleryViewer: React.FC<IProps> = ({ gallery }) => {
|
||||
sourceIndex={currentIndex}
|
||||
toggler={lightboxToggle}
|
||||
sources={photos}
|
||||
key={gallery.id!}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user