helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-10-17 18:19:27 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix(web): backwards asset navigation in GalleryViewer (#10132)

Browse source 
* fix(web): backwards asset navigation in GalleryViewer

* fix ctrl/cmd click

---------

Co-authored-by: Alex Tran <alex.tran1502@gmail.com>
This commit is contained in:
Michel Heusschen 2024-06-11 17:27:18 +02:00 • committed by GitHub
parent 36bdbf93a7
commit b8e6ae65b1
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 31 additions and 33 deletions
Download patch file Download diff file Expand all files Collapse all files

29
web/src/lib/components/assets/thumbnail/thumbnail.svelte
View file

@ -22,7 +22,6 @@
import { fade } from 'svelte/transition';
import ImageThumbnail from './image-thumbnail.svelte';
import VideoThumbnail from './video-thumbnail.svelte';
import { shortcut } from '$lib/actions/shortcut';
import { currentUrlReplaceAssetId } from '$lib/utils/navigation';
const dispatch = createEventDispatcher<{
@ -37,14 +36,12 @@
export let thumbnailHeight: number | undefined = undefined;
export let selected = false;
export let selectionCandidate = false;
export let isMultiSelectState = false;
export let isStackSlideshow = false;
export let disabled = false;
export let readonly = false;
export let showArchiveIcon = false;
export let showStackedIcon = true;
export let href: string | undefined = undefined;
export let onClick: ((asset: AssetResponseDto) => void) | undefined = undefined;
export let onClick: ((asset: AssetResponseDto, event: Event) => void) | undefined = undefined;
let className = '';
export { className as class };
@ -65,14 +62,6 @@
return [235, 235];
})();
const thumbnailClickedHandler = (e: Event) => {
e.stopPropagation();
e.preventDefault();
if (!disabled) {
onClick?.(asset);
}
};
const onIconClickedHandler = (e: MouseEvent) => {
e.stopPropagation();
e.preventDefault();
@ -81,12 +70,17 @@
}
};
const handleClick = (e: Event) => {
if (isMultiSelectState) {
onIconClickedHandler(e as MouseEvent);
} else if (isStackSlideshow) {
thumbnailClickedHandler(e);
const handleClick = (e: MouseEvent) => {
if (e.ctrlKey || e.metaKey) {
return;
}
if (selected) {
onIconClickedHandler(e);
return;
}
onClick?.(asset, e);
};
const onMouseEnter = () => {
@ -111,7 +105,6 @@
on:mouseleave={onMouseLeave}
tabindex={0}
on:click={handleClick}
use:shortcut={{ shortcut: { key: 'Enter' }, onShortcut: thumbnailClickedHandler }}
>
{#if intersecting}
<div class="absolute z-20 {className}" style:width="{width}px" style:height="{height}px">