kenmirrors/ente
1
0
Fork 0
mirror of https://github.com/ente-io/ente.git synced 2025-08-13 17:57:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

wasd

Browse Source
This commit is contained in:
Manav Rathi
2025-03-06 08:00:23 +05:30
parent ae4e189848
commit f487e64569
2 changed files with 57 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
web/packages/gallery/components/viewer/FileViewer.tsx
View File

@@ -900,12 +900,13 @@ const Shortcuts: React.FC<ModalVisibilityProps> = ({ open, onClose }) => (
<ShortcutsContent sx={{ "&&": { pt: 2, pb: 5, px: 5 } }}>
<Shortcut action="Close" shortcut="Esc" />
<Shortcut action="Previous, Next" shortcut="←, →" />
<Shortcut action="Zoom" shortcut="Mouse scroll" />
<Shortcut action="Zoom" shortcut="Mouse scroll, Pinch" />
<Shortcut action="Zoom preset" shortcut="Z, Tap inside image" />
<Shortcut action="Toggle controls" shortcut="Tap outside image" />
<Shortcut action="Pan" shortcut="WASD, Drag" />
<Shortcut action="Toggle favorite" shortcut="L" />
<Shortcut action="View info" shortcut="I" />
<Shortcut action="Download" shortcut="D" />
<Shortcut action="Download" shortcut="^D, ⌘D" />
<Shortcut action="Delete" shortcut="Delete, Backspace" />
<Shortcut action="Copy as PNG" shortcut="^C, ⌘C" />
<Shortcut action="Toggle fullscreen" shortcut="F" />

67
web/packages/gallery/components/viewer/photoswipe.ts
View File

@@ -701,6 +701,24 @@ export class FileViewerPhotoSwipe {
return element;
});
// Pan action handlers
const panner = (key: "w" | "a" | "s" | "d") => () => {
const slide = pswp.currSlide;
const d = 80;
switch (key) {
case "w":
slide.pan.y -= d;
case "a":
slide.pan.x += d;
case "s":
slide.pan.x += d;
case "d":
slide.pan.y += d;
}
slide.panTo(slide.pan.x, slide.pan.y);
};
// Some actions routed via the delegate
const handleDelete = () => delegate.performKeyAction("delete");
@@ -710,21 +728,44 @@ export class FileViewerPhotoSwipe {
const handleToggleFullscreen = () =>
delegate.performKeyAction("toggle-fullscreen");
pswp.on("keydown", (e, z) => {
const key = e.originalEvent.key ?? "";
const cb = (() => {
switch (key.toLowerCase()) {
case "l":
return handleToggleFavoriteIfEnabled;
pswp.on("keydown", (_e) => {
const e: KeyboardEvent = _e.originalEvent;
// Even though we ignore shift, Caps lock might still be on.
const key = e.key.toLowerCase();
let cb: (() => void) | undefined;
if (e.shiftKey || e.altKey || e.metaKey) {
// ignore
} else if (e.ctrlKey) {
switch (key) {
case "d":
return handleDownloadIfEnabled;
case "i":
return handleViewInfo;
case "f":
return handleToggleFullscreen;
cb = handleDownloadIfEnabled;
break;
case "c":
cb = handleCopy;
break;
}
return undefined;
})();
} else {
switch (key) {
case "w":
case "a":
case "s":
case "d":
cb = panner(key);
break;
case "l":
cb = handleToggleFavoriteIfEnabled;
break;
case "i":
cb = handleViewInfo;
break;
case "f":
cb = handleToggleFullscreen;
break;
}
}
cb?.();
});