self-hosted/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-06-27 05:11:11 +02:00
Code Issues Releases Activity

fix(web): keyboard shortcut handling (#7946)

Browse Source 
* fix(web): keyboard shortcut handling

* drop executeShortcuts in favor of action

* fix merge

---------

Co-authored-by: Jason Rasmussen <jrasm91@gmail.com>
This commit is contained in:
Michel Heusschen
2024-03-15 00:16:55 +01:00
committed by GitHub
parent 12fb90c232
commit eed8e6b67a
14 changed files with 197 additions and 268 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
web/src/lib/components/asset-viewer/asset-viewer.svelte
View File

@ -13,7 +13,7 @@
import { getAssetJobMessage, isSharedLink, handlePromiseError } from '$lib/utils';
import { addAssetsToAlbum, downloadFile } from '$lib/utils/asset-utils';
import { handleError } from '$lib/utils/handle-error';
import { shouldIgnoreShortcut } from '$lib/utils/shortcut';
import { shortcuts } from '$lib/utils/shortcut';
import { SlideshowHistory } from '$lib/utils/slideshow-history';
import {
AssetJobName,
@ -256,68 +256,9 @@
isShowActivity = !isShowActivity;
};
const handleKeypress = async (event: KeyboardEvent) => {
if (shouldIgnoreShortcut(event)) {
return;
}
const key = event.key;
const shiftKey = event.shiftKey;
const ctrlKey = event.ctrlKey;
if (ctrlKey) {
return;
}
switch (key) {
case 'a':
case 'A': {
if (shiftKey) {
await toggleArchive();
}
return;
}
case 'ArrowLeft': {
await navigateAsset('previous');
return;
}
case 'ArrowRight': {
await navigateAsset('next');
return;
}
case 'd':
case 'D': {
if (shiftKey) {
await downloadFile(asset);
}
return;
}
case 'Delete': {
await trashOrDelete(shiftKey);
return;
}
case 'Escape': {
if (isShowDeleteConfirmation) {
isShowDeleteConfirmation = false;
return;
}
if (isShowShareModal) {
isShowShareModal = false;
return;
}
closeViewer();
return;
}
case 'f': {
await toggleFavorite();
return;
}
case 'i': {
isShowActivity = false;
$isShowDetail = !$isShowDetail;
return;
}
}
const toggleDetailPanel = () => {
isShowActivity = false;
$isShowDetail = !$isShowDetail;
};
const handleCloseViewer = () => {
@ -557,7 +498,19 @@
};
</script>
<svelte:window on:keydown={handleKeypress} />
<svelte:window
use:shortcuts={[
{ shortcut: { key: 'a', shift: true }, onShortcut: toggleArchive },
{ shortcut: { key: 'ArrowLeft' }, onShortcut: () => navigateAsset('previous') },
{ shortcut: { key: 'ArrowRight' }, onShortcut: () => navigateAsset('next') },
{ shortcut: { key: 'd', shift: true }, onShortcut: () => downloadFile(asset) },
{ shortcut: { key: 'Delete' }, onShortcut: () => trashOrDelete(false) },
{ shortcut: { key: 'Delete', shift: true }, onShortcut: () => trashOrDelete(true) },
{ shortcut: { key: 'Escape' }, onShortcut: closeViewer },
{ shortcut: { key: 'f' }, onShortcut: toggleFavorite },
{ shortcut: { key: 'i' }, onShortcut: toggleDetailPanel },
]}
/>
<section
id="immich-asset-viewer"